change fileUploadState impl

packages/editor/src/components/CodeMirrorEditor/CodeMirrorEditor.tsx

@@ -103,10 +103,44 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
   const {
     getRootProps,
     isDragActive,
-    fileUploadState,
+    isDragAccept,
+    isDragReject,
+    isUploading,
     open,
   } = useFileDropzone({ onUpload, acceptedFileType });
 
+  const fileUploadState = useMemo(() => {
+
+    if (isUploading) {
+      return 'dropzone-uploading';
+    }
+
+    switch (acceptedFileType) {
+      case AcceptedUploadFileType.NONE:
+        return 'dropzone-disabled';
+
+      case AcceptedUploadFileType.IMAGE:
+        if (isDragAccept) {
+          return 'dropzone-accepted';
+        }
+        if (isDragReject) {
+          return 'dropzone-mismatch-picture';
+        }
+        break;
+
+      case AcceptedUploadFileType.ALL:
+        if (isDragAccept) {
+          return 'dropzone-accepted';
+        }
+        if (isDragReject) {
+          return 'dropzone-rejected';
+        }
+        break;
+    }
+
+    return '';
+  }, [isUploading, isDragAccept,isDragReject, acceptedFileType]);
+
   return (
     <div className={`${style['codemirror-editor']} flex-expand-vert`}>
       <div {...getRootProps()} className={`dropzone ${fileUploadState} flex-expand-vert`}>

packages/editor/src/services/file-dropzone/use-file-dropzone/use-file-dropzone.ts

@@ -1,13 +1,12 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useState } from 'react';
 
 import { useDropzone, Accept } from 'react-dropzone';
 import type { DropzoneState } from 'react-dropzone';
 
-import { AcceptedUploadFileType } from '../../consts';
+import { AcceptedUploadFileType } from '../../../consts';
 
 type FileDropzoneState = DropzoneState & {
   isUploading: boolean,
-  fileUploadState: string,
 }
 
 type DropzoneEditor = {
@@ -46,41 +45,8 @@ export const useFileDropzone = (props: DropzoneEditor): FileDropzoneState => {
     accept,
   });
 
-  const fileUploadState = useMemo(() => {
-
-    if (isUploading) {
-      return 'dropzone-uploading';
-    }
-
-    switch (acceptedFileType) {
-      case AcceptedUploadFileType.NONE:
-        return 'dropzone-disabled';
-
-      case AcceptedUploadFileType.IMAGE:
-        if (dzState.isDragAccept) {
-          return 'dropzone-accepted';
-        }
-        if (dzState.isDragReject) {
-          return 'dropzone-mismatch-picture';
-        }
-        break;
-
-      case AcceptedUploadFileType.ALL:
-        if (dzState.isDragAccept) {
-          return 'dropzone-accepted';
-        }
-        if (dzState.isDragReject) {
-          return 'dropzone-rejected';
-        }
-        break;
-    }
-
-    return '';
-  }, [isUploading, dzState.isDragAccept, dzState.isDragReject, acceptedFileType]);
-
   return {
     ...dzState,
     isUploading,
-    fileUploadState,
   };
 };