Nicolas Cantu d3cae85b3d Update presentation page to dark theme and add language selector
- Update /presentation page to use dark theme (PageHeader, Footer, bg-cyber-darker)
- Add LanguageSelector component to PageHeader for all pages
- Update AuthorPresentationEditor to use dark theme styling
- Update ArticleField and ArticleFormButtons to use dark theme
- Add locale persistence in localStorage
- Update _app.tsx to load saved locale from localStorage
- All pages now support FR/EN language switching
2025-12-27 23:17:50 +01:00

42 lines
1.4 KiB
TypeScript

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 }
}