feat(editor): add showHints to command palette (#12187)

* feat(editor): route showHints through the action system (#12165 follow-up)

`showHints` was the only item in the Preferences submenu that flipped
appState directly instead of going through an action, so it was missing
everything the action system provides: no command palette entry, no
`trackEvent`, no `viewMode` declaration.

- add `actionToggleShowHints`, modelled on `actionToggleMidpointSnapping`
  (`viewMode: false` — hints live in the toolbar, which view mode hides)
- register it under `ActionName` and export it from `actions/index.ts`
- `PreferencesToggleShowHintsItem` now calls `executeAction`
- list it in the command palette's editor commands
- document `appState.showHints` /
  `MainMenu.DefaultItems.Preferences.ToggleShowHints` in the CHANGELOG,
  which the original commit never touched

No keyboard shortcut: like `arrowBinding` and `midpointSnapping`, this is
a set-once preference, and the natural mnemonic (`Alt+H`) is already
distribute-horizontally.

Adds `tests/showHints.test.tsx` — the preference previously had no
behavioural coverage at all, only incidental snapshot entries.

* chore(editor): drop showHints tests & changelog entry

Both will be rewritten in a follow-up PR.

Opus 5.5 (1M context), xhigh

---------

Co-authored-by: hiennd <hiennd@aidia.vn>
Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>

packages/excalidraw/actions/actionToggleShowHints.tsx

@@ -0,0 +1,28 @@
+import { CaptureUpdateAction } from "@excalidraw/element";
+
+import { messageCircleIcon } from "../components/icons";
+
+import { register } from "./register";
+
+export const actionToggleShowHints = register({
+  name: "showHints",
+  label: "labels.showHints",
+  icon: messageCircleIcon,
+  keywords: ["hint", "hints", "tip", "tips"],
+  // hints live in the toolbar, which view mode hides entirely
+  viewMode: false,
+  trackEvent: {
+    category: "canvas",
+    predicate: (appState) => !appState.showHints,
+  },
+  perform(elements, appState) {
+    return {
+      appState: {
+        ...appState,
+        showHints: !this.checked!(appState),
+      },
+      captureUpdate: CaptureUpdateAction.NEVER,
+    };
+  },
+  checked: (appState) => appState.showHints,
+});

packages/excalidraw/actions/index.ts

@@ -82,6 +82,7 @@ export { actionToggleZenMode } from "./actionToggleZenMode";
 export { actionToggleObjectsSnapMode } from "./actionToggleObjectsSnapMode";
 export { actionToggleArrowBinding } from "./actionToggleArrowBinding";
 export { actionToggleMidpointSnapping } from "./actionToggleMidpointSnapping";
+export { actionToggleShowHints } from "./actionToggleShowHints";
 
 export { actionToggleStats } from "./actionToggleStats";
 export { actionUnbindText, actionBindText } from "./actionBoundText";

packages/excalidraw/actions/types.ts

@@ -61,6 +61,7 @@ export type ActionName =
   | "objectsSnapMode"
   | "arrowBinding"
   | "midpointSnapping"
+  | "showHints"
   | "stats"
   | "changeStrokeColor"
   | "changeBackgroundColor"

packages/excalidraw/components/CommandPalette/CommandPalette.tsx

@@ -368,6 +368,7 @@ function CommandPaletteInner({
         actionManager.actions.viewMode,
         actionManager.actions.gridMode,
         actionManager.actions.objectsSnapMode,
+        actionManager.actions.showHints,
         actionManager.actions.toggleShortcuts,
         actionManager.actions.selectAll,
         actionManager.actions.toggleElementLock,

packages/excalidraw/components/main-menu/DefaultItems.tsx

@@ -14,6 +14,7 @@ import {
   actionToggleMidpointSnapping,
   actionToggleObjectsSnapMode,
   actionToggleSearchMenu,
+  actionToggleShowHints,
   actionToggleStats,
   actionToggleTheme,
   actionToggleZenMode,
@@ -565,13 +566,13 @@ const PreferencesToggleMidpointSnappingItem = () => {
 
 const PreferencesToggleShowHintsItem = () => {
   const { t } = useI18n();
+  const actionManager = useExcalidrawActionManager();
   const appState = useUIAppState();
-  const setAppState = useExcalidrawSetAppState();
   return (
     <DropdownMenuItemCheckbox
       checked={appState.showHints}
       onSelect={(event) => {
-        setAppState({ showHints: !appState.showHints });
+        actionManager.executeAction(actionToggleShowHints);
         event.preventDefault();
       }}
     >