From 86007828b1f5e368d6f594080e8e04d39a84f7c1 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal Date: Wed, 27 Nov 2024 14:08:58 +0530 Subject: [PATCH 1/6] fix: merge conflicts resolved from preview --- .../src/ce/extensions/core/extensions.ts | 11 +++++++++- .../extensions/core/read-only-extensions.ts | 11 +++++++++- packages/editor/src/ce/extensions/index.ts | 1 + .../src/ce/extensions/slash-commands.tsx | 14 +++++++++++++ .../collaborative-read-only-editor.tsx | 2 ++ .../editors/document/read-only-editor.tsx | 5 ++++- .../components/editors/editor-wrapper.tsx | 2 ++ .../editors/read-only-editor-wrapper.tsx | 2 ++ .../components/editors/rich-text/editor.tsx | 13 ++++++------ .../editor/src/core/extensions/extensions.tsx | 9 ++++++--- .../core/extensions/read-only-extensions.tsx | 9 ++++++--- .../slash-commands/command-items-list.tsx | 20 ++++++++++++++++--- .../core/extensions/slash-commands/root.tsx | 11 +++++++--- .../core/hooks/use-collaborative-editor.ts | 1 + packages/editor/src/core/hooks/use-editor.ts | 12 ++++++++++- .../use-read-only-collaborative-editor.ts | 2 ++ .../src/core/hooks/use-read-only-editor.ts | 11 ++++++---- .../editor/src/core/types/collaboration.ts | 2 +- packages/editor/src/core/types/editor.ts | 3 ++- packages/editor/src/core/types/extensions.ts | 2 +- .../lite-text-editor/lite-text-editor.tsx | 7 ++++++- .../lite-text-read-only-editor.tsx | 10 +++++++++- .../rich-text-editor/rich-text-editor.tsx | 7 ++++++- .../rich-text-read-only-editor.tsx | 10 +++++++++- .../components/pages/editor/editor-body.tsx | 5 +++-- 25 files changed, 146 insertions(+), 36 deletions(-) create mode 100644 packages/editor/src/ce/extensions/slash-commands.tsx diff --git a/packages/editor/src/ce/extensions/core/extensions.ts b/packages/editor/src/ce/extensions/core/extensions.ts index 8f4fd41855a..d03229133b0 100644 --- a/packages/editor/src/ce/extensions/core/extensions.ts +++ b/packages/editor/src/ce/extensions/core/extensions.ts @@ -1,3 +1,12 @@ import { Extensions } from "@tiptap/core"; +// types +import { TExtensions } from "@/types"; -export const CoreEditorAdditionalExtensions = (): Extensions => []; +type Props = { + disabledExtensions: TExtensions[]; +}; + +export const CoreEditorAdditionalExtensions = (props: Props): Extensions => { + const {} = props; + return []; +}; diff --git a/packages/editor/src/ce/extensions/core/read-only-extensions.ts b/packages/editor/src/ce/extensions/core/read-only-extensions.ts index b7789af738b..398848e31d8 100644 --- a/packages/editor/src/ce/extensions/core/read-only-extensions.ts +++ b/packages/editor/src/ce/extensions/core/read-only-extensions.ts @@ -1,3 +1,12 @@ import { Extensions } from "@tiptap/core"; +// types +import { TExtensions } from "@/types"; -export const CoreReadOnlyEditorAdditionalExtensions = (): Extensions => []; +type Props = { + disabledExtensions: TExtensions[]; +}; + +export const CoreReadOnlyEditorAdditionalExtensions = (props: Props): Extensions => { + const {} = props; + return []; +}; diff --git a/packages/editor/src/ce/extensions/index.ts b/packages/editor/src/ce/extensions/index.ts index b25cbcfc73b..c9f58a936a9 100644 --- a/packages/editor/src/ce/extensions/index.ts +++ b/packages/editor/src/ce/extensions/index.ts @@ -1,2 +1,3 @@ export * from "./core"; export * from "./document-extensions"; +export * from "./slash-commands"; diff --git a/packages/editor/src/ce/extensions/slash-commands.tsx b/packages/editor/src/ce/extensions/slash-commands.tsx new file mode 100644 index 00000000000..6eabee08238 --- /dev/null +++ b/packages/editor/src/ce/extensions/slash-commands.tsx @@ -0,0 +1,14 @@ +// extensions +import { TSlashCommandAdditionalOption } from "@/extensions"; +// types +import { TExtensions } from "@/types"; + +type Props = { + disabledExtensions: TExtensions[]; +}; + +export const coreEditorAdditionalSlashCommandOptions = (props: Props): TSlashCommandAdditionalOption[] => { + const {} = props; + const options: TSlashCommandAdditionalOption[] = []; + return options; +}; diff --git a/packages/editor/src/core/components/editors/document/collaborative-read-only-editor.tsx b/packages/editor/src/core/components/editors/document/collaborative-read-only-editor.tsx index aa925abece4..89acace7b70 100644 --- a/packages/editor/src/core/components/editors/document/collaborative-read-only-editor.tsx +++ b/packages/editor/src/core/components/editors/document/collaborative-read-only-editor.tsx @@ -15,6 +15,7 @@ import { EditorReadOnlyRefApi, ICollaborativeDocumentReadOnlyEditor } from "@/ty const CollaborativeDocumentReadOnlyEditor = (props: ICollaborativeDocumentReadOnlyEditor) => { const { containerClassName, + disabledExtensions, displayConfig = DEFAULT_DISPLAY_CONFIG, editorClassName = "", embedHandler, @@ -37,6 +38,7 @@ const CollaborativeDocumentReadOnlyEditor = (props: ICollaborativeDocumentReadOn } const { editor, hasServerConnectionFailed, hasServerSynced } = useReadOnlyCollaborativeEditor({ + disabledExtensions, editorClassName, extensions, fileHandler, diff --git a/packages/editor/src/core/components/editors/document/read-only-editor.tsx b/packages/editor/src/core/components/editors/document/read-only-editor.tsx index 8544157aa0e..b36fb44a7a9 100644 --- a/packages/editor/src/core/components/editors/document/read-only-editor.tsx +++ b/packages/editor/src/core/components/editors/document/read-only-editor.tsx @@ -10,9 +10,10 @@ import { getEditorClassNames } from "@/helpers/common"; // hooks import { useReadOnlyEditor } from "@/hooks/use-read-only-editor"; // types -import { EditorReadOnlyRefApi, IMentionHighlight, TDisplayConfig, TFileHandler } from "@/types"; +import { EditorReadOnlyRefApi, IMentionHighlight, TDisplayConfig, TExtensions, TFileHandler } from "@/types"; interface IDocumentReadOnlyEditor { + disabledExtensions: TExtensions[]; id: string; initialValue: string; containerClassName: string; @@ -31,6 +32,7 @@ interface IDocumentReadOnlyEditor { const DocumentReadOnlyEditor = (props: IDocumentReadOnlyEditor) => { const { containerClassName, + disabledExtensions, displayConfig = DEFAULT_DISPLAY_CONFIG, editorClassName = "", embedHandler, @@ -51,6 +53,7 @@ const DocumentReadOnlyEditor = (props: IDocumentReadOnlyEditor) => { } const editor = useReadOnlyEditor({ + disabledExtensions, editorClassName, extensions, fileHandler, diff --git a/packages/editor/src/core/components/editors/editor-wrapper.tsx b/packages/editor/src/core/components/editors/editor-wrapper.tsx index 33f011535c5..075420ed74f 100644 --- a/packages/editor/src/core/components/editors/editor-wrapper.tsx +++ b/packages/editor/src/core/components/editors/editor-wrapper.tsx @@ -19,6 +19,7 @@ export const EditorWrapper: React.FC = (props) => { const { children, containerClassName, + disabledExtensions, displayConfig = DEFAULT_DISPLAY_CONFIG, editorClassName = "", extensions, @@ -37,6 +38,7 @@ export const EditorWrapper: React.FC = (props) => { } = props; const editor = useEditor({ + disabledExtensions, editorClassName, enableHistory: true, extensions, diff --git a/packages/editor/src/core/components/editors/read-only-editor-wrapper.tsx b/packages/editor/src/core/components/editors/read-only-editor-wrapper.tsx index e06826a2895..6cd360ac0d7 100644 --- a/packages/editor/src/core/components/editors/read-only-editor-wrapper.tsx +++ b/packages/editor/src/core/components/editors/read-only-editor-wrapper.tsx @@ -12,6 +12,7 @@ import { IReadOnlyEditorProps } from "@/types"; export const ReadOnlyEditorWrapper = (props: IReadOnlyEditorProps) => { const { containerClassName, + disabledExtensions, displayConfig = DEFAULT_DISPLAY_CONFIG, editorClassName = "", fileHandler, @@ -22,6 +23,7 @@ export const ReadOnlyEditorWrapper = (props: IReadOnlyEditorProps) => { } = props; const editor = useReadOnlyEditor({ + disabledExtensions, editorClassName, fileHandler, forwardedRef, diff --git a/packages/editor/src/core/components/editors/rich-text/editor.tsx b/packages/editor/src/core/components/editors/rich-text/editor.tsx index 87dba8b4d11..ffcc21da6c7 100644 --- a/packages/editor/src/core/components/editors/rich-text/editor.tsx +++ b/packages/editor/src/core/components/editors/rich-text/editor.tsx @@ -8,12 +8,7 @@ import { SideMenuExtension, SlashCommands } from "@/extensions"; import { EditorRefApi, IRichTextEditor } from "@/types"; const RichTextEditor = (props: IRichTextEditor) => { - const { - disabledExtensions, - dragDropEnabled, - bubbleMenuEnabled = true, - extensions: externalExtensions = [], - } = props; + const { disabledExtensions, dragDropEnabled, bubbleMenuEnabled = true, extensions: externalExtensions = [] } = props; const getExtensions = useCallback(() => { const extensions = [ @@ -24,7 +19,11 @@ const RichTextEditor = (props: IRichTextEditor) => { }), ]; if (!disabledExtensions?.includes("slash-commands")) { - extensions.push(SlashCommands()); + extensions.push( + SlashCommands({ + disabledExtensions, + }) + ); } return extensions; diff --git a/packages/editor/src/core/extensions/extensions.tsx b/packages/editor/src/core/extensions/extensions.tsx index 96e90a5255f..b43ca1e3595 100644 --- a/packages/editor/src/core/extensions/extensions.tsx +++ b/packages/editor/src/core/extensions/extensions.tsx @@ -32,11 +32,12 @@ import { // helpers import { isValidHttpUrl } from "@/helpers/common"; // types -import { IMentionHighlight, IMentionSuggestion, TFileHandler } from "@/types"; +import { IMentionHighlight, IMentionSuggestion, TExtensions, TFileHandler } from "@/types"; // plane editor extensions import { CoreEditorAdditionalExtensions } from "@/plane-editor/extensions"; type TArguments = { + disabledExtensions: TExtensions[]; enableHistory: boolean; fileHandler: TFileHandler; mentionConfig: { @@ -48,7 +49,7 @@ type TArguments = { }; export const CoreEditorExtensions = (args: TArguments): Extensions => { - const { enableHistory, fileHandler, mentionConfig, placeholder, tabIndex } = args; + const { disabledExtensions, enableHistory, fileHandler, mentionConfig, placeholder, tabIndex } = args; return [ StarterKit.configure({ @@ -163,6 +164,8 @@ export const CoreEditorExtensions = (args: TArguments): Extensions => { CharacterCount, CustomTextAlignExtension, CustomColorExtension, - ...CoreEditorAdditionalExtensions(), + ...CoreEditorAdditionalExtensions({ + disabledExtensions, + }), ]; }; diff --git a/packages/editor/src/core/extensions/read-only-extensions.tsx b/packages/editor/src/core/extensions/read-only-extensions.tsx index 1eb0e852255..0d77c251030 100644 --- a/packages/editor/src/core/extensions/read-only-extensions.tsx +++ b/packages/editor/src/core/extensions/read-only-extensions.tsx @@ -28,11 +28,12 @@ import { // helpers import { isValidHttpUrl } from "@/helpers/common"; // types -import { IMentionHighlight, TFileHandler } from "@/types"; +import { IMentionHighlight, TExtensions, TFileHandler } from "@/types"; // plane editor extensions import { CoreReadOnlyEditorAdditionalExtensions } from "@/plane-editor/extensions"; type Props = { + disabledExtensions: TExtensions[]; fileHandler: Pick; mentionConfig: { mentionHighlights?: () => Promise; @@ -40,7 +41,7 @@ type Props = { }; export const CoreReadOnlyEditorExtensions = (props: Props): Extensions => { - const { fileHandler, mentionConfig } = props; + const { disabledExtensions, fileHandler, mentionConfig } = props; return [ StarterKit.configure({ @@ -129,6 +130,8 @@ export const CoreReadOnlyEditorExtensions = (props: Props): Extensions => { CustomColorExtension, HeadingListExtension, CustomTextAlignExtension, - ...CoreReadOnlyEditorAdditionalExtensions(), + ...CoreReadOnlyEditorAdditionalExtensions({ + disabledExtensions, + }), ]; }; diff --git a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx index d3fc807d029..84940bcedb0 100644 --- a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx +++ b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx @@ -37,7 +37,10 @@ import { setText, } from "@/helpers/editor-commands"; // types -import { CommandProps, ISlashCommandItem, TSlashCommandSectionKeys } from "@/types"; +import { CommandProps, ISlashCommandItem, TExtensions, TSlashCommandSectionKeys } from "@/types"; +// plane editor extensions +import { coreEditorAdditionalSlashCommandOptions } from "@/plane-editor/extensions"; +// local types import { TSlashCommandAdditionalOption } from "./root"; export type TSlashCommandSection = { @@ -46,9 +49,15 @@ export type TSlashCommandSection = { items: ISlashCommandItem[]; }; +type TArgs = { + additionalOptions?: TSlashCommandAdditionalOption[]; + disabledExtensions: TExtensions[]; +}; + export const getSlashCommandFilteredSections = - (additionalOptions?: TSlashCommandAdditionalOption[]) => + (args: TArgs) => ({ query }: { query: string }): TSlashCommandSection[] => { + const { additionalOptions, disabledExtensions } = args; const SLASH_COMMAND_SECTIONS: TSlashCommandSection[] = [ { key: "general", @@ -269,7 +278,12 @@ export const getSlashCommandFilteredSections = }, ]; - additionalOptions?.forEach((item) => { + [ + ...(additionalOptions ?? []), + ...coreEditorAdditionalSlashCommandOptions({ + disabledExtensions, + }), + ]?.forEach((item) => { const sectionToPushTo = SLASH_COMMAND_SECTIONS.find((s) => s.key === item.section) ?? SLASH_COMMAND_SECTIONS[0]; const itemIndexToPushAfter = sectionToPushTo.items.findIndex((i) => i.commandKey === item.pushAfter); if (itemIndexToPushAfter !== undefined) { diff --git a/packages/editor/src/core/extensions/slash-commands/root.tsx b/packages/editor/src/core/extensions/slash-commands/root.tsx index afe670d8fef..62c353f9275 100644 --- a/packages/editor/src/core/extensions/slash-commands/root.tsx +++ b/packages/editor/src/core/extensions/slash-commands/root.tsx @@ -3,7 +3,7 @@ import { ReactRenderer } from "@tiptap/react"; import Suggestion, { SuggestionOptions } from "@tiptap/suggestion"; import tippy from "tippy.js"; // types -import { ISlashCommandItem, TEditorCommands, TSlashCommandSectionKeys } from "@/types"; +import { ISlashCommandItem, TEditorCommands, TExtensions, TSlashCommandSectionKeys } from "@/types"; // components import { getSlashCommandFilteredSections } from "./command-items-list"; import { SlashCommandsMenu, SlashCommandsMenuProps } from "./command-menu"; @@ -107,10 +107,15 @@ const renderItems = () => { }; }; -export const SlashCommands = (additionalOptions?: TSlashCommandAdditionalOption[]) => +type TExtensionProps = { + additionalOptions?: TSlashCommandAdditionalOption[]; + disabledExtensions: TExtensions[]; +}; + +export const SlashCommands = (props: TExtensionProps) => Command.configure({ suggestion: { - items: getSlashCommandFilteredSections(additionalOptions), + items: getSlashCommandFilteredSections(props), render: renderItems, }, }); diff --git a/packages/editor/src/core/hooks/use-collaborative-editor.ts b/packages/editor/src/core/hooks/use-collaborative-editor.ts index 5bee8c0c3f5..f32d7f4cca2 100644 --- a/packages/editor/src/core/hooks/use-collaborative-editor.ts +++ b/packages/editor/src/core/hooks/use-collaborative-editor.ts @@ -75,6 +75,7 @@ export const useCollaborativeEditor = (props: TCollaborativeEditorProps) => { }, [provider, id]); const editor = useEditor({ + disabledExtensions, id, onTransaction, editorProps, diff --git a/packages/editor/src/core/hooks/use-editor.ts b/packages/editor/src/core/hooks/use-editor.ts index eef72797cee..5cddc79e566 100644 --- a/packages/editor/src/core/hooks/use-editor.ts +++ b/packages/editor/src/core/hooks/use-editor.ts @@ -16,12 +16,20 @@ import { IMarking, scrollSummary, scrollToNodeViaDOMCoordinates } from "@/helper // props import { CoreEditorProps } from "@/props"; // types -import { EditorRefApi, IMentionHighlight, IMentionSuggestion, TEditorCommands, TFileHandler } from "@/types"; +import { + EditorRefApi, + IMentionHighlight, + IMentionSuggestion, + TEditorCommands, + TExtensions, + TFileHandler, +} from "@/types"; export interface CustomEditorProps { editorClassName: string; editorProps?: EditorProps; enableHistory: boolean; + disabledExtensions: TExtensions[]; extensions?: any; fileHandler: TFileHandler; forwardedRef?: MutableRefObject; @@ -45,6 +53,7 @@ export interface CustomEditorProps { export const useEditor = (props: CustomEditorProps) => { const { + disabledExtensions, editorClassName, editorProps = {}, enableHistory, @@ -79,6 +88,7 @@ export const useEditor = (props: CustomEditorProps) => { }, extensions: [ ...CoreEditorExtensions({ + disabledExtensions, enableHistory, fileHandler, mentionConfig: { diff --git a/packages/editor/src/core/hooks/use-read-only-collaborative-editor.ts b/packages/editor/src/core/hooks/use-read-only-collaborative-editor.ts index d4081922973..62e08e5d32b 100644 --- a/packages/editor/src/core/hooks/use-read-only-collaborative-editor.ts +++ b/packages/editor/src/core/hooks/use-read-only-collaborative-editor.ts @@ -11,6 +11,7 @@ import { TReadOnlyCollaborativeEditorProps } from "@/types"; export const useReadOnlyCollaborativeEditor = (props: TReadOnlyCollaborativeEditorProps) => { const { + disabledExtensions, editorClassName, editorProps = {}, extensions, @@ -66,6 +67,7 @@ export const useReadOnlyCollaborativeEditor = (props: TReadOnlyCollaborativeEdit }, [provider, id]); const editor = useReadOnlyEditor({ + disabledExtensions, editorProps, editorClassName, extensions: [ diff --git a/packages/editor/src/core/hooks/use-read-only-editor.ts b/packages/editor/src/core/hooks/use-read-only-editor.ts index 23ce023adcd..f75fa72685d 100644 --- a/packages/editor/src/core/hooks/use-read-only-editor.ts +++ b/packages/editor/src/core/hooks/use-read-only-editor.ts @@ -11,14 +11,15 @@ import { IMarking, scrollSummary } from "@/helpers/scroll-to-node"; // props import { CoreReadOnlyEditorProps } from "@/props"; // types -import { EditorReadOnlyRefApi, IMentionHighlight, TFileHandler } from "@/types"; +import { EditorReadOnlyRefApi, IMentionHighlight, TExtensions, TFileHandler } from "@/types"; interface CustomReadOnlyEditorProps { - initialValue?: string; + disabledExtensions: TExtensions[]; editorClassName: string; - forwardedRef?: MutableRefObject; - extensions?: any; editorProps?: EditorProps; + extensions?: any; + forwardedRef?: MutableRefObject; + initialValue?: string; fileHandler: Pick; handleEditorReady?: (value: boolean) => void; mentionHandler: { @@ -29,6 +30,7 @@ interface CustomReadOnlyEditorProps { export const useReadOnlyEditor = (props: CustomReadOnlyEditorProps) => { const { + disabledExtensions, initialValue, editorClassName, forwardedRef, @@ -54,6 +56,7 @@ export const useReadOnlyEditor = (props: CustomReadOnlyEditorProps) => { }, extensions: [ ...CoreReadOnlyEditorExtensions({ + disabledExtensions, mentionConfig: { mentionHighlights: mentionHandler.highlights, }, diff --git a/packages/editor/src/core/types/collaboration.ts b/packages/editor/src/core/types/collaboration.ts index 8609995ed83..35fbdb99680 100644 --- a/packages/editor/src/core/types/collaboration.ts +++ b/packages/editor/src/core/types/collaboration.ts @@ -20,7 +20,7 @@ export type TServerHandler = { }; type TCollaborativeEditorHookProps = { - disabledExtensions?: TExtensions[]; + disabledExtensions: TExtensions[]; editorClassName: string; editorProps?: EditorProps; extensions?: Extensions; diff --git a/packages/editor/src/core/types/editor.ts b/packages/editor/src/core/types/editor.ts index b3f9a5c6ec8..2b10232c21e 100644 --- a/packages/editor/src/core/types/editor.ts +++ b/packages/editor/src/core/types/editor.ts @@ -106,7 +106,7 @@ export interface EditorRefApi extends EditorReadOnlyRefApi { export interface IEditorProps { containerClassName?: string; displayConfig?: TDisplayConfig; - disabledExtensions?: TExtensions[]; + disabledExtensions: TExtensions[]; editorClassName?: string; fileHandler: TFileHandler; forwardedRef?: React.MutableRefObject; @@ -148,6 +148,7 @@ export interface ICollaborativeDocumentEditor // read only editor props export interface IReadOnlyEditorProps { containerClassName?: string; + disabledExtensions: TExtensions[]; displayConfig?: TDisplayConfig; editorClassName?: string; fileHandler: Pick; diff --git a/packages/editor/src/core/types/extensions.ts b/packages/editor/src/core/types/extensions.ts index 2be17a4effa..bccb0d4ec13 100644 --- a/packages/editor/src/core/types/extensions.ts +++ b/packages/editor/src/core/types/extensions.ts @@ -1 +1 @@ -export type TExtensions = "ai" | "collaboration-cursor" | "issue-embed" | "slash-commands"| "enter-key"; +export type TExtensions = "ai" | "collaboration-cursor" | "issue-embed" | "slash-commands" | "enter-key" | "callout"; diff --git a/web/core/components/editor/lite-text-editor/lite-text-editor.tsx b/web/core/components/editor/lite-text-editor/lite-text-editor.tsx index 0822f1a97d3..0fe75904d8b 100644 --- a/web/core/components/editor/lite-text-editor/lite-text-editor.tsx +++ b/web/core/components/editor/lite-text-editor/lite-text-editor.tsx @@ -14,9 +14,11 @@ import { isCommentEmpty } from "@/helpers/string.helper"; // hooks import { useMember, useMention, useUser } from "@/hooks/store"; // plane web hooks +import { useEditorFlagging } from "@/plane-web/hooks/use-editor-flagging"; import { useFileSize } from "@/plane-web/hooks/use-file-size"; -interface LiteTextEditorWrapperProps extends Omit { +interface LiteTextEditorWrapperProps + extends Omit { workspaceSlug: string; workspaceId: string; projectId: string; @@ -49,6 +51,8 @@ export const LiteTextEditor = React.forwardRef getUserDetails(id) as IUserLite); @@ -72,6 +76,7 @@ export const LiteTextEditor = React.forwardRef & { +type LiteTextReadOnlyEditorWrapperProps = Omit< + ILiteTextReadOnlyEditor, + "disabledExtensions" | "fileHandler" | "mentionHandler" +> & { workspaceSlug: string; projectId: string; }; @@ -19,10 +24,13 @@ export const LiteTextReadOnlyEditor = React.forwardRef { +interface RichTextEditorWrapperProps + extends Omit { workspaceSlug: string; workspaceId: string; projectId: string; @@ -26,6 +28,8 @@ export const RichTextEditor = forwardRef getUserDetails(id) as IUserLite); @@ -42,6 +46,7 @@ export const RichTextEditor = forwardRef & { +type RichTextReadOnlyEditorWrapperProps = Omit< + IRichTextReadOnlyEditor, + "disabledExtensions" | "fileHandler" | "mentionHandler" +> & { workspaceSlug: string; projectId?: string; }; @@ -15,10 +20,13 @@ type RichTextReadOnlyEditorWrapperProps = Omit( ({ workspaceSlug, projectId, ...props }, ref) => { const { mentionHighlights } = useMention({}); + // editor flaggings + const { richTextEditor: disabledExtensions } = useEditorFlagging(workspaceSlug?.toString()); return ( = observer((props) => { user: currentUser ?? undefined, }); // editor flaggings - const { documentEditor } = useEditorFlagging(); + const { documentEditor: disabledExtensions } = useEditorFlagging(); // page filters const { fontSize, fontStyle, isFullWidth } = usePageFilters(); // issue-embed @@ -224,7 +224,7 @@ export const PageEditorBody: React.FC = observer((props) => { realtimeConfig={realtimeConfig} serverHandler={serverHandler} user={userConfig} - disabledExtensions={documentEditor} + disabledExtensions={disabledExtensions} aiHandler={{ menu: getAIMenu, }} @@ -233,6 +233,7 @@ export const PageEditorBody: React.FC = observer((props) => { Date: Wed, 27 Nov 2024 14:37:53 +0530 Subject: [PATCH 2/6] fix: space app build errors --- packages/editor/src/ce/extensions/document-extensions.tsx | 8 +++++++- space/core/components/editor/lite-text-editor.tsx | 4 +++- .../core/components/editor/lite-text-read-only-editor.tsx | 6 +++++- space/core/components/editor/rich-text-editor.tsx | 6 +++--- .../core/components/editor/rich-text-read-only-editor.tsx | 6 +++++- 5 files changed, 23 insertions(+), 7 deletions(-) diff --git a/packages/editor/src/ce/extensions/document-extensions.tsx b/packages/editor/src/ce/extensions/document-extensions.tsx index e3c94fa0e10..35d7c0f3dee 100644 --- a/packages/editor/src/ce/extensions/document-extensions.tsx +++ b/packages/editor/src/ce/extensions/document-extensions.tsx @@ -15,7 +15,13 @@ type Props = { export const DocumentEditorAdditionalExtensions = (_props: Props) => { const { disabledExtensions } = _props; - const extensions: Extensions = disabledExtensions?.includes("slash-commands") ? [] : [SlashCommands()]; + const extensions: Extensions = disabledExtensions?.includes("slash-commands") + ? [] + : [ + SlashCommands({ + disabledExtensions, + }), + ]; return extensions; }; diff --git a/space/core/components/editor/lite-text-editor.tsx b/space/core/components/editor/lite-text-editor.tsx index 0e3f34293b5..5d50271355a 100644 --- a/space/core/components/editor/lite-text-editor.tsx +++ b/space/core/components/editor/lite-text-editor.tsx @@ -10,7 +10,8 @@ import { isCommentEmpty } from "@/helpers/string.helper"; // hooks import { useMention } from "@/hooks/use-mention"; -interface LiteTextEditorWrapperProps extends Omit { +interface LiteTextEditorWrapperProps + extends Omit { anchor: string; workspaceId: string; isSubmitting?: boolean; @@ -41,6 +42,7 @@ export const LiteTextEditor = React.forwardRef & { +type LiteTextReadOnlyEditorWrapperProps = Omit< + ILiteTextReadOnlyEditor, + "disabledExtensions" | "fileHandler" | "mentionHandler" +> & { anchor: string; }; @@ -18,6 +21,7 @@ export const LiteTextReadOnlyEditor = React.forwardRef { +interface RichTextEditorWrapperProps + extends Omit { uploadFile: (file: File) => Promise; } @@ -27,6 +26,7 @@ export const RichTextEditor = forwardRef & { +type RichTextReadOnlyEditorWrapperProps = Omit< + IRichTextReadOnlyEditor, + "disabledExtensions" | "fileHandler" | "mentionHandler" +> & { anchor: string; }; @@ -18,6 +21,7 @@ export const RichTextReadOnlyEditor = React.forwardRef Date: Wed, 27 Nov 2024 14:21:34 +0530 Subject: [PATCH 3/6] fix: product updates modal --- web/core/components/global/product-updates/modal.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/web/core/components/global/product-updates/modal.tsx b/web/core/components/global/product-updates/modal.tsx index 57beaa68109..6bdacc94704 100644 --- a/web/core/components/global/product-updates/modal.tsx +++ b/web/core/components/global/product-updates/modal.tsx @@ -59,6 +59,7 @@ export const ProductUpdatesModal: FC = observer((props {data?.id && (

