File size: 2,958 Bytes
74ade83 bb69456 53f091c 88e5a61 60788d3 88e5a61 74ade83 b916b29 be99f83 bb69456 53f091c d1bf860 e08f767 b916b29 74ade83 60788d3 74ade83 be99f83 88e5a61 53f091c 74ade83 88e5a61 74ade83 88e5a61 53f091c 88e5a61 5769711 e1bc1d4 e441caf d1bf860 84f80c5 88e5a61 e1bc1d4 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
import i18n from '@/locales/config';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
import { App, ConfigProvider, ConfigProviderProps, theme } from 'antd';
import enUS from 'antd/locale/en_US';
import vi_VN from 'antd/locale/vi_VN';
import zhCN from 'antd/locale/zh_CN';
import zh_HK from 'antd/locale/zh_HK';
import dayjs from 'dayjs';
import advancedFormat from 'dayjs/plugin/advancedFormat';
import customParseFormat from 'dayjs/plugin/customParseFormat';
import localeData from 'dayjs/plugin/localeData';
import weekOfYear from 'dayjs/plugin/weekOfYear';
import weekYear from 'dayjs/plugin/weekYear';
import weekday from 'dayjs/plugin/weekday';
import React, { ReactNode, useEffect, useState } from 'react';
import { ThemeProvider, useTheme } from './components/theme-provider';
import { TooltipProvider } from './components/ui/tooltip';
import storage from './utils/authorization-util';
dayjs.extend(customParseFormat);
dayjs.extend(advancedFormat);
dayjs.extend(weekday);
dayjs.extend(localeData);
dayjs.extend(weekOfYear);
dayjs.extend(weekYear);
const AntLanguageMap = {
en: enUS,
zh: zhCN,
'zh-TRADITIONAL': zh_HK,
vi: vi_VN,
};
const queryClient = new QueryClient();
type Locale = ConfigProviderProps['locale'];
function Root({ children }: React.PropsWithChildren) {
const { theme: themeragflow } = useTheme();
const getLocale = (lng: string) =>
AntLanguageMap[lng as keyof typeof AntLanguageMap] ?? enUS;
const [locale, setLocal] = useState<Locale>(getLocale(storage.getLanguage()));
i18n.on('languageChanged', function (lng: string) {
storage.setLanguage(lng);
setLocal(getLocale(lng));
});
return (
<>
<ConfigProvider
theme={{
token: {
fontFamily: 'Inter',
},
algorithm:
themeragflow === 'dark'
? theme.darkAlgorithm
: theme.defaultAlgorithm,
}}
locale={locale}
>
<App> {children}</App>
</ConfigProvider>
<ReactQueryDevtools buttonPosition={'top-left'} />
</>
);
}
const RootProvider = ({ children }: React.PropsWithChildren) => {
useEffect(() => {
// Because the language is saved in the backend, a token is required to obtain the api. However, the login page cannot obtain the language through the getUserInfo api, so the language needs to be saved in localstorage.
const lng = storage.getLanguage();
if (lng) {
i18n.changeLanguage(lng);
}
}, []);
return (
<TooltipProvider>
<QueryClientProvider client={queryClient}>
<ThemeProvider defaultTheme="light" storageKey="ragflow-ui-theme">
<Root>{children}</Root>
</ThemeProvider>
</QueryClientProvider>
</TooltipProvider>
);
};
export function rootContainer(container: ReactNode) {
return <RootProvider>{container}</RootProvider>;
}
|