refactor(web): add a label variant to Badge

[juliusmarminge]

Pull request labels drove their colour through a --label custom property
in className. Expose variant="label" (the color-mix recipe, driven by
the --label style the consumer sets). The sidebar environment pill, the
traits default badge and the keybinding source badge each hand-rolled a
quieter or rounder badge; a badge has one radius and outline is the
quiet one.

Visible effect: pull request labels and the sidebar environment pill are
rounded-sm instead of pills; the traits picker's Default badge and the
keybinding source badge are standard sm outline badges.

Lowers the no-restyle ceiling from 713 to 690.

Layer 10 of 24 in stack #13044, ordered least to most opinionated. Part of the components/ui className cleanup (audit and guardrail: #12982). Each layer lowers the shadcn/no-restyle ceiling; CI fails if the count rises. For every override cluster the question was "is this a real design-system concept, or should the primitive get stricter and the consumers change?"; a prop was only added for the former.

Written by Claude Fable 5 in Claude Code.

🤖 Generated with Claude Code

Summary by CodeRabbit

• Style
  • Standardized badge sizing, spacing, typography, and layout across chat, pull request, settings, and sidebar interfaces.
  • Updated pull request label badges to use consistent styling while preserving label-specific colors.
  • Added support for light and dark label badge colors based on each label’s configured color.
  • Simplified the appearance of the environment identification pill for a more consistent interface.

[macroscopeapp]

Approvability

Verdict: Approved at b406d21

Macroscope's review found this PR approvable — This is a contained Badge styling refactor with minor, explicit visual changes across existing UI paths and no changes to product behavior, data contracts, security-sensitive code, or deployment. The new label variant centralizes an existing color recipe, while the lint threshold becomes stricter rather than suppressing diagnostics.

^{You can add or adjust custom eligibility rules. Learn more.}

[github-actions]

Thread transfer impact

✅ Thread transfer remains within every enforced ceiling.

ℹ️ No successful main baseline artifact is available yet. This run establishes the initial measurement.

Provider	Metric	Main baseline	This PR	Impact	PR ceiling
Codex	Total thread wire	—	13.5 KiB	—	15.1 KiB	✅
Codex	Thread snapshot wire	—	7.1 KiB	—	7.3 KiB	✅
Codex	Live turn WebSocket wire	—	6.4 KiB	—	7.8 KiB	✅
Codex	Live turn WebSocket decoded	—	56.2 KiB	—	66.4 KiB	✅
Codex	Live turn messages	—	9	—	21	✅
Claude	Total thread wire	—	13.5 KiB	—	15.1 KiB	✅
Claude	Thread snapshot wire	—	7.1 KiB	—	7.3 KiB	✅
Claude	Live turn WebSocket wire	—	6.4 KiB	—	7.8 KiB	✅
Claude	Live turn WebSocket decoded	—	57.0 KiB	—	66.4 KiB	✅
Claude	Live turn messages	—	9	—	21	✅

Baseline: unavailable · PR result: b406d21 · Source CI: success

Scenario and decoded snapshot size

10 historical turns, 5 command tools per turn, 878.9 KiB retained MCP result per historical turn, and a 1.05 MiB retained result in the measured turn.

• Codex decoded thread snapshot: 114.0 KiB
• Claude decoded thread snapshot: 114.6 KiB

Updated in place by a trusted workflow. PR artifacts are strictly validated and never executed.

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: pingdotgg/t3code/.coderabbit.yaml

Review profile: CHILL

Plan: Team

Run ID: d81a7373-e7ad-4b0d-9e22-1a65e09b94f7

📥 Commits

Reviewing files that changed from the base of the PR and between 4e3538c and b406d21.

📒 Files selected for processing (1)

• scripts/lint-restyle-ceiling.ts

Limit details: You’ve used all 10 included reviews currently available.

---

📝 Walkthrough

Walkthrough

The change adds a shared label badge variant, updates badge consumers to use shared styling, removes local overrides, and lowers the restyle lint ceiling.

Changes

Badge restyle

Layer / File(s)	Summary
Shared label badge variant apps/web/src/components/ui/badge.tsx	Adds a label variant that derives colors from --label.
Badge consumer alignment apps/web/src/components/chat/TraitsPicker.tsx, apps/web/src/components/pullRequest/pullRequestPresentation.tsx, apps/web/src/components/settings/KeybindingsSettings.tsx, apps/web/src/components/sidebar/SidebarChrome.tsx, scripts/lint-restyle-ceiling.ts	Updates badge consumers to use shared sizing and variants, removes local styling overrides, and lowers the lint finding ceiling from 1031 to 1008.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Refactor

Merge Risk: ⚪ Minimal · up to b406d

The change is mergeable with no concrete current-head compatibility or runtime risk identified.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 25.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 4 functions across 6 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the main change: adding a label variant to Badge.
Description check	✅ Passed	The description explains the Badge variant, consumer changes, visible UI effects, cleanup context, and rationale. It omits the template headings, checklist, and UI screenshots, and its restyle ceiling…
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

• Fix all pre-merge checks with AI

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Commit to this branch
• Create a new PR

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

Usage-based review receipt

• Mode: Continue automatically
• Reviewed files: 1
• Charged: $0.25
• View usage details

Note

This review was completed with usage-based billing: files reviewed beyond your plan's included limits are billed at $0.25/file. View usage-based billing.

---

_{Comment @coderabbitai help to get the list of available commands.}

Dismissing prior approval to re-evaluate b406d21