import { useEffect, useState } from 'react'
import { setLocale, getLocale, loadTranslations, t, type Locale } from '@/lib/i18n'

export function useI18n(locale: Locale = 'fr') {
  const [loaded, setLoaded] = useState(false)
  const [currentLocale, setCurrentLocale] = useState<Locale>(getLocale())

  useEffect(() => {
    const load = async () => {
      try {
        // Get saved locale from localStorage or use provided locale
        const savedLocale = typeof window !== 'undefined' ? (localStorage.getItem('zapwall-locale') as Locale | null) : null
        const initialLocale = savedLocale && (savedLocale === 'fr' || savedLocale === 'en') ? savedLocale : locale

        // Load translations from files in public directory
        const frResponse = await fetch('/locales/fr.txt')
        const enResponse = await fetch('/locales/en.txt')

        if (frResponse.ok) {
          const frText = await frResponse.text()
          await loadTranslations('fr', frText)
        }

        if (enResponse.ok) {
          const enText = await enResponse.text()
          await loadTranslations('en', enText)
        }

        setLocale(initialLocale)
        setCurrentLocale(initialLocale)
        setLoaded(true)
      } catch (e) {
        console.error('Error loading translations:', e)
        setLoaded(true) // Continue even if translations fail to load
      }
    }
    void load()
  }, [locale])

  return { loaded, locale: currentLocale, t }
}