From fa5cfd5fc3720a8800e6336ad628ed5a1bda9f36 Mon Sep 17 00:00:00 2001
From: Palanikannan M <akashmalinimurugu@gmail.com>
Date: Fri, 13 Sep 2024 21:09:08 +0530
Subject: [PATCH] fix: fixed multi time file opener

---
 .../custom-image/components/image-node.tsx          |  4 ++++
 .../core/extensions/custom-image/custom-image.ts    | 13 ++++---------
 .../custom-image/read-only-custom-image.ts          |  6 ------
 3 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/packages/editor/src/core/extensions/custom-image/components/image-node.tsx b/packages/editor/src/core/extensions/custom-image/components/image-node.tsx
index b65d890f56..17aa0b90c4 100644
--- a/packages/editor/src/core/extensions/custom-image/components/image-node.tsx
+++ b/packages/editor/src/core/extensions/custom-image/components/image-node.tsx
@@ -72,8 +72,12 @@ export const CustomImageNode = (props: CustomImageNodeViewProps) => {
       if (uploadEntity.event === "drop" && "file" in uploadEntity) {
         uploadFile(uploadEntity.file);
       } else if (uploadEntity.event === "insert" && fileInputRef.current && !hasTriggeredFilePickerRef.current) {
+        const entity = editorStorage?.fileMap.get(id);
+        if (entity && entity.hasOpenedFileInputOnce) return;
         fileInputRef.current.click();
         hasTriggeredFilePickerRef.current = true;
+        if (!entity) return;
+        editorStorage?.fileMap.set(id, { ...entity, hasOpenedFileInputOnce: true });
       }
     }
   }, [getUploadEntity, uploadFile]);
diff --git a/packages/editor/src/core/extensions/custom-image/custom-image.ts b/packages/editor/src/core/extensions/custom-image/custom-image.ts
index 4f0b96e7e8..ee942c1bd7 100644
--- a/packages/editor/src/core/extensions/custom-image/custom-image.ts
+++ b/packages/editor/src/core/extensions/custom-image/custom-image.ts
@@ -22,7 +22,7 @@ export interface UploadImageExtensionStorage {
   fileMap: Map<string, UploadEntity>;
 }
 
-export type UploadEntity = { event: "insert" } | { event: "drop"; file: File };
+export type UploadEntity = ({ event: "insert" } | { event: "drop"; file: File }) & { hasOpenedFileInputOnce: boolean };
 
 export const CustomImageExtension = (props: TFileHandler) => {
   const { upload } = props;
@@ -46,12 +46,6 @@ export const CustomImageExtension = (props: TFileHandler) => {
         height: {
           default: "auto",
         },
-        ["data-type"]: {
-          default: this.name,
-        },
-        ["data-file"]: {
-          default: null,
-        },
         ["id"]: {
           default: null,
         },
@@ -63,6 +57,9 @@ export const CustomImageExtension = (props: TFileHandler) => {
         {
           tag: "image-component",
         },
+        {
+          tag: "img",
+        },
       ];
     },
 
@@ -101,9 +98,7 @@ export const CustomImageExtension = (props: TFileHandler) => {
             }
 
             const attributes = {
-              "data-type": this.name,
               id: fileId,
-              "data-file": props.file ? `data-file="${props.file}"` : "",
             };
 
             if (props.pos) {
diff --git a/packages/editor/src/core/extensions/custom-image/read-only-custom-image.ts b/packages/editor/src/core/extensions/custom-image/read-only-custom-image.ts
index 7ffd4fba8b..eb75de63c8 100644
--- a/packages/editor/src/core/extensions/custom-image/read-only-custom-image.ts
+++ b/packages/editor/src/core/extensions/custom-image/read-only-custom-image.ts
@@ -24,12 +24,6 @@ export const CustomReadOnlyImageExtension = () =>
         height: {
           default: "auto",
         },
-        ["data-type"]: {
-          default: this.name,
-        },
-        ["data-file"]: {
-          default: null,
-        },
         ["id"]: {
           default: null,
         },