diff --git a/apps/studio/state/shortcuts/useShortcut.ts b/apps/studio/state/shortcuts/useShortcut.tsx similarity index 62% rename from apps/studio/state/shortcuts/useShortcut.ts rename to apps/studio/state/shortcuts/useShortcut.tsx index 91e5e472a2a..124cfdc9d91 100644 --- a/apps/studio/state/shortcuts/useShortcut.ts +++ b/apps/studio/state/shortcuts/useShortcut.tsx @@ -1,5 +1,6 @@ import { useHotkeySequence } from '@tanstack/react-hotkeys' -import { useCallback } from 'react' +import { Fragment, useCallback } from 'react' +import { KeyboardShortcut } from 'ui' import { useRegisterCommands } from 'ui-patterns/CommandMenu' import { SHORTCUT_DEFINITIONS, type ShortcutId } from './registry' @@ -8,7 +9,14 @@ import type { ShortcutOptions } from './types' import { COMMAND_MENU_SECTIONS } from '@/components/interfaces/App/CommandMenu/CommandMenu.utils' import useLatest from '@/hooks/misc/useLatest' -export function useShortcut(id: ShortcutId, callback: () => void, options?: ShortcutOptions) { +interface UseShortcutOptions extends ShortcutOptions { + registerInCommandMenu?: boolean +} + +const hotkeyToKeys = (hotkey: string): string[] => + hotkey.split('+').map((part) => (part === 'Mod' ? 'Meta' : part)) + +export function useShortcut(id: ShortcutId, callback: () => void, options?: UseShortcutOptions) { const snap = useShortcutStateSnapshot() const def = SHORTCUT_DEFINITIONS[id] @@ -28,7 +36,23 @@ export function useShortcut(id: ShortcutId, callback: () => void, options?: Shor useRegisterCommands( COMMAND_MENU_SECTIONS.SHORTCUTS, - [{ id, name: def.label, action: stableAction }], + [ + { + id, + name: def.label, + action: stableAction, + badge: () => ( +