diff --git a/src-web/components/RequestResponse.tsx b/src-web/components/RequestResponse.tsx index 9654cd48..d68cc068 100644 --- a/src-web/components/RequestResponse.tsx +++ b/src-web/components/RequestResponse.tsx @@ -121,22 +121,8 @@ export const RequestResponse = memo(function RequestResponse({ style }: Props) { [width, height, vertical, setHeight, setWidth], ); - if (activeRequest === null && requests.length > 0) { - return ( -
-

No Selected Request

-
- ); - } else if (requests.length === 0) { - return ( - - ); + if (activeRequest === null) { + return ; } return ( diff --git a/src-web/components/ResponsePane.tsx b/src-web/components/ResponsePane.tsx index 1997836e..eef9554e 100644 --- a/src-web/components/ResponsePane.tsx +++ b/src-web/components/ResponsePane.tsx @@ -104,12 +104,7 @@ export const ResponsePane = memo(function ResponsePane({ style, className }: Pro <> )} diff --git a/src-web/components/core/HotKeyLabel.tsx b/src-web/components/core/HotKeyLabel.tsx new file mode 100644 index 00000000..d39b71da --- /dev/null +++ b/src-web/components/core/HotKeyLabel.tsx @@ -0,0 +1,11 @@ +import type { HotkeyAction } from '../../hooks/useHotkey'; +import { useHotKeyLabel } from '../../hooks/useHotkey'; + +interface Props { + action: HotkeyAction | null; +} + +export function HotKeyLabel({ action }: Props) { + const label = useHotKeyLabel(action); + return {label}; +} diff --git a/src-web/components/core/HotKeyList.tsx b/src-web/components/core/HotKeyList.tsx index d0170e81..3e4be281 100644 --- a/src-web/components/core/HotKeyList.tsx +++ b/src-web/components/core/HotKeyList.tsx @@ -1,21 +1,20 @@ import React from 'react'; import type { HotkeyAction } from '../../hooks/useHotkey'; import { HotKey } from './HotKey'; +import { HotKeyLabel } from './HotKeyLabel'; interface Props { - hotkeys: { action: HotkeyAction; label: string }[]; + hotkeys: HotkeyAction[]; } export const HotKeyList = ({ hotkeys }: Props) => { return ( -
+
{hotkeys.map((hotkey) => ( -
-

{hotkey.label}

-
- -
+
+ +
))}
diff --git a/src-web/hooks/useHotkey.ts b/src-web/hooks/useHotkey.ts index 7ebd1a99..030185a2 100644 --- a/src-web/hooks/useHotkey.ts +++ b/src-web/hooks/useHotkey.ts @@ -90,7 +90,28 @@ export function useAnyHotkey( window.removeEventListener('keydown', down); window.removeEventListener('keyup', up); }; - }, [os]); + }, [options.enable, os]); +} + +export function useHotKeyLabel(action: HotkeyAction | null): string { + switch (action) { + case 'request.send': + return 'Send Request'; + case 'request.create': + return 'New Request'; + case 'request.duplicate': + return 'Duplicate Request'; + case 'sidebar.toggle': + return 'Toggle Sidebar'; + case 'sidebar.focus': + return 'Focus Sidebar'; + case 'urlBar.focus': + return 'Focus URL'; + case 'environmentEditor.toggle': + return 'Edit Environments'; + default: + return 'Unknown'; + } } export function useFormattedHotkey(action: HotkeyAction | null): string | null {