diff --git a/packages/client/src/tiptap/core/extensions/flow.ts b/packages/client/src/tiptap/core/extensions/flow.ts index 7ff9ec0..ed98647 100644 --- a/packages/client/src/tiptap/core/extensions/flow.ts +++ b/packages/client/src/tiptap/core/extensions/flow.ts @@ -1,3 +1,4 @@ +import { IUser } from '@think/domains'; import { mergeAttributes, Node, nodeInputRule } from '@tiptap/core'; import { ReactNodeViewRenderer } from '@tiptap/react'; import { FlowWrapper } from 'tiptap/core/wrappers/flow'; @@ -7,6 +8,8 @@ export interface IFlowAttrs { width?: number | string; height?: number; data?: string; + defaultShowPicker?: boolean; + createUser?: IUser['id']; } declare module '@tiptap/core' { @@ -40,6 +43,12 @@ export const Flow = Node.create({ default: DEFAULT_XML, parseHTML: getDatasetAttribute('data'), }, + defaultShowPicker: { + default: false, + }, + createUser: { + default: null, + }, }; }, diff --git a/packages/client/src/tiptap/core/hooks/use-attributes.tsx b/packages/client/src/tiptap/core/hooks/use-attributes.tsx index 6f5cae9..95191dd 100644 --- a/packages/client/src/tiptap/core/hooks/use-attributes.tsx +++ b/packages/client/src/tiptap/core/hooks/use-attributes.tsx @@ -8,12 +8,7 @@ function mapSelf(d: T): T { return d; } -export function useAttributes, R>( - editor: Editor, - attrbute: string, - defaultValue?: T, - map?: (arg: T) => R -) { +export function useAttributes(editor: Editor, attrbute: string, defaultValue?: T, map?: (arg: T) => R) { const mapFn = (map || mapSelf) as MapFn; const [value, setValue] = useState(mapFn(defaultValue)); const prevValueCache = useRef(value); diff --git a/packages/client/src/tiptap/core/menus/commands.tsx b/packages/client/src/tiptap/core/menus/commands.tsx index db010ec..17e52c1 100644 --- a/packages/client/src/tiptap/core/menus/commands.tsx +++ b/packages/client/src/tiptap/core/menus/commands.tsx @@ -114,8 +114,8 @@ export const COMMANDS: ICommand[] = [ { icon: , label: '流程图', - action: (editor) => { - editor.chain().focus().setFlow({ width: '100%' }).run(); + action: (editor, user) => { + editor.chain().focus().setFlow({ width: '100%', defaultShowPicker: true, createUser: user.id }).run(); }, }, { diff --git a/packages/client/src/tiptap/core/menus/flow/bubble.tsx b/packages/client/src/tiptap/core/menus/flow/bubble.tsx index 47f4f9e..35b2499 100644 --- a/packages/client/src/tiptap/core/menus/flow/bubble.tsx +++ b/packages/client/src/tiptap/core/menus/flow/bubble.tsx @@ -2,16 +2,22 @@ import { IconCopy, IconDelete, IconEdit } from '@douyinfe/semi-icons'; import { Button, Space } from '@douyinfe/semi-ui'; import { Divider } from 'components/divider'; import { Tooltip } from 'components/tooltip'; -import { useCallback } from 'react'; +import { useUser } from 'data/user'; +import { useCallback, useEffect } from 'react'; import { BubbleMenu } from 'tiptap/core/bubble-menu'; -import { Flow } from 'tiptap/core/extensions/flow'; +import { Flow, IFlowAttrs } from 'tiptap/core/extensions/flow'; import { useAttributes } from 'tiptap/core/hooks/use-attributes'; import { copyNode, deleteNode } from 'tiptap/prose-utils'; import { triggerOpenFlowSettingModal } from '../_event'; export const FlowBubbleMenu = ({ editor }) => { - const attrs = useAttributes(editor, Flow.name, {}); + const attrs = useAttributes(editor, Flow.name, { + defaultShowPicker: false, + createUser: '', + }); + const { defaultShowPicker, createUser } = attrs; + const { user } = useUser(); const openEditLinkModal = useCallback(() => { triggerOpenFlowSettingModal(editor, attrs); @@ -20,6 +26,13 @@ export const FlowBubbleMenu = ({ editor }) => { const copyMe = useCallback(() => copyNode(Flow.name, editor), [editor]); const deleteMe = useCallback(() => deleteNode(Flow.name, editor), [editor]); + useEffect(() => { + if (defaultShowPicker && user && createUser === user.id) { + openEditLinkModal(); + editor.chain().updateAttributes(Flow.name, { defaultShowPicker: false }).focus().run(); + } + }, [createUser, defaultShowPicker, editor, openEditLinkModal, user]); + return (