Center the agent icon in the footprint render_icon_with_status reserves - #14930
Center the agent icon in the footprint render_icon_with_status reserves#14930bobrnor wants to merge 2 commits into
Conversation
`render_icon_with_status` reserves a `total_size` square through `Stack::layout`'s `constraint.min`, but the brand circle inside it is only `CIRCLE_RATIO` (0.76) of that, and neither `ConstrainedBox` nor `Stack` centers a child -- both paint at the origin. The circle was left flush against the box's top-left with `total_size * 0.24` of dead space on its right and bottom. That has two visible consequences on every surface carrying an agent avatar: - The trailing gap grows by the slack. The vertical tabs sidebar rendered ~14px between the avatar and the title instead of the 8px `ICON_WITH_STATUS_GAP` asks for. - `corner_overlay_offset` anchors the status badge to the box's bottom-right, which only lands inside the circle's edge while the circle is centered. Left-aligned, the badge sat clear of the circle instead of tucked into it. Routing the circle through an `Align` restores both. The new test reads the painted rect out of the scene: the circle moves from (0, 0) to (2.88, 2.88) in a 24px footprint. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LF4ZTotC6MZwg1DAto3VRt
|
Every PR must be linked to a same-repo issue before Oz can review it. Next step: open or find a same-repo issue describing this change, then link it to this PR by adding See the contribution guidelines for the full readiness model. Powered by Oz |
There was a problem hiding this comment.
Every PR must be linked to a same-repo issue before Oz can review it.
Next step: open or find a same-repo issue describing this change, then link it to this PR by adding Closes #123 to the PR description (or using the "Development" sidebar on GitHub). A maintainer will mark the issue ready-to-implement when it is ready. Once it is marked, comment /oz-review to re-trigger review.
See the contribution guidelines for the full readiness model.
Powered by Oz
The comment claimed a left-aligned circle also grew the caller's trailing gap by the slack. It does not: `ConstrainedBox` reports the size it was constrained to, not its child's, so the component reserves the full footprint either way. What the misalignment actually breaks is the badge, which is anchored to the footprint's corner and so floats detached once the circle pulls away from it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LF4ZTotC6MZwg1DAto3VRt
Description
Every surface that draws an agent avatar — the vertical tabs sidebar, the conversation list, agent notifications, ambient agent blocks, pane rows — has been rendering it flush against the top-left of the box it reserves, instead of centered in it. Two things fall out of that, and both are visible:
render_icon_with_statusreserves atotal_sizesquare, but the brand circle is onlyCIRCLE_RATIO(0.76) of it. Left-aligned, the remaining 24% piles up as dead space on the right, on top of whatever gap the caller already asked for. In the vertical tabs sidebar that reads as ~14px between the avatar and the title whereICON_WITH_STATUS_GAPasks for 8.corner_overlay_offsetanchors the badge to the box's bottom-right corner. That geometry only puts the badge inside the circle's edge — which is what the comment onCIRCLE_RATIOsays it is for — while the circle is centered in the box. Left-aligned, the badge's center lands outside the circle and the badge reads as hanging off the avatar.The cause is that neither
ConstrainedBoxnorStackcenters a child:ConstrainedBox::layoutonly tightens the constraint it passes down and then paints the child at the origin it was handed, andStacktakes its size fromconstraint.minbut likewise paints non-positioned children at its own origin. So the reserved footprint was correct and the artwork inside it was not. Routing the circle through anAlignfixes both symptoms at once, and makes the two comments that already describe the intended geometry true.Reported against the vertical tabs sidebar; the fix is in the shared component, so it lands everywhere.
Linked Issue
Closes #14958.
ready-to-implement. — Agent avatar renders flush top-left in its reserved box, widening the title gap and pushing the status badge off the circle #14958 was filed alongside this PR and has not been triaged yet.Related
warpdotdev/warp#14893hit the same defect in the orchestration pill bar and worked around it there, centering inside its ownCustomAvatarelement and leavingicon_with_status.rsas a comments-only diff. That PR's avatar already fills the wholetotal_sizebox, so centering an element the size of its container is a no-op and the two changes compose without double-centering.Testing
brand_circle_is_centered_in_the_reserved_footprintrenders the component into a headless presenter and reads the painted rect straight out of the scene, so this is measured rather than eyeballed:(0.0, 0.0)(2.88, 2.88)2.88is24 * (1 - 0.76) / 2— the circle centered in a 24px footprint. The test fails on the pre-fix code with exactly that diff, so it pins the behavior rather than passing vacuously../script/format,cargo clippy -p warp --all-targets --tests -- -D warnings, andcargo nextest run -p warp --lib icon_with_status(4/4) are clean../script/runNot checked deliberately:
./script/runbuilds the OSS channel without internal channel-config access, and a fresh instance has no agent conversation to draw an avatar for, so it cannot show this surface. The scene-level assertion above is the evidence; a look at the sidebar on a build with real agent panes is still worth having before merge.Screenshots / Videos
To be attached.
Agent Mode