nexus/.planning/phases/22-agent-streaming/22-04-PLAN.md
Mikkel Georgsen e8c70d6c8d [nexus] fix(22): revise plans based on checker feedback
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-01 14:45:00 +02:00

128 lines
5.4 KiB
Markdown

---
phase: 22-agent-streaming
plan: 04
type: execute
wave: 3
depends_on: [22-03]
files_modified: []
autonomous: false
requirements: [CHAT-01, CHAT-08, CHAT-10, CHAT-11, CHAT-12, INPUT-05, INPUT-06, AGENT-04, THEME-03, PERF-02, PERF-03]
must_haves:
truths:
- "pnpm test run exits 0 with all chat-routes, chat-stream-routes, parseMessageIntent, ChatAgentBadge, and ChatInput.slash-mention tests passing"
- "pnpm --filter @paperclipai/ui build and pnpm --filter @paperclipai/server build both exit 0"
- "User sends a message and sees echo-stream tokens appear word-by-word in a streaming assistant bubble (CHAT-01 transport-level, echo-stream placeholder)"
- "Stop button (red square) appears during streaming and cancels the stream on click"
- "Agent selector dropdown in chat header shows agents with colored avatars and persists selection across page reload"
- "Agent badge with colored circle and name appears above each assistant message"
- "Slash command popover appears when typing / prefix, @mention popover appears when typing @ prefix"
- "Agent colors are visually distinguishable across all three themes (Catppuccin Mocha, Tokyo Night, Catppuccin Latte)"
artifacts: []
key_links: []
---
<objective>
Full test suite verification and visual/functional checkpoint for the complete Phase 22 agent streaming feature.
Purpose: Ensures all automated tests pass and gives the user a chance to verify the streaming experience, agent selector, theme colors, and interaction flows visually.
Output: Verified, working Phase 22.
</objective>
<execution_context>
@$HOME/.claude/get-shit-done/workflows/execute-plan.md
@$HOME/.claude/get-shit-done/templates/summary.md
</execution_context>
<context>
@.planning/PROJECT.md
@.planning/ROADMAP.md
@.planning/phases/22-agent-streaming/22-01-SUMMARY.md
@.planning/phases/22-agent-streaming/22-02-SUMMARY.md
@.planning/phases/22-agent-streaming/22-03-SUMMARY.md
</context>
<tasks>
<task type="auto">
<name>Task 1: Full test suite verification and build check</name>
<files>
(run-only verification task -- no source changes expected; reads test files for diagnostics if failures occur)
</files>
<read_first>
server/src/__tests__/chat-stream-routes.test.ts,
server/src/__tests__/chat-routes.test.ts,
ui/src/lib/parseMessageIntent.test.ts,
ui/src/components/ChatAgentBadge.test.tsx,
ui/src/components/ChatInput.slash-mention.test.tsx
</read_first>
<action>
Run the full test suite and verify all tests pass:
```bash
pnpm test run
```
If any tests fail:
1. Read the failing test file and the source file it tests
2. Fix the issue (prefer fixing source code over weakening tests)
3. Re-run until all tests pass
Then verify the build:
```bash
pnpm --filter @paperclipai/ui build
pnpm --filter @paperclipai/server build
```
Report the total test count and pass rate.
</action>
<verify>
<automated>pnpm test run && pnpm --filter @paperclipai/ui build && pnpm --filter @paperclipai/server build</automated>
</verify>
<done>All tests pass and both UI and server build cleanly</done>
</task>
<task type="checkpoint:human-verify" gate="blocking">
<name>Task 2: Visual and functional verification of streaming chat</name>
<files>
(checkpoint -- no files modified; visual/functional verification only)
</files>
<action>
Present the verification checklist to the user. Complete Phase 22 agent streaming has been built:
SSE echo-stream endpoint, virtualized message list with agent badges, edit/retry actions,
Stop button, AgentSelector, slash command and @mention popovers.
The user will manually test:
1. Start the dev server: `pnpm dev`
2. Open the chat panel (MessageSquare icon in sidebar)
3. Create a new conversation and send a message -- verify tokens stream in word-by-word (echo-stream: you will see your own message echoed back, this is the Phase 22 placeholder; real LLM responses come in Phase 23)
4. While streaming: verify the Stop button (red square) appears; click it to cancel
5. Hover over an assistant message -- verify Retry button (rotate icon) appears; click it
6. Hover over a user message -- verify Edit button (pencil icon) appears; click to enter edit mode, modify text, click Regenerate
7. Open the Agent Selector dropdown in the header -- verify agents appear with colored avatars
8. Select a different agent -- verify it persists (reload page, re-open conversation)
9. Type `/ask-pm ` -- verify slash command popover appears with matching commands
10. Type `@` followed by an agent name -- verify mention popover appears
11. Switch between all three themes (Catppuccin Mocha, Tokyo Night, Catppuccin Latte) -- verify agent badge colors are distinguishable
12. (Optional) If you have a conversation with many messages, scroll rapidly to check smoothness
</action>
<verify>User types "approved" or describes issues to fix</verify>
<done>User has approved the complete Phase 22 streaming chat experience</done>
</task>
</tasks>
<verification>
- Full test suite green
- Build succeeds for both UI and server
- User has visually verified the streaming experience
</verification>
<success_criteria>
1. All automated tests pass
2. Build succeeds
3. User approves the streaming experience
</success_criteria>
<output>
After completion, create `.planning/phases/22-agent-streaming/22-04-SUMMARY.md`
</output>