ui: EN/FR toggle in the What's-new dialog (defaults to UI language)

This commit is contained in:
2026-07-21 00:36:39 +02:00
parent 46772e54fe
commit aa5af4fc75
+14 -2
View File
@@ -1150,6 +1150,10 @@ export default function App() {
// "What's new": the changelog for the version(s) since the operator last ran,
// shown once on the first launch after an update (EN/FR per the UI language).
const [whatsNew, setWhatsNew] = useState<Array<{ version: string; date: string; en: string[]; fr: string[] }> | null>(null);
// Which language the What's-new modal shows — defaults to the UI language but
// toggleable, so a French operator running the English UI can still read it.
const [clLang, setClLang] = useState<'en' | 'fr'>(lang);
useEffect(() => { setClLang(lang); }, [lang]);
useEffect(() => {
GetWhatsNew().then((e: any) => { if (Array.isArray(e) && e.length) setWhatsNew(e); }).catch(() => {});
}, []);
@@ -4159,7 +4163,15 @@ export default function App() {
<Zap className="size-5 text-primary" />
<h2 className="text-lg font-bold tracking-tight">{t('whatsnew.title')}</h2>
<span className="flex-1" />
<button onClick={() => setWhatsNew(null)} className="text-muted-foreground hover:text-foreground"><X className="size-4" /></button>
<div className="inline-flex rounded-md border border-border overflow-hidden text-[11px] font-semibold">
{(['en', 'fr'] as const).map((l) => (
<button key={l} onClick={() => setClLang(l)}
className={cn('px-2 py-0.5 uppercase', clLang === l ? 'bg-primary text-primary-foreground' : 'text-muted-foreground hover:bg-muted')}>
{l}
</button>
))}
</div>
<button onClick={() => setWhatsNew(null)} className="text-muted-foreground hover:text-foreground ml-1"><X className="size-4" /></button>
</div>
<div className="overflow-y-auto px-5 py-4 space-y-5">
{whatsNew.map((e) => (
@@ -4169,7 +4181,7 @@ export default function App() {
{e.date && <span className="text-[11px] text-muted-foreground">{e.date}</span>}
</div>
<ul className="space-y-1.5 text-sm">
{(lang === 'fr' ? e.fr : e.en).map((line, i) => (
{(clLang === 'fr' ? e.fr : e.en).map((line, i) => (
<li key={i} className="flex gap-2">
<span className="text-primary mt-1.5 size-1.5 rounded-full bg-primary shrink-0" />
<span>{line}</span>