Horários Bolachas

Mobile-first, offline-capable timetable app for multiple festival editions. / lists every edition from the Festival table; each one gets a public route at /<slug> and an admin route at /admin/<slug>. Live current-time line, two-tier marks and per-slot notes (localStorage only by default, no accounts), and a password-protected admin panel scoped to one festival at a time.

Marking a set is a tri-state tap: unmarked → must-see (filled blue ★) → interested (hollow amber ☆) → unmarked. Holding a set (500ms, or right-click on desktop) opens a sheet with explicit tier buttons and a free-text note (280 characters) for that slot — "front left, get there early", "skip if the queue is bad". Notes stay on-device unless the visitor opts into cross-device sync below, exactly like the tiers themselves.

The same sheet can hide the act: every set by that act leaves the grid, on every day (grouped like the #2/3 ordinals, by Artist id or by normalised name, actKeyOf in src/lib/shows.ts). Hiding clears the act's marks, and a set that still carries a mark always stays on the grid. Once anything is hidden, a hidden (N) switch in the legend row brings hidden acts back, dimmed with an eye-off glyph, so they can be unhidden from the sheet (marking one unhides it too). Hidden acts sync with favorites (HiddenAct table), and crewmates never see them: crew reads only touch Favorite.

Four editions, two layouts, chosen per festival by Festival.layout:

• /pdc26 — Vodafone Paredes de Coura 2026 (Aug 9–16, including the bonus afterparty day). VERTICAL: time runs down, two stages side by side as columns.
• /lotd26 — Left of the Dial 2026, Rotterdam (Oct 21–24). TRANSPOSED: time runs across, one row per room, because 26 rooms cannot be read as columns. Rows are grouped by walking zone, and tapping a set re-labels every zone with the walking time from that venue.
• /lc26oct — London Calling October 2026, Amsterdam (Oct 30–31). VERTICAL, but with three columns (gridColumns: 3 in src/lib/festival-copy.ts): both Paradiso halls every night, plus De Kring (Fri) or Barlaeus (Sat). The slug carries the month because London Calling runs every April and October.
• /lgw26 — Le Guess Who? 2026, Utrecht (Nov 5–8). TRANSPOSED, like LOTD: 45 rooms in ten walking zones. Two switches start off: the U? side programme (dashed blocks) and non-concerts (films, talks, workshops, exhibitions, each with a chip saying which). With both off the grid is the main concert programme, and the day's time axis tightens to it.

A festival needs no flag to become "archived" — / and each festival's own page mark it as such automatically once its endDate has passed (see isFestivalOver in src/lib/festival.ts). PdC 2026 has already happened, so /pdc26 shows as an archived record of that lineup today.

A new edition needs one Festival row plus its Stage rows (own timezone, own locale, own slug namespace) — no route or admin code changes. Rooms and walking zones are hand-curated in a migration, never created by the importer, so a room always has an address and a zone.

Stack

• Next.js 16 (App Router, Turbopack), TypeScript, Tailwind CSS
• Postgres via Prisma 7 (@prisma/adapter-pg) — Festival → Zone → Stage → Performance, plus Artist for imported reference data and ZoneWalk for walking times between zones
• Hand-rolled service worker (public/sw.js) — not Serwist/Workbox, since @serwist/next doesn't support Turbopack, which Next 16 uses by default for both dev and build
• Admin auth: single shared password (ADMIN_PASSWORD env var) + a jose-signed session cookie, gated by proxy.ts (Next 16's renamed middleware.ts) — one password for every festival's admin, not per-edition

Local development

Requires Node 20+ and a local Postgres.

brew install postgresql@16   # if you don't have Postgres locally
brew services start postgresql@16
createdb horarios_dev

npm install
cp .env.example .env         # then fill in DATABASE_URL / ADMIN_PASSWORD / SESSION_SECRET
npx prisma migrate dev
npx prisma db seed
npm run dev

Open http://localhost:3000 for the archive index, or http://localhost:3000/pdc26 for the PdC 2026 timetable directly. Admin is at /admin (password from .env) — log in, then pick a festival to get its scoped editor at /admin/<slug>.

Timezone note: .env sets TZ=UTC and src/lib/prisma.ts forces the Postgres session timezone to UTC on every connection. Don't remove either — see the comments in those two files for why (a real bug was found and fixed here: without this, the exact same code silently stored different absolute instants depending on the connecting process's local timezone).

Tests

npm test          # Vitest — time/grid math, grouping, importer parsers, RTL components
npm run test:e2e  # Playwright — admin CRUD, offline-after-first-visit, transposed grid, crews

test:e2e runs Chromium for everything, plus WebKit (iPhone 14) for e2e/lotd.spec.ts, e2e/lc.spec.ts and e2e/lgw.spec.ts only. lgw.spec.ts needs npm run import:lgw -- --apply against the e2e database first. The transposed grid's frozen venue column and time header are pure CSS sticky, and every sticky bug this project has actually hit (stuttering scroll, unpainted headers — commits 0f12f0e, ed2f728) was Safari-only, so those assertions have to run on WebKit. The admin specs assume a desktop viewport and Playwright's offline emulation isn't supported on WebKit, which is why the WebKit project is scoped rather than running everything.

npm test also runs automatically on git commit via a Husky pre-commit hook (along with npm run lint). test:e2e builds and starts a production server itself (playwright.config.ts's webServer) since the service worker only registers in production — see RegisterServiceWorker.tsx.

This is the beginning of the README. Read the rest at the original. Read the full README ↗