tiptap: fix menu

packages/client/src/tiptap/core/extensions/status.ts

@@ -47,7 +47,7 @@ export const Status = Node.create({
         parseHTML: getDatasetAttribute('borderColor'),
       },
       text: {
-        default: '请设置状态内容',
+        default: '',
         parseHTML: getDatasetAttribute('text'),
       },
     };

packages/client/src/tiptap/core/menus/excalidraw/bubble.tsx

@@ -52,7 +52,7 @@ export const ExcalidrawBubbleMenu = ({ editor }) => {
     <BubbleMenu
       className={'bubble-menu'}
       editor={editor}
-      pluginKey="flow-bubble-menu"
+      pluginKey="excalidraw-bubble-menu"
       shouldShow={shouldShow}
       tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
     >

packages/client/src/tiptap/core/menus/redo/index.tsx

@@ -8,7 +8,7 @@ export const Redo: React.FC<{ editor: Editor }> = ({ editor }) => {
   const redo = useCallback(() => editor.chain().focus().redo().run(), [editor]);
 
   return (
-    <Tooltip content="撤销">
+    <Tooltip content="重做">
       <Button onClick={redo} icon={<IconRedo />} type="tertiary" theme="borderless" />
     </Tooltip>
   );

packages/client/src/tiptap/core/menus/text/index.tsx

@@ -14,6 +14,7 @@ import { Image } from 'tiptap/core/extensions/image';
 import { Katex } from 'tiptap/core/extensions/katex';
 import { Link } from 'tiptap/core/extensions/link';
 import { Mind } from 'tiptap/core/extensions/mind';
+import { Status } from 'tiptap/core/extensions/status';
 import { Table } from 'tiptap/core/extensions/table';
 import { TableOfContents } from 'tiptap/core/extensions/table-of-contents';
 import { Title } from 'tiptap/core/extensions/title';
@@ -45,19 +46,19 @@ const OTHER_BUBBLE_MENU_TYPES = [
   DocumentChildren.name,
   Katex.name,
   HorizontalRule.name,
+  Status.name,
 ];
 
 export const Text = ({ editor }) => {
-  const shouldShow = useCallback(
+  const shouldShow = useCallback(() => {
-    () => !editor.state.selection.empty && OTHER_BUBBLE_MENU_TYPES.every((type) => !editor.isActive(type)),
+    return !editor.state.selection.empty && OTHER_BUBBLE_MENU_TYPES.every((type) => !editor.isActive(type));
-    [editor]
+  }, [editor]);
-  );
 
   return (
     <BubbleMenu
       className={'bubble-menu'}
       editor={editor}
-      pluginKey="code-block-bubble-menu"
+      pluginKey="text-bubble-menu"
       shouldShow={shouldShow}
       tippyOptions={{ maxWidth: 'calc(100vw - 100px)' }}
     >

packages/client/src/tiptap/core/menus/underline/index.tsx

@@ -4,17 +4,19 @@ import { Tooltip } from 'components/tooltip';
 import React, { useCallback } from 'react';
 import { Editor } from 'tiptap/core';
 import { Title } from 'tiptap/core/extensions/title';
+import { Underline as UnderlineExtension } from 'tiptap/core/extensions/underline';
 import { useActive } from 'tiptap/core/hooks/use-active';
 
 export const Underline: React.FC<{ editor: Editor }> = ({ editor }) => {
   const isTitleActive = useActive(editor, Title.name);
+  const isUnderlineActive = useActive(editor, UnderlineExtension.name);
 
   const toggleUnderline = useCallback(() => editor.chain().focus().toggleUnderline().run(), [editor]);
 
   return (
     <Tooltip content="下划线">
       <Button
-        theme={editor.isActive('underline') ? 'light' : 'borderless'}
+        theme={isUnderlineActive ? 'light' : 'borderless'}
         type="tertiary"
         icon={<IconUnderline />}
         onClick={toggleUnderline}

packages/client/src/tiptap/core/wrappers/status/index.tsx

@@ -58,13 +58,15 @@ export const StatusWrapper = ({ editor, node, updateAttributes }) => {
   useEffect(() => {
     if (defaultShowPicker && user && user.id === createUser) {
       toggleVisible(true);
-      setTimeout(() => ref.current?.focus(), 100);
+      setTimeout(() => ref.current?.focus(), 200);
     }
   }, [defaultShowPicker, toggleVisible, createUser, user]);
 
   useEffect(() => {
     if (visible) {
+      setTimeout(() => {
         ref.current?.focus();
+      }, 200);
     } else {
       updateAttributes({ text: currentText });
     }

packages/client/src/tiptap/editor/collaboration/collaboration/editor.tsx

@@ -165,7 +165,11 @@ export const EditorInstance = forwardRef((props: IProps, ref) => {
       {(!online || status === 'disconnected') && (
         <Banner
           type="warning"
-          description="我们已与您断开连接，您可以继续编辑文档。一旦重新连接，我们会自动重新提交数据。"
+          description={
+            editable
+              ? '我们已与您断开连接，您可以继续编辑文档。一旦重新连接，我们会自动重新提交数据。'
+              : '我们已与您断开连接，您可以继续阅读文档。一旦重新连接，我们会自动重新刷新数据。'
+          }
         />
       )}
 

packages/client/src/tiptap/editor/collaboration/collaboration/menubar.tsx

@@ -38,6 +38,7 @@ import { Subscript } from 'tiptap/core/menus/subscript';
 import { Superscript } from 'tiptap/core/menus/superscript';
 import { Table } from 'tiptap/core/menus/table';
 import { TaskList } from 'tiptap/core/menus/task-list';
+import { Text } from 'tiptap/core/menus/text';
 import { TextColor } from 'tiptap/core/menus/text-color';
 import { Underline } from 'tiptap/core/menus/underline';
 import { Undo } from 'tiptap/core/menus/undo';
@@ -111,6 +112,8 @@ const _MenuBar: React.FC<{ editor: Editor }> = ({ editor }) => {
         <Mind editor={editor} />
         <Excalidraw editor={editor} />
         <Columns editor={editor} />
+
+        <Text editor={editor} />
       </Space>
     </div>
   );