import {MeasurementSystem} from 'common/measurement-utils'
import {usePersistentLocalState} from 'web/hooks/use-persistent-local-state'
import {getLocale} from 'web/lib/locale-cookie'

export const useMeasurementSystem = () => {
  // Get default based on locale
  const getDefaultMeasurementSystem = (): MeasurementSystem => {
    if (typeof window !== 'undefined') {
      try {
        const saved = localStorage.getItem('measurement-system')
        if (saved) {
          let parsed = JSON.parse(saved)
          parsed = parsed.value ?? parsed
          if (parsed === 'metric' || parsed === 'imperial') {
            return parsed
          }
        }
        // Default based on locale
        return getLocale() === 'en' ? 'imperial' : 'metric'
      } catch (_e) {
        // Fallback to imperial if anything goes wrong
        return 'imperial'
      }
    }
    return 'imperial' // server-side default
  }

  const [measurementSystem, setMeasurementSystemState] = usePersistentLocalState<MeasurementSystem>(
    getDefaultMeasurementSystem(),
    'measurement-system',
  )

  const setMeasurementSystem = (newSystem: MeasurementSystem) => {
    setMeasurementSystemState(newSystem)
  }

  return {measurementSystem, setMeasurementSystem}
}