From 890eea299d5371cc8a71de701f7a7d58aacf57d1 Mon Sep 17 00:00:00 2001
From: Gregory Schier <gschier1990@gmail.com>
Date: Fri, 12 Jan 2024 21:03:20 -0800
Subject: [PATCH] Hotkeys for request switcher

---
 src-web/components/RecentRequestsDropdown.tsx | 25 ++++++++-----------
 src-web/components/SettingsDropdown.tsx       |  2 --
 src-web/hooks/useHotKey.ts                    |  8 ++++++
 3 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src-web/components/RecentRequestsDropdown.tsx b/src-web/components/RecentRequestsDropdown.tsx
index 6d4a84f9..ec509949 100644
--- a/src-web/components/RecentRequestsDropdown.tsx
+++ b/src-web/components/RecentRequestsDropdown.tsx
@@ -5,6 +5,7 @@ import { useActiveEnvironmentId } from '../hooks/useActiveEnvironmentId';
 import { useActiveRequest } from '../hooks/useActiveRequest';
 import { useActiveWorkspaceId } from '../hooks/useActiveWorkspaceId';
 import { useAppRoutes } from '../hooks/useAppRoutes';
+import { useHotKey } from '../hooks/useHotKey';
 import { useRecentRequests } from '../hooks/useRecentRequests';
 import { useRequests } from '../hooks/useRequests';
 import { fallbackRequestName } from '../lib/fallbackRequestName';
@@ -33,25 +34,19 @@ export function RecentRequestsDropdown({ className }: Pick<ButtonProps, 'classNa
 
   // Handle key-up
   useKeyPressEvent('Control', undefined, () => {
+    if (!dropdownRef.current?.isOpen) return;
     dropdownRef.current?.select?.();
   });
 
-  useKey(
-    'Tab',
-    (e) => {
-      if (!e.ctrlKey || recentRequestIds.length === 0) return;
+  useHotKey('requestSwitcher.prev', () => {
+    if (!dropdownRef.current?.isOpen) dropdownRef.current?.open(1);
+    dropdownRef.current?.next?.();
+  });
 
-      if (!dropdownRef.current?.isOpen) {
-        dropdownRef.current?.open(e.shiftKey ? -1 : 1);
-        return;
-      }
-
-      if (e.shiftKey) dropdownRef.current?.prev?.();
-      else dropdownRef.current?.next?.();
-    },
-    undefined,
-    [recentRequestIds.length],
-  );
+  useHotKey('requestSwitcher.next', () => {
+    if (!dropdownRef.current?.isOpen) dropdownRef.current?.open(-1);
+    dropdownRef.current?.prev?.();
+  });
 
   const items = useMemo<DropdownItem[]>(() => {
     if (activeWorkspaceId === null) return [];
diff --git a/src-web/components/SettingsDropdown.tsx b/src-web/components/SettingsDropdown.tsx
index bd9a8ca2..e60e280a 100644
--- a/src-web/components/SettingsDropdown.tsx
+++ b/src-web/components/SettingsDropdown.tsx
@@ -3,7 +3,6 @@ import { useRef } from 'react';
 import { useAppVersion } from '../hooks/useAppVersion';
 import { useExportData } from '../hooks/useExportData';
 import { useImportData } from '../hooks/useImportData';
-import { useTheme } from '../hooks/useTheme';
 import { useUpdateMode } from '../hooks/useUpdateMode';
 import { Button } from './core/Button';
 import type { DropdownRef } from './core/Dropdown';
@@ -18,7 +17,6 @@ import { SettingsDialog } from './SettingsDialog';
 export function SettingsDropdown() {
   const importData = useImportData();
   const exportData = useExportData();
-  const { appearance, toggleAppearance } = useTheme();
   const appVersion = useAppVersion();
   const [updateMode, setUpdateMode] = useUpdateMode();
   const dropdownRef = useRef<DropdownRef>(null);
diff --git a/src-web/hooks/useHotKey.ts b/src-web/hooks/useHotKey.ts
index 4a1b0116..1488cae7 100644
--- a/src-web/hooks/useHotKey.ts
+++ b/src-web/hooks/useHotKey.ts
@@ -12,6 +12,8 @@ export type HotkeyAction =
   | 'urlBar.focus'
   | 'environmentEditor.toggle'
   | 'hotkeys.showHelp'
+  | 'requestSwitcher.prev'
+  | 'requestSwitcher.next'
   | 'settings.show';
 
 const hotkeys: Record<HotkeyAction, string[]> = {
@@ -24,6 +26,8 @@ const hotkeys: Record<HotkeyAction, string[]> = {
   'environmentEditor.toggle': ['CmdCtrl+e'],
   'hotkeys.showHelp': ['CmdCtrl+/'],
   'settings.show': ['CmdCtrl+,'],
+  'requestSwitcher.prev': ['Control+Tab'],
+  'requestSwitcher.next': ['Control+Shift+Tab'],
 };
 
 const hotkeyLabels: Record<HotkeyAction, string> = {
@@ -35,6 +39,8 @@ const hotkeyLabels: Record<HotkeyAction, string> = {
   'urlBar.focus': 'Focus URL',
   'environmentEditor.toggle': 'Edit Environments',
   'hotkeys.showHelp': 'Show Keyboard Shortcuts',
+  'requestSwitcher.prev': 'Go To Next Request',
+  'requestSwitcher.next': 'Go To Previous Request',
   'settings.show': 'Open Settings',
 };
 
@@ -136,6 +142,8 @@ export function useFormattedHotkey(action: HotkeyAction | null): string | null {
         labelParts.push('⌃');
       } else if (p === 'Enter') {
         labelParts.push('↩');
+      } else if (p === 'Tab') {
+        labelParts.push('⇥');
       } else {
         labelParts.push(p.toUpperCase());
       }