### What problem does this PR solve? change language Issue link: #245 - [x] New Feature (non-breaking change which adds functionality)
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import i18next from '@/locales/config';
|
|
import { App, ConfigProvider, ConfigProviderProps } from 'antd';
|
|
import enUS from 'antd/locale/en_US';
|
|
import zhCN from 'antd/locale/zh_CN';
|
|
import React, { ReactNode, useEffect, useState } from 'react';
|
|
import storage from './utils/authorizationUtil';
|
|
|
|
type Locale = ConfigProviderProps['locale'];
|
|
|
|
const RootProvider = ({ children }: React.PropsWithChildren) => {
|
|
const getLocale = (lng: string) => (lng === 'zh' ? zhCN : enUS);
|
|
|
|
const [locale, setLocal] = useState<Locale>(getLocale(storage.getLanguage()));
|
|
|
|
i18next.on('languageChanged', function (lng: string) {
|
|
storage.setLanguage(lng);
|
|
setLocal(getLocale(lng));
|
|
});
|
|
|
|
useEffect(() => {
|
|
i18next.changeLanguage(storage.getLanguage());
|
|
}, [locale]);
|
|
|
|
return (
|
|
<ConfigProvider
|
|
theme={{
|
|
token: {
|
|
fontFamily: 'Inter',
|
|
},
|
|
}}
|
|
locale={locale}
|
|
>
|
|
<App> {children}</App>
|
|
</ConfigProvider>
|
|
);
|
|
};
|
|
|
|
export function rootContainer(container: ReactNode) {
|
|
return <RootProvider>{container}</RootProvider>;
|
|
}
|