Repository navigation
feat(ui): translate the viewer with vue-i18n and let readers pick the language - #39
Merged
Merged
Conversation
… language
The viewer was English only, while evals already label scores, metrics, and
artifacts in several languages (`{ 'en': …, 'zh-Hans': … }`).
- vue-i18n 11 with typed TypeScript messages per area (`client/src/i18n/locales/{en,zh-Hans}/<area>.ts`); a zh-Hans
module that misses a key fails vue-tsc
- `useLocale` and the `vieval-viewer:locale` preference (`auto` or a code); `scheme.js` sets `<html lang>` before the
first paint
- the Colors popover becomes Preferences, with a language dropdown (Auto, English, 简体中文) built on
`option-trigger`, `AnimatedContent`, and `DropdownMenuRadioGroup`; phones keep three header buttons
- every page, panel, menu, tooltip, and empty state translated to zh-Hans, with real plurals in English
- `localize()`, numbers, dates, and relative times follow the picked language
Co-Authored-By: Claude Opus 5.5 <[email protected]>
Bring in #37 (phone layout and narrow cards), #38 (run header leads with the score), and v0.10.2. Conflicts kept main's layout and behavior and applied the translations on top; the strings #37 and #38 added (the ETA info button, Run details) are translated in en and zh-Hans. Co-Authored-By: Claude Opus 5.5 <[email protected]>
Approval required for deploying to Cloudflare Workers (Preview) for docs.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
The viewer was English only. Evals already label scores, metrics, and artifacts in several languages (
{ 'en': …, 'zh-Hans': … }), but nothing let a reader pick a language.Result
The viewer speaks English or Simplified Chinese. The reader picks one, or follows the browser. One locale drives everything on a page:
Comparison:
d6a35fc(main) →0bf23b4(head revision ofnekomeowww/feat/viewer-i18n). One commit.How it works
client/src/i18n)createI18n({ legacy: false }). Messages are TypeScript modules per area:locales/{en,zh-Hans}/<area>.ts. Azh-Hansmodule issatisfies typeof en, so a missing key fails vue-tsc.useLocalevieval-viewer:localepreference isauto(the default) or a supported code.autoresolvesnavigator.languageswith theIntl.Localematching thatlocalize()already used, now shared. Changing it sets<html lang>.public/scheme.jsalso sets<html lang>before the first paint.HuePicker.vue) becomes Preferences (PreferencesMenu.vue). The language row is anoption-triggeropening aDropdownMenuRadioGroupwith Auto, English, and 简体中文, wrapped inAnimatedContentwithfloating/floating-arrow, likeCompareMenu. The phone top bar keeps three buttons.format.ts,labels.ts,caseMetrics.ts,InferencePanel, andJsonlTableformat withcurrentLocale()instead ofen-USor the browser default.localize()reads the picked locale first.aria-label, and empty state, in about 650 keys. English counts are real plurals ("3 projects", not "3 project(s)"). The d3 charts redraw when the language changes. Report data (case, task, metric, and score names, ids, outputs) is not translated.CLI changes
No CLI changes.
Report file and viewer API changes
No report file or viewer API changes. Only
packages/ui/clientchanged: the server,@vieval/ui/contract, and the report files are untouched.New dependency:
vue-i18n ^11.4.9(catalog; the same version airi uses).Validation
At
0bf23b4:pnpm typecheckpasses, andpnpm exec eslint packages/uiis clean.vitest.client.config.ts, browser mode). They includeresolveLocale,localizefollowing the preference, and the language switch changing a label and<html lang>.vitest.server.config.ts).Follow-up
The next PR is stacked on this one. It covers:
t()key exists🤖 Generated with Claude Code