# Frontend (Vite + React + TS)

Single-page app served by Nginx in production. Uses Vite for build/dev, React Router, and debug-gated logging/overlay.

## Prerequisites
- Node.js 20+
- npm (uses `package-lock.json`)

## Commands
```bash
npm ci                # install deps
npm run dev           # start Vite dev server (http://localhost:5173)
npm run build         # type-check + production build
npm run lint          # eslint
npm test              # vitest unit tests (config, parsers, API helpers)
```

## Env/config
- `PUBLIC_BASE_PATH` (build arg) → Vite `base`/Router `basename` (default `/watch-party/`, use `/` for local dev).
- `FRONTEND_MODE` → `VITE_APP_MODE` (`debug` enables logging/overlay; `production` disables).
- `VITE_BACKEND_ORIGIN` (default `/api`) — relative path preferred so Nginx proxy works; avoid baking hosts.
- Optional polling overrides:
  - `VITE_INTERVAL_TIME_SYNC_MS` (default 60000)
  - `VITE_INTERVAL_TIME_SKEW_MS` (default 300000)
  - `VITE_INTERVAL_SCHEDULE_POLL_MS` (default 60000)

## Running locally
```bash
cd frontend
npm ci
VITE_APP_MODE=debug npm run dev   # enables debug overlay/logging
```
The dev server proxies `/api` to `http://localhost:8082` (see `vite.config.ts`). Adjust if your backend runs elsewhere.

## Docker build
```bash
docker build -t watchparty-frontend \
  --build-arg PUBLIC_BASE_PATH=/watch-party/ \
  --build-arg FRONTEND_MODE=production \
  --build-arg VITE_BACKEND_ORIGIN=/api \
  .
```
The runtime Nginx proxy target is controlled separately via `BACKEND_ORIGIN` in the root `.env`/compose.