snapshot of https://github.com/makeplane/plane.git @ d868349a55de79979eb8b98701bf1702c67ad634 (2026-09-15)

apps/web/core/hooks/editor/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+export * from "./use-editor-config";
+export * from "./use-editor-mention";

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

@@ -0,0 +1,108 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useCallback } from "react";
+// plane imports
+import type { TFileHandler } from "@plane/editor";
+import { getEditorAssetDownloadSrc, getEditorAssetSrc } from "@plane/utils";
+// hooks
+import { useEditorAsset } from "@/hooks/store/use-editor-asset";
+// plane web hooks
+import { useExtendedEditorConfig } from "@/hooks/editor/use-extended-editor-config";
+import { useFileSize } from "@/hooks/use-file-size";
+// services
+import { FileService } from "@/services/file.service";
+const fileService = new FileService();
+
+type TArgs = {
+  projectId?: string;
+  uploadFile: TFileHandler["upload"];
+  duplicateFile: TFileHandler["duplicate"];
+  workspaceId: string;
+  workspaceSlug: string;
+};
+
+export const useEditorConfig = () => {
+  // store hooks
+  const { assetsUploadPercentage } = useEditorAsset();
+  // file size
+  const { maxFileSize } = useFileSize();
+  const { getExtendedEditorFileHandlers } = useExtendedEditorConfig();
+
+  const getEditorFileHandlers = useCallback(
+    (args: TArgs): TFileHandler => {
+      const { projectId, uploadFile, duplicateFile, workspaceId, workspaceSlug } = args;
+
+      return {
+        assetsUploadStatus: assetsUploadPercentage,
+        cancel: fileService.cancelUpload,
+        checkIfAssetExists: async (assetId: string) => {
+          const res = await fileService.checkIfAssetExists(workspaceSlug, assetId);
+          return res?.exists ?? false;
+        },
+        delete: async (src: string) => {
+          if (src?.startsWith("http")) {
+            await fileService.deleteOldWorkspaceAsset(workspaceId, src);
+          } else {
+            await fileService.deleteNewAsset(
+              getEditorAssetSrc({
+                assetId: src,
+                projectId,
+                workspaceSlug,
+              }) ?? ""
+            );
+          }
+        },
+        getAssetDownloadSrc: async (path) => {
+          if (!path) return "";
+          if (path?.startsWith("http")) {
+            return path;
+          } else {
+            return (
+              getEditorAssetDownloadSrc({
+                assetId: path,
+                projectId,
+                workspaceSlug,
+              }) ?? ""
+            );
+          }
+        },
+        getAssetSrc: async (path) => {
+          if (!path) return "";
+          if (path?.startsWith("http")) {
+            return path;
+          } else {
+            return (
+              getEditorAssetSrc({
+                assetId: path,
+                projectId,
+                workspaceSlug,
+              }) ?? ""
+            );
+          }
+        },
+        restore: async (src: string) => {
+          if (src?.startsWith("http")) {
+            await fileService.restoreOldEditorAsset(workspaceId, src);
+          } else {
+            await fileService.restoreNewAsset(workspaceSlug, src);
+          }
+        },
+        upload: uploadFile,
+        duplicate: duplicateFile,
+        validation: {
+          maxFileSize,
+        },
+        ...getExtendedEditorFileHandlers({ projectId, workspaceSlug }),
+      };
+    },
+    [assetsUploadPercentage, getExtendedEditorFileHandlers, maxFileSize]
+  );
+
+  return {
+    getEditorFileHandlers,
+  };
+};

apps/web/core/hooks/editor/use-editor-mention.tsx

@@ -0,0 +1,82 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useCallback } from "react";
+// plane editor
+import { Avatar } from "@makeplane/propel/components/avatar";
+import type { TMentionSection, TMentionSuggestion } from "@plane/editor";
+// plane types
+import type { TSearchEntities, TSearchEntityRequestPayload, TSearchResponse, TUserSearchResponse } from "@plane/types";
+// helpers
+import { getFileURL } from "@plane/utils";
+// plane web hooks
+import { useAdditionalEditorMention } from "@/hooks/use-additional-editor-mention";
+
+type TArgs = {
+  enableAdvancedMentions?: boolean;
+  searchEntity: (payload: TSearchEntityRequestPayload) => Promise<TSearchResponse>;
+};
+
+export const useEditorMention = (args: TArgs) => {
+  const { enableAdvancedMentions = false, searchEntity } = args;
+  // additional mentions
+  const { editorMentionTypes, updateAdditionalSections } = useAdditionalEditorMention({
+    enableAdvancedMentions,
+  });
+  // fetch mentions handler
+  const fetchMentions = useCallback(
+    async (query: string): Promise<TMentionSection[]> => {
+      try {
+        const res = await searchEntity({
+          count: 5,
+          query_type: editorMentionTypes,
+          query,
+        });
+        const suggestionSections: TMentionSection[] = [];
+        if (!res) {
+          throw new Error("No response found");
+        }
+        Object.keys(res).map((key) => {
+          const responseKey = key as TSearchEntities;
+          const response = res[responseKey];
+          if (responseKey === "user_mention" && response && response.length > 0) {
+            const items: TMentionSuggestion[] = (response as TUserSearchResponse[]).map((user) => ({
+              icon: (
+                <Avatar
+                  alt={user.member__display_name}
+                  fallback={user.member__display_name?.[0]?.toUpperCase()}
+                  src={getFileURL(user.member__avatar_url)}
+                  size="xs"
+                />
+              ),
+              id: user.member__id,
+              entity_identifier: user.member__id,
+              entity_name: "user_mention",
+              title: user.member__display_name,
+            }));
+            suggestionSections.push({
+              key: "users",
+              title: "Users",
+              items,
+            });
+          }
+        });
+        const { sections } = updateAdditionalSections({
+          response: res,
+        });
+        return [...suggestionSections, ...sections];
+      } catch (error) {
+        console.error("Error in fetching mentions:", error);
+        throw error;
+      }
+    },
+    [editorMentionTypes, searchEntity, updateAdditionalSections]
+  );
+
+  return {
+    fetchMentions,
+  };
+};

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

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+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,
+  };
+};