Skip to content

Fix homepage localization for chip labels and translations #2275

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
SunayKulkarni wants to merge 12 commits into
base: main
Choose a base branch
from
+72 −16
Open

Fix homepage localization for chip labels and translations #2275

Show file tree
Hide file tree
Changes from 9 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
7459aba
Fix incomplete homepage localization (chip labels + translations)
SunayKulkarni May 19, 2026
f026e56
Fix i18n key mismatch and remove unsafe cast; localize tooltips
SunayKulkarni May 19, 2026
0723732
Enforce type-safe i18n keys for HomeHero chips
SunayKulkarni May 19, 2026
6244913
Remove unused labelKey for migrate chips to avoid duplicate i18n sources
SunayKulkarni May 19, 2026
bba7388
Restore labelKey for migrate chips to satisfy HomeHeroChip type
SunayKulkarni May 19, 2026
7f9a7cb
Add zh-CN localization test for HomeHero rail labels and tooltips
SunayKulkarni May 19, 2026
26fa6d9
Refactor HomeHeroChip into create/migrate union and fix type-safe ren…
SunayKulkarni May 19, 2026
16ab5d8
Fix type errors: remove label from CreateChip, add example-live-artif…
SunayKulkarni May 22, 2026
9199903
Remove dead TypeTabBar component; RailGroup is the single tab renderer
SunayKulkarni May 22, 2026
465819d
Remove unused labelKey from CreateChip; homeHeroChipLabel is the sing…
SunayKulkarni May 22, 2026
0c53dcf
Extend zh-CN rail test to cover migrate chip labels and tooltips via …
SunayKulkarni May 23, 2026
cfde794
Add live-artifact zh-CN label and tooltip assertions to rail test
SunayKulkarni May 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions apps/web/src/components/HomeHero.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2351,6 +2351,7 @@ function getPluginQueryPreview(plugin: InstalledPluginRecord): string {
return trimmed.length > 96 ? `${trimmed.slice(0, 96)}…` : trimmed;
}


