import { useState, useEffect } from 'react'

export function useLocalStorageState<T>(
  key: string,
  defaultValue: T,
  options?: {
    serialize?: (value: T) => string
    deserialize?: (value: string) => T
    validate?: (value: unknown) => value is T
  }
): [T, (value: T | ((prev: T) => T)) => void] {
  const { serialize = String, deserialize, validate } = options ?? {}

  const [state, setState] = useState<T>(() => {
    try {
      const saved = localStorage.getItem(key)
      if (saved !== null) {
        const parsed = deserialize ? deserialize(saved) : (saved as unknown as T)
        if (validate ? validate(parsed) : true) return parsed
      }
    } catch {
      // 忽略
    }
    return defaultValue
  })

  useEffect(() => {
    try {
      localStorage.setItem(key, serialize(state))
    } catch {
      // 忽略
    }
  }, [key, state, serialize])

  return [state, setState]
}