Metro pulse — Station Operations
Metro pulse is a metro-station operations app built with the typed AWC UI React wrappers. Monitor 15 fictional stations on three lines, inspect passenger flow, and manage simulated incidents.
Choose Use demo credentials → Sign in, then enter 246810 and press Enter or choose Verify & continue. The one-use recovery code is METR2026. Signup also supports fictional account details and demo verification.
Try it in five minutes
Section titled “Try it in five minutes”- Explore the network. Select a station on the keyboard-operable schematic to open its details. Route chips filter stations and trains by line.
- Inspect passenger flow. Compare entry and exit charts, station occupancy, network KPIs, and sparklines.
- Build a station worklist. Search, filter by status or line, sort, page, and export the station table as CSV.
- Review incidents. Switch between active and resolved incidents, acknowledge an event, and follow it through resolution.
- Control the simulation. Pause trains, change their speed, or pause the network from Settings. Open Make it yours to try color, density, Arabic, right-to-left layout, and light/dark appearance.
Six simulated trains stop at stations and reverse at terminals. Network telemetry updates every 15 seconds. These controls alter browser simulation data only.
Components in context
Section titled “Components in context”| Workflow | AWC components |
|---|---|
| App shell | App bar, Navigation rail, Avatar, Tooltip |
| Station filters and worklists | Chip, Text field, Select, Table |
| Network and station readings | Card, Line chart, Sparkline, Meter, Side sheet |
| Account, settings, and feedback | OTP field, Checkbox, Switch, Color picker, Button, Snackbar |
The metro schematic is application SVG because AWC UI has no metro-map component.
The surrounding controls, table composition, charts, form behavior, and inspection
surfaces use the existing library. React passes arrays, objects, and handlers
through typed component properties and the documented md* events.
Build and data
Section titled “Build and data”Source lives in apps/metro-monitor. Vite compiles the React app with relative
asset URLs, and the documentation build stages it at
/showcase/metro-monitor/react/. The root workspace lockfile manages its local
core, React wrapper, and theme dependencies.
Station locations, telemetry, trains, and incidents are fictional fixtures. Authentication and account changes are kept in memory, with no identity service or operational API. Accounts and incident edits reset on reload; appearance and sidebar layout are browser preferences. The demo verification codes are public.
Run locally
Section titled “Run locally”From the repository root, with core, React wrappers, and theme built:
pnpm --filter @awc-ui/metro-monitor devOpen Metro pulse locally. The build includes TypeScript
checking, and pnpm --filter @awc-ui/metro-monitor test exercises domain,
authentication, simulation, export, and optional agent-tool contracts.