interface RailGroupProps {
group: ChipGroup;
activeChipId: string | null;
Expand Down
39 changes: 24 additions & 15 deletions apps/web/src/components/home-hero/chips.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
import type { ProjectKind, ProjectMetadata } from '@open-design/contracts';
import type { DefaultScenarioPluginId } from '@open-design/contracts';
import type { IconName } from '../Icon';
import type { Dict } from '../../i18n/types';

// Plugin ids the chip rail can dispatch to. Most chips route to a
// `DefaultScenarioPluginId` so the same fallback table the daemon
Expand All @@ -33,7 +34,8 @@ import type { IconName } from '../Icon';
// independently of the default-binding mapping.
export type ChipScenarioPluginId =
| DefaultScenarioPluginId
| 'example-hyperframes';
| 'example-hyperframes'
| 'example-live-artifact';

export type ChipAction =
| {
Expand All @@ -60,19 +62,29 @@ export type ChipAction =
// narrow viewports without horizontal scrolling.
export type ChipGroup = 'create' | 'migrate';

export interface HomeHeroChip {
export interface CreateChip {
id: string;
label: string;
icon: IconName;
group: ChipGroup;
labelKey: keyof Dict;
Copy link
Copy Markdown
Contributor

@nettee nettee May 19, 2026

Choose a reason for hiding this comment

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

labelKey is now type-safe here, but the lower rail still does not read it: RailGroup renders homeHeroChipLabel(chip.id, t) in apps/web/src/components/HomeHero.tsx:1587, and homeHeroChipTitle() also switches on chip.id for the migrate chips at apps/web/src/components/HomeHero.tsx:1616-1619. That means the new metadata entries you changed here (create-plugin, figma, folder, template) are not actually the source of truth for the labels/tooltips users see in that rail. This matters because future homepage i18n edits can compile cleanly while silently updating only one of the two paths. Please either drive both rail labels/titles from chip metadata (for example labelKey plus a typed hint/title key) or keep the switch helpers as the single source of truth and drop the unused migrate-chip labelKey fields.

🔁 Powered by Looper · runner=reviewer · agent=opencode · An autonomous AI dev team for your GitHub repos.

Copy link
Copy Markdown
Contributor

@nettee nettee May 19, 2026

Choose a reason for hiding this comment

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

HomeHeroChip still requires labelKey here, but this patch removes that property from the create-plugin, figma, folder, and template entries below. That leaves HOME_HERO_CHIPS out of sync with its declared ReadonlyArray<HomeHeroChip> type, so the i18n-safety follow-up now turns into a type/build break instead of a clean refactor. Please either keep labelKey on those migrate chips, or split the model into separate create/migrate chip types so only the create chips are required to carry labelKey.

🔁 Powered by Looper · runner=reviewer · agent=opencode · An autonomous AI dev team for your GitHub repos.

Copy link
Copy Markdown
Contributor

@nettee nettee May 22, 2026

Choose a reason for hiding this comment

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

This change makes labelKey part of the new CreateChip contract, but the homepage renderer still does not consume it: RailGroup continues to render homeHeroChipLabel(chip.id, t) in apps/web/src/components/HomeHero.tsx, and the new zh-CN test only asserts that switch-based output. That leaves two sources of truth for the same label, so a future edit can update HOME_HERO_CHIPS and assume the UI changed even though the rendered copy still comes from the separate switch table. Please either render create-chip labels directly from chip.labelKey (and extend the test to cover that path), or remove labelKey from this model until the UI actually uses it.

🔁 Powered by Looper · runner=reviewer · agent=opencode · An autonomous AI dev team for your GitHub repos.

hint?: string;
icon: IconName;
group: 'create';
action: ChipAction;
}

export interface MigrateChip {
id: string;
icon: IconName;
group: 'migrate';
hint: string;
action: ChipAction;
}

export type HomeHeroChip = CreateChip | MigrateChip;

export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
{
id: 'prototype',
label: 'Prototype',
labelKey: 'homeHero.chip.prototype',
icon: 'palette',
group: 'create',
// Prototype now binds to the bundled `example-web-prototype` plugin,
Expand All @@ -92,7 +104,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'live-artifact',
label: 'Live artifact',
labelKey: 'homeHero.chip.liveArtifact',
icon: 'refresh',
group: 'create',
hint: 'Build a refreshable artifact backed by connector or local data.',
Expand All @@ -109,7 +121,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'deck',
label: 'Slide deck',
labelKey: 'homeHero.chip.deck',
icon: 'present',
group: 'create',
// Slide deck binds to `example-simple-deck`, which ships a 353-line
Expand All @@ -130,7 +142,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'image',
label: 'Image',
labelKey: 'homeHero.chip.image',
icon: 'image',
group: 'create',
action: {
Expand All @@ -147,7 +159,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'video',
label: 'Video',
labelKey: 'homeHero.chip.video',
icon: 'play',
group: 'create',
action: {
Expand All @@ -164,7 +176,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'hyperframes',
label: 'HyperFrames',
labelKey: 'homeHero.chip.hyperframes',
icon: 'orbit',
group: 'create',
hint: 'Author HTML-based motion: captions, audio-reactive visuals, scene transitions.',
Expand All @@ -176,7 +188,7 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'audio',
label: 'Audio',
labelKey: 'homeHero.chip.audio',
icon: 'mic',
group: 'create',
action: {
Expand All @@ -193,15 +205,13 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'create-plugin',
label: 'Create plugin',
icon: 'edit',
group: 'migrate',
hint: 'Author a reusable Open Design plugin and add it to My plugins.',
action: { kind: 'create-plugin' },
},
{
id: 'figma',
label: 'From Figma',
icon: 'import',
group: 'migrate',
hint: 'Migrate a Figma frame into the active design system.',
Expand All @@ -217,7 +227,6 @@ export const HOME_HERO_CHIPS: ReadonlyArray<HomeHeroChip> = [
},
{
id: 'template',
label: 'From template',
icon: 'file-code',
group: 'migrate',
hint: 'Start from a bundled template.',
Expand Down
3 changes: 2 additions & 1 deletion apps/web/src/i18n/locales/zh-CN.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -498,7 +498,8 @@ export const zhCN: Dict = {
'recentProjects.title': '最近项目',
'recentProjects.viewAll': '查看全部',
'recentProjects.empty': '还没有项目 — 输入 Prompt 即可开始。',
'pluginsHome.title': 'Community',

'pluginsHome.title': '官方入门',
'pluginsHome.subtitle': '当前运行环境内置的 Open Design 工作流。选择一个加载 starter prompt，或浏览插件市场查看更多。',
'pluginsHome.browseRegistry': '浏览插件市场',
'pluginsHome.count': '{filtered} / {total}',
Expand Down
35 changes: 35 additions & 0 deletions apps/web/tests/components/HomeHero.rail.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { cleanup, fireEvent, render, screen } from '@testing-library/react';
import { afterEach, describe, expect, it, vi } from 'vitest';
import type { InstalledPluginRecord } from '@open-design/contracts';

import { I18nProvider } from '../../src/i18n';
import { HomeHero } from '../../src/components/HomeHero';
import {
HOME_HERO_CHIPS,
Expand Down Expand Up @@ -246,4 +247,38 @@ describe('HomeHero intent rail', () => {
},
});
});

it('renders localized chip labels and tooltips in zh-CN', () => {
Copy link
Copy Markdown
Contributor

@nettee nettee May 22, 2026

Choose a reason for hiding this comment

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

This regression test only asserts one always-visible create-chip label (prototype) and one tooltip (hyperframes), and it never opens the More shortcuts menu. That means the zh-CN copy for the changed migrate shortcuts (create-plugin, figma, template) can regress without this suite failing, even though the PR body says no mixed English homepage UI remains. Please extend this test to open home-hero-shortcuts-trigger under zh-CN and assert the localized labels/titles for the shortcut chips as well, so the homepage-localization guarantee is covered across both rail rows.

🔁 Powered by Looper · runner=reviewer · agent=opencode · An autonomous AI dev team for your GitHub repos.

render(
<I18nProvider initial="zh-CN">
<HomeHero
prompt=""
onPromptChange={() => undefined}
onSubmit={() => undefined}
activePluginTitle={null}
activeChipId={null}
onClearActivePlugin={() => undefined}
pluginOptions={[]}
pluginsLoading={false}
pendingPluginId={null}
pendingChipId={null}
onPickPlugin={vi.fn()}
onPickChip={vi.fn()}
contextItemCount={0}
error={null}
/>
</I18nProvider>
);

// Prototype chip label should be zh-CN
Copy link
Copy Markdown
Contributor

@nettee nettee May 23, 2026

Choose a reason for hiding this comment

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

This zh-CN regression test still skips the other always-visible create chip, live-artifact. The current homepage renderer localizes that chip through homeHeroChipLabel() / homeHeroChipTitle() (homeHero.chip.liveArtifact and homeHero.chip.liveArtifactHint), and this same PR also touches its chip contract by adding example-live-artifact to ChipScenarioPluginId in apps/web/src/components/home-hero/chips.ts. Because the assertions here only cover prototype, hyperframes, and the migrate shortcuts, a future regression in the live-artifact zh-CN label or tooltip would still pass even though the PR body says no mixed-language homepage UI remains. Please add home-hero-rail-live-artifact text and title assertions in this test so the visible create-chip set is covered end to end.

🔁 Powered by Looper · runner=reviewer · agent=opencode · An autonomous AI dev team for your GitHub repos.

const prototypeChip = screen.getByTestId('home-hero-rail-prototype');
expect(prototypeChip.textContent).toContain('原型');

// HyperFrames tooltip should be the zh-CN string
const hyperframes = screen.getByTestId('home-hero-rail-hyperframes');
expect(hyperframes.getAttribute('title')).toBe(
'创作基于 HTML 的动态内容：字幕、音频响应视觉和场景转场。'
);
});

});