feat: add language local storage

This commit is contained in:
JimmFly
2023-01-10 18:47:13 +08:00
parent b3e703b656
commit d0d0955c0e

View File

@@ -1,6 +1,5 @@
import i18next, { Resource } from 'i18next'; import i18next, { Resource } from 'i18next';
import { Trans, initReactI18next, useTranslation } from 'react-i18next'; import { Trans, initReactI18next, useTranslation } from 'react-i18next';
import detector from 'i18next-browser-languagedetector';
import { LOCALES } from './resources/index.js'; import { LOCALES } from './resources/index.js';
import type en_US from './resources/en.json'; import type en_US from './resources/en.json';
@@ -22,7 +21,7 @@ declare module 'react-i18next' {
} }
} }
// const STORAGE_KEY = 'i18n_lng'; const STORAGE_KEY = 'i18n_lng';
export { Trans, i18n, useTranslation, LOCALES }; export { Trans, i18n, useTranslation, LOCALES };
@@ -34,33 +33,39 @@ const resources = LOCALES.reduce<Resource>(
const fallbackLng = LOCALES[0].tag; const fallbackLng = LOCALES[0].tag;
const standardizeLocale = (language: string) => { const standardizeLocale = (language: string) => {
if (LOCALES.find(locale => locale.tag === language)) return language; if (LOCALES.find(locale => locale.tag === language)) return language;
if (language === 'zh-CN' || language === 'zh') {
return 'zh-Hans';
}
if (language.slice(0, 2).toLowerCase() === 'zh') {
return 'zh-Hant';
}
if (LOCALES.find(locale => locale.tag === language.slice(0, 2).toLowerCase())) if (LOCALES.find(locale => locale.tag === language.slice(0, 2).toLowerCase()))
return language; return language;
return fallbackLng; return fallbackLng;
}; };
let language = 'en';
const language = standardizeLocale( if (typeof window !== 'undefined') {
// localStorage.getItem(STORAGE_KEY) ?? const localStorageLanguage = localStorage.getItem(STORAGE_KEY);
// (typeof navigator !== 'undefined' ? navigator.language : 'en') if (localStorageLanguage) {
'en' language = standardizeLocale(localStorageLanguage);
); } else {
language = standardizeLocale(navigator.language);
}
}
const i18n = i18next.createInstance(); const i18n = i18next.createInstance();
i18n i18n.use(initReactI18next).init({
.use(detector) lng: language,
.use(initReactI18next) fallbackLng,
.init({ debug: false,
lng: language, resources,
fallbackLng, interpolation: {
debug: false, escapeValue: false, // not needed for react as it escapes by default
resources, },
interpolation: { });
escapeValue: false, // not needed for react as it escapes by default
},
});
i18n.on('languageChanged', () => { i18n.on('languageChanged', lng => {
// localStorage.setItem(STORAGE_KEY, lng); localStorage.setItem(STORAGE_KEY, lng);
}); });
// const I18nProvider = I18nextProvider; // const I18nProvider = I18nextProvider;