Three low-severity findings from the /code-review high self-pass: - Plex duration: the "Any" chip no longer false-highlights when durationMin/Max hold a set-but-off-bucket value (stale/version-skew state) — it selects nothing then, matching the pre-sweep behaviour, instead of colliding on the empty-string sentinel. - FilterChipGroup: count badge now guards on count > 0 (was `!= null`), matching the Tabs badge so a future count:0 can't render a stray "0" pill. - Extract the shared CountBadge component; Tabs and FilterChipGroup now render the count-badge token from one source (was two near-identical inline spans). gate green (tsc/eslint-0/vitest 136/knip/prettier). Duration self-E2E'd: bucket select + Any toggle intact. Branch not merged.
16 lines
708 B
TypeScript
16 lines
708 B
TypeScript
// A small count pill shown beside a tab label or filter chip (pending requests, item counts). One
|
|
// source for the count-badge token so Tabs and FilterChipGroup can't drift. The `active` variant sits
|
|
// on an accent-filled parent (a pressed tab/chip), so it tints against accent-fg; the resting variant
|
|
// carries its own accent tint. Callers guard on `count > 0` — this just renders the pill.
|
|
export default function CountBadge({ count, active }: { count: number; active?: boolean }) {
|
|
return (
|
|
<span
|
|
className={`tabular-nums text-2xs leading-none px-1.5 py-0.5 rounded-full ${
|
|
active ? "bg-accent-fg/20" : "bg-accent/20 text-accent"
|
|
}`}
|
|
>
|
|
{count}
|
|
</span>
|
|
);
|
|
}
|