From 8ea97f3ffc16eb795badf623bd195cd9b8d9a388 Mon Sep 17 00:00:00 2001 From: kolaente Date: Sun, 21 Jan 2024 15:45:18 +0100 Subject: [PATCH] fix(editor): use a stable image id to prevent constant re-rendering --- src/components/input/editor/TipTap.vue | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/input/editor/TipTap.vue b/src/components/input/editor/TipTap.vue index 4b096131f3..f50e30314a 100644 --- a/src/components/input/editor/TipTap.vue +++ b/src/components/input/editor/TipTap.vue @@ -173,7 +173,6 @@ import XButton from '@/components/input/button.vue' import {Placeholder} from '@tiptap/extension-placeholder' import {eventToHotkeyString} from '@github/hotkey' import {mergeAttributes} from '@tiptap/core' -import {createRandomID} from '@/helpers/randomId' import {isEditorContentEmpty} from '@/helpers/editorContentEmpty' const tiptapInstanceRef = ref(null) @@ -229,19 +228,20 @@ const CustomImage = Image.extend({ renderHTML({HTMLAttributes}) { if (HTMLAttributes.src?.startsWith(window.API_URL) || HTMLAttributes['data-src']?.startsWith(window.API_URL)) { const imageUrl = HTMLAttributes['data-src'] ?? HTMLAttributes.src - const id = 'tiptap-image-' + createRandomID() + + // The url is something like /tasks//attachments/ + const parts = imageUrl.slice(window.API_URL.length + 1).split('/') + const taskId = Number(parts[1]) + const attachmentId = Number(parts[3]) + const cacheKey: CacheKey = `${taskId}-${attachmentId}` + const id = 'tiptap-image-' + cacheKey + nextTick(async () => { const img = document.getElementById(id) if (!img) return - // The url is something like /tasks//attachments/ - const parts = imageUrl.slice(window.API_URL.length + 1).split('/') - const taskId = Number(parts[1]) - const attachmentId = Number(parts[3]) - const cacheKey: CacheKey = `${taskId}-${attachmentId}` - if (typeof loadedAttachments.value[cacheKey] === 'undefined') { const attachment = new AttachmentModel({taskId: taskId, id: attachmentId})