Files
ccs/ui
Tam Nhu Tran caef89a7aa fix(ui): address PR-Agent round 2 review feedback
MonitorLayout:
- Wrap ScrollArea in an explicit flex-col container with min-h-0. The
  previous version relied on the parent (PageShell) being flex-col for
  flex-1 to compute a definite height; that's fragile. The wrapper now
  establishes its own flex column so the ScrollArea reliably scrolls
  whether or not the caller's wrapper is flex.

ConfigLayout (MobileTabs):
- Derive active tab during render with fallback to first available, same
  pattern applied to JsonPane in the previous round. Parent toggling
  `left` or `json` props could change the available tabs and leave
  the controlled Tabs value pointing at a tab id that no longer existed,
  rendering an empty pane on mobile until the user manually switched.
2026-04-25 12:43:41 -04:00
..

CCS Dashboard UI

React + TypeScript + Vite frontend for the CCS local dashboard.

This UI is served by the CCS web server and is accessed via:

ccs config

Development

From project root:

bun run dev

This starts the CCS server, opens a local browser URL, and prints bind/network details for the dashboard. If the runtime bind is reachable beyond loopback, CCS also prints an auth reminder.

For remote device access during development, run:

bun run dev -- --host 0.0.0.0

For local-only development, run:

bun run dev -- --host 127.0.0.1

From ui/ only (frontend dev server):

cd ui
bun run dev

Quality Commands

cd ui
bun run typecheck
bun run lint
bun run validate
bun run test:run

i18n

Dashboard localization uses react-i18next.

  • Main setup: ui/src/lib/i18n.ts
  • Locale helpers: ui/src/lib/locales.ts
  • Language switcher: ui/src/components/layout/language-switcher.tsx

For full architecture, conventions, and locale onboarding, see:


Notes

  • UI locale persistence uses browser localStorage key ccs-ui-locale.
  • Current supported locales are managed in ui/src/lib/locales.ts.
  • Current locales: en, zh-CN, vi.
  • Fallback locale is English (en).