Skip to content

feat(views): add theme switcher to user menu#5641

Open
josonzhao wants to merge 1 commit into
multica-ai:mainfrom
josonzhao:agent/agent/1353a14d
Open

feat(views): add theme switcher to user menu#5641
josonzhao wants to merge 1 commit into
multica-ai:mainfrom
josonzhao:agent/agent/1353a14d

Conversation

@josonzhao

Copy link
Copy Markdown

Summary

  • Add an Appearance submenu to the workspace-switcher user menu (packages/views/layout/app-sidebar.tsx) with Light / Dark / System options, rendered as a DropdownMenuSub + DropdownMenuRadioGroup (current option auto-checked), inserted above the "Log out" group.
  • Reuses useTheme() from @multica/ui/components/common/theme-provider (next-themes) — the same source as Settings > Preferences — so the two surfaces stay bidirectionally in sync with no new store, matching the client-view-state split in CLAUDE.md.
  • Theme option labels borrow settings.preferences.theme.{light,dark,system} (no key duplication); only sidebar.appearance is new, added to en / zh-Hans / ja / ko per the conventions glossary (Appearance → 外观 / 外観 / 모양).
  • SSR-safe: passes theme (may be undefined on first frame) straight to the radio group — no item is checked until resolved, same fallback as the preferences tab.

Files

  • packages/views/layout/app-sidebar.tsxAppearanceSubmenu component + insertion before logout group.
  • packages/views/layout/app-sidebar.test.tsxuseTheme mock, extended dropdown-menu mock with Sub/Radio primitives, 4 new cases.
  • packages/views/locales/{en,zh-Hans,ja,ko}/layout.jsonsidebar.appearance.

Test plan

  • pnpm typecheck (full monorepo: ui/core/docs/views/web/desktop) — pass
  • pnpm test (views) — 2683 tests pass, incl. 4 new appearance-submenu cases and 162 locale-parity checks
  • Manual: open user menu → Appearance submenu shows 3 options, current has check; switching flips theme immediately and matches Settings > Preferences.

Closes the coding phase of WS-591. Test agent to run end-to-end verification.

Add an Appearance submenu to the workspace-switcher user menu with
Light/Dark/System options (DropdownMenuSub + RadioGroup, current option
checked). Reuses next-themes useTheme - the same source as Settings >
Preferences - so the two surfaces stay in sync without a new store.
Theme option labels borrow settings.preferences.theme.* instead of
duplicating keys; only sidebar.appearance is new (en/zh-Hans/ja/ko).
@vercel

vercel Bot commented Jul 19, 2026

Copy link
Copy Markdown

@josonzhao is attempting to deploy a commit to the IndexLabs Team on Vercel.

A member of the Team first needs to authorize it.

@NevilleQingNY

Copy link
Copy Markdown
Collaborator

Hi, you can use cmd + k to switch theme in everywhere
image

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.

2 participants