import { useState, useEffect, useCallback, useRef } from 'react';

export type SaveStatus = 'idle' | 'saving' | 'saved' | 'error';

interface UseSettingsSaveOptions {
  onSave: (silent?: boolean) => Promise<boolean>;
  autoSaveDelay?: number;
}

export function useSettingsSave({ onSave, autoSaveDelay = 1500 }: UseSettingsSaveOptions) {
  const [saveStatus, setSaveStatus] = useState<SaveStatus>('idle');
  const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
  const [isSaving, setIsSaving] = useState(false);
  const isMounted = useRef(true);

  useEffect(() => {
    return () => {
      isMounted.current = false;
    };
  }, []);

  const handleSave = useCallback(async (silent = true) => {
    if (!silent) setIsSaving(true);
    setSaveStatus('saving');

    try {
      const success = await onSave(silent);
      if (isMounted.current) {
        if (success) {
          setHasUnsavedChanges(false);
          setSaveStatus('saved');
          setTimeout(() => {
            if (isMounted.current) setSaveStatus('idle');
          }, 3000);
        } else {
          setSaveStatus('error');
        }
      }
    } catch (error) {
      console.error('Settings save error:', error);
      if (isMounted.current) setSaveStatus('error');
    } finally {
      if (isMounted.current && !silent) setIsSaving(false);
    }
  }, [onSave]);

  // Auto-save logic
  useEffect(() => {
    if (!hasUnsavedChanges) return;

    const timer = setTimeout(() => {
      handleSave(true);
    }, autoSaveDelay);

    return () => clearTimeout(timer);
  }, [hasUnsavedChanges, handleSave, autoSaveDelay]);

  // Before unload warning
  useEffect(() => {
    const handleBeforeUnload = (e: BeforeUnloadEvent) => {
      if (hasUnsavedChanges) {
        e.preventDefault();
        e.returnValue = '';
      }
    };
    window.addEventListener('beforeunload', handleBeforeUnload);
    return () => window.removeEventListener('beforeunload', handleBeforeUnload);
  }, [hasUnsavedChanges]);

  const markDirty = useCallback(() => {
    setHasUnsavedChanges(true);
  }, []);

  const markClean = useCallback(() => {
    setHasUnsavedChanges(false);
  }, []);

  return {
    saveStatus,
    hasUnsavedChanges,
    isSaving,
    handleSave,
    markDirty,
    markClean
  };
}