Spaces:
Paused
Paused
File size: 2,595 Bytes
5a81b95 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | import { useEffect, useCallback } from 'react';
import { useNavigate } from 'react-router-dom';
import { toast } from '@/hooks/use-toast';
interface ShortcutAction {
key: string;
ctrlKey?: boolean;
shiftKey?: boolean;
altKey?: boolean;
description: string;
action: () => void;
}
export const useKeyboardShortcuts = () => {
const navigate = useNavigate();
const shortcuts: ShortcutAction[] = [
{
key: 'd',
ctrlKey: true,
description: 'Gå til Dashboard',
action: () => navigate('/dashboard'),
},
{
key: 'p',
ctrlKey: true,
description: 'Gå til Mine Sider',
action: () => navigate('/pages'),
},
{
key: 'g',
ctrlKey: true,
description: 'Gå til Widget Gallery',
action: () => navigate('/gallery'),
},
{
key: 'h',
ctrlKey: true,
description: 'Gå til Hjem',
action: () => navigate('/'),
},
{
key: '/',
ctrlKey: true,
description: 'Vis genveje',
action: () => {
toast({
title: 'Keyboard Shortcuts',
description: 'Ctrl+D: Dashboard | Ctrl+P: Sider | Ctrl+G: Gallery | Ctrl+H: Hjem | Ctrl+?: Hjælp',
});
},
},
];
const handleKeyDown = useCallback((event: KeyboardEvent) => {
// Don't trigger shortcuts when typing in inputs
const target = event.target as HTMLElement;
if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable) {
return;
}
for (const shortcut of shortcuts) {
const ctrlMatch = shortcut.ctrlKey ? (event.ctrlKey || event.metaKey) : !event.ctrlKey && !event.metaKey;
const shiftMatch = shortcut.shiftKey ? event.shiftKey : !event.shiftKey;
const altMatch = shortcut.altKey ? event.altKey : !event.altKey;
if (
event.key.toLowerCase() === shortcut.key.toLowerCase() &&
ctrlMatch &&
shiftMatch &&
altMatch
) {
event.preventDefault();
shortcut.action();
return;
}
}
}, [shortcuts]);
useEffect(() => {
window.addEventListener('keydown', handleKeyDown);
return () => window.removeEventListener('keydown', handleKeyDown);
}, [handleKeyDown]);
return shortcuts;
};
export const shortcutsList = [
{ keys: 'Ctrl + D', description: 'Gå til Dashboard' },
{ keys: 'Ctrl + P', description: 'Gå til Mine Sider' },
{ keys: 'Ctrl + G', description: 'Gå til Widget Gallery' },
{ keys: 'Ctrl + H', description: 'Gå til Hjem' },
{ keys: 'Ctrl + /', description: 'Vis genveje' },
];
|