import { useState, useEffect } from 'react';

/**
 * Hook to check if Resource Debug is enabled
 * This controls both Resource Debug overlay and AI Function Logs
 */
export function useResourceDebug(): boolean {
  const [enabled, setEnabled] = useState(false);

  useEffect(() => {
    // Load initial state
    const saved = localStorage.getItem('debug_resource_tracking_enabled');
    setEnabled(saved === 'true');

    // Listen for toggle changes
    const handleToggle = (e: Event) => {
      const customEvent = e as CustomEvent;
      setEnabled(customEvent.detail);
    };

    window.addEventListener('debug-resource-tracking-toggle', handleToggle);
    
    return () => {
      window.removeEventListener('debug-resource-tracking-toggle', handleToggle);
    };
  }, []);

  return enabled;
}