diff --git a/interface/src/App.tsx b/interface/src/App.tsx index e25f48aa4..ae2023e73 100644 --- a/interface/src/App.tsx +++ b/interface/src/App.tsx @@ -4,28 +4,46 @@ import { Slide, ToastContainer } from 'react-toastify'; import AppRouting from 'AppRouting'; import CustomTheme from 'CustomTheme'; import TypesafeI18n from 'i18n/i18n-react'; -import { detectLocale } from 'i18n/i18n-util'; +import type { Locales } from 'i18n/i18n-types'; import { loadLocaleAsync } from 'i18n/i18n-util.async'; -import { localStorageDetector } from 'typesafe-i18n/detectors'; +import { detectLocale, navigatorDetector } from 'typesafe-i18n/detectors'; -const detectedLocale = detectLocale(localStorageDetector); +const availableLocales = [ + 'de', + 'en', + 'it', + 'fr', + 'nl', + 'no', + 'pl', + 'sk', + 'sv', + 'tr', + 'cz' +]; const App = () => { const [wasLoaded, setWasLoaded] = useState(false); + const [locale, setLocale] = useState('en'); useEffect(() => { - void loadLocaleAsync(detectedLocale).then(() => setWasLoaded(true)); + // determine locale, take from session if set other default to browser language + const browserLocale = detectLocale('en', availableLocales, navigatorDetector); + const newLocale = (localStorage.getItem('lang') || browserLocale) as Locales; + localStorage.setItem('lang', newLocale); + setLocale(newLocale); + void loadLocaleAsync(newLocale).then(() => setWasLoaded(true)); }, []); if (!wasLoaded) return null; return ( - +