feat: 增加系统语言切换

shared/i18n/langs/en-US/translation.json

@@ -2,6 +2,7 @@
   "k10c018fe": "Teamwork",
   "k162e37f1": "Plugin is successfully uninstalled, and it needs to be restarted to take effect",
   "k1704ea49": "Install",
+  "k1885734a": "Effective after refreshing the page",
   "k18c716ce": "Password cannot be less than 6 digits",
   "k19885be1": "Panel name is too long",
   "k1b38bb5c": "Register Now",
@@ -24,6 +25,7 @@
   "k3c7c48f8": "Invite not found",
   "k3e514bd0": "Panel name cannot be empty",
   "k3f3597fc": "All",
+  "k3fe97dcc": "System settings",
   "k419da0ef": "Message explanation",
   "k424be044": "This invite expired in <2>{{date}}</2>",
   "k42a44318": "Joined",
@@ -66,6 +68,7 @@
   "k979fc780": "Unable to join the room, you will not be able to get the latest information, please refresh the page and try again",
   "k9bb01902": "Show Detail",
   "k9d901c20": "Meeting room",
+  "ka01a00eb": "System language",
   "ka0451c97": "Cancel",
   "ka14986f0": "Plugin install successed, need to be restarted to take effect",
   "ka2c48894": "Customize your group",

shared/i18n/langs/zh-CN/translation.json

@@ -2,6 +2,7 @@
   "k10c018fe": "工作协同",
   "k162e37f1": "插件卸载成功, 需要重启后生效",
   "k1704ea49": "安装",
+  "k1885734a": "刷新页面后生效",
   "k18c716ce": "密码不能低于6位",
   "k19885be1": "面板名过长",
   "k1b38bb5c": "立即注册",
@@ -24,6 +25,7 @@
   "k3c7c48f8": "找不到邀请信息",
   "k3e514bd0": "面板名不能为空",
   "k3f3597fc": "全员",
+  "k3fe97dcc": "系统设置",
   "k419da0ef": "消息解释",
   "k424be044": "该邀请将于 <2>{{date}}</2> 过期",
   "k42a44318": "已加入",
@@ -66,6 +68,7 @@
   "k979fc780": "无法加入房间, 您将无法获取到最新的信息, 请刷新页面后重试",
   "k9bb01902": "显示详情",
   "k9d901c20": "会议室",
+  "ka01a00eb": "系统语言",
   "ka0451c97": "取消",
   "ka14986f0": "插件安装成功, 需要重启后生效",
   "ka2c48894": "自定义你的群组",

shared/index.tsx

@@ -36,6 +36,7 @@ export { TcProvider } from './components/Provider';
 // i18n
 export { t, setLanguage, useTranslation } from './i18n';
 export { Trans } from './i18n/Trans';
+export { useLanguage } from './i18n/language';
 
 // hooks
 export { useAsync } from './hooks/useAsync';

web/src/components/modals/SettingsView/System.tsx

@@ -0,0 +1,37 @@
+import { FullModalField } from '@/components/FullModal/Field';
+import { Select } from 'antd';
+import React, { useCallback } from 'react';
+import { showToasts, t } from 'tailchat-shared';
+import { useLanguage } from 'tailchat-shared';
+
+export const SettingsSystem: React.FC = React.memo(() => {
+  const { language, setLanguage } = useLanguage();
+
+  const handleChangeLanguage = useCallback(
+    (newLang: string) => {
+      showToasts(t('刷新页面后生效'), 'info');
+      setLanguage(newLang);
+    },
+    [setLanguage]
+  );
+
+  return (
+    <div>
+      <FullModalField
+        title={t('系统语言')}
+        content={
+          <Select
+            style={{ width: 300 }}
+            size="large"
+            value={language}
+            onChange={handleChangeLanguage}
+          >
+            <Select.Option value="zh-CN">简体中文</Select.Option>
+            <Select.Option value="en-US">English</Select.Option>
+          </Select>
+        }
+      />
+    </div>
+  );
+});
+SettingsSystem.displayName = 'SettingsSystem';

web/src/components/modals/SettingsView/index.tsx

@@ -5,6 +5,7 @@ import { t } from 'tailchat-shared';
 import { SettingsAbout } from './About';
 import { SettingsAccount } from './Account';
 import { SettingsStatus } from './Status';
+import { SettingsSystem } from './System';
 
 interface SettingsViewProps {
   onClose: () => void;
@@ -30,6 +31,11 @@ export const SettingsView: React.FC<SettingsViewProps> = React.memo((props) => {
             title: t('账户信息'),
             content: <SettingsAccount />,
           },
+          {
+            type: 'item',
+            title: t('系统设置'),
+            content: <SettingsSystem />,
+          },
           {
             type: 'item',
             title: t('服务状态'),