remade in Vitejs

src/i18n/lang-context.tsx

@@ -0,0 +1,36 @@
+import { createContext, useContext, useEffect, useState } from 'react'
+import { Lang, Translations, translations } from './translations'
+
+const LangContext = createContext<{ lang: Lang; setLang: (l: Lang) => void; t: Translations } | null>(null)
+
+const STORAGE_KEY = 'lang'
+
+export function LangProvider({ children }: { children: React.ReactNode }) {
+  const [lang, setLangState] = useState<Lang>('en')
+
+  useEffect(() => {
+    const saved = localStorage.getItem(STORAGE_KEY) as Lang | null
+    if (saved && saved in translations) setLangState(saved)
+  }, [])
+
+  useEffect(() => {
+    document.documentElement.lang = lang
+  }, [lang])
+
+  const setLang = (l: Lang) => {
+    setLangState(l)
+    localStorage.setItem(STORAGE_KEY, l)
+  }
+
+  return (
+    <LangContext.Provider value={{ lang, setLang, t: translations[lang] }}>
+      {children}
+    </LangContext.Provider>
+  )
+}
+
+export function useLang() {
+  const ctx = useContext(LangContext)
+  if (!ctx) throw new Error('useLang must be used within LangProvider')
+  return ctx
+}