Web client
apps/client is the browser app that staff, drivers, and partners use. It's a Vite single-page application built with React 19.
Stack
- Vite 7 for the build and dev server (port 3000).
- React 19 with the TanStack suite — Router for navigation, Query for server state, Store for local and form state.
- Tailwind CSS v4 with shadcn-style components over Base UI.
- Mapbox for route planning and the impact map.
- dnd-kit for drag-and-drop (for example, ordering route stops).
- ORPC client for all API calls, wrapped in TanStack Query utilities.
- Sentry (
@sentry/react) for client-side error monitoring in staging and production.
Layout
apps/client/src/
main.tsx — app entry; mounts the router
routes/ — file-based routes (TanStack Router)
_authenticated.tsx — auth + role guard for protected routes
.../-helpers/ — route-local components and hooks
components/ — shared UI components
helpers/ — orpc client, api base URL, and other app glue
lib/ — utilities (Sentry init, color schemes, …)
env.ts — build-time VITE_* configurationThe imports map in package.json aliases #/* to ./src/*, so you'll see imports like import { orpc } from '#/helpers/orpc'.
Scripts
cd apps/client
bun run dev # Vite dev server on port 3000
bun run build # production build
bun run preview # serve the production build locally
bun run test # component/unit tests (Vitest)
bun run env-check # validate VITE_* configurationConfiguration
Client configuration is build-time and prefixed VITE_, validated in apps/client/src/env.ts. On localhost the client automatically targets the API at http://localhost:8080; in hosted environments the base URL is derived from the deployment.
How it's organized
For how routing, data fetching, state, and UI fit together, see Frontend architecture. For naming, element IDs, and styling rules, see Conventions.
Deployment
The client builds into a static bundle via apps/client/Dockerfile and deploys to Railway (two replicas in production). See Build and deploy.