ead43f081c
Add Semi UI internationalization to the project by wrapping the root
component tree with `LocaleProvider`. A new `SemiLocaleWrapper`
component maps the current `i18next` language code to the corresponding
Semi locale (currently `zh_CN` and `en_GB`) and falls back to Chinese
when no match is found.
Key changes
-----------
1. web/src/index.js
• Import `LocaleProvider`, `useTranslation`, and Semi locale files.
• Introduce `SemiLocaleWrapper` to determine `semiLocale` from
`i18next.language` using a concise prefix-based mapping.
• Wrap `PageLayout` with `SemiLocaleWrapper` inside the existing
`ThemeProvider`.
2. Ensures that all Semi components automatically display the correct
language when the app language is switched via i18next.
BREAKING CHANGE
---------------
Applications embedding this project must now ensure that `i18next`
initialization occurs before React render so that `LocaleProvider`
receives the correct initial language.
28 lines
573 B
JavaScript
28 lines
573 B
JavaScript
import i18n from 'i18next';
|
|
import { initReactI18next } from 'react-i18next';
|
|
import LanguageDetector from 'i18next-browser-languagedetector';
|
|
|
|
import enTranslation from './locales/en.json';
|
|
import zhTranslation from './locales/zh.json';
|
|
|
|
i18n
|
|
.use(LanguageDetector)
|
|
.use(initReactI18next)
|
|
.init({
|
|
load: 'languageOnly',
|
|
resources: {
|
|
en: {
|
|
translation: enTranslation,
|
|
},
|
|
zh: {
|
|
translation: zhTranslation,
|
|
},
|
|
},
|
|
fallbackLng: 'zh',
|
|
interpolation: {
|
|
escapeValue: false,
|
|
},
|
|
});
|
|
|
|
export default i18n;
|