diff --git a/src/frontend/src/features/shortcuts/types.ts b/src/frontend/src/features/shortcuts/types.ts index a5eb4914..7fe39c3d 100644 --- a/src/frontend/src/features/shortcuts/types.ts +++ b/src/frontend/src/features/shortcuts/types.ts @@ -1,4 +1,6 @@ export type Shortcut = { key: string ctrlKey?: boolean + shiftKey?: boolean + altKey?: boolean } diff --git a/src/frontend/src/features/shortcuts/useKeyboardShortcuts.ts b/src/frontend/src/features/shortcuts/useKeyboardShortcuts.ts index d26fdf19..bd034a2e 100644 --- a/src/frontend/src/features/shortcuts/useKeyboardShortcuts.ts +++ b/src/frontend/src/features/shortcuts/useKeyboardShortcuts.ts @@ -11,11 +11,13 @@ export const useKeyboardShortcuts = () => { // This approach handles basic shortcuts but isn't comprehensive. // Issues might occur. First draft. const onKeyDown = async (e: KeyboardEvent) => { - const { key, metaKey, ctrlKey } = e + const { key, metaKey, ctrlKey, shiftKey, altKey } = e if (!key) return const shortcutKey = formatShortcutKey({ key, ctrlKey: ctrlKey || (isMacintosh() && metaKey), + shiftKey, + altKey, }) const shortcut = shortcutsSnap.shortcuts.get(shortcutKey) if (!shortcut) return diff --git a/src/frontend/src/features/shortcuts/utils.ts b/src/frontend/src/features/shortcuts/utils.ts index cf22f2a1..e6c0a8e2 100644 --- a/src/frontend/src/features/shortcuts/utils.ts +++ b/src/frontend/src/features/shortcuts/utils.ts @@ -4,15 +4,27 @@ import { Shortcut } from '@/features/shortcuts/types' export const CTRL = 'ctrl' export const formatShortcutKey = (shortcut: Shortcut) => { - if (shortcut.ctrlKey) return `${CTRL}+${shortcut.key.toUpperCase()}` - return shortcut.key.toUpperCase() + const parts = [] + if (shortcut.ctrlKey) parts.push(CTRL) + if (shortcut.altKey) parts.push('alt') + if (shortcut.shiftKey) parts.push('shift') + parts.push(shortcut.key.toUpperCase()) + return parts.join('+') } export const appendShortcutLabel = (label: string, shortcut: Shortcut) => { if (!shortcut.key) return - let formattedKeyLabel = shortcut.key.toLowerCase() + const parts: string[] = [] if (shortcut.ctrlKey) { - formattedKeyLabel = `${isMacintosh() ? '⌘' : 'Ctrl'}+${formattedKeyLabel}` + parts.push(isMacintosh() ? '⌘' : 'Ctrl') } + if (shortcut.altKey) { + parts.push(isMacintosh() ? '⌥' : 'Alt') + } + if (shortcut.shiftKey) { + parts.push('Shift') + } + parts.push(shortcut.key.toLowerCase()) + const formattedKeyLabel = parts.join('+') return `${label} (${formattedKeyLabel})` }