feat(chat): rebuild /chat on assistant-ui elements (tools, approvals, plan, sub-agents, composer) + core events

app/package.json

@@ -68,13 +68,13 @@
     "lint": "eslint . --ext .ts,.tsx --cache",
     "lint:fix": "eslint . --ext .ts,.tsx --fix --cache",
     "lint:commands-tokens": "bash scripts/lint-token-scan.sh lint:commands-tokens -nU \"(bg|text|border|ring|shadow)-(neutral|primary|sage|amber|canvas|stone|slate)\" src/components/commands/",
-    "lint:ui-tokens": "bash scripts/lint-token-scan.sh lint:ui-tokens -nP \"^(?!\\s*(//|\\*|/\\*)).*\\b(bg|text|border|ring|divide)-(neutral|stone|slate|canvas|white|black)\\b\" src/components/ui/ src/components/layout/ src/components/settings/ src/features/conversations/ src/components/intelligence/ src/components/feedback/ src/components/flows/ src/components/chat/ src/components/skills/ src/components/channels/ src/pages/ src/components/dashboard/ src/components/composio/ src/components/notifications/ src/components/accounts/ src/components/approvals/ src/features/human/ && bash scripts/lint-token-scan.sh lint:ui-tokens -nP \"^(?!\\s*(//|\\*|/\\*)).*(color-mix\\(|oklch\\(|@layer )\" src/components/ui/ src/styles/fonts.css && node scripts/lint-undefined-scales.mjs",
+    "lint:ui-tokens": "bash scripts/lint-token-scan.sh lint:ui-tokens -nP \"^(?!\\s*(//|\\*|/\\*)).*\\b(bg|text|border|ring|divide)-(neutral|stone|slate|canvas|white|black)\\b\" src/components/ui/ src/components/layout/ src/components/settings/ src/features/conversations/ src/components/intelligence/ src/components/feedback/ src/components/flows/ src/components/chat/ src/components/skills/ src/components/channels/ src/pages/ src/components/dashboard/ src/components/composio/ src/components/notifications/ src/components/accounts/ src/features/human/ && bash scripts/lint-token-scan.sh lint:ui-tokens -nP \"^(?!\\s*(//|\\*|/\\*)).*(color-mix\\(|oklch\\(|@layer )\" src/components/ui/ src/styles/fonts.css && node scripts/lint-undefined-scales.mjs",
     "knip": "knip --config knip.json",
     "knip:production": "knip --config knip.json --production"
   },
   "dependencies": {
-    "@assistant-ui/core": "^0.3.15",
-    "@assistant-ui/react": "^0.15.16",
+    "@assistant-ui/core": "^0.3.20",
+    "@assistant-ui/react": "^0.15.21",
     "@assistant-ui/react-lexical": "^0.2.10",
     "@assistant-ui/react-markdown": "^0.14.12",
     "@base-ui/react": "^1.7.0",

app/src/AppRoutes.guards.test.tsx

@@ -65,6 +65,9 @@ vi.mock('./pages/Accounts', () => ({ default: () => <div /> }));
 vi.mock('./pages/Brain', () => ({ default: () => <div /> }));
 vi.mock('./pages/dev/AgentInsightsPreview', () => ({ default: () => <div /> }));
 vi.mock('./pages/dev/UiGallery', () => ({ default: () => <div data-testid="page-ui-gallery" /> }));
+vi.mock('./pages/dev/ToolCallGallery', () => ({
+  default: () => <div data-testid="page-tool-call-gallery" />,
+}));
 vi.mock('./pages/Invites', () => ({ default: () => <div data-testid="page-invites" /> }));
 vi.mock('./pages/Notifications', () => ({
   default: () => <div data-testid="page-notifications" />,
@@ -102,6 +105,7 @@ const OWNED: Array<{ path: string; page: string; guard: Guard }> = [
   { path: '/notifications', page: 'page-notifications', guard: 'protected' },
   { path: '/ptt-overlay', page: 'page-ptt-overlay', guard: 'none' },
   { path: '/dev/ui', page: 'page-ui-gallery', guard: 'none' },
+  { path: '/dev/tools', page: 'page-tool-call-gallery', guard: 'none' },
 ];
 
 describe('AppRoutes — each route renders its page behind the right guard', () => {
@@ -200,6 +204,7 @@ describe('AppRoutes — the whole route table stays classified', () => {
     '/ptt-overlay': 'none',
     '/dev/agent-insights': 'none',
     '/dev/ui': 'none',
+    '/dev/tools': 'none',
     '/dev/assistant-ui': 'none',
     '*': 'none',
   };

app/src/AppRoutes.tsx

@@ -12,6 +12,7 @@ import Activity from './pages/Activity';
 import Brain from './pages/Brain';
 import AgentInsightsPreview from './pages/dev/AgentInsightsPreview';
 import AssistantUiDemoPage from './pages/dev/assistant-ui-demo';
+import ToolCallGallery from './pages/dev/ToolCallGallery';
 import UiGallery from './pages/dev/UiGallery';
 import FlowCanvasPage, { FlowCanvasDraftPage } from './pages/FlowCanvasPage';
 import FlowsPage from './pages/FlowsPage';
@@ -260,6 +261,9 @@ const AppRoutes = ({ location }: AppRoutesProps = {}) => {
           {/* Gallery of every shared UI primitive, in the active theme. */}
           <Route path="/dev/ui" element={<UiGallery />} />
 
+          {/* Tool-call presentation: every state and the whole core catalog. */}
+          <Route path="/dev/tools" element={<ToolCallGallery />} />
+
           {/* The upstream assistant-ui `base` demo on a mock runtime. */}
           <Route path="/dev/assistant-ui" element={<AssistantUiDemoPage />} />
         </>

app/src/components/__tests__/a11y.smoke.test.tsx

@@ -8,24 +8,14 @@
  * Kept deliberately small and provider-light so it stays fast and stable; grow
  * it screen-by-screen rather than pulling in the full app shell.
  */
-import { configureStore } from '@reduxjs/toolkit';
 import { render } from '@testing-library/react';
 import { axe } from 'jest-axe';
-import { Provider } from 'react-redux';
 import { describe, expect, it, vi } from 'vitest';
 
-import chatRuntimeReducer, {
-  type ArtifactSnapshot,
-  type PendingApproval,
-  setPendingApprovalForThread,
-} from '../../store/chatRuntimeSlice';
-import ApprovalRequestCard from '../chat/ApprovalRequestCard';
-import ArtifactCard from '../chat/ArtifactCard';
+import { ApprovalCardAdapter } from '../../features/conversations/aui/ApprovalCardAdapter';
+import { ArtifactCardAdapter } from '../../features/conversations/aui/ArtifactCardAdapter';
+import type { ArtifactSnapshot } from '../../store/chatRuntimeSlice';
 
-vi.mock('../../services/artifactDownloadService', () => ({
-  saveArtifactViaDialog: vi.fn(),
-  revealArtifactInFileManager: vi.fn(),
-}));
 vi.mock('../../services/coreRpcClient', () => ({ callCoreRpc: vi.fn() }));
 
 async function expectNoViolations(container: HTMLElement) {
@@ -34,7 +24,7 @@ async function expectNoViolations(container: HTMLElement) {
 }
 
 describe('accessibility smoke', () => {
-  it('ArtifactCard (ready) has no axe violations', async () => {
+  it('ArtifactCardAdapter (ready) has no axe violations', async () => {
     const artifact: ArtifactSnapshot = {
       artifactId: 'a-1',
       kind: 'presentation',
@@ -44,11 +34,11 @@ describe('accessibility smoke', () => {
       path: 'a-1/deck.pptx',
       updatedAt: 0,
     };
-    const { container } = render(<ArtifactCard artifact={artifact} />);
+    const { container } = render(<ArtifactCardAdapter artifact={artifact} />);
     await expectNoViolations(container);
   });
 
-  it('ArtifactCard (failed with error) has no axe violations', async () => {
+  it('ArtifactCardAdapter (failed with error) has no axe violations', async () => {
     const artifact: ArtifactSnapshot = {
       artifactId: 'a-2',
       kind: 'document',
@@ -57,23 +47,22 @@ describe('accessibility smoke', () => {
       error: 'producer crashed',
       updatedAt: 0,
     };
-    const { container } = render(<ArtifactCard artifact={artifact} onRetry={vi.fn()} />);
+    const { container } = render(<ArtifactCardAdapter artifact={artifact} onRetry={vi.fn()} />);
     await expectNoViolations(container);
   });
 
-  it('ApprovalRequestCard has no axe violations', async () => {
-    const approval: PendingApproval = {
-      requestId: 'req-1',
-      toolName: 'shell',
-      message: 'Run `shell` — shell (18 bytes of arguments)',
-      command: 'pip show yfinance',
-    };
-    const store = configureStore({ reducer: { chatRuntime: chatRuntimeReducer } });
-    store.dispatch(setPendingApprovalForThread({ threadId: 't1', approval }));
+  it('ApprovalCardAdapter has no axe violations', async () => {
     const { container } = render(
-      <Provider store={store}>
-        <ApprovalRequestCard threadId="t1" approval={approval} />
-      </Provider>
+      <ApprovalCardAdapter
+        ariaLabel="Approval needed"
+        title="Approval needed"
+        subtitle="Run `shell` — shell (18 bytes of arguments)"
+        command="pip show yfinance"
+        toolName="shell"
+        alwaysDecision="approve_always_for_tool"
+        analyticsPrefix="chat-approval"
+        onDecide={vi.fn()}
+      />
     );
     await expectNoViolations(container);
   });