Files
copilotkit__copilotkit/examples/showcases/reskinnable-demo/package.json
Maxim 0163beab8e feat(reskinnable-demo): stream the harness into a CLI console via AG-UI subagents
Makes the offsite-expenses beat legible while it runs, and gives it its own
model, by taking the AG-UI subagent surface from the canary line.

## The expense analyst is now a real subagent

    banking                       gpt-5.4, temp 0
      │  banking's prompt; browser frontend tools; Intelligence memory tools
      └─ expense-analyst          gpt-5.6-sol, reasoning_effort=high
           │  sandboxed shell, submit_expense_report
           └─ merchant-researcher gpt-5.4, one per merchant, Tavily

Previously the beat was a section of banking's prompt, which left nowhere to put
per-beat configuration: model, effort and recursion limit are all agent-level and
there was one agent. It also meant banking's ~21,000-character rulebook rode
every one of the ~20 model calls the run makes, re-sending rules about markdown
tables while the agent read a CSV.

Reached as a `CompiledSubAgent` because a raw `SubAgent` spec has no `subagents`
field and this one needs its own — the per-merchant fan-out is a headline of the
beat, and a flat subagent could only research serially. Verified nesting
survives: a probe showed the analyst's `task` dispatches, the researchers'
`search_merchant` calls and the final report tool all reaching `astream_events`.

`gpt-5.6-sol` additionally needs `use_responses_api=True`: with function tools
and `reasoning_effort` it 400s on /v1/chat/completions. The first probe missed
that by asking the model a question with NO tools bound — a model probe for an
agent has to bind one.

## The console: one CLI window, streaming

`shell/subagents/subagent-activity.tsx` subscribes to the agent's event stream
and folds it into console lines. Reading `agent.messages` (the previous design)
was wrong twice over: messages materialise at the `MESSAGES_SNAPSHOT`, two per
run, so the pane sat still for minutes and then filled at once; and persisted
messages carry no `subagentRunId`, so the harness's narration could not be told
from banking's own reply.

The fold is pure and idempotent — every line keyed by the id of the thing that
produced it — so the same code serves the live subscription and a replay of the
thread's stored events when a conversation is reopened.

Three heuristics are deleted, each replaced by identity the protocol already
carried:

- the console's "first tool call" anchor      -> the run's first `task` call, from
                                                 MESSAGE order (durable; the
                                                 event-derived version rendered
                                                 one console per delegation on a
                                                 restored thread — six, measured)
- `CONSOLE_TOOL_NAMES` suppression list       -> `subagentRunId` presence
- `disable_streaming` on the researchers      -> the canary's per-lane state

`shell/subagents/subagent-message-filter.tsx` keeps subagent narration out of the
conversation. It suppresses the PROSE and keeps the TOOL CALLS: an agent
routinely narrates and calls a tool in one message, and returning null for the
whole message hid the REPORT CARD — the run looked perfect and ended with nothing
to show. Shell-level and inert for a skin whose agent has no subagents.

## Canary stack, contained to this app

The subagent surface only exists on the canary line, and a released
`@ag-ui/client` <= 0.0.57 rejects `SUBAGENT_*` events in the HTTP transport
before any middleware runs, killing the stream. So the demo leaves the root pnpm
workspace and ships its own lockfile, pinning `@copilotkit/* 1.68.3-canary` and
`@ag-ui/* 0.0.59-canary` locally instead of imposing an unreleased protocol on
every package in the monorepo.

A 1.62.2-based canary was tried first and could not compile the app: it silently
rewound the CopilotKit API five minors under a demo written against 1.67.1, and
`OpenGenerativeUIActivityRenderer` (a public `/v2` export since ~1.63) was the
first thing to break. `workspace:*` is not a version, so the app had no recorded
lower bound on the API it needs.

KNOWN GAP, deliberately not fixed here: Nx discovers projects THROUGH the pnpm
workspace (there is no `workspaceLayout` in `nx.json`), so leaving it also
removes the demo from the repo-wide `nx run-many -t build` and `-t check-types`
sweeps. Verified — `nx show project deep-agents` and the other standalone
showcases return "Could not find project". No workflow names this demo, so it is
currently unbuilt and untype-checked in CI and needs its own job. Run the four
gates locally until that lands. Documented in `pnpm-workspace.yaml`.

## Fixes

- The run clock is keyed per run and read through an injected `ToolRuntime`
  instead of taking the oldest open stamp across the process. Model calls AFTER
  the report re-stamped the clock and that leftover became the next run's start:
  a two-minute run reported 333s. Now 86s reported against 98s wall clock — the
  gap is thread-naming and delegation, before the analyst's first model call,
  which is what the tile claims to measure.
- `merchantKind` non-answers are rejected on the leading token, on hedging
  language, and over 40 characters. With no search tool the model wrote a bare
  "unclear"; with Tavily live it hedges in prose ("unknown (likely
  bookbindery/bookshop retail, but not established for this exact merchant)"),
  which an exact-match filter passed into a 60-character label glued to the
  merchant name.