"} containerClassName="p-0 border-none" From 0e4107ee071a0a28a0563db8999affadb9f20ecf Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal Date: Wed, 27 Nov 2024 14:08:58 +0530 Subject: [PATCH 4/6] fix: build errors --- web/ce/hooks/use-editor-flagging.ts | 6 +++++- web/core/components/pages/editor/editor-body.tsx | 2 +- web/core/components/pages/version/editor.tsx | 4 ++++ 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/web/ce/hooks/use-editor-flagging.ts b/web/ce/hooks/use-editor-flagging.ts index ddaee716507..05fdff91fa5 100644 --- a/web/ce/hooks/use-editor-flagging.ts +++ b/web/ce/hooks/use-editor-flagging.ts @@ -4,10 +4,14 @@ import { TExtensions } from "@plane/editor"; /** * @description extensions disabled in various editors */ -export const useEditorFlagging = (): { +export const useEditorFlagging = ( + workspaceSlug: string +): { documentEditor: TExtensions[]; + liteTextEditor: TExtensions[]; richTextEditor: TExtensions[]; } => ({ documentEditor: ["ai", "collaboration-cursor"], + liteTextEditor: ["ai", "collaboration-cursor"], richTextEditor: ["ai", "collaboration-cursor"], }); diff --git a/web/core/components/pages/editor/editor-body.tsx b/web/core/components/pages/editor/editor-body.tsx index 2dd521dd2b1..ad27f9d7ded 100644 --- a/web/core/components/pages/editor/editor-body.tsx +++ b/web/core/components/pages/editor/editor-body.tsx @@ -84,7 +84,7 @@ export const PageEditorBody: React.FC = observer((props) => { user: currentUser ?? undefined, }); // editor flaggings - const { documentEditor: disabledExtensions } = useEditorFlagging(); + const { documentEditor: disabledExtensions } = useEditorFlagging(workspaceSlug?.toString()); // page filters const { fontSize, fontStyle, isFullWidth } = usePageFilters(); // issue-embed diff --git a/web/core/components/pages/version/editor.tsx b/web/core/components/pages/version/editor.tsx index 697af9b1528..637736e39f3 100644 --- a/web/core/components/pages/version/editor.tsx +++ b/web/core/components/pages/version/editor.tsx @@ -12,6 +12,7 @@ import { getReadOnlyEditorFileHandlers } from "@/helpers/editor.helper"; import { useMember, useMention, useUser } from "@/hooks/store"; import { usePageFilters } from "@/hooks/use-page-filters"; // plane web hooks +import { useEditorFlagging } from "@/plane-web/hooks/use-editor-flagging"; import { useIssueEmbed } from "@/plane-web/hooks/use-issue-embed"; export type TVersionEditorProps = { @@ -31,6 +32,8 @@ export const PagesVersionEditor: React.FC = observer((props getUserDetails, project: { getProjectMemberIds }, } = useMember(); + // editor flaggings + const { documentEditor: disabledExtensions } = useEditorFlagging(workspaceSlug?.toString() ?? ""); // derived values const projectMemberIds = projectId ? getProjectMemberIds(projectId.toString()) : []; const projectMemberDetails = projectMemberIds?.map((id) => getUserDetails(id) as IUserLite); @@ -101,6 +104,7 @@ export const PagesVersionEditor: React.FC = observer((props id={activeVersion ?? ""} initialValue={description ?? "

