fix: address Copilot re-review feedback (round 5)

- Lift `commands` to GlobalKeybindings: previously CommandPalette and GlobalKeybindings each called `useCommandSources` independently. Now GlobalKeybindings owns the single Command[] instance and passes it to CommandPalette as a prop, so the palette, the shortcuts dialog, and the keydown listener all reference the exact same closures.
- Move the "/" focus-search shortcut into useGlobalKeybindings' existing keydown listener so it inherits the established suppression rules: it now no-ops on touch-only devices via isMobileLike() and treats <select> as a typing target via isTypingTarget(), matching the rest of the global shortcuts. Removes the separate document-level listener that previously didn't share those guards.

Author: Medformatik

apps/web/src/components/command-palette/CommandPalette.tsx

@@ -18,16 +18,16 @@ import { CommandPaletteFooter } from "./CommandPaletteFooter";
 import { CommandPaletteInput } from "./CommandPaletteInput";
 import { CommandPaletteList, getDefaultCommandPaletteRows } from "./CommandPaletteList";
 import { COMMAND_PALETTE_LISTBOX_ID, SEARCH_INPUT_ID } from "./constants";
-import { useCommandSources } from "./useCommandSources";
 
 interface Props {
-  /** Called when the user runs the "Show keyboard shortcuts" command. */
-  onOpenShortcuts: () => void;
+  /** Command list — provided by `GlobalKeybindings` so the palette, the
+   * shortcuts dialog, and the global listener all share a single instance. */
+  commands: Command[];
 }
 
 const SEARCH_FALLBACK_ID = "search.fallback";
 
-export function CommandPalette({ onOpenShortcuts }: Props) {
+export function CommandPalette({ commands }: Props) {
   const theme = useTheme();
   const isXs = useMediaQuery(theme.breakpoints.down("sm"));
   const t = useTranslations("commandPalette");
@@ -62,8 +62,6 @@ export function CommandPalette({ onOpenShortcuts }: Props) {
     });
   }, [close, query, setSearchQuery]);
 
-  const commands = useCommandSources({ openShortcutsDialog: onOpenShortcuts });
-
   // Ranked filtered list when query is present, otherwise the raw command list.
   // When filtering, the synthetic "Search '<q>' on map" row is always appended so
   // it can be navigated by ↑↓ alongside real matches.

apps/web/src/components/command-palette/GlobalKeybindings.tsx

@@ -1,9 +1,7 @@
 "use client";
 
-import { useCommandPaletteStore } from "@openmapx/core";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useState } from "react";
 import { CommandPalette } from "./CommandPalette";
-import { SEARCH_INPUT_ID } from "./constants";
 import { KeyboardShortcutsDialog } from "./KeyboardShortcutsDialog";
 import { useCommandSources } from "./useCommandSources";
 import { useGlobalKeybindings } from "./useGlobalKeybindings";
@@ -13,6 +11,8 @@ export function GlobalKeybindings() {
   // Stable references so useCommandSources' useMemo deps don't churn.
   const openShortcuts = useCallback(() => setShortcutsOpen(true), []);
   const closeShortcuts = useCallback(() => setShortcutsOpen(false), []);
+  // Single source of truth — palette, shortcuts dialog, and listener all
+  // share the same Command[] instance.
   const commands = useCommandSources({ openShortcutsDialog: openShortcuts });
 
   useGlobalKeybindings({
@@ -21,36 +21,9 @@ export function GlobalKeybindings() {
     isShortcutsDialogOpen: shortcutsOpen,
   });
 
-  // Built-in: "/" focuses the SearchBar input. Suppressed while the palette
-  // or shortcuts dialog is open so it doesn't focus the SearchBar behind a
-  // modal, and (like the rest of the listener) while the user is typing.
-  useEffect(() => {
-    const onKey = (e: KeyboardEvent) => {
-      if (e.key !== "/") return;
-      // Plain "/" only — don't hijack browser/OS shortcuts like Ctrl+/, Cmd+/.
-      // (Shift+/ produces "?" so it never reaches this branch on most layouts.)
-      if (e.ctrlKey || e.metaKey || e.altKey) return;
-      if (useCommandPaletteStore.getState().isOpen) return;
-      if (shortcutsOpen) return;
-      const target = e.target;
-      if (target instanceof HTMLElement) {
-        const tag = target.tagName;
-        if (tag === "INPUT" || tag === "TEXTAREA" || target.isContentEditable) return;
-      }
-      const el = document.getElementById(SEARCH_INPUT_ID) as HTMLInputElement | null;
-      if (el) {
-        e.preventDefault();
-        el.focus();
-        el.select();
-      }
-    };
-    document.addEventListener("keydown", onKey);
-    return () => document.removeEventListener("keydown", onKey);
-  }, [shortcutsOpen]);
-
   return (
     <>
-      <CommandPalette onOpenShortcuts={openShortcuts} />
+      <CommandPalette commands={commands} />
       <KeyboardShortcutsDialog open={shortcutsOpen} onClose={closeShortcuts} commands={commands} />
     </>
   );

apps/web/src/components/command-palette/useGlobalKeybindings.ts

@@ -14,6 +14,7 @@ import {
   useSidebarStore,
 } from "@openmapx/core";
 import { useEffect, useRef } from "react";
+import { SEARCH_INPUT_ID } from "./constants";
 
 const SEQUENCE_TIMEOUT_MS = 1200;
 
@@ -141,7 +142,21 @@ export function useGlobalKeybindings(opts: Options) {
         return;
       }
 
-      // 4. Match against registered command shortcuts (sequences allowed)
+      // 4. Built-in "/" — focus the SearchBar. Plain "/" only; modifier
+      // combos belong to the browser/OS. Inherits the typing-target,
+      // dialog-open, and mobile-guard suppression rules above.
+      if (event.key === "/" && !event.ctrlKey && !event.metaKey && !event.altKey) {
+        const el = document.getElementById(SEARCH_INPUT_ID) as HTMLInputElement | null;
+        if (el) {
+          event.preventDefault();
+          el.focus();
+          el.select();
+        }
+        clearBuffer();
+        return;
+      }
+
+      // 5. Match against registered command shortcuts (sequences allowed)
       const sequences: KeySequence[] = [];
       const cmdsForSeq: Command[] = [];
       for (const c of commandsRef.current) {