feat(i18n): flat-desktop support language switching (#775)

* feat(i18n): add ErrorCode、DeviceCheck * feat(i18n): flat-desktop support language switching * refactor(i18n): Adjust text
netless-io · Jun 29, 2021 · 0e2854c · 0e2854c
1 parent 6e5c84b
commit 0e2854c
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 7 deletions.
diff --git a/desktop/renderer-app/src/pages/UserSettingPage/GeneralSettingPage/index.tsx b/desktop/renderer-app/src/pages/UserSettingPage/GeneralSettingPage/index.tsx
@@ -1,6 +1,7 @@
 import "./style.less";
 
 import { Checkbox, Radio } from "antd";
+import type { CheckboxChangeEvent } from "antd/lib/checkbox";
 import React, { useEffect, useState } from "react";
 import { UserSettingLayoutContainer } from "../UserSettingLayoutContainer";
 import { ipcSyncByApp, ipcAsyncByApp } from "../../../utils/ipc";
@@ -12,7 +13,7 @@ enum SelectLanguage {
 }
 
 export const GeneralSettingPage = (): React.ReactElement => {
-    const { t } = useTranslation();
+    const { t, i18n } = useTranslation();
     const [openAtLogin, setOpenAtLogin] = useState(false);
 
     useEffect(() => {
@@ -32,6 +33,11 @@ export const GeneralSettingPage = (): React.ReactElement => {
         });
     };
 
+    async function changeLanguage(event: CheckboxChangeEvent): Promise<void> {
+        const language: SelectLanguage = event.target.value;
+        await i18n.changeLanguage(language === SelectLanguage.Chinese ? "zh-CN" : "en");
+    }
+
     return (
         <UserSettingLayoutContainer>
             <div className="general-setting-container">
@@ -42,11 +48,16 @@ export const GeneralSettingPage = (): React.ReactElement => {
                 </div>
                 <div className="general-setting-select-language">
                     <span>{t("language-settings")}</span>
-                    <Radio.Group defaultValue={SelectLanguage.Chinese}>
+                    <Radio.Group
+                        defaultValue={
+                            i18n.language === "zh-CN"
+                                ? SelectLanguage.Chinese
+                                : SelectLanguage.English
+                        }
+                        onChange={changeLanguage}
+                    >
                         <Radio value={SelectLanguage.Chinese}>{t("chinese")}</Radio>
-                        <Radio disabled value={SelectLanguage.English}>
-                            English
-                        </Radio>
+                        <Radio value={SelectLanguage.English}>English</Radio>
                     </Radio.Group>
                 </div>
             </div>

diff --git a/packages/flat-i18n/locales/en.json b/packages/flat-i18n/locales/en.json
@@ -60,9 +60,9 @@
   "the-room-has-ended-and-is-about-to-exit": "The room has ended and is about to exit...",
   "you-have-entered-the-room-at-another-device": "You have entered the room at another device",
   "class-picker-text": {
-    "BigClass": "1 teacher for a large number of students",
+    "BigClass": "Large number of students",
     "OneToOne": "1 teacher and 1 student",
-    "SmallClass": "1 teacher for up to 16 students"
+    "SmallClass": "Up to 16 students"
   },
   "class-room-type": {
     "BigClass": "Large Class",