/**
 * LocalStorage 동기화 커스텀 훅
 * - 여러 상태를 하나의 effect로 통합 관리
 * - 배치 업데이트로 성능 최적화
 */

import { useEffect, useRef } from 'react';

interface StorageConfig {
  [key: string]: any;
}

/**
 * 여러 상태를 localStorage와 자동 동기화
 */
export function useLocalStorageSync(config: StorageConfig) {
  const timeoutRef = useRef<number | null>(null);
  const pendingUpdates = useRef<Record<string, any>>({});

  useEffect(() => {
    // 배치 업데이트: 100ms 내 모든 변경사항을 한 번에 저장
    Object.entries(config).forEach(([key, value]) => {
      pendingUpdates.current[key] = value;
    });

    if (timeoutRef.current !== null) {
      window.clearTimeout(timeoutRef.current);
    }

    timeoutRef.current = window.setTimeout(() => {
      Object.entries(pendingUpdates.current).forEach(([key, value]) => {
        if (value === null || value === undefined) {
          localStorage.removeItem(key);
        } else {
          localStorage.setItem(key, String(value));
        }
      });

      console.log(`💾 [LocalStorage] 배치 저장 완료 (${Object.keys(pendingUpdates.current).length}개)`);
      pendingUpdates.current = {};
      timeoutRef.current = null;
    }, 100);

    return () => {
      if (timeoutRef.current !== null) {
        window.clearTimeout(timeoutRef.current);
      }
    };
  }, [JSON.stringify(config)]);
}

/**
 * LocalStorage에서 초기값 로드
 */
export function loadFromLocalStorage<T>(
  key: string,
  defaultValue: T,
  parser?: (value: string) => T
): T {
  try {
    const saved = localStorage.getItem(key);
    if (saved === null) return defaultValue;
    
    if (parser) {
      return parser(saved);
    }
    
    // 자동 타입 변환
    if (typeof defaultValue === 'number') {
      return Number(saved) as T;
    }
    if (typeof defaultValue === 'boolean') {
      return (saved === 'true') as T;
    }
    
    return saved as T;
  } catch (error) {
    console.error(`LocalStorage 로드 실패 (${key}):`, error);
    return defaultValue;
  }
}