- `vitest` no longer externalises `@copilotkit/*`. Installing them from npm moved
  `src/app/layout.tsx`'s stylesheet import under `node_modules/.pnpm/`, where
  Node's ESM loader threw `Unknown file extension ".css"` and took out 16 suites
  while naming a stylesheet nobody had touched.
- `agent/main.py` reads the demo's `.env` as well as its own, so `TAVILY_API_KEY`
  works wherever an operator puts it. Two env files to keep in sync is a trap
  whose failure mode is "the agent ignores a key that is plainly sitting in .env".

## Upstream finding (reported separately, not fixed here)

`@copilotkit/runtime` drops `subagentRunId` when persisting messages: 2888 of
3026 stream events carry it, 0 of 53 persisted messages do. Reproduced with
Intelligence removed entirely, so it is the runtime's message shape rather than
the platform store — and `@copilotkit/runtime`'s dist contains no occurrence of
the field at all, while `@ag-ui/core`, `ag-ui-protocol` and `@copilotkit/core`
all model it. One field threaded through would let the console rebuild from
message history and delete the event-replay seeding added here.

`CLAUDE.md`'s appended block is generated by `next dev`
(`next/dist/server/lib/generate-agent-files.js`) and committed per its own
instruction to keep the tree clean.

Gates: lint 0, typecheck 0, test:unit 2460 passed across 216 files, build 0.
Measured end to end in Intelligence mode: 14 rows, 9 merchants researched, 6
charges filed with ids read out of real 201 bodies, totals reconciling against
their own rows, 3220 events with 6 SUBAGENT_STARTED/FINISHED pairs.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JRubZT6AS6LCGkcE2KzcfA
2026-08-20 13:54:58 +02:00

79 lines
2.7 KiB
JSON

{
"name": "reskinnable-demo",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "eslint .",
"test:e2e": "playwright test",
"test:e2e:ogui": "playwright test -c playwright.ogui.config.ts",
"test:self-learning": "playwright test e2e/memory-learning.spec.ts",
"test:unit": "vitest run",
"typecheck": "tsc --noEmit",
"mint-dev-license": "node scripts/mint-dev-license.mjs"
},
"dependencies": {
"@ag-ui/client": "0.0.59-canary.1786716392.0",
"@copilotkit/a2ui-renderer": "1.68.3-canary.1786716392",
"@copilotkit/core": "1.68.3-canary.1786716392",
"@copilotkit/react-core": "1.68.3-canary.1786716392",
"@copilotkit/runtime": "1.68.3-canary.1786716392",
"@copilotkit/shared": "1.68.3-canary.1786716392",
"@radix-ui/react-avatar": "^1.1.1",
"@radix-ui/react-dialog": "^1.1.2",
"@radix-ui/react-dropdown-menu": "^2.1.2",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-label": "^2.1.0",
"@radix-ui/react-popover": "^1.1.2",
"@radix-ui/react-progress": "^1.1.0",
"@radix-ui/react-scroll-area": "^1.2.0",
"@radix-ui/react-select": "^2.1.2",
"@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-switch": "^1.1.1",
"@radix-ui/react-tabs": "^1.1.1",
"@radix-ui/react-toast": "^1.2.2",
"@radix-ui/react-tooltip": "^1.1.3",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.1",
"hono": "^4.11.4",
"lucide-react": "^0.447.0",
"next": "^16.0.10",
"openai": "^4.96.2",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-resizable-panels": "^4.12.2",
"tailwind-merge": "^2.5.2",
"tw-animate-css": "^1.4.0",
"zod": "^3.25.76"
},
"devDependencies": {
"@copilotkit/aimock": "1.19.1",
"@playwright/test": "^1.59.1",
"@tailwindcss/postcss": "^4",
"@testing-library/react": "^16.1.0",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"@vitejs/plugin-react": "^4.3.4",
"eslint": "^9",
"eslint-config-next": "^16.0.10",
"jsdom": "^25.0.1",
"tailwindcss": "^4",
"typescript": "^5",
"vitest": "^3.2.0"
},
"packageManager": "pnpm@10.10.0+sha512.d615db246fe70f25dcfea6d8d73dee782ce23e2245e3c4f6f888249fb568149318637dca73c2c5c8ef2a4ca0d5657fb9567188bfab47f566d1ee6ce987815c39",
"pnpm": {
"overrides": {
"@ag-ui/core": "0.0.59-canary.1786716392.0",
"@ag-ui/client": "0.0.59-canary.1786716392.0",
"@ag-ui/encoder": "0.0.59-canary.1786716392.0",
"@ag-ui/proto": "0.0.59-canary.1786716392.0",
"@ag-ui/langgraph": "0.0.43-canary.1786716392.0"
}
}
}