+
{hints.map((hint, i) => (
-
+
{hint.key}
{hint.action}
@@ -42,4 +50,4 @@ export function KeyboardHints() {
)
-}
\ No newline at end of file
+}
diff --git a/frontend/src/components/KeyboardShortcuts.tsx b/frontend/src/components/KeyboardShortcuts.tsx
deleted file mode 100644
index daa85d8..0000000
--- a/frontend/src/components/KeyboardShortcuts.tsx
+++ /dev/null
@@ -1,143 +0,0 @@
-import { useState } from 'react'
-import { Keyboard, ChevronRight, ChevronDown, X } from 'lucide-react'
-import clsx from 'clsx'
-
-interface Shortcut {
- keys: string[]
- description: string
- category: 'navigation' | 'selection' | 'actions' | 'view'
-}
-
-const shortcuts: Shortcut[] = [
- // Navigation
- { keys: ['↑', '↓', '←', '→'], description: 'Navigate photos', category: 'navigation' },
- { keys: ['Space'], description: 'Quick preview', category: 'navigation' },
- { keys: ['Enter'], description: 'Open in loupe view', category: 'navigation' },
-
- // Selection
- { keys: ['Click'], description: 'Select photo', category: 'selection' },
- { keys: ['Shift', 'Click'], description: 'Select range', category: 'selection' },
- { keys: ['Ctrl/Cmd', 'Click'], description: 'Add to selection', category: 'selection' },
- { keys: ['Ctrl/Cmd', 'A'], description: 'Select all', category: 'selection' },
- { keys: ['Escape'], description: 'Clear selection', category: 'selection' },
-
- // Actions
- { keys: ['1-5'], description: 'Set rating', category: 'actions' },
- { keys: ['0'], description: 'Remove rating', category: 'actions' },
- { keys: ['P'], description: 'Pick photo', category: 'actions' },
- { keys: ['X'], description: 'Reject photo', category: 'actions' },
- { keys: ['U'], description: 'Unflag photo', category: 'actions' },
- { keys: ['Delete'], description: 'Move to trash', category: 'actions' },
-
- // View
- { keys: ['Tab'], description: 'Toggle left sidebar', category: 'view' },
- { keys: ['I'], description: 'Toggle info panel', category: 'view' },
- { keys: ['G'], description: 'Grid view', category: 'view' },
- { keys: ['E'], description: 'Loupe view', category: 'view' },
- { keys: ['F'], description: 'Fullscreen', category: 'view' },
-]
-
-export function KeyboardShortcuts() {
- const [isExpanded, setIsExpanded] = useState(true)
- const [isMinimized, setIsMinimized] = useState(false)
-
- const categories = {
- navigation: { label: 'Navigation', color: 'text-primary' },
- selection: { label: 'Selection', color: 'text-pick' },
- actions: { label: 'Actions', color: 'text-star' },
- view: { label: 'View', color: 'text-text' },
- }
-
- if (isMinimized) {
- return (
-
-
-
- )
- }
-
- return (
-
- {/* Header */}
-
-
-
- Keyboard Shortcuts
-
-
-
-
-
-
-
- {/* Content */}
- {isExpanded && (
-
- {Object.entries(categories).map(([category, { label, color }]) => (
-
-
- {label}
-
-
- {shortcuts
- .filter(s => s.category === category)
- .map((shortcut, i) => (
-
-
- {shortcut.description}
-
-
- {shortcut.keys.map((key, j) => (
-
-
- {key}
-
- {j < shortcut.keys.length - 1 && (
- +
- )}
-
- ))}
-
-
- ))}
-
-
- ))}
-
- )}
-
- {/* Footer Hint */}
- {!isExpanded && (
-
-
Click to expand shortcuts list
-
- )}
-
- )
-}
\ No newline at end of file