Skip to content

fix(agent-manager): color PR badge by state, show checks as icon#11785

Merged
marius-kilocode merged 5 commits into
mainfrom
bead-apogee
Jun 29, 2026
Merged

fix(agent-manager): color PR badge by state, show checks as icon#11785
marius-kilocode merged 5 commits into
mainfrom
bead-apogee

Conversation

@marius-kilocode

@marius-kilocode marius-kilocode commented Jun 29, 2026

Copy link
Copy Markdown
Collaborator

Problem

In Agent Manager, the PR badge on each worktree card uses color to encode several unrelated signals at once. A merged PR is purple, an open PR is green, a closed PR is red, but a failing CI check also turns the badge red. Because red is established as the "closed" color, a card with failing tests reads as a closed PR. The PR's lifecycle state and its CI status are two independent things being collapsed onto one color channel.

Change

Split the signals so the badge color means one thing and CI/review status is shown separately:

  • Badge color = PR lifecycle state: open = green, draft = gray, merged = purple, closed = red. A failing check no longer recolors the badge.
  • CI/review results = an icon on the badge, independent of the accent color:
    • Failing checks → red (circle-x)
    • Review requested changes → amber warning
    • Review approved → green check
    • Otherwise → neutral branch icon
  • Checks still running keep the existing pulsing amber badge background. Amber is unambiguous since no lifecycle state uses it, and the animation reads clearly as in-progress. This intentionally keeps the well-liked running-checks treatment rather than moving it to an icon.

A failing open PR is now a green badge with a red ✗, clearly distinct from a red closed-PR badge. Terminal states (merged/closed) show no status icon since their checks are no longer actionable.

This is the focused color/icon fix. Surfacing full PR checks, comments, and merge actions inside Agent Manager is a larger, separate effort and is not part of this change.

Screenshots / tests

The WithPRBadges visual-regression story renders all states in one card list (open passing/approved, open failing, open changes-requested, open checks-running, draft, merged, closed) so the colors and icons are captured side by side. CI generates the baseline PNG (animations are disabled in snapshots, so the running-checks badge appears as a static amber badge).

>
<Icon name={pr().review === "approved" ? "check-small" : "branch"} size="small" />
<span class="am-pr-badge" style={{ "--pr-accent": accent() }} onClick={handleOpenPR}>
<Switch fallback={<Icon name="branch" size="small" />}>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

WARNING: Terminal PRs still render a status icon

prBadgeIndicator() returns "none" for merged and closed PRs, but this Switch falls back to the neutral branch icon. That means terminal badges still render a leading glyph even though the new contract says merged/closed PRs should show no status icon. Consider handling "none" explicitly and rendering nothing for that case.


Reply with @kilocode-bot fix it to have Kilo Code address this issue.

<div style={{ "max-height": "560px", overflow: "auto" }}>
<DndWrap>
<SectionHeader section={sec("s1", 0, { name: "In Review", color: "Blue" })} count={3} {...sectionProps}>
<SectionHeader section={sec("s1", 0, { name: "In Review", color: "Blue" })} count={8} {...sectionProps}>

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

SUGGESTION: Story count no longer matches the rendered badge states

This header count was changed to 8, but the story below renders seven WorktreeItems and the PR description also describes seven states. Leaving it at 8 makes the visual-regression fixture and generated screenshot show a mismatched section count.


Reply with @kilocode-bot fix it to have Kilo Code address this issue.

@kilo-code-bot

kilo-code-bot Bot commented Jun 29, 2026

Copy link
Copy Markdown
Contributor

Code Review Summary

Status: 2 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 1
SUGGESTION 1

Fix these issues in Kilo Cloud

Issue Details (click to expand)

WARNING

File Line Issue
packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx 352 Terminal PR badges still render the neutral branch icon because the Switch fallback handles "none" the same way as an open PR with neutral status.

SUGGESTION

File Line Issue
packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx 578 The section count is set to 8 even though the fixture renders seven PR badge variants, so the screenshot baseline shows a mismatched header.
Files Reviewed (5 files)
  • .changeset/agent-manager-pr-status-icon.md - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/agentmanager-sections/with-pr-badges-chromium-linux.png - 0 issues
  • packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx - 1 issue
  • packages/kilo-vscode/webview-ui/agent-manager/agent-manager.css - 0 issues
  • packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx - 1 issue
Previous Review Summaries (2 snapshots, latest commit f9a977d)

Current summary above is authoritative. Previous snapshots are kept for context only.

Previous review (commit f9a977d)

Status: 2 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 1
SUGGESTION 1

Fix these issues in Kilo Cloud

Issue Details (click to expand)

WARNING

File Line Issue
packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx 352 Terminal PR badges still render the neutral branch icon because the Switch fallback handles "none" the same way as an open PR with neutral status.

SUGGESTION

File Line Issue
packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx 578 The section count is set to 8 even though the fixture renders seven PR badge variants, so the screenshot baseline shows a mismatched header.
Files Reviewed (5 files)
  • .changeset/agent-manager-pr-status-icon.md - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/agentmanager-sections/with-pr-badges-chromium-linux.png - 0 issues
  • packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx - 1 issue
  • packages/kilo-vscode/webview-ui/agent-manager/agent-manager.css - 0 issues
  • packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx - 1 issue

Previous review (commit 9993f99)

Status: 2 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 1
SUGGESTION 1

Fix these issues in Kilo Cloud

Issue Details (click to expand)

WARNING

File Line Issue
packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx 339 Merged and closed PR badges still render the neutral branch icon because the Switch fallback handles "none" the same way as an open PR with neutral status.

SUGGESTION

File Line Issue
packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx 578 The section count is set to 8 even though the fixture renders seven PR badge variants, so the screenshot baseline will show a mismatched header.
Files Reviewed (5 files)
  • .changeset/agent-manager-pr-status-icon.md - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/agentmanager-sections/with-pr-badges-chromium-linux.png - 0 issues
  • packages/kilo-vscode/webview-ui/agent-manager/WorktreeItem.tsx - 1 issue
  • packages/kilo-vscode/webview-ui/agent-manager/agent-manager.css - 0 issues
  • packages/kilo-vscode/webview-ui/src/stories/section-header.stories.tsx - 1 issue

Reviewed by gpt-5.4-2026-03-05 · Input: 44.5K · Output: 3.9K · Cached: 103.9K

Review guidance: REVIEW.md from base branch main

Badge color now reflects only the PR lifecycle state (open/draft/merged/closed),
so a failing check is no longer mistaken for a closed PR. CI and review results are
shown as a separate icon (failing checks, changes requested, approved), and an open
PR whose checks are still running keeps its pulsing amber badge.
@marius-kilocode marius-kilocode merged commit 3037ef6 into main Jun 29, 2026
22 checks passed
@marius-kilocode marius-kilocode deleted the bead-apogee branch June 29, 2026 10:55
vkeerthivikram pushed a commit to vkeerthivikram/kilocode that referenced this pull request Jun 30, 2026
fix(agent-manager): color PR badge by state, show checks as icon
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants