fixup! feat(text-editor): add support for pasting inline images

Lundalogik · Mar 5, 2025 · 7503410 · 7503410
1 parent 5aae2b8
commit 7503410
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 9 deletions.
diff --git a/src/components/text-editor/prosemirror-adapter/plugins/image/inserter.ts b/src/components/text-editor/prosemirror-adapter/plugins/image/inserter.ts
@@ -8,6 +8,7 @@ import {
     ImageState,
 } from '../../../text-editor.types';
 import { Node } from 'prosemirror-model';
+import { imageCache } from './node';
 
 export const pluginKey = new PluginKey('imageInserterPlugin');
 
@@ -83,6 +84,8 @@ const findAndHandleRemovedImages = (
             state: removedImage.attrs.state,
         };
         imageRemovedCallback(imageInfo);
+
+        imageCache.delete(removedImage.attrs.fileInfoId);        
     }
 };
 

diff --git a/src/components/text-editor/prosemirror-adapter/plugins/image/node.ts b/src/components/text-editor/prosemirror-adapter/plugins/image/node.ts
@@ -2,7 +2,7 @@ import { NodeSpec, Node, Attrs, DOMOutputSpec } from 'prosemirror-model';
 import { ImageState } from '../../../text-editor.types';
 import { MarkdownSerializerState } from 'prosemirror-markdown';
 
-const imageCache = new Map<string, HTMLImageElement>();
+export const imageCache = new Map<string, HTMLImageElement>();
 
 type MarkdownSerializerFunction = (
     state: MarkdownSerializerState,
@@ -96,16 +96,15 @@ function createImageNodeSpec(): NodeSpec {
                 return document.createElement('span');
             }
 
-            if (imageCache.has(node.attrs.fileInfoId)) {
-                const img = imageCache.get(node.attrs.fileInfoId);
-
-                return updateImageElement(img, node);
+            let img = imageCache.get(node.attrs.fileInfoId);
+            if (img) {
+                updateImageElement(img, node);
             } else {
-                const img = createImageElement(node);
+                img = createImageElement(node);
                 imageCache.set(node.attrs.fileInfoId, img);
-
-                return img;
             }
+
+            return img;
         },
         parseDOM: [
             {

diff --git a/src/components/text-editor/prosemirror-adapter/prosemirror-adapter.tsx b/src/components/text-editor/prosemirror-adapter/prosemirror-adapter.tsx
@@ -51,7 +51,7 @@ import {
     ImageInfo,
 } from '../text-editor.types';
 import { getTableNodes, getTableEditingPlugins } from './plugins/table-plugin';
-import { getImageNode } from './plugins/image/node';
+import { getImageNode, imageCache } from './plugins/image/node';
 
 const DEBOUNCE_TIMEOUT = 300;
 
@@ -230,6 +230,8 @@ export class ProsemirrorAdapter {
     }
 
     public disconnectedCallback() {
+        imageCache.clear();
+
         this.host.removeEventListener(
             'open-editor-link-menu',
             this.handleOpenLinkMenu,