[WIKI-345] chore: pass disabled and flagged extensions to block menu (#7152)

* chore: refactor editor

* sync changes

* feat: api service update

* refactor : update sync

* fix : package sync

* fix: requested changes

* fix : embedhandler type

* fix : remove commands

* refactor : space

* refactor : rich lite editors

* refactor : minor ce changes

* chore : minor ui fix

* package: tldjs

* refactor : remove tldjs

* refactor: flagged

* refactor: flagged

* chore : remove disbaled check in menu

* refactor: fix space

* refactor: NodeViewProps

* refactor: type

* refactor : update community types

* refactor : remove external embed CE

* remove : external embed config from ce

* refactor : update disabled

* chore: pass disabled

* chore : update utils

Author: iam-vipin

apps/live/src/core/services/api.service.ts

@@ -14,6 +14,7 @@ export abstract class APIService {
     this.axiosInstance = axios.create({
       baseURL,
       withCredentials: true,
+      timeout: 20000,
     });
   }
 

apps/space/helpers/string.helper.ts

@@ -71,7 +71,7 @@ export const isCommentEmpty = (comment: string | undefined): boolean => {
   return (
     comment?.trim() === "" ||
     comment === "<p></p>" ||
-    isEmptyHtmlString(comment ?? "", ["img", "mention-component", "image-component"])
+    isEmptyHtmlString(comment ?? "", ["img", "mention-component", "image-component", "embed-component"])
   );
 };
 

apps/web/core/components/editor/lite-text/editor.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from "react";
-// plane imports
+// plane constants
 import { EIssueCommentAccessSpecifier } from "@plane/constants";
+// plane imports
 import { type EditorRefApi, type ILiteTextEditorProps, LiteTextEditorWithRef, type TFileHandler } from "@plane/editor";
 import { useTranslation } from "@plane/i18n";
 import type { MakeOptional } from "@plane/types";
@@ -87,7 +88,6 @@ export const LiteTextEditor = React.forwardRef<EditorRefApi, LiteTextEditorWrapp
   // derived values
   const isEmpty = isCommentEmpty(props.initialValue);
   const editorRef = isMutableRefObject<EditorRefApi>(ref) ? ref.current : null;
-
   return (
     <div
       className={cn(

apps/web/core/components/editor/sticky-editor/editor.tsx

@@ -59,7 +59,6 @@ export const StickyEditor = React.forwardRef<EditorRefApi, StickyEditorWrapperPr
   }
   // derived values
   const editorRef = isMutableRefObject<EditorRefApi>(ref) ? ref.current : null;
-
   return (
     <div
       className={cn("relative border border-custom-border-200 rounded", parentClassName)}

apps/web/next.config.js

@@ -12,7 +12,7 @@ const nextConfig = {
     return [
       {
         source: "/(.*)?",
-        headers: [{ key: "X-Frame-Options", value: "SAMEORIGIN" }],
+        headers: [{ key: "X-Frame-Options", value: "DENY" }],
       },
     ];
   },

packages/editor/src/core/components/editors/document/collaborative-editor.tsx

@@ -108,6 +108,8 @@ const CollaborativeDocumentEditor: React.FC<ICollaborativeDocumentEditorProps> =
       isTouchDevice={!!isTouchDevice}
       isLoading={!hasServerSynced && !hasServerConnectionFailed}
       tabIndex={tabIndex}
+      flaggedExtensions={flaggedExtensions}
+      disabledExtensions={disabledExtensions}
     />
   );
 };

packages/editor/src/core/components/editors/document/editor.tsx

@@ -82,6 +82,7 @@ const DocumentEditor = (props: IDocumentEditorProps) => {
     initialValue: value,
     mentionHandler,
     onChange,
+    embedHandler,
   });
 
   const editorContainerClassName = getEditorClassNames({
@@ -98,6 +99,8 @@ const DocumentEditor = (props: IDocumentEditorProps) => {
       editorContainerClassName={cn(editorContainerClassName, "document-editor")}
       id={id}
       isTouchDevice={!!isTouchDevice}
+      flaggedExtensions={flaggedExtensions}
+      disabledExtensions={disabledExtensions}
     />
   );
 };

packages/editor/src/core/components/editors/document/page-renderer.tsx

@@ -5,7 +5,7 @@ import { cn } from "@plane/utils";
 import { DocumentContentLoader, EditorContainer, EditorContentWrapper } from "@/components/editors";
 import { AIFeaturesMenu, BlockMenu, EditorBubbleMenu } from "@/components/menus";
 // types
-import { TAIHandler, TDisplayConfig } from "@/types";
+import { IEditorProps, TAIHandler, TDisplayConfig } from "@/types";
 
 type Props = {
   aiHandler?: TAIHandler;
@@ -18,6 +18,8 @@ type Props = {
   isLoading?: boolean;
   isTouchDevice: boolean;
   tabIndex?: number;
+  flaggedExtensions?: IEditorProps["flaggedExtensions"];
+  disabledExtensions?: IEditorProps["disabledExtensions"];
 };
 
 export const PageRenderer = (props: Props) => {
@@ -32,6 +34,8 @@ export const PageRenderer = (props: Props) => {
     isLoading,
     isTouchDevice,
     tabIndex,
+    flaggedExtensions,
+    disabledExtensions,
   } = props;
 
   return (
@@ -54,7 +58,11 @@ export const PageRenderer = (props: Props) => {
           {editor.isEditable && !isTouchDevice && (
             <div>
               {bubbleMenuEnabled && <EditorBubbleMenu editor={editor} />}
-              <BlockMenu editor={editor} />
+              <BlockMenu
+                editor={editor}
+                flaggedExtensions={flaggedExtensions}
+                disabledExtensions={disabledExtensions}
+              />
               <AIFeaturesMenu menu={aiHandler?.menu} />
             </div>
           )}

packages/editor/src/core/components/editors/editor-wrapper.tsx

@@ -41,6 +41,7 @@ export const EditorWrapper: React.FC<Props> = (props) => {
     placeholder,
     tabIndex,
     value,
+    embedHandler,
   } = props;
 
   const editor = useEditor({
@@ -65,6 +66,7 @@ export const EditorWrapper: React.FC<Props> = (props) => {
     placeholder,
     tabIndex,
     value,
+    embedHandler,
   });
 
   const editorContainerClassName = getEditorClassNames({

packages/editor/src/core/components/editors/link-view-container.tsx

@@ -1,8 +1,12 @@
 import { autoUpdate, flip, hide, shift, useDismiss, useFloating, useInteractions } from "@floating-ui/react";
 import { Editor, useEditorState } from "@tiptap/react";
 import { FC, useCallback, useEffect, useRef, useState } from "react";
+
 // components
 import { LinkView, LinkViewProps } from "@/components/links";
+import { CORE_EXTENSIONS } from "@/constants/extension";
+// components
+import { getExtensionStorage } from "@/helpers/get-extension-storage";
 
 type Props = {
   editor: Editor;
@@ -18,7 +22,7 @@ export const LinkViewContainer: FC<Props> = ({ editor, containerRef }) => {
   const editorState = useEditorState({
     editor,
     selector: ({ editor }: { editor: Editor }) => ({
-      linkExtensionStorage: editor.storage.link,
+      linkExtensionStorage: getExtensionStorage(editor, CORE_EXTENSIONS.CUSTOM_LINK),
     }),
   });