ake/paperclip
1
0
Fork 0
mirror of https://github.com/alkimake/paperclip.git synced 2026-06-16 19:00:38 +09:00
Code Issues Projects Releases Packages Wiki Activity

feat(ui): add keyboard shortcut cheatsheet dialog on ? keypress

Browse source 
Shows a beautiful categorized cheatsheet of all keyboard shortcuts
(inbox, issue detail, global) when the user presses ? with keyboard
shortcuts enabled. Respects text input focus detection — won't trigger
in text fields. Uses the existing Dialog component and Radix UI.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
dotta 2026-04-08 08:27:49 -05:00
parent 69ff793c6a
commit fad5634b29
3 changed files with 114 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

11
ui/src/hooks/useKeyboardShortcuts.ts
View file

@ -6,6 +6,7 @@ interface ShortcutHandlers {
onNewIssue?: () => void;
onToggleSidebar?: () => void;
onTogglePanel?: () => void;
onShowShortcuts?: () => void;
}
export function useKeyboardShortcuts({
@ -13,6 +14,7 @@ export function useKeyboardShortcuts({
onNewIssue,
onToggleSidebar,
onTogglePanel,
onShowShortcuts,
}: ShortcutHandlers) {
useEffect(() => {
if (!enabled) return;
@ -23,6 +25,13 @@ export function useKeyboardShortcuts({
return;
}
// ? → Show keyboard shortcuts cheatsheet
if (e.key === "?" && !e.metaKey && !e.ctrlKey && !e.altKey) {
e.preventDefault();
onShowShortcuts?.();
return;
}
// C → New Issue
if (e.key === "c" && !e.metaKey && !e.ctrlKey && !e.altKey) {
e.preventDefault();
@ -44,5 +53,5 @@ export function useKeyboardShortcuts({
document.addEventListener("keydown", handleKeyDown);
return () => document.removeEventListener("keydown", handleKeyDown);
}, [enabled, onNewIssue, onToggleSidebar, onTogglePanel]);
}, [enabled, onNewIssue, onToggleSidebar, onTogglePanel, onShowShortcuts]);
}