spb/valoplex Public

1// Auteur : Simon-Pierre Boucher — contact@spboucher.ai2"use client";3import { createContext, useContext, useEffect, useState } from "react";4import { t as translate, type Lang, type TKey } from "@/lib/i18n";56const Ctx = createContext<{7  lang: Lang;8  setLang: (l: Lang) => void;9  t: (k: TKey) => string;10}>({ lang: "fr", setLang: () => {}, t: (k) => translate("fr", k) });1112export function LangProvider({ children }: { children: React.ReactNode }) {13  const [lang, setLangState] = useState<Lang>("fr");14  useEffect(() => {15    const saved = window.localStorage.getItem("vp-lang");16    if (saved !== "en" && saved !== "fr") return;17    const id = setTimeout(() => setLangState(saved), 0);18    return () => clearTimeout(id);19  }, []);20  const setLang = (l: Lang) => {21    setLangState(l);22    window.localStorage.setItem("vp-lang", l);23  };24  return (25    <Ctx.Provider value={{ lang, setLang, t: (k) => translate(lang, k) }}>26      {children}27    </Ctx.Provider>28  );29}3031export function useLang() {32  return useContext(Ctx);33}3435export function LangToggle() {36  const { lang, setLang } = useLang();37  return (38    <button39      onClick={() => setLang(lang === "fr" ? "en" : "fr")}40      className="vp-mono min-h-[36px] rounded-full border-[1.5px] border-ink bg-surface px-4 py-1.5 text-[12px] font-bold uppercase tracking-[0.08em] text-ink transition-all hover:bg-ink hover:text-lime"41      aria-label="Changer de langue / Switch language"42    >43      {lang === "fr" ? "EN" : "FR"}44    </button>45  );46}47