diff --git a/web/src/App.tsx b/web/src/App.tsx index be3b0b35..e420ffb3 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -83,14 +83,17 @@ export const App: React.FC = React.memo(() => { - - {/* 这个host用于处理其他页面(非main)的modal */} - - - - - - + + + + + + + + + + + {/* NOTICE: Switch里不能出现动态路由 */} {pluginRootRoute.map((r, i) => ( { component={r.component} /> ))} - - - - + + + + ); diff --git a/web/src/components/LanguageSelect.tsx b/web/src/components/LanguageSelect.tsx new file mode 100644 index 00000000..dfee0291 --- /dev/null +++ b/web/src/components/LanguageSelect.tsx @@ -0,0 +1,31 @@ +import { Select } from 'antd'; +import React, { useCallback } from 'react'; +import { showToasts, t, useLanguage } from 'tailchat-shared'; + +/** + * 语言切换选择框 + */ +export const LanguageSelect: React.FC = React.memo(() => { + const { language, setLanguage } = useLanguage(); + + const handleChangeLanguage = useCallback( + (newLang: string) => { + showToasts(t('刷新页面后生效'), 'info'); + setLanguage(newLang); + }, + [setLanguage] + ); + + return ( + + ); +}); +LanguageSelect.displayName = 'LanguageSelect'; diff --git a/web/src/components/modals/SettingsView/System.tsx b/web/src/components/modals/SettingsView/System.tsx index f158bbdc..82a30383 100644 --- a/web/src/components/modals/SettingsView/System.tsx +++ b/web/src/components/modals/SettingsView/System.tsx @@ -1,17 +1,11 @@ import { FullModalField } from '@/components/FullModal/Field'; +import { LanguageSelect } from '@/components/LanguageSelect'; import { pluginColorScheme } from '@/plugin/common'; import { Select, Switch } from 'antd'; -import React, { useCallback } from 'react'; -import { - showToasts, - t, - useColorScheme, - useSingleUserSetting, -} from 'tailchat-shared'; -import { useLanguage } from 'tailchat-shared'; +import React from 'react'; +import { t, useColorScheme, useSingleUserSetting } from 'tailchat-shared'; export const SettingsSystem: React.FC = React.memo(() => { - const { language, setLanguage } = useLanguage(); const { colorScheme, setColorScheme } = useColorScheme(); const { value: messageListVirtualization, @@ -19,30 +13,9 @@ export const SettingsSystem: React.FC = React.memo(() => { loading, } = useSingleUserSetting('messageListVirtualization', false); - const handleChangeLanguage = useCallback( - (newLang: string) => { - showToasts(t('刷新页面后生效'), 'info'); - setLanguage(newLang); - }, - [setLanguage] - ); - return (
- - 简体中文 - English - - } - /> + } />