From 552eee31692d9150e429abbc2ec2dff076ed740a Mon Sep 17 00:00:00 2001
From: Tam Nhu Tran <kaitran.ntt@gmail.com>
Date: Tue, 3 Mar 2026 01:22:52 +0700
Subject: [PATCH] fix(i18n): harden unstable dialog and complete cursor locale
 key

---
 .../monitoring/proxy-status-widget.tsx           | 16 +++++++++-------
 ui/src/lib/i18n.ts                               |  2 ++
 ui/tests/unit/ui/i18n/language-switcher.test.tsx | 10 +++-------
 3 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/ui/src/components/monitoring/proxy-status-widget.tsx b/ui/src/components/monitoring/proxy-status-widget.tsx
index 62ed0b7c..6e3c2adc 100644
--- a/ui/src/components/monitoring/proxy-status-widget.tsx
+++ b/ui/src/components/monitoring/proxy-status-widget.tsx
@@ -51,7 +51,7 @@ import {
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
 import { useQuery, useIsMutating } from '@tanstack/react-query';
 import { api, type CliproxyServerConfig } from '@/lib/api-client';
-import { useTranslation } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
 import {
   useProxyStatus,
   useStartProxy,
@@ -545,14 +545,16 @@ export function ProxyStatusWidget() {
                 {t('proxyStatusWidget.installUnstableTitle')}
               </AlertDialogTitle>
               <AlertDialogDescription className="space-y-2">
-                <p
-                  dangerouslySetInnerHTML={{
-                    __html: t('proxyStatusWidget.installUnstableDesc', {
+                <p>
+                  <Trans
+                    i18nKey="proxyStatusWidget.installUnstableDesc"
+                    values={{
                       version: pendingInstallVersion ?? '',
                       maxStable: versionsData?.maxStableVersion || '6.6.80',
-                    }),
-                  }}
-                />
+                    }}
+                    components={{ strong: <strong /> }}
+                  />
+                </p>
                 <p className="text-amber-600 dark:text-amber-400">
                   {t('proxyStatusWidget.installUnstableWarning')}
                 </p>
diff --git a/ui/src/lib/i18n.ts b/ui/src/lib/i18n.ts
index 22eec49a..52fdf832 100644
--- a/ui/src/lib/i18n.ts
+++ b/ui/src/lib/i18n.ts
@@ -965,6 +965,7 @@ const resources = {
         enabled: 'Enabled',
         disabled: 'Disabled',
         expired: 'Expired',
+        connected: 'Connected',
         notConnected: 'Not connected',
         running: 'Running',
         stopped: 'Stopped',
@@ -2055,6 +2056,7 @@ const resources = {
         enabled: '已启用',
         disabled: '已禁用',
         expired: '已过期',
+        connected: '已连接',
         notConnected: '未连接',
         running: '运行中',
         stopped: '已停止',
diff --git a/ui/tests/unit/ui/i18n/language-switcher.test.tsx b/ui/tests/unit/ui/i18n/language-switcher.test.tsx
index e98d75b8..75f375d6 100644
--- a/ui/tests/unit/ui/i18n/language-switcher.test.tsx
+++ b/ui/tests/unit/ui/i18n/language-switcher.test.tsx
@@ -51,10 +51,8 @@ describe('Dashboard i18n', () => {
     await i18n.changeLanguage('en');
   });
 
-  it(
-    'renders language switcher and changes locale',
-    async () => {
-      render(<LanguageSwitcher />);
+  it('renders language switcher and changes locale', async () => {
+    render(<LanguageSwitcher />);
 
     expect(screen.getByRole('combobox')).toBeInTheDocument();
     expect(screen.getByText('English')).toBeInTheDocument();
@@ -66,9 +64,7 @@ describe('Dashboard i18n', () => {
       expect(i18n.language).toBe('zh-CN');
     });
     expect(localStorageMock.setItem).toHaveBeenCalledWith(LOCALE_STORAGE_KEY, 'zh-CN');
-    },
-    10000
-  );
+  }, 10000);
 
   it('restores locale from persisted storage', () => {
     persistLocale('zh-CN');