frontend/src/hooks/useKeyboardNavigation.js

import { useEffect, useCallback } from 'react';

export const useKeyboardNavigation = (options = {}) => {
  const {
    onEscape,
    onEnter,
    onArrowUp,
    onArrowDown,
    onArrowLeft,
    onArrowRight,
    onTab,
    enabled = true,
    preventDefault = true,
  } = options;

  const handleKeyDown = useCallback((event) => {
    if (!enabled) return;

    const { key, ctrlKey, metaKey, shiftKey } = event;

    // Handle different key combinations
    switch (key) {
      case 'Escape':
        if (onEscape) {
          if (preventDefault) event.preventDefault();
          onEscape(event);
        }
        break;
      
      case 'Enter':
        if (onEnter) {
          if (preventDefault) event.preventDefault();
          onEnter(event);
        }
        break;
      
      case 'ArrowUp':
        if (onArrowUp) {
          if (preventDefault) event.preventDefault();
          onArrowUp(event);
        }
        break;
      
      case 'ArrowDown':
        if (onArrowDown) {
          if (preventDefault) event.preventDefault();
          onArrowDown(event);
        }
        break;
      
      case 'ArrowLeft':
        if (onArrowLeft) {
          if (preventDefault) event.preventDefault();
          onArrowLeft(event);
        }
        break;
      
      case 'ArrowRight':
        if (onArrowRight) {
          if (preventDefault) event.preventDefault();
          onArrowRight(event);
        }
        break;
      
      case 'Tab':
        if (onTab) {
          if (preventDefault) event.preventDefault();
          onTab(event, shiftKey);
        }
        break;
      
      default:
        break;
    }

    // Handle common shortcuts
    if (ctrlKey || metaKey) {
      switch (key) {
        case 'k':
        case 'K':
          // Command palette shortcut
          if (options.onCommandPalette) {
            event.preventDefault();
            options.onCommandPalette(event);
          }
          break;
        
        case '/':
          // Search shortcut
          if (options.onSearch) {
            event.preventDefault();
            options.onSearch(event);
          }
          break;
        
        default:
          break;
      }
    }
  }, [
    enabled,
    preventDefault,
    onEscape,
    onEnter,
    onArrowUp,
    onArrowDown,
    onArrowLeft,
    onArrowRight,
    onTab,
    options.onCommandPalette,
    options.onSearch,
  ]);

  useEffect(() => {
    if (enabled) {
      document.addEventListener('keydown', handleKeyDown);
      return () => document.removeEventListener('keydown', handleKeyDown);
    }
  }, [enabled, handleKeyDown]);

  return { handleKeyDown };
};

export default useKeyboardNavigation;