Skip to content

fix(web): pull request state badge matches the redesign's status chips - #29182

Merged
maria-rcks merged 1 commit into
pingdotgg:maria/redesign/3-panels-pagesfrom
flamboh:t3/redesign-fix-pr-state-badge-chip
Nov 2, 2026
Merged

maria-rcks merged 1 commit into
pingdotgg:maria/redesign/3-panels-pagesfrom
flamboh:t3/redesign-fix-pr-state-badge-chip

Conversation

@flamboh

@flamboh flamboh commented Nov 2, 2026 •

Copy link
Copy Markdown
Contributor

Note

🤖 Claude Opus 5.5 on behalf of Oliver

Fix for the redesign stack, targets layer 3 (#28841).

The state badge in the pull request header (Closed, Merged, Draft) was a bordered pill that didn't match the redesign's other chips.

It now uses the same chip as the sidebar's thread status pills (Badge size="status"): borderless tint, 18px tall, full-strength 10px glyph. The sidebar already draws a PR "Merged" pill with it, so the header and the sidebar now show PR state the same way. Each state keeps its glyph and hue through Badge's existing state variants: Closed error, Merged merged, Draft secondary. Open PRs still show no badge.

No other surface used the old pill. List rows, tabs, and the link hover card show PR state as a glyph or plain text, so they are unchanged.

Before / after

Rendered from the real PullRequestDetailCrumbs header for each state (rows: Closed, Merged, Draft, Open), dark theme. The bottom row is the sidebar's own status chips, for comparison. A live capture on a fresh dev server needs GitHub access for PR details.

Before (layer 3) After
Before: bordered outlined Closed, Merged and Draft pills in the PR header After: the header state badges are borderless sidebar-style status chips with the same icons and colors, matching the sidebar row at the bottom

Claude Opus 5.5 in Claude Code

@github-actions github-actions Bot added vouch:trusted PR author is trusted by repo permissions or the VOUCHED list. size:S 10-29 changed lines (additions + deletions). labels Nov 2, 2026
@macroscopeapp

macroscopeapp Bot commented Nov 2, 2026

Copy link
Copy Markdown
Contributor

Approvability

Verdict: Approved at 18f58ae

Macroscope's review found this PR approvable — The pull-request breadcrumb now uses the shared status-chip styling while preserving existing labels and visibility rules. The change is presentation-only and introduces no material behavioral or data risk.

You can add or adjust custom eligibility rules. Learn more.

@maria-rcks

Copy link
Copy Markdown
Collaborator

Note

Written by gpt-6.1-sol on behalf of Maria

Verified in a real dev environment

verified head 18f58ae0bd19ef1a6b42455a8596fcdbfc0fbfdf in the running web app on a linux boat vm, using repo playwright and /usr/bin/google-chrome.

  • installed and ran github/main (6f41364805) in a separate worktree first, then stopped it and ran the exact pr head. main shows an outlined merged pill. main and this redesign stack have different header layouts, so these full-app captures include that baseline difference.
  • created projects pointing at the real checkout and submitted real codex gpt-6.1-sol turns through the composer on both versions. the client displayed verification ready.. repeated the turn with isolated pr server state after restarting.
  • loaded real git.cafe pr details: merged 28887, closed 29531, draft 25276, and open 29182. merged, closed, and draft render the correct label and glyph at 18px tall, with 10px glyphs and transparent borders. open renders no state badge.
  • exercised summary, timeline, and code selection. inspected the merged chip in light and dark appearance and the open-pr layout at 1000px width.
  • blacksmith: existing PullRequestDetailPanel.permissions.browser.test.tsx passed all 3 tests. published ci is green. no source changes were needed.

before, main, same merged pr:

main showing the outlined merged pill for pr 28887

after, exact pr head:

pr head showing the shared merged status chip for pr 28887

recording, trimmed to the loaded states and tab interaction:

merged closed draft and open headers followed by tab selection

Not verified

native electron, ios, and android clients; macos and windows; remote relay or tunnel connections; other source-control hosts. this change is in the web header component. no merge, close, draft-state, checkout, or other repository mutation was performed.

@maria-rcks
maria-rcks merged commit 8bb8bed into pingdotgg:maria/redesign/3-panels-pages Nov 2, 2026
31 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size:S 10-29 changed lines (additions + deletions). vouch:trusted PR author is trusted by repo permissions or the VOUCHED list.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants