fix(budget): display 'invoiced' badge instead of confidence pill for invoiced budget lines#576
Conversation
…ed budget lines - Budget lines with invoices show green invoiced badge instead of confidence level pill - Work items and household items with costDisplay=actual show invoiced badge next to title - Remove green row tinting (rowActual/rowMixed classes) - badge is sufficient indicator - Update 4 existing tests and add 10 new tests covering all badge scenarios Fixes #575 Co-Authored-By: Claude frontend-developer (Haiku) <noreply@anthropic.com> Co-Authored-By: Claude qa-integration-tester (Haiku) <noreply@anthropic.com> Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
steilerDev
force-pushed
the
fix/575-invoiced-badge-confidence-pill
branch
from
e502bb3 to
9583335
Compare
steilerDev
left a comment
steilerDev
left a comment
There was a problem hiding this comment.
[security-engineer]
PR #576 reviewed. This is a purely visual change — swapping CSS row-highlight classes for an inline badge in three render functions (BudgetLineRow, WorkItemRow, HouseholdItemRow) plus the corresponding CSS class and test updates.
Security checklist:
- No user input handling or API surface changes
- No dangerouslySetInnerHTML, innerHTML, or eval usage — badge text is the static string literal
'invoiced', not any user-supplied value - No new dependencies introduced
- No auth or authorization logic touched
- No sensitive data exposure paths
- No CORS, CSP, or cookie changes
No security findings.
steilerDev
left a comment
steilerDev
left a comment
There was a problem hiding this comment.
[product-architect]
Review Summary
Clean, well-scoped bug fix. The change correctly replaces the green row tinting (rowActual/rowMixed classes) with an explicit "invoiced" badge for fully invoiced lines and work/household items. Tests are thorough — 4 updated scenarios + 10 new cases covering both entity types and all costDisplay states.
Design Token Compliance
The .invoicedBadge class uses exclusively design tokens (--font-size-xs, --font-weight-medium, --spacing-0-5, --spacing-2, --radius-full, --color-success-badge-bg, --color-success). All tokens exist in tokens.css and have dark mode overrides in the [data-theme="dark"] block. No hardcoded values — fully compliant.
Findings
Low: Dead CSS classes remain
.rowActual and .rowMixed are still defined in CostBreakdownTable.module.css (lines ~225-237) but are no longer applied anywhere in the TSX. These are now dead code. Not blocking — can be cleaned up in a follow-up or as part of the next touch to this component.
No other issues found. The badge pattern (pill shape, success color, capitalize text) is consistent with existing badge conventions in the codebase (status badges, confidence badges).
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
🎉 This PR is included in version 1.13.0-beta.25 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
|
🎉 This PR is included in version 1.13.0 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
2 participants
Summary
Fixes issue #575 — invoiced budget lines now display an "Invoiced" badge instead of the confidence level indicator.
Changes
.rowActualclass). When a budget line has an invoice, display "Invoiced" badge instead of confidence pill.costDisplay === 'actual'..invoicedBadgeclass with success styling (green background, success text color).Design Rationale
Co-Authored-By: Claude frontend-developer (Haiku 4.5) noreply@anthropic.com