use manual close

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

@@ -11,6 +11,7 @@ type Props = {
   acceptedUploadFileType: AcceptedUploadFileType,
   children?: ReactNode,
   onUpload?: (files: File[]) => void,
+  onClose?: () => void,
 }
 
 export const AttachmentsDropdownItem = (props: Props): JSX.Element => {
@@ -19,6 +20,7 @@ export const AttachmentsDropdownItem = (props: Props): JSX.Element => {
     acceptedUploadFileType,
     children,
     onUpload,
+    onClose,
   } = props;
 
   const {
@@ -26,10 +28,13 @@ export const AttachmentsDropdownItem = (props: Props): JSX.Element => {
     getInputProps,
     open,
   } = useFileDropzone({
-    onUpload,
+    onUpload: (files: File[]) => { onUpload?.(files); onClose?.() },
     acceptedUploadFileType,
     dropzoneOpts: {
-      noClick: true, noDrag: true, noKeyboard: true,
+      noClick: true,
+      noDrag: true,
+      noKeyboard: true,
+      onFileDialogCancel: onClose,
     },
   });
 

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

@@ -38,14 +38,14 @@ export const AttachmentsDropup = (props: Props): JSX.Element => {
           <DropdownItem divider />
 
           { acceptedUploadFileType === AcceptedUploadFileType.ALL && (
-            <AttachmentsDropdownItem acceptedUploadFileType={AcceptedUploadFileType.ALL} onUpload={onUpload}>
+            <AttachmentsDropdownItem acceptedUploadFileType={AcceptedUploadFileType.ALL} onUpload={onUpload} onClose={() => setOpen(false)}>
               <span className="material-symbols-outlined fs-5">attach_file</span>
               Files
             </AttachmentsDropdownItem>
           ) }
 
           { acceptedUploadFileType !== AcceptedUploadFileType.NONE && (
-            <AttachmentsDropdownItem acceptedUploadFileType={AcceptedUploadFileType.IMAGE} onUpload={onUpload}>
+            <AttachmentsDropdownItem acceptedUploadFileType={AcceptedUploadFileType.IMAGE} onUpload={onUpload} onClose={() => setOpen(false)}>
               <span className="material-symbols-outlined fs-5">image</span>
               Images
             </AttachmentsDropdownItem>