[Design] Redesign Planner tool activity
Nobody has claimed this yet.
Assessment
- Difficulty
- 5/5
- Estimated time
- Over a week
- Newbie friendliness
- 35/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- typescript
- Domain
- accessibility, design, frontend
Research direction
Start with the Planner transcript tool activity in apps/web, the existing Chat.Activity summary and disclosure model, and /design-audit#surfaces. Compare AI Elements Tool and related progress components, then produce the required audit specimens and reference comparison before considering migration. Done includes approval, accessibility and reduced-motion evidence, screenshots for required states, and passing bun run types, bun run ci, bun test apps/web/src/chat, and bun run design-audit:test.
Written by the indexing model from the issue text.
Description
Base branch: main
Branch: maggie/redesign-tool-activity
Depends on: None
Goal
Design a clear, compact tool-activity component for Planner messages using an established AI interface pattern.
Context From Planning
- The current “2 tools · 600ms” disclosure and running state feel unfinished and hard to parse.
- Evaluate AI Elements Tool first: https://elements.ai-sdk.dev/components/tool. Task and Chain of Thought may provide useful workflow-progress references.
- External components are candidates for presentation only; Chopin's transcript event model remains the source of truth.
Current Behavior
The transcript summarizes running tools as a loader, tool name, and completed count. Finished runs collapse into count, failure count, and elapsed time, with a simple list of tool names/status/durations when expanded.
Desired Behavior
Provide a polished tool-activity row and disclosure that communicates running, completed, failed, and denied/refused activity clearly without dominating the transcript.
Acceptance Criteria
- A library/reference evaluation documents what can be reused or adapted from AI Elements Tool and related progress components.
- The audit shows zero/one/many tools, running, mixed completed/running, completed, failed, denied/refused, long names, and missing-duration states.
- Summary and expanded rows have clear status icons, labels, elapsed time, and hierarchy.
- Disclosure is keyboard accessible, preserves reduced-motion behavior, and returns a useful accessible name/state.
- The implementation consumes existing
Chat.Activitydata and does not invent events or alter transcript persistence. - Maggie approves the audit specimen before production migration.
Verification Commands
bun run typesbun run cibun test apps/web/src/chatbun run design-audit:test
Primary Surfaces
/design-audit#surfaces- Planner transcript tool activity in
apps/web - Existing
Chat.Activitysummary and disclosure model
Expected PR Checks
- Repo required checks
Report Requirements
- Reference comparison and chosen pattern
- Before/after screenshots for running, completed, and failed states
- Accessibility and reduced-motion evidence
- Any event-model gaps discovered, kept as follow-ups
Implementation Notes
- Keep detailed tool names and status readable without exposing internal payloads or secrets.
- Adapt visual patterns to Chopin tokens and component primitives.
- Preserve current grouping of tool activity with the message that initiated it.
Stop Conditions
- The desired UI requires protocol states Chopin does not currently receive.
- A dependency would impose a conflicting transcript or AI SDK runtime model.
- Dominant language
- TypeScript
- Stars
- 351
- Forks
- 20
- Avg merge
- 14h 7m
- Merged PRs (30d)
- 34
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from githubnext/chopin
-
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
githubnext/chopin#154 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
githubnext/chopin#149 ·
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
githubnext/chopin#165 ·
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
githubnext/chopin#164 ·
-
Difficulty 5/5 Over a week Newbie friendliness 38/100
githubnext/chopin#163 ·
All issues in githubnext/chopin
Similar issues
-
bug(cli): hapi doctor inline-media prints a fabricated B:\ helper-script path in packaged installs Open
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
-
Crush Open
Difficulty 1/5 Under an hour Newbie friendliness 85/100
catppuccin/catppuccin#3125 ·
-
Add a SECURITY.md Open
Difficulty 1/5 Under an hour Newbie friendliness 90/100
ElementsProject/cln-application#167 · 1 comment · 1 reaction ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100
Quantco/pnpm-licenses#17 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 75/100