towercontrol/src/contexts/KeyboardShortcutsContext.tsx

'use client';

import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
import { usePathname } from 'next/navigation';

export interface KeyboardShortcut {
  keys: string[];
  description: string;
  category?: string;
}

export interface PageShortcuts {
  [pagePath: string]: KeyboardShortcut[];
}

// Configuration des raccourcis par page
const PAGE_SHORTCUTS: PageShortcuts = {
  // Raccourcis globaux (toutes les pages)
  '*': [
    {
      keys: ['Cmd', '?'],
      description: 'Afficher les raccourcis clavier',
      category: 'Navigation'
    },
    {
      keys: ['Shift', 'Q'],
      description: 'Basculer le thème',
      category: 'Apparence'
    },
    {
      keys: ['Shift', 'W'],
      description: 'Faire tourner les thèmes dark',
      category: 'Apparence'
    },
    {
      keys: ['Esc'],
      description: 'Fermer les modales/annuler',
      category: 'Navigation'
    }
  ],
  
  // Dashboard
  '/': [
    {
      keys: ['Shift', 'K'],
      description: 'Vers Kanban',
      category: 'Navigation'
    }
  ],
  
  // Kanban
  '/kanban': [
    {
      keys: ['Shift', 'N'],
      description: 'Créer une nouvelle tâche',
      category: 'Actions'
    },
    {
      keys: ['Space'],
      description: 'Basculer la vue compacte',
      category: 'Vue'
    },
    {
      keys: ['Shift', 'F'],
      description: 'Ouvrir les filtres',
      category: 'Filtres'
    },
    {
      keys: ['Shift', 'S'],
      description: 'Basculer les swimlanes',
      category: 'Vue'
    },
    {
      keys: ['Shift', 'O'],
      description: 'Basculer les objectifs',
      category: 'Vue'
    },
    {
      keys: ['Shift', 'D'],
      description: 'Filtrer par date de fin',
      category: 'Filtres'
    },
    {
      keys: ['Shift', 'Z'],
      description: 'Basculer la taille de police',
      category: 'Vue'
    },
    {
      keys: ['Tab'],
      description: 'Navigation entre colonnes',
      category: 'Navigation'
    },
    {
      keys: ['Enter'],
      description: 'Valider une tâche',
      category: 'Actions'
    },
    {
      keys: ['Esc'],
      description: 'Annuler la création de tâche',
      category: 'Actions'
    }
  ],
  
  // Daily
  '/daily': [
    {
      keys: ['←', '→'],
      description: 'Navigation jour précédent/suivant',
      category: 'Navigation'
    },
    {
      keys: ['Shift', 'H'],
      description: 'Aller à aujourd\'hui',
      category: 'Navigation'
    },
    {
      keys: ['Enter'],
      description: 'Valider un élément',
      category: 'Actions'
    }
  ],
  
  // Manager
  '/weekly-manager': [
    {
      keys: ['Cmd', 'Ctrl', 'N'],
      description: 'Créer un objectif',
      category: 'Actions'
    },
    {
      keys: ['←', '→'],
      description: 'Navigation semaine précédente/suivante',
      category: 'Navigation'
    },
    {
      keys: ['Cmd', 'Ctrl', 'T'],
      description: 'Aller à cette semaine',
      category: 'Navigation'
    }
  ]
};

interface KeyboardShortcutsContextType {
  isOpen: boolean;
  shortcuts: KeyboardShortcut[];
  openModal: () => void;
  closeModal: () => void;
  toggleModal: () => void;
}

const KeyboardShortcutsContext = createContext<KeyboardShortcutsContextType | undefined>(undefined);

interface KeyboardShortcutsProviderProps {
  children: ReactNode;
}

export function KeyboardShortcutsProvider({ children }: KeyboardShortcutsProviderProps) {
  const [isOpen, setIsOpen] = useState(false);
  const pathname = usePathname();
  
  // Obtenir les raccourcis pour la page actuelle
  const getCurrentPageShortcuts = (): KeyboardShortcut[] => {
    const shortcuts: KeyboardShortcut[] = [];
    
    // Ajouter les raccourcis globaux
    if (PAGE_SHORTCUTS['*']) {
      shortcuts.push(...PAGE_SHORTCUTS['*']);
    }
    
    // Ajouter les raccourcis spécifiques à la page
    const pageShortcuts = PAGE_SHORTCUTS[pathname];
    if (pageShortcuts) {
      shortcuts.push(...pageShortcuts);
    }
    
    return shortcuts;
  };
  
  const shortcuts = getCurrentPageShortcuts();
  
  // Gérer le raccourci Cmd+? pour ouvrir la popup
  useEffect(() => {
    const handleKeyDown = (event: KeyboardEvent) => {
      // Cmd+? ou Ctrl+? pour ouvrir les raccourcis
      if ((event.metaKey || event.ctrlKey) && event.key === '?') {
        event.preventDefault();
        setIsOpen(true);
      }
      
      // Esc pour fermer
      if (event.key === 'Escape' && isOpen) {
        setIsOpen(false);
      }
    };
    
    document.addEventListener('keydown', handleKeyDown);
    
    return () => {
      document.removeEventListener('keydown', handleKeyDown);
    };
  }, [isOpen]);
  
  const contextValue: KeyboardShortcutsContextType = {
    isOpen,
    shortcuts,
    openModal: () => setIsOpen(true),
    closeModal: () => setIsOpen(false),
    toggleModal: () => setIsOpen(prev => !prev)
  };
  
  return (
    <KeyboardShortcutsContext.Provider value={contextValue}>
      {children}
    </KeyboardShortcutsContext.Provider>
  );
}

export function useKeyboardShortcutsModal() {
  const context = useContext(KeyboardShortcutsContext);
  if (context === undefined) {
    throw new Error('useKeyboardShortcutsModal must be used within a KeyboardShortcutsProvider');
  }
  return context;
}