feat: integrate global keyboard shortcuts across multiple components

- Added `KeyboardShortcutsProvider` to `RootLayout` for centralized keyboard shortcut management.
- Implemented `useGlobalKeyboardShortcuts` in `DailyPageClient`, `KanbanPageClient`, and `HomePageClient` to enhance navigation and task management with keyboard shortcuts.
- Updated `KeyboardShortcuts` component to render a modal for displaying available shortcuts, improving user accessibility.
- Enhanced `Header` component with buttons to open the keyboard shortcuts modal, streamlining user interaction.

src/components/ui/KeyboardShortcutsModal.tsx

@@ -0,0 +1,96 @@
+'use client';
+
+import { Modal } from './Modal';
+import { cn } from '@/lib/utils';
+
+interface KeyboardShortcut {
+  keys: string[];
+  description: string;
+  category?: string;
+}
+
+interface KeyboardShortcutsModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  shortcuts: KeyboardShortcut[];
+  title?: string;
+}
+
+function KeyBadge({ keyText }: { keyText: string }) {
+  return (
+    <kbd className="inline-flex items-center px-2 py-1 text-xs font-mono font-medium text-[var(--foreground)] bg-[var(--card)] border border-[var(--border)] rounded-md shadow-sm">
+      {keyText}
+    </kbd>
+  );
+}
+
+function ShortcutRow({ shortcut }: { shortcut: KeyboardShortcut }) {
+  return (
+    <div className="flex items-center justify-between py-2 px-3 rounded-md hover:bg-[var(--card-hover)] transition-colors">
+      <div className="flex items-center gap-2">
+        {shortcut.keys.map((key, index) => (
+          <div key={index} className="flex items-center gap-1">
+            <KeyBadge keyText={key} />
+            {index < shortcut.keys.length - 1 && (
+              <span className="text-[var(--muted-foreground)] text-xs">+</span>
+            )}
+          </div>
+        ))}
+      </div>
+      <span className="text-sm text-[var(--foreground)] font-mono">
+        {shortcut.description}
+      </span>
+    </div>
+  );
+}
+
+export function KeyboardShortcutsModal({ 
+  isOpen, 
+  onClose, 
+  shortcuts, 
+  title = "Raccourcis clavier" 
+}: KeyboardShortcutsModalProps) {
+  // Grouper les raccourcis par catégorie
+  const groupedShortcuts = shortcuts.reduce((acc, shortcut) => {
+    const category = shortcut.category || 'Général';
+    if (!acc[category]) {
+      acc[category] = [];
+    }
+    acc[category].push(shortcut);
+    return acc;
+  }, {} as Record<string, KeyboardShortcut[]>);
+
+  return (
+    <Modal isOpen={isOpen} onClose={onClose} title={title} size="lg">
+      <div className="space-y-6">
+        {Object.entries(groupedShortcuts).map(([category, categoryShortcuts]) => (
+          <div key={category}>
+            <h3 className="text-sm font-mono font-semibold text-[var(--primary)] uppercase tracking-wider mb-3">
+              {category}
+            </h3>
+            <div className="space-y-1">
+              {categoryShortcuts.map((shortcut, index) => (
+                <ShortcutRow key={index} shortcut={shortcut} />
+              ))}
+            </div>
+          </div>
+        ))}
+        
+        {shortcuts.length === 0 && (
+          <div className="text-center py-8">
+            <p className="text-[var(--muted-foreground)] font-mono">
+              Aucun raccourci disponible sur cette page
+            </p>
+          </div>
+        )}
+      </div>
+      
+      {/* Footer avec info */}
+      <div className="mt-6 pt-4 border-t border-[var(--border)]/50">
+        <p className="text-xs text-[var(--muted-foreground)] font-mono text-center">
+          Appuyez sur <KeyBadge keyText="Esc" /> pour fermer cette fenêtre
+        </p>
+      </div>
+    </Modal>
+  );
+}