Refactor effect-driven events into imperative handlers

Focus the note-row button directly in handleNoteRowPointerDown
instead of setting a ref flag and restoring focus in a useEffect.

Introduce useCommandRequest/useCommandRequestId to replace the
requestId + lastHandledRef + useEffect pattern at seven call sites.
Handlers returning false defer the mark so retry-on-data-load cases
still work.

Author: ChristianChiarulli

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

@@ -7,6 +7,7 @@ import {
 } from "react";
 
 import { type NoteEditorHandle } from "@/features/editor/note-editor";
+import { useCommandRequestId } from "@/shared/hooks/use-command-request";
 import { useShellCommandStore } from "@/shared/stores/use-shell-command-store";
 import {
   isEditorFindShortcut,
@@ -35,7 +36,6 @@ export function useFindBar({
   );
   const findInputRef = useRef<HTMLInputElement | null>(null);
   const lastActiveNoteIdRef = useRef(noteId);
-  const lastHandledEditorFindRequestIdRef = useRef(0);
   const hasEditorFindQuery = findOpen && findQuery.trim().length > 0;
 
   const activeEditorSearch = resolveActiveEditorSearch({
@@ -145,17 +145,9 @@ export function useFindBar({
     };
   }, []);
 
-  useEffect(() => {
-    if (
-      editorFindRequestId === 0 ||
-      lastHandledEditorFindRequestIdRef.current === editorFindRequestId
-    ) {
-      return;
-    }
-
-    lastHandledEditorFindRequestIdRef.current = editorFindRequestId;
+  useCommandRequestId(editorFindRequestId, () => {
     openFind();
-  }, [editorFindRequestId, openFind]);
+  });
 
   return {
     findOpen,

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

@@ -18,6 +18,7 @@ import {
   useShowEditorToolbar,
   useUIActions,
 } from "@/shared/stores/use-ui-store";
+import { useCommandRequest } from "@/shared/hooks/use-command-request";
 import { useShellCommandStore } from "@/shared/stores/use-shell-command-store";
 import { useShellNavigationStore } from "@/shared/stores/use-shell-navigation-store";
 import cometLogo from "@/assets/comet.svg";
@@ -199,7 +200,6 @@ export function EditorPane({
     setToolbarContainer(node);
   };
   const editorLoadKey = noteId ? (editorKey ?? noteId) : null;
-  const lastHandledFocusEditorRequestIdRef = useRef(0);
 
   const openEditorMenu = async (position: LogicalPosition) => {
     if (!noteId) return;
@@ -278,37 +278,22 @@ export function EditorPane({
       window.removeEventListener("keydown", handleGlobalHistoryKeyDown);
   }, []);
 
-  const handleFocusEditor = useEffectEvent(
-    (scrollTo: "preserve" | "top" = "preserve") => {
-      if (!noteId) {
-        return;
-      }
-
-      setFocusedPane("editor");
-      requestAnimationFrame(() => {
-        if (scrollTo === "top") {
-          editorRef.current?.focusAtStart();
-          scrollContainerRef.current?.scrollTo({ top: 0 });
-          return;
-        }
-
-        editorRef.current?.focus();
-      });
-    },
-  );
-
-  useEffect(() => {
-    if (
-      !focusEditorRequest ||
-      lastHandledFocusEditorRequestIdRef.current ===
-        focusEditorRequest.requestId
-    ) {
+  useCommandRequest(focusEditorRequest, (request) => {
+    if (!noteId) {
       return;
     }
 
-    lastHandledFocusEditorRequestIdRef.current = focusEditorRequest.requestId;
-    handleFocusEditor(focusEditorRequest.scrollTo);
-  }, [focusEditorRequest, handleFocusEditor]);
+    setFocusedPane("editor");
+    requestAnimationFrame(() => {
+      if (request.scrollTo === "top") {
+        editorRef.current?.focusAtStart();
+        scrollContainerRef.current?.scrollTo({ top: 0 });
+        return;
+      }
+
+      editorRef.current?.focus();
+    });
+  });
 
   const headerActions =
     noteId !== null ? (

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

@@ -34,7 +34,6 @@ export type NoteRowProps = {
   searchWords: string[];
   selectedNoteId: string | null;
   setSlideInNoteId(noteId: string | null): void;
-  setShouldRestoreSelectedRowFocus(): void;
   shouldSkipAnimation: boolean;
 };
 
@@ -53,7 +52,6 @@ export function NoteRow({
   searchWords,
   selectedNoteId,
   setSlideInNoteId,
-  setShouldRestoreSelectedRowFocus,
   shouldSkipAnimation,
 }: NoteRowProps) {
   const isActive = note.id === selectedNoteId;
@@ -124,10 +122,7 @@ export function NoteRow({
             setFocusedPane("sidebar");
           }
         }}
-        onPointerDown={(event) => {
-          handleNoteRowPointerDown(event);
-          setShouldRestoreSelectedRowFocus();
-        }}
+        onPointerDown={handleNoteRowPointerDown}
         onMouseDown={(event) => {
           if (event.button === 2) {
             event.preventDefault();

app/src/features/notes-pane/ui/notes-pane-utils.ts

@@ -117,6 +117,7 @@ export function handleNoteRowPointerDown(
 
   event.preventDefault();
   window.getSelection()?.removeAllRanges();
+  event.currentTarget.focus({ preventScroll: true });
 }
 
 export function focusSelectedNoteRow(root?: ParentNode | null) {

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

@@ -4,6 +4,10 @@ import { useEffect, useRef, useState, type MouseEvent } from "react";
 import { useInView } from "react-intersection-observer";
 
 import { Button } from "@/shared/ui/button";
+import {
+  useCommandRequest,
+  useCommandRequestId,
+} from "@/shared/hooks/use-command-request";
 import { searchWordsFromQuery } from "@/shared/lib/search";
 import {
   type NoteListNavigationDirection,
@@ -155,10 +159,7 @@ export function NotesPane({
   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);
   const scrollContainerRef = useRef<HTMLDivElement | null>(null);
   const { ref: loadMoreRef, inView } = useInView({
@@ -245,34 +246,15 @@ export function NotesPane({
     searchInputRef.current?.select();
   }, [isSearchOpen]);
 
-  useEffect(() => {
-    if (
-      focusNotesSearchRequestId === 0 ||
-      lastHandledFocusNotesSearchRequestIdRef.current ===
-        focusNotesSearchRequestId
-    ) {
-      return;
-    }
-
-    lastHandledFocusNotesSearchRequestIdRef.current = focusNotesSearchRequestId;
+  useCommandRequestId(focusNotesSearchRequestId, () => {
     setFocusedPane("notes");
     setIsSearchOpen(true);
     setIsSearchFocused(true);
     focusSearchInput();
-  }, [focusNotesSearchRequestId, focusSearchInput, setFocusedPane]);
-
-  useEffect(() => {
-    if (
-      !focusNotesPaneRequest ||
-      lastHandledFocusNotesPaneRequestIdRef.current ===
-        focusNotesPaneRequest.requestId
-    ) {
-      return;
-    }
+  });
 
-    lastHandledFocusNotesPaneRequestIdRef.current =
-      focusNotesPaneRequest.requestId;
-    let selection = focusNotesPaneRequest.selection ?? "selected";
+  useCommandRequest(focusNotesPaneRequest, (request) => {
+    let selection = request.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
@@ -302,14 +284,7 @@ export function NotesPane({
     setFocusedPane("notes");
     setIsSearchFocused(false);
     focusNotesPaneTarget(scrollContainerRef.current);
-  }, [
-    focusNotesPaneRequest,
-    filteredNotes,
-    isNotesPlaceholderData,
-    selectFirstVisibleNote,
-    selectedNoteId,
-    setFocusedPane,
-  ]);
+  });
 
   useEffect(() => {
     setShowHeaderBorder((scrollContainerRef.current?.scrollTop ?? 0) > 0);
@@ -320,29 +295,21 @@ export function NotesPane({
       return;
     }
 
-    if (pendingNotesPaneSelectionRef.current && isNotesPlaceholderData) {
+    if (!pendingNotesPaneSelectionRef.current) {
       return;
     }
 
-    // Only respond to filteredNotes.length changes when there is a
-    // pending selection (initial data load). Without this guard,
-    // loading more notes via infinite scroll would scroll back to
-    // the selected note.
-    if (
-      !pendingNotesPaneSelectionRef.current &&
-      !shouldRestoreSelectedRowFocusRef.current
-    ) {
+    if (isNotesPlaceholderData) {
       return;
     }
 
-    if (selectedNoteId || shouldRestoreSelectedRowFocusRef.current) {
+    if (selectedNoteId) {
       pendingNotesPaneSelectionRef.current = null;
-      shouldRestoreSelectedRowFocusRef.current = false;
       focusSelectedNoteRow(scrollContainerRef.current);
       return;
     }
 
-    if (pendingNotesPaneSelectionRef.current && selectFirstVisibleNote()) {
+    if (selectFirstVisibleNote()) {
       pendingNotesPaneSelectionRef.current = null;
       return;
     }
@@ -550,9 +517,6 @@ export function NotesPane({
                       selectedNoteId={selectedNoteId}
                       setSlideInNoteId={setSlideInNoteId}
                       shouldSkipAnimation={shouldSkipAnimation}
-                      setShouldRestoreSelectedRowFocus={() => {
-                        shouldRestoreSelectedRowFocusRef.current = true;
-                      }}
                     />
                   );
                 })}

app/src/features/shell/hooks/use-shell-command-handlers.ts

@@ -1,5 +1,4 @@
-import { useEffect, useEffectEvent, useRef } from "react";
-
+import { useCommandRequest } from "@/shared/hooks/use-command-request";
 import { canonicalizeTagPath } from "@/shared/lib/tags";
 import { useShellCommandStore } from "@/shared/stores/use-shell-command-store";
 import type { NoteFilter } from "@/shared/api/types";
@@ -45,12 +44,8 @@ export function useShellCommandHandlers(deps: ShellCommandHandlerDeps) {
   const focusTagPathRequest = useShellCommandStore(
     (state) => state.focusTagPathRequest,
   );
-  const lastHandledCreateNoteFromWikilinkRequestIdRef = useRef(0);
-  const lastHandledFocusNoteRequestIdRef = useRef(0);
-  const lastHandledFocusTagPathRequestIdRef = useRef(0);
-
-  const handleFocusTagPath = useEffectEvent((requestedTagPath: string) => {
-    const tagPath = canonicalizeTagPath(requestedTagPath);
+  useCommandRequest(focusTagPathRequest, (request) => {
+    const tagPath = canonicalizeTagPath(request.tagPath);
     if (!tagPath) {
       return;
     }
@@ -59,8 +54,8 @@ export function useShellCommandHandlers(deps: ShellCommandHandlerDeps) {
     handleSelectTagPath(tagPath);
   });
 
-  const handleFocusNote = useEffectEvent((requestedNoteId: string) => {
-    const noteId = requestedNoteId.trim();
+  useCommandRequest(focusNoteRequest, (request) => {
+    const noteId = request.noteId.trim();
     if (!noteId) {
       return;
     }
@@ -69,71 +64,30 @@ export function useShellCommandHandlers(deps: ShellCommandHandlerDeps) {
     handleSelectNote(noteId);
   });
 
-  const handleCreateNoteFromWikilink = useEffectEvent(
-    (request: { location: number; sourceNoteId: string; title: string }) => {
-      const title = request.title.trim();
-      if (!title || isCreatingNote) {
-        return;
-      }
-
-      flushCurrentDraft();
-      const tagsForNewNote =
-        tagViewActive && activeTagPath ? [activeTagPath] : [];
-      if (
-        !tagViewActive &&
-        noteFilter !== "today" &&
-        noteFilter !== "todo" &&
-        noteFilter !== "pinned" &&
-        noteFilter !== "untagged"
-      ) {
-        setNoteFilter("all");
-      }
-      setFocusedPane("notes");
-      prepareNoteCreation();
-      createNoteMutation.mutate({
-        autoFocusEditor: false,
-        tags: tagsForNewNote,
-        markdown: `# ${title}`,
-      });
-    },
-  );
-
-  useEffect(() => {
-    if (
-      !focusTagPathRequest ||
-      lastHandledFocusTagPathRequestIdRef.current ===
-        focusTagPathRequest.requestId
-    ) {
-      return;
-    }
-
-    lastHandledFocusTagPathRequestIdRef.current = focusTagPathRequest.requestId;
-    handleFocusTagPath(focusTagPathRequest.tagPath);
-  }, [focusTagPathRequest, handleFocusTagPath]);
-
-  useEffect(() => {
-    if (
-      !focusNoteRequest ||
-      lastHandledFocusNoteRequestIdRef.current === focusNoteRequest.requestId
-    ) {
+  useCommandRequest(createNoteFromWikilinkRequest, (request) => {
+    const title = request.title.trim();
+    if (!title || isCreatingNote) {
       return;
     }
 
-    lastHandledFocusNoteRequestIdRef.current = focusNoteRequest.requestId;
-    handleFocusNote(focusNoteRequest.noteId);
-  }, [focusNoteRequest, handleFocusNote]);
-
-  useEffect(() => {
+    flushCurrentDraft();
+    const tagsForNewNote =
+      tagViewActive && activeTagPath ? [activeTagPath] : [];
     if (
-      !createNoteFromWikilinkRequest ||
-      lastHandledCreateNoteFromWikilinkRequestIdRef.current ===
-        createNoteFromWikilinkRequest.requestId
+      !tagViewActive &&
+      noteFilter !== "today" &&
+      noteFilter !== "todo" &&
+      noteFilter !== "pinned" &&
+      noteFilter !== "untagged"
     ) {
-      return;
+      setNoteFilter("all");
     }
-
-    lastHandledCreateNoteFromWikilinkRequestIdRef.current =
-      createNoteFromWikilinkRequest.requestId;
-    handleCreateNoteFromWikilink(createNoteFromWikilinkRequest);
-  }, [createNoteFromWikilinkRequest, handleCreateNoteFromWikilink]);
+    setFocusedPane("notes");
+    prepareNoteCreation();
+    createNoteMutation.mutate({
+      autoFocusEditor: false,
+      tags: tagsForNewNote,
+      markdown: `# ${title}`,
+    });
+  });
 }