mirror of
https://github.com/AmanTahiliani/box-box.git
synced 2026-08-07 11:54:59 -04:00
66 lines
2.6 KiB
Markdown
66 lines
2.6 KiB
Markdown
|
# Phase 8 Analytics Visuals
|
||
|
|
|
||
|
|
## Purpose
|
||
|
|
|
||
|
|
Phase 7 added the backend data foundation for Race Hub analytics: stints, pit
|
||
|
|
stops, positions, race control, weather, and laps now flow through the local
|
||
|
|
SQLite store, ingestion, query layer, and `/api/v1/race-hub`.
|
||
|
|
|
||
|
|
Phase 8 returns to frontend work. The goal is to replace the Strategy and
|
||
|
|
Position placeholder states with useful, production-minded views that consume
|
||
|
|
the real local-first analytics arrays now present in the Race Hub payload.
|
||
|
|
|
||
|
|
## Scope
|
||
|
|
|
||
|
|
Build the first real analytics views for:
|
||
|
|
|
||
|
|
- race strategy from stints and pit stops;
|
||
|
|
- position evolution from position samples;
|
||
|
|
- lightweight supporting context from race control, weather, and laps where it
|
||
|
|
improves the view without making the screen noisy.
|
||
|
|
|
||
|
|
The work should stay inside the React Race Hub surface. Do not redesign the
|
||
|
|
whole application shell in this phase.
|
||
|
|
|
||
|
|
## Frontend Work
|
||
|
|
|
||
|
|
Expected changes:
|
||
|
|
|
||
|
|
- pass `stints`, `pit_stops`, `positions`, `race_control`, `weather`, and `laps`
|
||
|
|
into the relevant Race Hub components;
|
||
|
|
- replace "chart not yet implemented" placeholders with real visual treatment;
|
||
|
|
- preserve honest missing-data states for sessions that only have core datasets;
|
||
|
|
- keep the design dense, technical, and F1-native;
|
||
|
|
- add focused component/unit tests for available and missing analytics data;
|
||
|
|
- update Playwright coverage so seeded analytics views prove the real data path
|
||
|
|
works.
|
||
|
|
|
||
|
|
## Visual Direction
|
||
|
|
|
||
|
|
Prefer timing-wall clarity over dashboard decoration:
|
||
|
|
|
||
|
|
- stint bars should be compact and scan-friendly;
|
||
|
|
- team colors should identify drivers without overpowering compound colors;
|
||
|
|
- compound colors should be disciplined and legible;
|
||
|
|
- position evolution should make gain/loss and driver comparison obvious;
|
||
|
|
- avoid decorative cards, giant empty panels, vague gradients, and generic SaaS
|
||
|
|
chart chrome.
|
||
|
|
|
||
|
|
## Guardrails
|
||
|
|
|
||
|
|
- Do not fetch OpenF1 directly from React.
|
||
|
|
- Do not add a heavy charting library unless the local interaction genuinely
|
||
|
|
needs it; SVG/CSS is enough for this first slice.
|
||
|
|
- Do not hide missing datasets behind fake mock data in runtime views.
|
||
|
|
- Keep mobile and iPad layouts usable, not just desktop-polished.
|
||
|
|
- Keep backend changes out of scope unless a clear API bug is discovered.
|
||
|
|
|
||
|
|
## Acceptance Criteria
|
||
|
|
|
||
|
|
- Strategy tab renders real stint/pit information when analytics data exists.
|
||
|
|
- Position tab renders real position information when position samples exist.
|
||
|
|
- Missing-data sessions still show clear unavailable states.
|
||
|
|
- Existing Race Hub views keep working.
|
||
|
|
- Frontend tests and build pass.
|
||
|
|
- Playwright Race Hub e2e passes against the seeded local database.
|