Skip to content

feat: add i18n infrastructure with Chinese (简体中文) language support#441

Open
WanderLandWalker wants to merge 14 commits into
browser-use:mainfrom
WanderLandWalker:main
Open

feat: add i18n infrastructure with Chinese (简体中文) language support#441
WanderLandWalker wants to merge 14 commits into
browser-use:mainfrom
WanderLandWalker:main

Conversation

@WanderLandWalker
Copy link
Copy Markdown

@WanderLandWalker WanderLandWalker commented May 26, 2026

Summary

Add full i18n (internationalization) infrastructure with built-in Chinese (简体中文) and English language support.

Changes

i18n Infrastructure

  • Initialize i18next + react-i18next with key = fallback pattern (English text = translation key)
  • All 5 renderer entry points (hub/, onboarding/, pill/, popup/, logs/) wrapped with <I18nextProvider>
  • Language preference persisted in localStorage

Locale Files

  • app/src/renderer/locales/en.json — 433 English source strings
  • app/src/renderer/locales/zh.json — 433 Chinese (simplified) translations

Components Translated

All core UI components covered: SettingsPane, Sidebar, Dashboard, AgentPane, HubApp, OnboardingApp, ConnectionsPane, KeybindingsOverlay, CommandBar, TaskInput, Navbar, MemoryIndicator, Pill, LogsApp, Toast, EnginePicker, etc.

Chat modules: ChatPane, ChatTurn, ToolBlock, ChatTranscript, BrowserPreview, TerminalSpinner, CodeBlock, AskForm, OptionList

Tool labels & spinner presets: toolLabels.ts (~130 tool verb phrases), spinnerVerbs.ts (7 presets)

Settings UI

  • Language dropdown added to Settings → Language (English / 简体中文)

Documentation

  • README.md — added bilingual sections (English + Chinese)
  • CONTRIBUTING.md — added bilingual i18n guide for translators

How to Test

  1. Launch the app
  2. Go to Settings → Language
  3. Switch to 简体中文
  4. All UI strings should display in Chinese

Notes

  • Missing keys fall back gracefully to English (key = fallback)
  • To add a new locale: create {locale}.json, add all keys from en.json, add option in SettingsPane.tsx

Summary by cubic

Adds full i18n across the app with English and Simplified Chinese (简体中文), plus a language switcher in Settings. All UI text and aria labels load from locale files with an English-as-key fallback.

  • New Features

    • Integrated i18next + react-i18next; added en.json and zh.json (726 strings) and wrapped renderer roots (hub/, onboarding/, pill/, popup/, logs/) in I18nextProvider.
    • Added Settings → Language with preference saved in localStorage.
    • Localized core UI and chat modules, tool labels, and spinner presets; added README.zh.md and CONTRIBUTING.zh.md with doc language switchers.
  • Bug Fixes

    • Configured custom interpolation (prefix $) and moved runtime-only translations to render-time; preserved required English literals for backend string comparisons.
    • Localized empty/error states, titles, and aria labels across components; re-applied i18n in OptionList after upstream merge.
    • Wrapped remaining CookieBrowser.tsx header strings and toast messages in i18n; added cookie sync descriptions to locale files.
    • Localized relative time strings in CookieBrowser.tsx (e.g., “just now”, “5m ago”).

Written for commit 4ba5d97. Summary will update on new commits. Review in cubic

- Initialize i18next + react-i18next with key=fallback pattern
- Add en.json (English source) and zh.json (Chinese translations)
- Wrap all 5 renderer entry points with I18nextProvider
- Translate all core UI components (Settings, Sidebar, Dashboard,
  AgentPane, Onboarding, Connections, Pill, Logs, etc.)
- Translate chat modules (ChatPane, ChatTurn, ToolBlock, AskForm, etc.)
- Translate tool labels and spinner verb presets
- Add language switcher in Settings → Language
- Update README with i18n badge and documentation
- Update CONTRIBUTING with i18n contribution guide
- Language preference persisted in localStorage
- Add README.zh.md with full Chinese translation
- Add CONTRIBUTING.zh.md with full Chinese contribution guide
- Add language switcher at top of all 4 doc files
- Clean up inline bilingual sections from English docs
Copy link
Copy Markdown

@cubic-dev-ai cubic-dev-ai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

8 issues found across 47 files

Tip: instead of fixing issues one by one fix them all with cubic

Re-trigger cubic

Comment thread app/src/renderer/hub/HubApp.tsx Outdated
Comment thread app/src/renderer/hub/SettingsPane.tsx
Comment thread app/src/renderer/onboarding/DomainList.tsx Outdated
Comment thread app/src/renderer/hub/chat/spinnerVerbs.ts Outdated
Comment thread app/src/renderer/shared/CookieBrowser.tsx
Comment thread app/src/renderer/locales/zh.json
Comment thread app/src/renderer/onboarding/OnboardingApp.tsx Outdated
Comment thread CONTRIBUTING.md Outdated
- Configure i18next custom interpolation (prefix: '$') so /
  placeholders resolve correctly with { '1': val, '2': val } syntax
- Fix HubApp.tsx: use original English string for resume prompt
  (backend does string comparison)
- Fix DomainList.tsx: put count inside single t() call
- Fix OnboardingApp.tsx: use <Trans> for sentence with <strong>
- Fix SettingsPane.tsx: translate spinner labels at render time
  (not module-load time)
- Fix spinnerVerbs.ts: revert module-level i18n.t() calls
- Add shortcutDesc locale key for Trans component
# Conflicts:
#	app/src/renderer/hub/chat-v2/AskForm.tsx
#	app/src/renderer/hub/chat-v2/OptionList.tsx
Copy link
Copy Markdown

@cubic-dev-ai cubic-dev-ai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1 issue found across 3 files (changes from recent commits).

Tip: Review your code locally with the cubic CLI to iterate faster.

Fix all with cubic | Re-trigger cubic

Comment thread app/src/renderer/shared/CookieBrowser.tsx
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant