feat!: enhance keyboard logic for vim users

Innei · Innei · commit fd51a23a674a · 2025-05-19T23:46:01.000+08:00
- Simplified keyboard shortcuts for switching views and showing shortcuts.
- Enhanced hotkey registration to include special key mappings.
- Updated command hotkeys in various components for consistency.
- Adjusted user guide to reflect new shortcut key for showing shortcuts.

Signed-off-by: Innei &lt;tukon479@gmail.com&gt;
diff --git a/apps/desktop/layer/renderer/src/constants/shortcuts.ts b/apps/desktop/layer/renderer/src/constants/shortcuts.ts
@@ -19,11 +19,11 @@ const shortcutConfigs = {
     },
     switchNextView: {
       name: tShortcuts("keys.subscriptions.switchNextView"),
-      key: "Tab, ArrowRight",
+      key: "Tab",
     },
     switchPreviousView: {
       name: tShortcuts("keys.subscriptions.switchPreviousView"),
-      key: "Shift+Tab, ArrowLeft",
+      key: "Shift+Tab",
     },
     nextSubscription: {
       name: tShortcuts("keys.subscriptions.nextSubscription"),
@@ -45,7 +45,7 @@ const shortcutConfigs = {
     },
     showShortcuts: {
       name: tShortcuts("keys.layout.showShortcuts"),
-      key: "H",
+      key: "?",
     },
     toggleWideMode: {
       name: tShortcuts("keys.layout.toggleWideMode"),
diff --git a/apps/desktop/layer/renderer/src/modules/command/hooks/use-register-hotkey.ts b/apps/desktop/layer/renderer/src/modules/command/hooks/use-register-hotkey.ts
@@ -19,6 +19,8 @@ export interface RegisterHotkeyOptions<T extends FollowCommandId> {
 
 const IGNORE_INPUT_ELEMENT = [HTMLInputElement, HTMLTextAreaElement]
 
+const SPECIAL_KEYS_MAPPINGS = [["?", "Shift+Slash"]] as const
+
 export const useCommandHotkey = <T extends FollowCommandId>({
   shortcut,
   commandId,
@@ -42,7 +44,16 @@ export const useCommandHotkey = <T extends FollowCommandId>({
 
     // Create a handler for each shortcut
     shortcuts.forEach((key) => {
-      keyMap[key] = (event) => {
+      let nextKey = key
+
+      for (const [from, to] of SPECIAL_KEYS_MAPPINGS) {
+        if (key === from) {
+          nextKey = to
+          break
+        }
+      }
+
+      keyMap[nextKey] = (event) => {
         const { target } = event
         if (
           !options?.forceInputElement &&
diff --git a/apps/desktop/layer/renderer/src/modules/entry-column/EntryColumnShortcutHandler.tsx b/apps/desktop/layer/renderer/src/modules/entry-column/EntryColumnShortcutHandler.tsx
@@ -45,13 +45,13 @@ export const EntryColumnShortcutHandler: FC<{
 
   useCommandHotkey({
     commandId: COMMAND_ID.layout.focusToEntryRender,
-    shortcut: "Enter",
+    shortcut: "Enter, L, ArrowRight",
     when,
   })
 
   useCommandHotkey({
     commandId: COMMAND_ID.layout.focusToSubscription,
-    shortcut: "Backspace, Escape",
+    shortcut: "Backspace, Escape, H, ArrowLeft",
     when,
   })
 
diff --git a/apps/desktop/layer/renderer/src/modules/new-user-guide/guide-modal-content.tsx b/apps/desktop/layer/renderer/src/modules/new-user-guide/guide-modal-content.tsx
@@ -70,7 +70,7 @@ function Outtro() {
           <Trans
             i18nKey="new_user_guide.step.shortcuts.description2"
             components={{
-              kbd: <Kbd>H</Kbd>,
+              kbd: <Kbd>?</Kbd>,
             }}
           />
         </p>
diff --git a/apps/desktop/layer/renderer/src/modules/timeline-column/FeedList.electron.tsx b/apps/desktop/layer/renderer/src/modules/timeline-column/FeedList.electron.tsx
@@ -319,7 +319,7 @@ const useRegisterCommand = () => {
   useCommandHotkey({
     commandId: COMMAND_ID.layout.focusToTimeline,
     when: isFocus,
-    shortcut: "Enter",
+    shortcut: "Enter, L, ArrowRight",
   })
 
   useCommandBinding({
diff --git a/apps/desktop/layer/renderer/src/providers/global-hotkeys-provider.tsx b/apps/desktop/layer/renderer/src/providers/global-hotkeys-provider.tsx
@@ -16,8 +16,6 @@ export const GlobalHotkeysProvider = () => {
 
   useCommandBinding({
     commandId: COMMAND_ID.global.showShortcuts,
-    when:
-      activeScopes.includes(HotkeyScope.Home) && !activeScopes.includes(HotkeyScope.EntryRender),
   })
 
   useEventListener("keydown", (e) => {
