/ plans / phase_tracking.org
phase_tracking.org
 1  #+title: Phase Tracking: Mission Control Dashboard
 2  #+author: PRD Generator
 3  #+date: [2026-04-02 Thu]
 4  #+startup: indent
 5  #+TODO: TODO STARTED | DONE
 6  
 7  * Phase 1: Aircraft on a Map (Polling)
 8  
 9  - [ ] F1.1 Screenshot showing aircraft markers on map
10  - [ ] F1.2 Screenshot showing polling state (fetching/waiting) in sidebar
11  - [ ] F1.3 Screenshot showing telemetry panel with aircraft data
12  - [ ] F1.4 Screenshot showing error state (simulate network failure)
13  - [ ] F1.5 Code review: server function proxies OpenSky API
14  - [ ] F1.6 Code review: XState polling machine (fromPromise + after)
15  - [ ] F1.7 Code review: error handling in machine workflow
16  
17  * Phase 2: Simulated Mission Assets over WebSocket
18  
19  - [ ] F2.1 WebSocket server running on VPS (node server.js output)
20  - [ ] F2.2 Mission assets streaming in real-time (1s updates)
21  - [ ] F2.3 Asset types distinguished by icon (drone/vehicle/sensor)
22  - [ ] F2.4 Alert sidebar with severity-based colors
23  - [ ] F2.5 WebSocket reconnection after forced disconnect
24  - [ ] F2.6 Code review: XState WebSocket machine (connecting/reconnecting states)
25  - [ ] F2.7 Code review: fromCallback for WebSocket lifecycle
26  
27  * Phase 3: Transit Vehicles via Server-Sent Events
28  
29  - [ ] F3.1 MBTA SSE connection established (API key in URL params)
30  - [ ] F3.2 Transit vehicles appearing on map
31  - [ ] F3.3 Transit telemetry (route, status, speed) visible
32  - [ ] F3.4 Event handler code for reset/update/add/remove
33  - [ ] F3.5 EventSource auto-reconnection (no reconnection state in machine)
34  - [ ] F3.6 Code review: XState SSE machine (streaming only)
35  
36  * UI Integration
37  
38  - [ ] F4.1 Map shows all three asset types simultaneously
39  - [ ] F4.2 Sidebar showing counts by category
40  - [ ] F4.3 Connection status indicators (WS connected, SSE connected)
41  - [ ] F4.4 Clicking any asset displays appropriate telemetry panel
42  - [ ] F4.5 Alert sidebar styling (critical = red, warning = yellow)
43  - [ ] F4.6 Layout responsive on mobile/tablet/desktop
44  
45  * Documentation
46  
47  - [ ] doc/tutorials/tutorial_mission_control_dashboard.org (exists)
48  - [ ] doc/explanation/explanation_realtime_data_patterns.org (exists)
49  - [ ] doc/reference/ref_api_contracts.org (exists)
50  - [ ] doc/howto/*.org files (exists)
51  - [ ] Org-mode style guide compliance (org-review skill)
52  
53  * Final Checklist
54  
55  - [ ] All .ts, .tsx files linting
56  - [ ] No console errors during normal operation
57  - [ ] All three data sources working simultaneously
58  - [ ] Code follows project conventions (one hook per data source)
59  - [ ] Documentation complete and cross-referenced
60  - [ ] PRD acceptance criteria met
61  
62  * Learning Outcomes
63  
64  - [ ] Can explain polling vs WebSocket vs SSE trade-offs
65  - [ ] Can implement XState polling machine with after transitions
66  - [ ] Can implement XState WebSocket machine with fromCallback
67  - [ ] Can implement XState SSE machine without reconnection state
68  - [ ] Can debug connection issues in each transport pattern