feat(app): rebuild chat surfaces with shadcn primitives

[DeliciousBuding]

What

The chat surface is rebuilt on vendored shadcn primitives. The transcript runtime, Hub/Edge protocol, reducer and virtualised block model are untouched: this PR only replaces how the existing state is drawn.

• UnifiedComposer collapses into a single InputGroup card. Reply, quote, edit, mention, mainchain, attachment and upload rows become block-start addons instead of stacked bars above the box.
• UserMessage renders through Message + Bubble; AgentGroup reuses the same primitives.
• Tool cards, rail, sidebar, header, inspector and status bar drop glass and layered shadows for a flat Vercel-style chrome with 9-18% foreground hairlines.
• Inspector auto-collapses below 768px; the conversation column keeps a readable width instead of being squeezed.
• Net -1296 / +1471 lines. Most of the diff is deleting dead composer CSS (AgentHubWorkbench.module.css alone loses ~1.1k lines) rather than layering a second system on top.

Why not assistant-ui

Checked @assistant-ui/react@0.15.29 (MIT, React 18/19, ~2.9 MB unpacked / 1302 files, hard deps on zustand, radix-ui, @assistant-ui/core, assistant-cloud, assistant-stream).

It is not adopted as a layer, because:

1. Its message model (ThreadMessageLike content parts) is narrower than our TranscriptBlock union (27 kinds, including run_step_group, agent_timeline, route_decision, context_usage, compact_boundary, replay_gap, checkpoint, deploy). Mapping those onto data parts would create a second transcript SSOT.
2. Its runtime would own composer queue, attachments, edit and auto-scroll semantics that the Hub/Edge reducer and typed WebSocket already own, so we would carry two sources of truth and a conversion layer for zero added UI.
3. Its primitives are unstyled; the visual work in this PR would still have to be written.

Its elements (for example the props-driven ApprovalCard, which needs no runtime or provider) stay a real option for a later isolated experiment, but replacing our approval card - which carries risk tiers, critical confirm and A/R shortcuts plus tests - is not worth it now.

Component acceptance (5 dimensions)

Dimension	Result
Structure / a11y	Composer stays a <form>; textarea keeps aria-label, aria-expanded, aria-controls; mention listbox keeps its role and aria-activedescendant; message rows keep role="log" container and stable data-block-id.
Theming	Colours and radii only through shadcn.css tokens mapped from the existing palette; brand blue unchanged; light and dark verified by capture.
States	Empty, multiline, mention, approval, attachment, streaming-ended and goal scenes captured in both themes.
Responsive	1440x810 standard matrix plus 768x900 narrow captures; no horizontal overflow asserted by the DOM/geometry contract.
Regression	27 transcript block kinds, search jump, selection mode, checkpoints, artifacts and approvals unaffected (runtime untouched).

Verification

• tsc -b for shared / workbench / web: clean.
• Vitest: shared 151 files / 2758 tests, workbench 163 files / 1605 tests, web 33 files / 275 tests - all passed (347 files / 4638 tests).
• Shared package coverage after this change: statements 87.74%, branches 81.89%, functions 86.41%, lines 90.09%.
• Stubbed-Hub Playwright chat flow: 10 passed.
• node scripts/verify/verify-doc-ssot.py: pass; git diff --check: clean.
• Lint: shared/workbench no errors (pre-existing warnings only), web clean.
• Visual QA: visual:qa:chat capture re-run after the final diff, screenshots kept in gitignored app/web/.tmp/visual/{before,after,states} (1440x810 light+dark, 768x900, plus composer empty / multiline / mention / approval / attachment in both themes), contract asserts code block, tool card and goal banner present, overflow=false.

Not run

• Packaged Desktop build (Tauri) and real-stack L3/L4 lanes: the change is renderer CSS/JSX only, but they are not required gates for this path. CI covers the rest.

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

• Configuration used: Repository: TokenDanceLab/AgentHub/.coderabbit.yaml
• Review profile: CHILL
• Plan: Advanced
• Run ID: ba584a1a-1471-4975-b698-aa66844cc33b

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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.}