Fix translation issues in agent status bar

All-Hands-AI · Jan 6, 2025 · dff8d97 · dff8d97
1 parent 9515ac5
commit dff8d97
Show file tree

Hide file tree

Showing 10 changed files with 340 additions and 32 deletions.
diff --git a/frontend/__tests__/components/chat/chat-suggestions.test.tsx b/frontend/__tests__/components/chat/chat-suggestions.test.tsx
@@ -0,0 +1,14 @@
+import { describe, expect, it, vi } from "vitest";
+import { screen } from "@testing-library/react";
+import { renderWithProviders } from "../../../test-utils";
+import { ChatSuggestions } from "#/components/features/chat/chat-suggestions";
+
+describe("ChatSuggestions", () => {
+  it("should display translated 'Let's start building!' text", () => {
+    const mockOnClick = vi.fn();
+    renderWithProviders(<ChatSuggestions onSuggestionsClick={mockOnClick} />);
+
+    // This will fail if the translation is missing or not properly set up
+    expect(screen.getByText("Let's start building!")).toBeInTheDocument();
+  });
+});
diff --git a/frontend/__tests__/components/context-menu/account-settings-context-menu.test.tsx b/frontend/__tests__/components/context-menu/account-settings-context-menu.test.tsx
@@ -28,8 +28,8 @@ describe("AccountSettingsContextMenu", () => {
     expect(
       screen.getByTestId("account-settings-context-menu"),
     ).toBeInTheDocument();
-    expect(screen.getByText("ACCOUNT_SETTINGS$SETTINGS")).toBeInTheDocument();
-    expect(screen.getByText("ACCOUNT_SETTINGS$LOGOUT")).toBeInTheDocument();
+    expect(screen.getByText("Account Settings")).toBeInTheDocument();
+    expect(screen.getByText("Logout")).toBeInTheDocument();
   });
 
   it("should call onClickAccountSettings when the account settings option is clicked", async () => {
@@ -42,7 +42,7 @@ describe("AccountSettingsContextMenu", () => {
       />,
     );
 
-    const accountSettingsOption = screen.getByText("ACCOUNT_SETTINGS$SETTINGS");
+    const accountSettingsOption = screen.getByText("Account Settings");
     await user.click(accountSettingsOption);
 
     expect(onClickAccountSettingsMock).toHaveBeenCalledOnce();
@@ -58,7 +58,7 @@ describe("AccountSettingsContextMenu", () => {
       />,
     );
 
-    const logoutOption = screen.getByText("ACCOUNT_SETTINGS$LOGOUT");
+    const logoutOption = screen.getByText("Logout");
     await user.click(logoutOption);
 
     expect(onLogoutMock).toHaveBeenCalledOnce();
@@ -74,7 +74,7 @@ describe("AccountSettingsContextMenu", () => {
       />,
     );
 
-    const logoutOption = screen.getByText("ACCOUNT_SETTINGS$LOGOUT");
+    const logoutOption = screen.getByText("Logout");
     await user.click(logoutOption);
 
     expect(onLogoutMock).not.toHaveBeenCalled();
@@ -90,7 +90,7 @@ describe("AccountSettingsContextMenu", () => {
       />,
     );
 
-    const accountSettingsButton = screen.getByText("ACCOUNT_SETTINGS$SETTINGS");
+    const accountSettingsButton = screen.getByText("Account Settings");
     await user.click(accountSettingsButton);
     await user.click(document.body);
 

diff --git a/frontend/__tests__/components/user-actions.test.tsx b/frontend/__tests__/components/user-actions.test.tsx
@@ -58,7 +58,7 @@ describe("UserActions", () => {
     const userAvatar = screen.getByTestId("user-avatar");
     await user.click(userAvatar);
 
-    const accountSettingsOption = screen.getByText("ACCOUNT_SETTINGS$SETTINGS");
+    const accountSettingsOption = screen.getByText("Account Settings");
     await user.click(accountSettingsOption);
 
     expect(onClickAccountSettingsMock).toHaveBeenCalledOnce();
@@ -79,7 +79,7 @@ describe("UserActions", () => {
     const userAvatar = screen.getByTestId("user-avatar");
     await user.click(userAvatar);
 
-    const logoutOption = screen.getByText("ACCOUNT_SETTINGS$LOGOUT");
+    const logoutOption = screen.getByText("Logout");
     await user.click(logoutOption);
 
     expect(onLogoutMock).toHaveBeenCalledOnce();
@@ -99,7 +99,7 @@ describe("UserActions", () => {
     const userAvatar = screen.getByTestId("user-avatar");
     await user.click(userAvatar);
 
-    const logoutOption = screen.getByText("ACCOUNT_SETTINGS$LOGOUT");
+    const logoutOption = screen.getByText("Logout");
     await user.click(logoutOption);
 
     expect(onLogoutMock).not.toHaveBeenCalled();

diff --git a/frontend/src/components/features/chat/chat-suggestions.tsx b/frontend/src/components/features/chat/chat-suggestions.tsx
@@ -1,3 +1,4 @@
+import { useTranslation } from "react-i18next";
 import { Suggestions } from "#/components/features/suggestions/suggestions";
 import BuildIt from "#/icons/build-it.svg?react";
 import { SUGGESTIONS } from "#/utils/suggestions";
@@ -7,12 +8,13 @@ interface ChatSuggestionsProps {
 }
 
 export function ChatSuggestions({ onSuggestionsClick }: ChatSuggestionsProps) {
+  const { t } = useTranslation();
   return (
     <div className="flex flex-col gap-6 h-full px-4 items-center justify-center">
       <div className="flex flex-col items-center p-4 bg-neutral-700 rounded-xl w-full">
         <BuildIt width={45} height={54} />
         <span className="font-semibold text-[20px] leading-6 -tracking-[0.01em] gap-1">
-          Let&apos;s start building!
+          {t("CHAT$LETS_START_BUILDING")}
         </span>
       </div>
       <Suggestions

diff --git a/frontend/src/components/features/controls/agent-status-bar.tsx b/frontend/src/components/features/controls/agent-status-bar.tsx
@@ -46,7 +46,7 @@ export function AgentStatusBar() {
         <div
           className={`w-2 h-2 rounded-full animate-pulse ${AGENT_STATUS_MAP[curAgentState].indicator}`}
         />
-        <span className="text-sm text-stone-400">{t(statusMessage)}</span>
+        <span className="text-sm text-stone-400">{statusMessage}</span>
       </div>
     </div>
   );

diff --git a/frontend/src/context/conversation-context.tsx b/frontend/src/context/conversation-context.tsx
@@ -24,7 +24,11 @@ export function ConversationProvider({
 
   const value = useMemo(() => ({ conversationId }), [conversationId]);
 
-  return <ConversationContext value={value}>{children}</ConversationContext>;
+  return (
+    <ConversationContext.Provider value={value}>
+      {children}
+    </ConversationContext.Provider>
+  );
 }
 
 export function useConversation() {

diff --git a/frontend/src/i18n/translation.json b/frontend/src/i18n/translation.json
@@ -1,4 +1,212 @@
 {
+  "ACCOUNT_SETTINGS$SETTINGS": {
+    "en": "Account Settings",
+    "zh-CN": "账户设置",
+    "de": "Kontoeinstellungen",
+    "ko-KR": "계정 설정",
+    "no": "Kontoinnstillinger",
+    "zh-TW": "帳戶設定",
+    "ar": "إعدادات الحساب",
+    "fr": "Paramètres du compte",
+    "it": "Impostazioni account",
+    "pt": "Configurações da conta",
+    "es": "Ajustes de cuenta"
+  },
+  "BROWSER$EMPTY_MESSAGE": {
+    "en": "No browser content to display",
+    "zh-CN": "没有浏览器内容可显示",
+    "de": "Keine Browser-Inhalte zum Anzeigen",
+    "ko-KR": "표시할 브라우저 내용이 없습니다",
+    "no": "Ingen nettleserinnhold å vise",
+    "zh-TW": "沒有瀏覽器內容可顯示",
+    "ar": "لا يوجد محتوى متصفح للعرض",
+    "fr": "Aucun contenu de navigateur à afficher",
+    "it": "Nessun contenuto del browser da visualizzare",
+    "pt": "Nenhum conteúdo do navegador para exibir",
+    "es": "No hay contenido del navegador para mostrar"
+  },
+  "CHAT_INTERFACE$AGENT_INIT_MESSAGE": {
+    "en": "Agent is initializing...",
+    "zh-CN": "代理正在初始化...",
+    "de": "Agent wird initialisiert...",
+    "ko-KR": "에이전트 초기화 중...",
+    "no": "Agent initialiseres...",
+    "zh-TW": "代理正在初始化...",
+    "ar": "جاري تهيئة الوكيل...",
+    "fr": "L'agent est en cours d'initialisation...",
+    "it": "L'agente si sta inizializzando...",
+    "pt": "O agente está inicializando...",
+    "es": "El agente se está inicializando..."
+  },
+  "CHAT_INTERFACE$AGENT_RUNNING_MESSAGE": {
+    "en": "Agent is running...",
+    "zh-CN": "代理正在运行...",
+    "de": "Agent läuft...",
+    "ko-KR": "에이전트 실행 중...",
+    "no": "Agent kjører...",
+    "zh-TW": "代理正在運行...",
+    "ar": "الوكيل قيد التشغيل...",
+    "fr": "L'agent est en cours d'exécution...",
+    "it": "L'agente è in esecuzione...",
+    "pt": "O agente está em execução...",
+    "es": "El agente está en ejecución..."
+  },
+  "CHAT_INTERFACE$AGENT_AWAITING_USER_INPUT_MESSAGE": {
+    "en": "Waiting for user input...",
+    "zh-CN": "等待用户输入...",
+    "de": "Warte auf Benutzereingabe...",
+    "ko-KR": "사용자 입력 대기 중...",
+    "no": "Venter på brukerinndata...",
+    "zh-TW": "等待使用者輸入...",
+    "ar": "في انتظار إدخال المستخدم...",
+    "fr": "En attente de la saisie de l'utilisateur...",
+    "it": "In attesa dell'input dell'utente...",
+    "pt": "Aguardando entrada do usuário...",
+    "es": "Esperando entrada del usuario..."
+  },
+  "CHAT_INTERFACE$AGENT_PAUSED_MESSAGE": {
+    "en": "Agent is paused",
+    "zh-CN": "代理已暂停",
+    "de": "Agent ist pausiert",
+    "ko-KR": "에이전트가 일시 중지됨",
+    "no": "Agent er pauset",
+    "zh-TW": "代理已暫停",
+    "ar": "الوكيل متوقف مؤقتاً",
+    "fr": "L'agent est en pause",
+    "it": "L'agente è in pausa",
+    "pt": "O agente está pausado",
+    "es": "El agente está pausado"
+  },
+  "CHAT_INTERFACE$INITIALIZING_AGENT_LOADING_MESSAGE": {
+    "en": "Loading...",
+    "zh-CN": "加载中...",
+    "de": "Lädt...",
+    "ko-KR": "로딩 중...",
+    "no": "Laster...",
+    "zh-TW": "載入中...",
+    "ar": "جاري التحميل...",
+    "fr": "Chargement...",
+    "it": "Caricamento...",
+    "pt": "Carregando...",
+    "es": "Cargando..."
+  },
+  "CHAT_INTERFACE$AGENT_STOPPED_MESSAGE": {
+    "en": "Agent has stopped",
+    "zh-CN": "代理已停止",
+    "de": "Agent wurde gestoppt",
+    "ko-KR": "에이전트가 중지됨",
+    "no": "Agent har stoppet",
+    "zh-TW": "代理已停止",
+    "ar": "توقف الوكيل",
+    "fr": "L'agent s'est arrêté",
+    "it": "L'agente si è fermato",
+    "pt": "O agente parou",
+    "es": "El agente se ha detenido"
+  },
+  "CHAT_INTERFACE$AGENT_FINISHED_MESSAGE": {
+    "en": "Agent has finished",
+    "zh-CN": "代理已完成",
+    "de": "Agent ist fertig",
+    "ko-KR": "에이전트가 완료됨",
+    "no": "Agent er ferdig",
+    "zh-TW": "代理已完成",
+    "ar": "انتهى الوكيل",
+    "fr": "L'agent a terminé",
+    "it": "L'agente ha terminato",
+    "pt": "O agente terminou",
+    "es": "El agente ha terminado"
+  },
+  "CHAT_INTERFACE$AGENT_REJECTED_MESSAGE": {
+    "en": "Agent was rejected",
+    "zh-CN": "代理被拒绝",
+    "de": "Agent wurde abgelehnt",
+    "ko-KR": "에이전트가 거부됨",
+    "no": "Agent ble avvist",
+    "zh-TW": "代理被拒絕",
+    "ar": "تم رفض الوكيل",
+    "fr": "L'agent a été rejeté",
+    "it": "L'agente è stato rifiutato",
+    "pt": "O agente foi rejeitado",
+    "es": "El agente fue rechazado"
+  },
+  "CHAT_INTERFACE$AGENT_ERROR_MESSAGE": {
+    "en": "An error occurred",
+    "zh-CN": "发生错误",
+    "de": "Ein Fehler ist aufgetreten",
+    "ko-KR": "오류가 발생했습니다",
+    "no": "En feil oppstod",
+    "zh-TW": "發生錯誤",
+    "ar": "حدث خطأ",
+    "fr": "Une erreur s'est produite",
+    "it": "Si è verificato un errore",
+    "pt": "Ocorreu um erro",
+    "es": "Se produjo un error"
+  },
+  "CHAT_INTERFACE$AGENT_AWAITING_USER_CONFIRMATION_MESSAGE": {
+    "en": "Waiting for user confirmation...",
+    "zh-CN": "等待用户确认...",
+    "de": "Warte auf Benutzerbestätigung...",
+    "ko-KR": "사용자 확인 대기 중...",
+    "no": "Venter på brukerbekreftelse...",
+    "zh-TW": "等待使用者確認...",
+    "ar": "في انتظار تأكيد المستخدم...",
+    "fr": "En attente de la confirmation de l'utilisateur...",
+    "it": "In attesa della conferma dell'utente...",
+    "pt": "Aguardando confirmação do usuário...",
+    "es": "Esperando confirmación del usuario..."
+  },
+  "CHAT_INTERFACE$AGENT_ACTION_USER_CONFIRMED_MESSAGE": {
+    "en": "User confirmed",
+    "zh-CN": "用户已确认",
+    "de": "Benutzer hat bestätigt",
+    "ko-KR": "사용자가 확인함",
+    "no": "Bruker bekreftet",
+    "zh-TW": "使用者已確認",
+    "ar": "تم تأكيد المستخدم",
+    "fr": "Utilisateur confirmé",
+    "it": "Utente confermato",
+    "pt": "Usuário confirmou",
+    "es": "Usuario confirmado"
+  },
+  "CHAT_INTERFACE$AGENT_ACTION_USER_REJECTED_MESSAGE": {
+    "en": "User rejected",
+    "zh-CN": "用户已拒绝",
+    "de": "Benutzer hat abgelehnt",
+    "ko-KR": "사용자가 거부함",
+    "no": "Bruker avvist",
+    "zh-TW": "使用者已拒絕",
+    "ar": "تم رفض المستخدم",
+    "fr": "Utilisateur rejeté",
+    "it": "Utente rifiutato",
+    "pt": "Usuário rejeitou",
+    "es": "Usuario rechazado"
+  },
+  "CHAT_INTERFACE$AGENT_RATE_LIMITED_MESSAGE": {
+    "en": "Rate limited, please wait...",
+    "zh-CN": "已达到速率限制，请稍候...",
+    "de": "Rate limitiert, bitte warten...",
+    "ko-KR": "속도 제한됨, 기다려 주세요...",
+    "no": "Frekvensbegrenset, vennligst vent...",
+    "zh-TW": "已達到速率限制，請稍候...",
+    "ar": "تم تقييد المعدل، يرجى الانتظار...",
+    "fr": "Taux limité, veuillez patienter...",
+    "it": "Limite di velocità raggiunto, attendere prego...",
+    "pt": "Taxa limitada, por favor aguarde...",
+    "es": "Límite de velocidad alcanzado, por favor espere..."
+  },
+  "CHAT$LETS_START_BUILDING": {
+    "en": "Let's start building!",
+    "zh-CN": "让我们开始构建！",
+    "de": "Lass uns anfangen zu bauen!",
+    "ko-KR": "시작해 봅시다!",
+    "no": "La oss begynne å bygge!",
+    "zh-TW": "讓我們開始構建！",
+    "ar": "دعنا نبدأ البناء!",
+    "fr": "Commençons à construire !",
+    "it": "Iniziamo a costruire!",
+    "pt": "Vamos começar a construir!",
+    "es": "¡Empecemos a construir!"
+  },
   "WORKSPACE$TITLE": {
     "en": "OpenHands Workspace",
     "zh-CN": "OpenHands 工作区",
@@ -2035,13 +2243,30 @@
     "en": "Pause the current task"
   },
   "BROWSER$SCREENSHOT_ALT": {
-    "en": "Browser Screenshot"
-  },
-  "ACCOUNT_SETTINGS$SETTINGS": {
-    "en": "Account Settings"
+    "en": "Browser Screenshot",
+    "zh-CN": "浏览器截图",
+    "de": "Browser-Screenshot",
+    "ko-KR": "브라우저 스크린샷",
+    "no": "Nettleser skjermbilde",
+    "zh-TW": "瀏覽器截圖",
+    "ar": "لقطة شاشة المتصفح",
+    "fr": "Capture d'écran du navigateur",
+    "it": "Screenshot del browser",
+    "pt": "Captura de tela do navegador",
+    "es": "Captura de pantalla del navegador"
   },
   "ACCOUNT_SETTINGS$LOGOUT": {
-    "en": "Logout"
+    "en": "Logout",
+    "zh-CN": "退出登录",
+    "de": "Abmelden",
+    "ko-KR": "로그아웃",
+    "no": "Logg ut",
+    "zh-TW": "登出",
+    "ar": "تسجيل الخروج",
+    "fr": "Déconnexion",
+    "it": "Disconnetti",
+    "pt": "Sair",
+    "es": "Cerrar sesión"
   },
   "ERROR_TOAST$CLOSE_BUTTON_LABEL": {
     "en": "Close"
-Original file line number
+Diff line change
@@ Expand Up / @@ -46,7 +46,7 @@ export function AgentStatusBar() { @@
             <div
               className={`w-2 h-2 rounded-full animate-pulse ${AGENT_STATUS_MAP[curAgentState].indicator}`}
             />
-            <span className="text-sm text-stone-400">{t(statusMessage)}</span>
+            <span className="text-sm text-stone-400">{statusMessage}</span>
           </div>
         </div>
       );
@@ Expand Down @@