fix: address CodeRabbit review feedback

- Complete tab context menu localization (rename, copy ID, flag tab,
  backgrounds, close tab, flag colors)
- Fix 'Ok' → 'OK' capitalization in en.json
- Auto-detect system language instead of hardcoding zh-CN
- Persist language preference to localStorage
- Support language switching via i18n.changeLanguage()

Author: jiaminghua

frontend/app/i18n/index.ts

@@ -4,24 +4,42 @@ import { initReactI18next } from "react-i18next";
 import en from "./locales/en.json";
 import zhCN from "./locales/zh-CN.json";
 
+// Detect system language and map to supported locale
+function detectLanguage(): string {
+    const sysLang = navigator.language || "en";
+    if (sysLang.startsWith("zh")) {
+        return "zh-CN";
+    }
+    return "en";
+}
+
+// Allow override via localStorage
+const savedLang = localStorage.getItem("wave:language");
+const initialLang = savedLang || detectLanguage();
+
 i18n.use(initReactI18next).init({
   resources: {
     en: { translation: en },
     "zh-CN": { translation: zhCN },
   },
-  lng: "zh-CN", // default language
+  lng: initialLang,
   fallbackLng: "en",
   interpolation: {
     escapeValue: false,
   },
 });
 
+// Save language preference on change
+i18n.on("languageChanged", (lng: string) => {
+    localStorage.setItem("wave:language", lng);
+});
+
 export default i18n;
 
 // Expose a global t function for use in non-React contexts (e.g. event handlers, menus)
 declare global {
     interface Window {
-        __waveI18n: { t: typeof i18n.t };
+        __waveI18n: { t: typeof i18n.t; changeLanguage: typeof i18n.changeLanguage };
     }
 }
-window.__waveI18n = { t: i18n.t.bind(i18n) };
+window.__waveI18n = { t: i18n.t.bind(i18n), changeLanguage: i18n.changeLanguage.bind(i18n) };

frontend/app/i18n/locales/en.json

@@ -53,7 +53,7 @@
     "app.keybindings": "Keybindings",
     "app.errorRenderingViewHeader": "Error Rendering View Header: {{error}}",
     "app.cancel": "Cancel",
-    "app.ok": "Ok",
+    "app.ok": "OK",
     "app.aboutDescription": "Open-Source AI-Integrated Terminal",
     "app.aboutTagline": "Built for Seamless Workflows",
     "app.clientVersion": "Client Version",

frontend/app/tab/tabcontextmenu.ts

@@ -47,9 +47,9 @@ export function buildTabContextMenu(
 ): ContextMenuItem[] {
     const menu: ContextMenuItem[] = [];
     menu.push(
-        { label: "Rename Tab", click: () => renameRef.current?.() },
+        { label: t("app.renameTab"), click: () => renameRef.current?.() },
         {
-            label: "Copy TabId",
+            label: t("app.copyTabId"),
             click: () => fireAndForget(() => navigator.clipboard.writeText(id)),
         },
         { type: "separator" }
@@ -58,7 +58,7 @@ export function buildTabContextMenu(
     const currentFlagColor = globalStore.get(getOrefMetaKeyAtom(tabORef, "tab:flagcolor")) ?? null;
     const flagSubmenu: ContextMenuItem[] = [
         {
-            label: "None",
+            label: t("app.none"),
             type: "checkbox",
             checked: currentFlagColor == null,
             click: () =>
@@ -67,7 +67,7 @@ export function buildTabContextMenu(
                 ),
         },
         ...FlagColors.map((fc) => ({
-            label: fc.label,
+            label: t("app." + fc.label.toLowerCase()),
             type: "checkbox" as const,
             checked: currentFlagColor === fc.value,
             click: () =>
@@ -76,7 +76,7 @@ export function buildTabContextMenu(
                 ),
         })),
     ];
-    menu.push({ label: "Flag Tab", type: "submenu", submenu: flagSubmenu }, { type: "separator" });
+    menu.push({ label: t("app.flagTab"), type: "submenu", submenu: flagSubmenu }, { type: "separator" });
     const fullConfig = globalStore.get(env.atoms.fullConfigAtom);
     const backgrounds = fullConfig?.backgrounds ?? {};
     const bgKeys = Object.keys(backgrounds).filter((k) => backgrounds[k] != null);
@@ -89,7 +89,7 @@ export function buildTabContextMenu(
         const submenu: ContextMenuItem[] = [];
         const oref = makeORef("tab", id);
         submenu.push({
-            label: "Default",
+            label: t("app.default"),
             click: () =>
                 fireAndForget(async () => {
                     await env.rpc.SetMetaCommand(TabRpcClient, {
@@ -115,9 +115,9 @@ export function buildTabContextMenu(
                     }),
             });
         }
-        menu.push({ label: "Backgrounds", type: "submenu", submenu }, { type: "separator" });
+        menu.push({ label: t("app.backgrounds"), type: "submenu", submenu }, { type: "separator" });
     }
     menu.push(...buildTabBarContextMenu(env), { type: "separator" });
-    menu.push({ label: "Close Tab", click: () => onClose(null) });
+    menu.push({ label: t("app.closeTab"), click: () => onClose(null) });
     return menu;
 }