Refactor shell command handling and account prep hooks

Author: ChristianChiarulli

app/src/features/editor-pane/hooks/use-find-bar.ts

@@ -7,12 +7,12 @@ import {
 } from "react";
 
 import { type NoteEditorHandle } from "@/features/editor/note-editor";
+import { useShellCommandStore } from "@/features/shell/store/use-shell-command-store";
 import {
   isEditorFindShortcut,
   isNotesSearchShortcut,
 } from "@/shared/lib/keyboard";
 import { resolveActiveEditorSearch } from "@/shared/lib/search";
-import { OPEN_EDITOR_FIND_EVENT } from "@/features/editor-pane/lib/editor-pane-utils";
 
 export function useFindBar({
   noteId,
@@ -30,8 +30,12 @@ export function useFindBar({
   const [findQuery, setFindQuery] = useState("");
   const [activeFindMatchIndex, setActiveFindMatchIndex] = useState(0);
   const [findScrollRevision, setFindScrollRevision] = useState(0);
+  const editorFindRequestId = useShellCommandStore(
+    (state) => state.editorFindRequestId,
+  );
   const findInputRef = useRef<HTMLInputElement | null>(null);
   const lastActiveNoteIdRef = useRef(noteId);
+  const lastHandledEditorFindRequestIdRef = useRef(0);
   const hasEditorFindQuery = findOpen && findQuery.trim().length > 0;
 
   const activeEditorSearch = resolveActiveEditorSearch({
@@ -134,19 +138,25 @@ export function useFindBar({
     }
   });
 
-  const handleOpenEditorFind = useEffectEvent((_event: Event) => {
-    openFind();
-  });
-
   useEffect(() => {
     window.addEventListener("keydown", handleGlobalFindKeyDown);
-    window.addEventListener(OPEN_EDITOR_FIND_EVENT, handleOpenEditorFind);
     return () => {
       window.removeEventListener("keydown", handleGlobalFindKeyDown);
-      window.removeEventListener(OPEN_EDITOR_FIND_EVENT, handleOpenEditorFind);
     };
   }, []);
 
+  useEffect(() => {
+    if (
+      editorFindRequestId === 0 ||
+      lastHandledEditorFindRequestIdRef.current === editorFindRequestId
+    ) {
+      return;
+    }
+
+    lastHandledEditorFindRequestIdRef.current = editorFindRequestId;
+    openFind();
+  }, [editorFindRequestId, openFind]);
+
   return {
     findOpen,
     findMatchCount: activeEditorFindMatchCount,

app/src/features/editor-pane/lib/editor-pane-utils.ts

@@ -1,8 +1,6 @@
 import { format } from "date-fns";
 import type { LogicalPosition } from "@tauri-apps/api/dpi";
 import { CheckMenuItem, Menu, Submenu } from "@tauri-apps/api/menu";
-
-export const OPEN_EDITOR_FIND_EVENT = "comet:open-editor-find";
 export const TOOLBAR_ENTER_ANIMATION = {
   damping: 28,
   mass: 0.8,

app/src/features/editor-pane/ui/editor-pane.tsx

@@ -14,6 +14,7 @@ import {
   useShowEditorToolbar,
   useUIActions,
 } from "@/features/settings/store/use-ui-store";
+import { useShellCommandStore } from "@/features/shell/store/use-shell-command-store";
 import { useShellNavigationStore } from "@/features/shell/store/use-shell-navigation-store";
 import cometLogo from "@/assets/comet.svg";
 import { LogicalPosition } from "@tauri-apps/api/dpi";
@@ -30,10 +31,6 @@ import {
   NoteEditor,
   type NoteEditorHandle,
 } from "@/features/editor/note-editor";
-import {
-  type FocusEditorDetail,
-  FOCUS_EDITOR_EVENT,
-} from "@/shared/lib/pane-navigation";
 import { Button } from "@/shared/ui/button";
 import { PopoverPopup, PopoverRoot, PopoverTrigger } from "@/shared/ui/popover";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/shared/ui/tooltip";
@@ -126,6 +123,9 @@ export function EditorPane({
   const [toolbarContainer, setToolbarContainer] = useState<HTMLElement | null>(
     null,
   );
+  const focusEditorRequest = useShellCommandStore(
+    (state) => state.focusEditorRequest,
+  );
   const editorFontSize = useEditorFontSize();
   const notesPanelVisible = useNotesPanelVisible();
   const showToolbar = useShowEditorToolbar();
@@ -195,6 +195,7 @@ export function EditorPane({
     setToolbarContainer(node);
   };
   const editorLoadKey = noteId ? (editorKey ?? noteId) : null;
+  const lastHandledFocusEditorRequestIdRef = useRef(0);
   const editorContent = (() => {
     if (noteId === null) {
       return null;
@@ -327,32 +328,37 @@ export function EditorPane({
       window.removeEventListener("keydown", handleGlobalHistoryKeyDown);
   }, []);
 
-  const handleFocusEditor = useEffectEvent((event: Event) => {
-    if (!noteId) {
-      return;
-    }
-
-    const customEvent = event as CustomEvent<FocusEditorDetail>;
-    const scrollTo = customEvent.detail?.scrollTo ?? "preserve";
-
-    setFocusedPane("editor");
-    requestAnimationFrame(() => {
-      if (scrollTo === "top") {
-        editorRef.current?.focusAtStart();
-        scrollContainerRef.current?.scrollTo({ top: 0 });
+  const handleFocusEditor = useEffectEvent(
+    (scrollTo: "preserve" | "top" = "preserve") => {
+      if (!noteId) {
         return;
       }
 
-      editorRef.current?.focus();
-    });
-  });
+      setFocusedPane("editor");
+      requestAnimationFrame(() => {
+        if (scrollTo === "top") {
+          editorRef.current?.focusAtStart();
+          scrollContainerRef.current?.scrollTo({ top: 0 });
+          return;
+        }
+
+        editorRef.current?.focus();
+      });
+    },
+  );
 
   useEffect(() => {
-    window.addEventListener(FOCUS_EDITOR_EVENT, handleFocusEditor);
-    return () => {
-      window.removeEventListener(FOCUS_EDITOR_EVENT, handleFocusEditor);
-    };
-  }, []);
+    if (
+      !focusEditorRequest ||
+      lastHandledFocusEditorRequestIdRef.current ===
+        focusEditorRequest.requestId
+    ) {
+      return;
+    }
+
+    lastHandledFocusEditorRequestIdRef.current = focusEditorRequest.requestId;
+    handleFocusEditor(focusEditorRequest.scrollTo);
+  }, [focusEditorRequest, handleFocusEditor]);
 
   const backlinksButton =
     backlinks.length > 0 ? (

app/src/features/editor/extensions/link-interactions.test.ts

@@ -7,9 +7,12 @@ import {
 } from "@codemirror/lang-markdown";
 import { EditorView } from "@codemirror/view";
 import { afterEach, describe, expect, it, vi } from "vitest";
+import {
+  resetShellCommandState,
+  useShellCommandStore,
+} from "@/features/shell/store/use-shell-command-store";
 import { shellStore } from "@/features/shell/store/use-shell-store";
 import { WikiLinkGrammar } from "@/features/editor/extensions/markdown-decorations/wikilink-syntax";
-import { CREATE_NOTE_FROM_WIKILINK_EVENT } from "@/shared/lib/note-navigation";
 
 const { invokeMock, openUrlMock } = vi.hoisted(() => ({
   invokeMock: vi.fn(),
@@ -66,6 +69,7 @@ async function flush() {
 afterEach(() => {
   invokeMock.mockReset();
   openUrlMock.mockClear();
+  resetShellCommandState();
   shellStore.setState({
     draftMarkdown: "",
     draftNoteId: null,
@@ -450,8 +454,6 @@ describe("Editor link interactions", () => {
 
   it("dispatches create-note for unresolved wikilinks", async () => {
     invokeMock.mockResolvedValueOnce(null);
-    const eventHandler = vi.fn();
-    window.addEventListener(CREATE_NOTE_FROM_WIKILINK_EVENT, eventHandler);
 
     const { view } = createView("[[Target]]", false, "note-1");
     await flush();
@@ -480,14 +482,15 @@ describe("Editor link interactions", () => {
         title: "Target",
       },
     });
-    expect(eventHandler).toHaveBeenCalledTimes(1);
-    expect((eventHandler.mock.calls[0][0] as CustomEvent).detail).toEqual({
+    expect(
+      useShellCommandStore.getState().createNoteFromWikilinkRequest,
+    ).toEqual({
       location: 0,
+      requestId: 1,
       sourceNoteId: "note-1",
       title: "Target",
     });
 
-    window.removeEventListener(CREATE_NOTE_FROM_WIKILINK_EVENT, eventHandler);
     view.destroy();
   });
 });

app/src/features/notes-pane/ui/notes-pane.tsx

@@ -23,11 +23,8 @@ import {
   useSearchQuery,
   useTagViewActive,
 } from "@/features/shell/store/use-shell-store";
+import { useShellCommandStore } from "@/features/shell/store/use-shell-command-store";
 import { useShellNavigationStore } from "@/features/shell/store/use-shell-navigation-store";
-import {
-  type FocusNotesPaneDetail,
-  FOCUS_NOTES_PANE_EVENT,
-} from "@/shared/lib/pane-navigation";
 import {
   type NoteSortDirection,
   type NoteSortField,
@@ -99,6 +96,12 @@ export function NotesPane({
   const noteFilter = tagViewActive ? "all" : storeNoteFilter;
   const searchQuery = useSearchQuery();
   const creatingNoteId = useCreatingSelectedNoteId();
+  const focusNotesPaneRequest = useShellCommandStore(
+    (state) => state.focusNotesPaneRequest,
+  );
+  const focusNotesSearchRequestId = useShellCommandStore(
+    (state) => state.focusNotesSearchRequestId,
+  );
   const { setFocusedPane, setSearchQuery: onChangeSearch } =
     useShellNavigationStore((state) => state.actions);
   const { setNoteSortPrefs } = useUIActions();
@@ -149,9 +152,11 @@ export function NotesPane({
 
   const shouldSkipAnimation = Date.now() < skipAnimationUntilRef.current;
   const searchInputRef = useRef<HTMLInputElement | null>(null);
-  const pendingNotesPaneSelectionRef = useRef<
-    FocusNotesPaneDetail["selection"] | null
-  >(null);
+  const pendingNotesPaneSelectionRef = useRef<"first" | "selected" | null>(
+    null,
+  );
+  const lastHandledFocusNotesPaneRequestIdRef = useRef(0);
+  const lastHandledFocusNotesSearchRequestIdRef = useRef(0);
   const noteRowRefs = useRef(new Map<string, HTMLButtonElement | null>());
   const shouldRestoreSelectedRowFocusRef = useRef(false);
   const [isSearchFocused, setIsSearchFocused] = useState(false);
@@ -239,56 +244,63 @@ export function NotesPane({
   }, [isSearchOpen]);
 
   useEffect(() => {
-    const handleFocusSearch = () => {
-      setFocusedPane("notes");
-      setIsSearchOpen(true);
-      focusSearchInput();
-    };
-    window.addEventListener("comet:focus-search", handleFocusSearch);
-    return () =>
-      window.removeEventListener("comet:focus-search", handleFocusSearch);
-  }, [focusSearchInput, setFocusedPane]);
+    if (
+      focusNotesSearchRequestId === 0 ||
+      lastHandledFocusNotesSearchRequestIdRef.current ===
+        focusNotesSearchRequestId
+    ) {
+      return;
+    }
+
+    lastHandledFocusNotesSearchRequestIdRef.current = focusNotesSearchRequestId;
+    setFocusedPane("notes");
+    setIsSearchOpen(true);
+    focusSearchInput();
+  }, [focusNotesSearchRequestId, focusSearchInput, setFocusedPane]);
 
   useEffect(() => {
-    const handleFocusNotesPane = (event: Event) => {
-      const customEvent = event as CustomEvent<FocusNotesPaneDetail>;
-      let selection = customEvent.detail?.selection ?? "selected";
-
-      // If the selected note isn't in the current filtered list, fall back
-      // to selecting the first visible note instead of focusing an empty
-      // scroll container.
-      if (
-        selection === "selected" &&
-        selectedNoteId &&
-        !filteredNotes.some((n) => n.id === selectedNoteId)
-      ) {
-        selection = "first";
-      }
+    if (
+      !focusNotesPaneRequest ||
+      lastHandledFocusNotesPaneRequestIdRef.current ===
+        focusNotesPaneRequest.requestId
+    ) {
+      return;
+    }
 
-      if (selection === "first") {
-        if (isNotesPlaceholderData) {
-          pendingNotesPaneSelectionRef.current = "first";
-          return;
-        }
+    lastHandledFocusNotesPaneRequestIdRef.current =
+      focusNotesPaneRequest.requestId;
+    let selection = focusNotesPaneRequest.selection ?? "selected";
+
+    // If the selected note isn't in the current filtered list, fall back
+    // to selecting the first visible note instead of focusing an empty
+    // scroll container.
+    if (
+      selection === "selected" &&
+      selectedNoteId &&
+      !filteredNotes.some((n) => n.id === selectedNoteId)
+    ) {
+      selection = "first";
+    }
 
-        setIsSearchFocused(false);
-        setFocusedPane("notes");
-        selectFirstVisibleNote();
-        focusNotesPaneTarget(scrollContainerRef.current);
+    if (selection === "first") {
+      if (isNotesPlaceholderData) {
+        pendingNotesPaneSelectionRef.current = "first";
         return;
       }
 
-      pendingNotesPaneSelectionRef.current = "selected";
-      setFocusedPane("notes");
       setIsSearchFocused(false);
+      setFocusedPane("notes");
+      selectFirstVisibleNote();
       focusNotesPaneTarget(scrollContainerRef.current);
-    };
+      return;
+    }
 
-    window.addEventListener(FOCUS_NOTES_PANE_EVENT, handleFocusNotesPane);
-    return () => {
-      window.removeEventListener(FOCUS_NOTES_PANE_EVENT, handleFocusNotesPane);
-    };
+    pendingNotesPaneSelectionRef.current = "selected";
+    setFocusedPane("notes");
+    setIsSearchFocused(false);
+    focusNotesPaneTarget(scrollContainerRef.current);
   }, [
+    focusNotesPaneRequest,
     filteredNotes,
     isNotesPlaceholderData,
     selectFirstVisibleNote,