fix suggestion menu exit bug

apps/client/src/features/editor/components/mention/mention-list.tsx

@@ -164,7 +164,7 @@ const MentionList = forwardRef<any, MentionListProps>((props, ref) => {
 
   const enterHandler = () => {
     if (!renderItems.length) return;
-    if (renderItems[selectedIndex].entityType !== "header") {
+    if (renderItems[selectedIndex]?.entityType !== "header") {
       selectItem(selectedIndex);
     }
   };
@@ -204,7 +204,7 @@ const MentionList = forwardRef<any, MentionListProps>((props, ref) => {
       parentPageId: page.id || null,
       title: title
     };
-    
+
     let createdPage: IPage;
     try {
       createdPage = await createPageMutation.mutateAsync(payload);

apps/client/src/features/editor/components/mention/mention-suggestion.ts

@@ -77,7 +77,7 @@ const mentionRenderItems = () => {
             {
               placement: "bottom-start",
               middleware: [offset(0), flip(), shift()],
-            }
+            },
           ).then(({ x, y }) => {
             Object.assign(element.style, {
               left: `${x}px`,
@@ -86,7 +86,7 @@ const mentionRenderItems = () => {
               zIndex: "9999",
             });
           });
-        }
+        },
       );
     },
     onUpdate: (props: {
@@ -115,23 +115,30 @@ const mentionRenderItems = () => {
 
       // destroy component if space is greater 3 without a match
       if (
-        whitespaceCount > 3 &&
+        whitespaceCount > 4 &&
         //@ts-ignore
-        props.editor.storage.mentionItems.length === 0
+        props.editor.storage.mentionItems.length === 1
       ) {
         destroy();
         return;
       }
+      // fallback exit
+      if (whitespaceCount > 7) {
+        destroy();
+        return;
+      }
     },
     onKeyDown: (props: { event: KeyboardEvent }) => {
-      if (props.event.key)
+      if (props.event.key === "Escape") {
-        if (
+        destroy();
-          props.event.key === "Escape" ||
+        return true;
-          (props.event.key === "Enter" && !component)
+      }
-        ) {
+
-          destroy();
+      if (props.event.key === "Enter" && !component) {
-          return false;
+        destroy();
-        }
+        return false;
+      }
+
       return (component?.ref as any)?.onKeyDown(props);
     },
     onExit: () => {

apps/client/src/features/editor/extensions/extensions.ts

@@ -78,6 +78,7 @@ import i18n from "@/i18n.ts";
 import { MarkdownClipboard } from "@/features/editor/extensions/markdown-clipboard.ts";
 import EmojiCommand from "./emoji-command";
 import { countWords } from "alfaaz";
+import { PluginKey } from "@tiptap/pm/state";
 
 const lowlight = createLowlight(common);
 lowlight.register("mermaid", plaintext);
@@ -243,12 +244,12 @@ export const mainExtensions = [
         "Mod-f": () => {
           const event = new CustomEvent("openFindDialogFromEditor", {});
           document.dispatchEvent(event);
-          return true;
+          return false;
         },
         Escape: () => {
           const event = new CustomEvent("closeFindDialogFromEditor", {});
           document.dispatchEvent(event);
-          return true;
+          return false;
         },
       };
     },

apps/client/src/features/page/components/header/page-header-menu.tsx

@@ -53,6 +53,7 @@ export default function PageHeaderMenu({ readOnly }: PageHeaderMenuProps) {
           const event = new CustomEvent("openFindDialogFromEditor", {});
           document.dispatchEvent(event);
         },
+        { preventDefault: false },
       ],
       [
         "Escape",
@@ -60,6 +61,7 @@ export default function PageHeaderMenu({ readOnly }: PageHeaderMenuProps) {
           const event = new CustomEvent("closeFindDialogFromEditor", {});
           document.dispatchEvent(event);
         },
+        { preventDefault: false },
       ],
     ],
     [],
@@ -280,7 +282,9 @@ function ConnectionWarning() {
   const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   useEffect(() => {
-    const isDisconnected = ["disconnected", "connecting"].includes(yjsConnectionStatus);
+    const isDisconnected = ["disconnected", "connecting"].includes(
+      yjsConnectionStatus,
+    );
 
     if (isDisconnected) {
       if (!timeoutRef.current) {