mirror of
https://github.com/vernu/textbee.git
synced 2026-07-30 17:07:46 -04:00
ad7bcd99a5
The status pill hardcoded a check mark and varied only its colour, so a past_due or canceled subscriber was shown a tick beside the bad news. It also fell back to the label "Active" when the payload carried no status at all, inventing a healthy state on a billing screen. The icon now comes from the status, and an absent status reads "Unknown". formatPrice returned "Free" whenever the currency was missing, even with a real amount. Since the badge only renders when amount > 0, the one case it could produce was a paying customer being shown "Free / monthly". Default the currency instead. The page also derived its usage numbers inline instead of calling deriveUsage, which exists precisely so billing and the dashboard cannot disagree. The inline copy skipped the helper's 0-100 clamp, so the invariant was already broken. Monthly is a rolling 30-day window server-side, not a calendar month, which the dashboard already labels correctly. Billing said "this month", so a user capping out late in the month would wait for a reset that never arrives. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
45 lines
1.6 KiB
TypeScript
45 lines
1.6 KiB
TypeScript
import { describe, expect, it } from 'vitest'
|
|
import { AlertTriangle, Check, CircleHelp, XCircle } from 'lucide-react'
|
|
import {
|
|
subscriptionStatusIcon,
|
|
subscriptionStatusTone,
|
|
usageMeterColor,
|
|
} from './status'
|
|
|
|
// The billing card used to hardcode a check mark next to whatever the status
|
|
// text said, so a past_due or canceled subscriber was reassured with a tick at
|
|
// exactly the moment they needed a warning.
|
|
describe('subscriptionStatusIcon', () => {
|
|
it('only shows a check for an active subscription', () => {
|
|
expect(subscriptionStatusIcon('active')).toBe(Check)
|
|
})
|
|
|
|
it('warns rather than reassures when something is wrong', () => {
|
|
expect(subscriptionStatusIcon('past_due')).toBe(AlertTriangle)
|
|
expect(subscriptionStatusIcon('canceled')).toBe(XCircle)
|
|
})
|
|
|
|
it('does not claim health for an unknown or missing status', () => {
|
|
expect(subscriptionStatusIcon(undefined)).toBe(CircleHelp)
|
|
expect(subscriptionStatusIcon(null)).toBe(CircleHelp)
|
|
expect(subscriptionStatusIcon('something_new')).toBe(CircleHelp)
|
|
})
|
|
})
|
|
|
|
describe('subscriptionStatusTone', () => {
|
|
it('keeps tone and icon agreeing about severity', () => {
|
|
expect(subscriptionStatusTone('active').text).toContain('green')
|
|
expect(subscriptionStatusTone('past_due').text).toContain('amber')
|
|
expect(subscriptionStatusTone(undefined).text).toBe('text-muted-foreground')
|
|
})
|
|
})
|
|
|
|
describe('usageMeterColor', () => {
|
|
it('escalates with usage', () => {
|
|
expect(usageMeterColor(0)).toBe('bg-green-500')
|
|
expect(usageMeterColor(79)).toBe('bg-green-500')
|
|
expect(usageMeterColor(80)).toBe('bg-amber-500')
|
|
expect(usageMeterColor(100)).toBe('bg-red-500')
|
|
})
|
|
})
|