Files
box-box/frontend/src/components/live/TrackStatusBanner.tsx
AmanTahiliani c708b6697d Upgrade live timing page for race weekends
- Track status flag banner (green/yellow/SC/VSC/red, defensive mapping)
- Weather strip: air/track temp, humidity, wind with compass, rain badge
- Gap trend sparklines from a per-driver interval ring buffer
- Battle detection: consecutive cars within 1.0s chained and highlighted
- Stint history column with compound sequence per driver
- Pinnable drivers (max 3) with focus cards, persisted to localStorage

Pure logic lives in lib/gapHistory.ts and lib/battles.ts with unit
tests; 137 frontend tests passing.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-03 00:21:23 -04:00

18 lines
505 B
TypeScript

import { trackStatusInfo } from '../../lib/live'
interface Props {
status: string | null | undefined
}
export function TrackStatusBanner({ status }: Props) {
if (!status) return null
const info = trackStatusInfo(status)
return (
<div className={`track-banner track-banner-${info.key}`} role="status" data-testid="track-banner">
<span className="track-banner-label">{info.label}</span>
{info.detail && <span className="track-banner-detail">{info.detail}</span>}
</div>
)
}