[WIKI-699] refactor: editor config (#7850)

apps/web/ce/hooks/editor/use-extended-editor-config.ts

@@ -0,0 +1,23 @@
+import { useCallback } from "react";
+// plane imports
+import type { TExtendedFileHandler } from "@plane/editor";
+
+export type TExtendedEditorFileHandlersArgs = {
+  projectId?: string;
+  workspaceSlug: string;
+};
+
+export type TExtendedEditorConfig = {
+  getExtendedEditorFileHandlers: (args: TExtendedEditorFileHandlersArgs) => TExtendedFileHandler;
+};
+
+export const useExtendedEditorConfig = (): TExtendedEditorConfig => {
+  const getExtendedEditorFileHandlers: TExtendedEditorConfig["getExtendedEditorFileHandlers"] = useCallback(
+    () => ({}),
+    []
+  );
+
+  return {
+    getExtendedEditorFileHandlers,
+  };
+};

apps/web/core/hooks/editor/use-editor-config.ts

@@ -5,6 +5,7 @@ import { getEditorAssetDownloadSrc, getEditorAssetSrc } from "@plane/utils";
 // hooks
 import { useEditorAsset } from "@/hooks/store/use-editor-asset";
 // plane web hooks
+import { useExtendedEditorConfig } from "@/plane-web/hooks/editor/use-extended-editor-config";
 import { useFileSize } from "@/plane-web/hooks/use-file-size";
 // services
 import { FileService } from "@/services/file.service";
@@ -22,6 +23,7 @@ export const useEditorConfig = () => {
   const { assetsUploadPercentage } = useEditorAsset();
   // file size
   const { maxFileSize } = useFileSize();
+  const { getExtendedEditorFileHandlers } = useExtendedEditorConfig();
 
   const getEditorFileHandlers = useCallback(
     (args: TArgs): TFileHandler => {
@@ -86,9 +88,10 @@ export const useEditorConfig = () => {
         validation: {
           maxFileSize,
         },
+        ...getExtendedEditorFileHandlers({ projectId, workspaceSlug }),
       };
     },
-    [assetsUploadPercentage, maxFileSize]
+    [assetsUploadPercentage, getExtendedEditorFileHandlers, maxFileSize]
   );
 
   return {

apps/web/core/services/file.service.ts

@@ -273,7 +273,6 @@ export class FileService extends APIService {
         throw err?.response?.data;
       });
   }
-
   async getProjectCoverImages(): Promise<string[]> {
     return this.get(`/api/project-covers/`)
       .then((res) => res?.data)

packages/editor/src/ce/types/config.ts

@@ -0,0 +1 @@
+export type TExtendedFileHandler = object;

packages/editor/src/ce/types/index.ts

@@ -1,2 +1,3 @@
 export * from "./issue-embed";
 export * from "./editor-extended";
+export * from "./config";

packages/editor/src/core/plugins/drag-handle.ts

@@ -22,6 +22,7 @@ const generalSelectors = [
   ".image-upload-component",
   ".editor-callout-component",
   ".editor-embed-component",
+  ".editor-drawio-component",
 ].join(", ");
 
 const maxScrollSpeed = 20;

packages/editor/src/core/types/config.ts

@@ -1,5 +1,6 @@
 // plane imports
 import { TWebhookConnectionQueryParams } from "@plane/types";
+import { TExtendedFileHandler } from "@/plane-editor/types/config";
 
 export type TFileHandler = {
   assetsUploadStatus: Record<string, number>; // blockId => progress percentage
@@ -16,7 +17,7 @@ export type TFileHandler = {
      * @example enter 5242880(5 * 1024 * 1024) for 5MB
      */
     maxFileSize: number;
-  };
+  } & TExtendedFileHandler;
 };
 
 export type TEditorFontStyle = "sans-serif" | "serif" | "monospace";