From b2f46d10f25c5e658bb7f790950a1fd9a4e5e288 Mon Sep 17 00:00:00 2001
From: streamich <streamich@gmail.com>
Date: Sat, 13 Jun 2020 13:42:36 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20improve=20how=20text=20is?=
 =?UTF-8?q?=20dropped=20in=20useDrop=20hook?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/useDrop.ts            | 21 ++++++---------------
 stories/useDrop.story.tsx |  7 +++----
 2 files changed, 9 insertions(+), 19 deletions(-)

diff --git a/src/useDrop.ts b/src/useDrop.ts
index aa92c8ceca..62ceda6621 100644
--- a/src/useDrop.ts
+++ b/src/useDrop.ts
@@ -1,6 +1,5 @@
 /* eslint-disable */
 import * as React from 'react';
-import useMountedState from './useMountedState';
 
 const { useState, useMemo, useCallback, useEffect } = React;
 
@@ -23,13 +22,8 @@ export interface DropAreaOptions {
 }
 
 const noop = () => {};
-/*
-const defaultState: DropAreaState = {
-  over: false,
-};
-*/
 
-const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTransfer: DataTransfer, event) => {
+const createProcess = (options: DropAreaOptions) => (dataTransfer: DataTransfer, event) => {
   const uri = dataTransfer.getData('text/uri-list');
 
   if (uri) {
@@ -42,21 +36,18 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans
     return;
   }
 
-  if (dataTransfer.items && dataTransfer.items.length) {
-    dataTransfer.items[0].getAsString(text => {
-      if (mounted) {
-        (options.onText || noop)(text, event);
-      }
-    });
+  if (event.clipboardData) {
+    const text = event.clipboardData.getData('text');
+    (options.onText || noop)(text, event);
+    return;
   }
 };
 
 const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => {
   const { onFiles, onText, onUri } = options;
-  const isMounted = useMountedState();
   const [over, setOverRaw] = useState<boolean>(false);
   const setOver = useCallback(setOverRaw, []);
-  const process = useMemo(() => createProcess(options, isMounted()), [onFiles, onText, onUri]);
+  const process = useMemo(() => createProcess(options), [onFiles, onText, onUri]);
 
   useEffect(() => {
     const onDragOver = event => {
diff --git a/stories/useDrop.story.tsx b/stories/useDrop.story.tsx
index b9443a1cfb..43e308301e 100644
--- a/stories/useDrop.story.tsx
+++ b/stories/useDrop.story.tsx
@@ -1,4 +1,3 @@
-import { action } from '@storybook/addon-actions';
 import { storiesOf } from '@storybook/react';
 import * as React from 'react';
 import { useDrop } from '../src';
@@ -6,9 +5,9 @@ import ShowDocs from './util/ShowDocs';
 
 const Demo = () => {
   const state = useDrop({
-    onFiles: action('onFiles'),
-    onUri: action('onUri'),
-    onText: action('onText'),
+    onFiles: (...args) => console.log('onFiles', ...args),
+    onUri: (...args) => console.log('onUri', ...args),
+    onText: (...args) => console.log('onText', ...args),
   });
 
   const style: React.CSSProperties = {