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>
This commit is contained in:
2026-07-03 00:21:23 -04:00
parent 7a5e0a323d
commit c708b6697d
17 changed files with 1342 additions and 31 deletions

View File

@@ -0,0 +1,29 @@
import type { LiveStintData } from '../../types'
import { compoundClass, compoundLetter } from '../../lib/live'
interface Props {
stints: LiveStintData[] | undefined
}
export function StintHistory({ stints }: Props) {
if (!stints || stints.length === 0) {
return <span className="stint-empty">-</span>
}
return (
<span className="stint-seq" data-testid="stint-seq">
{stints.map((stint, index) => (
<span className="stint-item" key={index}>
{index > 0 && <span className="stint-arrow"></span>}
<span
className={`stint-dot ${compoundClass(stint.Compound)}`}
title={`${stint.Compound || 'Unknown'}${stint.New ? ' (new)' : ''} · ${stint.Laps} laps`}
>
{compoundLetter(stint.Compound)}
</span>
{stint.Laps > 0 && <span className="stint-laps">{stint.Laps}</span>}
</span>
))}
</span>
)
}