"} containerClassName="p-0 pb-64 border-none" + disabledExtensions={disabledExtensions} displayConfig={displayConfig} editorClassName="pl-10" fileHandler={getReadOnlyEditorFileHandlers({ From ae4ae093abf53185e7adee6d5894ece2cf802b7f Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal Date: Thu, 28 Nov 2024 13:14:20 +0530 Subject: [PATCH 5/6] fix: lite text read only editor --- packages/editor/src/core/types/extensions.ts | 2 +- .../editor/lite-text-editor/lite-text-read-only-editor.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/editor/src/core/types/extensions.ts b/packages/editor/src/core/types/extensions.ts index bccb0d4ec13..b3aacccc0af 100644 --- a/packages/editor/src/core/types/extensions.ts +++ b/packages/editor/src/core/types/extensions.ts @@ -1 +1 @@ -export type TExtensions = "ai" | "collaboration-cursor" | "issue-embed" | "slash-commands" | "enter-key" | "callout"; +export type TExtensions = "ai" | "collaboration-cursor" | "issue-embed" | "slash-commands" | "enter-key"; diff --git a/web/core/components/editor/lite-text-editor/lite-text-read-only-editor.tsx b/web/core/components/editor/lite-text-editor/lite-text-read-only-editor.tsx index be6df2b7968..1f1edad7d18 100644 --- a/web/core/components/editor/lite-text-editor/lite-text-read-only-editor.tsx +++ b/web/core/components/editor/lite-text-editor/lite-text-read-only-editor.tsx @@ -25,7 +25,7 @@ export const LiteTextReadOnlyEditor = React.forwardRef Date: Thu, 28 Nov 2024 13:26:31 +0530 Subject: [PATCH 6/6] refactor: additional options push logic --- .../core/extensions/slash-commands/command-items-list.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx index 4a7f9976471..1efb729019f 100644 --- a/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx +++ b/packages/editor/src/core/extensions/slash-commands/command-items-list.tsx @@ -297,12 +297,8 @@ export const getSlashCommandFilteredSections = ]?.forEach((item) => { const sectionToPushTo = SLASH_COMMAND_SECTIONS.find((s) => s.key === item.section) ?? SLASH_COMMAND_SECTIONS[0]; const itemIndexToPushAfter = sectionToPushTo.items.findIndex((i) => i.commandKey === item.pushAfter); - if (itemIndexToPushAfter !== undefined) { - const resolvedIndex = - itemIndexToPushAfter + 1 < sectionToPushTo.items.length - ? itemIndexToPushAfter + 1 - : sectionToPushTo.items.length - 1; - sectionToPushTo.items.splice(resolvedIndex, 0, item); + if (itemIndexToPushAfter !== -1) { + sectionToPushTo.items.splice(itemIndexToPushAfter + 1, 0, item); } else { sectionToPushTo.items.push(item); }