[WIKI-181] chore: editor extension storage utility code split (#7071)

* chore: storage extension code split

* chore: use storage extension utility
This commit is contained in:
Aaryan Khandelwal 2025-05-19 13:12:52 +05:30 committed by GitHub
parent e48b2da623
commit 2a2feaf88e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 22 additions and 24 deletions

View file

@ -0,0 +1,13 @@
import { HeadingExtensionStorage } from "@/extensions";
import { CustomImageExtensionStorage } from "@/extensions/custom-image";
import { CustomLinkStorage } from "@/extensions/custom-link";
import { MentionExtensionStorage } from "@/extensions/mentions";
import { ImageExtensionStorage } from "@/plugins/image";
export type ExtensionStorageMap = {
imageComponent: CustomImageExtensionStorage;
image: ImageExtensionStorage;
link: CustomLinkStorage;
headingList: HeadingExtensionStorage;
mention: MentionExtensionStorage;
};

View file

@ -8,6 +8,7 @@ import { ACCEPTED_IMAGE_MIME_TYPES } from "@/constants/config";
import { CustomImageNode } from "@/extensions/custom-image"; import { CustomImageNode } from "@/extensions/custom-image";
// helpers // helpers
import { isFileValid } from "@/helpers/file"; import { isFileValid } from "@/helpers/file";
import { getExtensionStorage } from "@/helpers/get-extension-storage";
import { insertEmptyParagraphAtNodeBoundaries } from "@/helpers/insert-empty-paragraph-at-node-boundary"; import { insertEmptyParagraphAtNodeBoundaries } from "@/helpers/insert-empty-paragraph-at-node-boundary";
// plugins // plugins
import { TrackImageDeletionPlugin, TrackImageRestorationPlugin } from "@/plugins/image"; import { TrackImageDeletionPlugin, TrackImageRestorationPlugin } from "@/plugins/image";
@ -32,10 +33,9 @@ declare module "@tiptap/core" {
} }
} }
export const getImageComponentImageFileMap = (editor: Editor) => export const getImageComponentImageFileMap = (editor: Editor) => getExtensionStorage(editor, "imageComponent")?.fileMap;
(editor.storage.imageComponent as UploadImageExtensionStorage | undefined)?.fileMap;
export interface UploadImageExtensionStorage { export interface CustomImageExtensionStorage {
assetsUploadStatus: TFileHandler["assetsUploadStatus"]; assetsUploadStatus: TFileHandler["assetsUploadStatus"];
fileMap: Map<string, UploadEntity>; fileMap: Map<string, UploadEntity>;
deletedImageSet: Map<string, boolean>; deletedImageSet: Map<string, boolean>;
@ -55,7 +55,7 @@ export const CustomImageExtension = (props: TFileHandler) => {
validation: { maxFileSize }, validation: { maxFileSize },
} = props; } = props;
return Image.extend<Record<string, unknown>, UploadImageExtensionStorage>({ return Image.extend<Record<string, unknown>, CustomImageExtensionStorage>({
name: "imageComponent", name: "imageComponent",
selectable: true, selectable: true,
group: "block", group: "block",

View file

@ -2,14 +2,14 @@ import { mergeAttributes } from "@tiptap/core";
import { Image } from "@tiptap/extension-image"; import { Image } from "@tiptap/extension-image";
import { ReactNodeViewRenderer } from "@tiptap/react"; import { ReactNodeViewRenderer } from "@tiptap/react";
// components // components
import { CustomImageNode, UploadImageExtensionStorage } from "@/extensions/custom-image"; import { CustomImageNode, CustomImageExtensionStorage } from "@/extensions/custom-image";
// types // types
import { TReadOnlyFileHandler } from "@/types"; import { TReadOnlyFileHandler } from "@/types";
export const CustomReadOnlyImageExtension = (props: TReadOnlyFileHandler) => { export const CustomReadOnlyImageExtension = (props: TReadOnlyFileHandler) => {
const { getAssetSrc, restore: restoreImageFn } = props; const { getAssetSrc, restore: restoreImageFn } = props;
return Image.extend<Record<string, unknown>, UploadImageExtensionStorage>({ return Image.extend<Record<string, unknown>, CustomImageExtensionStorage>({
name: "imageComponent", name: "imageComponent",
selectable: false, selectable: false,
group: "block", group: "block",

View file

@ -1,23 +1,8 @@
import { Editor } from "@tiptap/core"; import { Editor } from "@tiptap/core";
import { // plane editor types
CustomLinkStorage, import { ExtensionStorageMap } from "@/plane-editor/types/storage";
HeadingExtensionStorage,
MentionExtensionStorage,
UploadImageExtensionStorage,
} from "@/extensions";
import { ImageExtensionStorage } from "@/plugins/image";
type ExtensionNames = "imageComponent" | "image" | "link" | "headingList" | "mention"; export const getExtensionStorage = <K extends keyof ExtensionStorageMap>(
interface ExtensionStorageMap {
imageComponent: UploadImageExtensionStorage;
image: ImageExtensionStorage;
link: CustomLinkStorage;
headingList: HeadingExtensionStorage;
mention: MentionExtensionStorage;
}
export const getExtensionStorage = <K extends ExtensionNames>(
editor: Editor, editor: Editor,
extensionName: K extensionName: K
): ExtensionStorageMap[K] => editor.storage[extensionName]; ): ExtensionStorageMap[K] => editor.storage[extensionName];