Transit Planner

Overview

Transit Planner is a Next.js (App Router) frontend centered around an interactive Mapbox GL editor. It includes GTFS import/export utilities and an AI council interface that can stream route proposals. Some analysis modules are not yet implemented and are called out as "in the works."

The application is structured as a single Next.js project under /web. All client-facing logic lives in src/app and src/lib. Server-side API routes live under src/app/api and should not be modified unless you are extending server functionality.

Technology Stack

Next.js 15

App Router framework

React 19

UI rendering

Mapbox GL

Map rendering

Tailwind CSS 4

Styling

Three.js

3D globe on landing

Auth0

Authentication

Supabase

Data persistence

Google Sans

Typography

Primary Modules

Map Editor

src/app/_components/TransitMap.tsx

The main Mapbox GL editor. Manages all map state: routes, stops, neighbourhoods, draw modes, overlays, undo/redo, GTFS export/import, and council preview visualization.

Lines Panel

src/app/_components/map/RoutePanel.tsx

Displays route details, stops list, population served, and line controls. Used for both static and generated routes.

Station Popup

src/app/_components/map/StationPopup.tsx

Positioned popup with station info, connections, AI-generated station analysis, and estimated ridership.

Neighbourhood Panel

src/app/_components/map/NeighbourhoodPanel.tsx

Shows neighbourhood context: population density, traffic level, employment info, street view imagery, and transit lines in the area.

AI & Chat

Chat Panel

src/app/_components/ChatPanel.tsx

Multi-agent chat interface. Hosts five distinct planning agents, streams responses, extracts route proposals from markdown, and generates HTML reports.

GTFS Utilities

GTFS Export

src/lib/gtfs.ts

Generates core GTFS CSVs (routes, stops, stop_times, trips, shapes) and zips them for download. Includes built-in validation before export.

GTFS Import

src/lib/gtfs-import.ts

Reads a GTFS ZIP and converts it into Route objects compatible with the map editor's internal state.

Data

Static Route Data

src/app/map/transit-data.ts

Base routes and stops pre-loaded into the editor. Contains the default Toronto transit network (~745KB). Used as the starting dataset.

Geo Utilities

src/app/map/geo-utils.ts

Geospatial helper functions: great-circle calculations, bounds computation, coordinate projections, and stop distance utilities.

Runtime & Deployment

Local developmentRun the Next.js dev server and point it at your own backing services (AI model provider, auth, storage).

Self-hosted / serverBuild and deploy the Next.js app to any server or platform that supports Node.js (e.g., Vercel, Fly.io, AWS).

Mapbox dependencyRequires a public Mapbox access token. Map tiles and geocoding run client-side against the Mapbox API.

Environment Variables

Set these in a .env.local file at the project root (or in your deployment platform's environment settings).

NEXT_PUBLIC_MAPBOX_TOKENRequired

Public Mapbox access token. Used for map tile rendering, geocoding, and map interactions. Exposed to the browser.

AUTH0_SECRETOptional

Auth0 session secret for server-side session encryption. Required if authentication is enabled.

AUTH0_BASE_URLOptional

The base URL of your deployment (e.g., http://localhost:3000). Used by the Auth0 SDK for callback URLs.

AUTH0_ISSUER_BASE_URLOptional

Your Auth0 tenant domain (e.g., https://your-tenant.auth0.com).

AUTH0_CLIENT_IDOptional

Auth0 application client ID.

AUTH0_CLIENT_SECRETOptional

Auth0 application client secret. Server-side only, never exposed to the browser.

NEXT_PUBLIC_SUPABASE_URLOptional

Supabase project URL for data persistence features.

NEXT_PUBLIC_SUPABASE_ANON_KEYOptional

Supabase anonymous public key. Used for client-side data operations.

Roadmap (In the Works)

The following modules are planned and not yet fully implemented:

Accessibility analysis inputs

Upload/retrieve datasets for accessibility analysis: street network, zones, destinations, and demographics.

r5 routing integration

Integration with the r5 routing engine and open-source accessibility/equity libraries.

Accessibility dashboard

Dashboard for travel times, accessibility results, and equity indicators across the designed network.

Expanded exports

Export formats beyond GTFS — maps, full datasets, and summary planning reports.

Technical Documentation