feat: Add Vietnamese language support

[chokiproai]

Summary by CodeRabbit

• New Features
  • Vietnamese language is now available as a selectable option in the language selector dropdown.
  • The application interface can be displayed entirely in Vietnamese with full localization support.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

The pull request adds Vietnamese language support to the application by introducing a new Vietnamese language option in the LanguageSelector component and registering the corresponding Vietnamese translations in the i18n configuration.

Changes

Cohort / File(s)	Summary
Language selector UI web/src/components/layout/headerbar/LanguageSelector.jsx	Adds a new Vietnamese language option to the dropdown, importing the VN flag from country-flag-icons and creating a Dropdown.Item with 'vi' locale, matching the existing language item structure and styling
i18n configuration web/src/i18n/i18n.js	Imports Vietnamese translation file (vi.json) and registers it in the i18n resources configuration under the 'vi' locale key

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

• Both changes follow established patterns in the codebase with straightforward imports and configurations
• The LanguageSelector modification mirrors existing language option structure with minimal logic
• No complex interactions or conditional logic to evaluate

Possibly related PRs

• feat(language): add Japanese language support #2131: Modifies the same files (LanguageSelector.jsx and i18n.js) to add a new language option and register its translations in an identical manner.

Poem

🐰 A language flows, Vietnamese so fine,
Through selectors and configs, it now aligns,
From Hanoi's heart to code so grand,
Another tongue in our digital land! 🌏

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'feat: Add Vietnamese language support' is clear, specific, and directly relates to the main changes which add Vietnamese (vi) language option to the LanguageSelector and register Vietnamese translations in i18n.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

• Provide your own instructions using the high_level_summary_instructions setting.
• Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
• Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
4. 📊 Contributor Summary — Include a Markdown table showing contributions:
   | Contributor | Lines Added | Lines Removed | Files Changed |
5. ✔️ Additional Notes — Add any extra reviewer context.
   Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (2)

web/src/components/layout/headerbar/LanguageSelector.jsx (2)

23-59: Update the JP inline comment to reflect current implementation

The comment about the Japanese flag using an emoji fallback and JP not being exported is now outdated since the component imports and renders <JP />. Consider updating or removing that comment to avoid confusion.

---

31-31: Vietnamese option is correctly wired; consider refreshing the sorting comment

The new Vietnamese dropdown item correctly uses the 'vi' code, matches the existing styling/active-state pattern, and uses the VN flag component, so behavior should be consistent with other languages. The “Language sorting” comment above still lists only the original set of languages; you might want to include Vietnamese there or reword it to stay accurate.

Also applies to: 68-74

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ef06472 and cdb1c06.

📒 Files selected for processing (2)

• web/src/components/layout/headerbar/LanguageSelector.jsx (2 hunks)
• web/src/i18n/i18n.js (2 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

web/src/components/layout/headerbar/LanguageSelector.jsx (1)

web/src/hooks/common/useHeaderBar.js (1)

• currentLang (39-39)

🔇 Additional comments (1)

web/src/i18n/i18n.js (1)

29-42: Vietnamese i18n resource wiring is consistent

The new viTranslation import and vi resource entry match the existing pattern for other locales and align with the 'vi' language code used in the UI. No issues from this file’s side.