mirror of
https://github.com/paperclipai/paperclip.git
synced 2026-10-06 21:05:21 +02:00
DottaandPaperclip
d7bdfc422c
## Thinking Path > - Paperclip helps people manage AI agents and their work. > - Agent chat shows which agent receives each message. > - The chat header used initials instead of the agent avatar. > - The name and controls did not use the same center alignment. > - This change uses the shared avatar and centers the header content. > - Users can identify the agent and open its settings from the same row. ## Linked Issues or Issue Description **What happened?** The agent chat header showed initials instead of the agent avatar. The settings control did not align with the name and avatar. **Expected behavior** Show the agent avatar. Put the avatar, name, and settings control on the same horizontal center line. **Steps to reproduce** 1. Enable Agent Chat in Experimental settings. 2. Open a conversation with an agent that has an appearance set. 3. Check the avatar and settings control in the top bar. Related navigation work: #14706. ## What Changed - Use `AgentAvatar` in the conversation breadcrumb. - Update the breadcrumb key when the agent appearance changes. - Center breadcrumb labels that have an adjacent action. Keep task identifier baseline alignment unchanged. - Add regression checks for avatar props, appearance changes, and center alignment. ## Verification - PASS: affected Vitest suites, 129 tests. - PASS: `pnpm check:token-gates`. - PASS: `pnpm --filter @paperclipai/ui typecheck` on an isolated retry. - PASS: `pnpm --filter @paperclipai/ui build`. - PASS: browser checks at 1000 and 390 CSS pixels. Avatar, name, and settings control all have center Y = 29.5 CSS pixels. - Screenshots use the real header and avatar renderer with isolated context fixtures. No screenshot or fixture is part of this diff. - Full typecheck and build cannot complete because Cargo is not installed. - Full tests stopped with SIGKILL. The first UI typecheck also stopped with exit 137. These runs do not prove full-suite success. ## Risks - Low risk. The change only affects UI rendering. It changes no API or database contract. - Breadcrumbs with adjacent actions now use center alignment. Ordinary task identifiers keep baseline alignment. ## Model Used OpenAI Codex agent, with code editing, shell tools, and browser checks. The runtime did not expose the exact model ID or context-window size. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [x] I have searched GitHub for duplicate or related PRs and linked them above - [x] I have either (a) linked existing issues with `Fixes: #` / `Closes #` / `Refs #` OR (b) described the issue in-PR following the relevant issue template - [x] I have not referenced internal/instance-local Paperclip issues or links (only public GitHub `#NNN` / `github.com/paperclipai/paperclip` URLs) - [ ] My branch name describes the change (e.g. `docs/...`, `fix/...`) and contains no internal Paperclip ticket id or instance-derived details - [x] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [ ] All Paperclip CI gates are green - [ ] Greptile is 5/5 with no open P2s, recommendations, or follow-ups - [x] I will address all Greptile and reviewer comments before requesting merge No behavior or command documentation needs an update for this rendering fix. The execution environment requires the assigned branch name to stay unchanged. Pending review gates are not marked complete. Co-authored-by: Paperclip <noreply@paperclip.ing>
@paperclipai/ui
Published static assets for the Paperclip board UI.
What gets published
The npm package contains the production build under dist/. It does not ship the UI source tree or workspace-only dependencies.
Storybook
Storybook config, stories, and fixtures live under ui/storybook/.
pnpm --filter @paperclipai/ui storybook
pnpm --filter @paperclipai/ui build-storybook
Typical use
Install the package, then serve or copy the built files from node_modules/@paperclipai/ui/dist.
Editor dependency identity
Keep the root and workspace overrides for @codemirror/state,
@codemirror/view, and @lezer/common aligned. CodeMirror requires shared
extension identity, while Lezer parsers and syntax highlighters require shared
NodeProp IDs. Multiple Lezer copies can crash code-block highlighting with
tags is not iterable. src/lib/codemirror-single-instance.test.ts checks the
installed dependency graph and highlights sample code through the editor's real
language dependencies. GitHub Actions owns regeneration of pnpm-lock.yaml.