flights_web/docs/superpowers/plans/2026-04-15-phase-2e-routes.md

Phase 2E — Routes + Pages

Parent plan: 2026-04-14-phase-2-online-board-master.md section 2E

Depends on: 2A (UI adapter), 2B (URL serializer), 2C (API hooks), 2D (SignalR wiring)

Scope: 6 route pages under src/routes/[lang]/onlineboard/, 3 feature-specific components in src/features/online-board/components/, barrel export updates, MF expose update.

---

Task inventory

T1 — Shared OnlineBoardSearchPage component

File: src/features/online-board/components/OnlineBoardSearchPage.tsx

Shared component composed by all 4 search pages (flight, departure, arrival, route). Accepts parsed URL params, converts to SearchFlightsParams, wires useOnlineBoard + useLiveBoardSearch + useCalendarDays, renders FlightList + ConnectionStatusBadge (inline). Provides useNavigate callbacks for date changes and flight detail links.

Test: src/features/online-board/components/OnlineBoardSearchPage.test.tsx — renders with mock provider, verifies FlightList presence and navigation wiring.

T2 — OnlineBoardStartPage component

File: src/features/online-board/components/OnlineBoardStartPage.tsx

Start page with plain HTML search form: radio buttons for search mode (flight/departure/arrival/route), text inputs for flight number / airport codes, date input. Submits via useNavigate to the correct search URL using buildOnlineBoardUrl.

Test: src/features/online-board/components/OnlineBoardStartPage.test.tsx

T3 — OnlineBoardDetailsPage component

File: src/features/online-board/components/OnlineBoardDetailsPage.tsx

Flight details page. Accepts IParsedFlightId, wires useFlightDetails + useLiveFlightDetails, renders flight info (legs, stations, times) using FlightCard + inline detail sections.

Test: src/features/online-board/components/OnlineBoardDetailsPage.test.tsx

T4 — Start page route

File: src/routes/[lang]/onlineboard/page.tsx

Renders OnlineBoardStartPage. No API calls. Wraps in SeoHead with basic title.

T5 — Flight search route

File: src/routes/[lang]/onlineboard/flight/[params]/page.tsx

Parses URL via parseFlightUrlParams, renders OnlineBoardSearchPage with type: "flight".

T6 — Departure search route

File: src/routes/[lang]/onlineboard/departure/[params]/page.tsx

Parses URL via parseStationUrlParams, renders OnlineBoardSearchPage with type: "departure".

T7 — Arrival search route

File: src/routes/[lang]/onlineboard/arrival/[params]/page.tsx

Parses URL via parseStationUrlParams, renders OnlineBoardSearchPage with type: "arrival".

T8 — Route search route

File: src/routes/[lang]/onlineboard/route/[params]/page.tsx

Parses URL via parseRouteUrlParams, renders OnlineBoardSearchPage with type: "route".

T9 — Flight details route

File: src/routes/[lang]/onlineboard/[params]/page.tsx

Parses URL via parseFlightUrlParams, renders OnlineBoardDetailsPage.

T10 — Update feature barrel

File: src/features/online-board/index.ts

Add exports for OnlineBoardStartPage, OnlineBoardSearchPage, OnlineBoardDetailsPage.

T11 — Update MF expose

File: src/mf/expose/OnlineBoard.tsx

Replace stub with React.lazy + Suspense loading OnlineBoardStartPage from the feature barrel.

T12 — Verification

Run pnpm typecheck && pnpm lint && pnpm test && pnpm build:standalone.

---

Execution order

T1 → T2 → T3 → T4,T5,T6,T7,T8,T9 (parallel) → T10 → T11 → T12

Commit plan

1. Plan file (this document)
2. Feature components (T1 + T2 + T3 + tests)
3. Route pages (T4-T9)
4. Barrel + MF expose updates (T10 + T11) + verification