www: per-station HTML stubs with og meta (gen-station-stubs.js postbuild)

GH Pages serves `/s/<slug>` deep links via the `404.html` SPA fallback —
HTTP 404 + homepage og meta, so link-preview crawlers (no JS) never saw
station-specific cards. Postbuild step now fetches the new
`/api/stations/slugs` worker endpoint (D1 `stations` rows with a slug,
~2.6k) and emits `dist/s/<slug>/index.html`: a copy of the built
`index.html` with `<title>` + og:title/description/url swapped and
og:image pointed at the worker's dynamic `/og/s/<slug>.png` renderer.
Browsers still boot the same SPA bundles (asset URLs are absolute);
crawlers now get a real 200 with per-station meta.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: ryan-williams

gbfs/api/src/index.ts

@@ -1516,6 +1516,17 @@ export default {
 			}
 		}
 
+		// /api/stations/slugs — all slugged stations, for build-time og:image
+		// stub generation in www (one row per station page to emit).
+		if (url.pathname === '/api/stations/slugs') {
+			const { results } = await env.DB.prepare(
+				`SELECT slug, short_name, name FROM stations WHERE slug IS NOT NULL ORDER BY slug`
+			).all();
+			return jsonResponse({ stations: results }, env, {
+				headers: { 'Cache-Control': 'public, max-age=3600' },
+			});
+		}
+
 		// /api/stations/:id/info — accepts slug, UUID, or short_name
 		const infoMatch = url.pathname.match(/^\/api\/stations\/([^/]+)\/info$/);
 		if (infoMatch) {

www/package.json

@@ -59,6 +59,7 @@
     "dev": "vite",
     "prebuild": "node scripts/gen-ymdgtb-index.js",
     "build": "vite build",
+    "postbuild": "node scripts/gen-station-stubs.js",
     "preview": "vite preview",
     "lint": "eslint .",
     "tc": "tsc",

www/scripts/gen-station-stubs.js

@@ -0,0 +1,56 @@
+#!/usr/bin/env node
+/**
+ * Emit per-station HTML stubs (`dist/s/<slug>/index.html`) after `vite build`.
+ *
+ * GH Pages serves the SPA via a `404.html` fallback, so `/s/<slug>` deep
+ * links return HTTP 404 with the generic homepage og meta — link-preview
+ * crawlers (Slack, Twitter, iMessage) don't run JS and some reject 404s
+ * outright. Each stub is a copy of the built `index.html` with the
+ * `<title>` + og meta swapped for the station (og:image → the worker's
+ * dynamic `/og/s/<slug>.png` renderer), served with a real 200. Browsers
+ * load the same SPA bundles (asset URLs are absolute), so UX is unchanged.
+ *
+ * Station list comes from the API worker's `/api/stations/slugs` (D1
+ * `stations` rows with a slug — ~2k). Failure is fatal: a deploy without
+ * stubs would silently regress share previews.
+ */
+
+import { readFileSync, writeFileSync, mkdirSync } from 'fs'
+import { join, dirname } from 'path'
+import { fileURLToPath } from 'url'
+
+const __dirname = dirname(fileURLToPath(import.meta.url))
+const distDir = join(__dirname, '..', 'dist')
+
+const API_BASE = process.env.VITE_API_BASE ?? 'https://ctbk-gbfs-api.ryan-0dc.workers.dev'
+const SITE = 'https://ctbk.dev'
+
+const escapeHtml = (s) =>
+  s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;')
+
+const setMeta = (html, property, content) => {
+  const re = new RegExp(`(<meta property="${property}" content=")[^"]*(")`)
+  if (!re.test(html)) throw new Error(`index.html missing <meta property="${property}">`)
+  return html.replace(re, `$1${escapeHtml(content)}$2`)
+}
+
+const res = await fetch(`${API_BASE}/api/stations/slugs`)
+if (!res.ok) throw new Error(`${API_BASE}/api/stations/slugs: HTTP ${res.status}`)
+const { stations } = await res.json()
+if (!stations?.length) throw new Error('no slugged stations returned')
+
+const template = readFileSync(join(distDir, 'index.html'), 'utf8')
+if (!/<title>/.test(template)) throw new Error('dist/index.html missing <title>')
+
+for (const { slug, name } of stations) {
+  const title = `${name} — Citi Bike station | ctbk.dev`
+  let html = template.replace(/<title>[^<]*<\/title>/, `<title>${escapeHtml(title)}</title>`)
+  html = setMeta(html, 'og:title', title)
+  html = setMeta(html, 'og:description', `Live availability + trip history for the ${name} Citi Bike station.`)
+  html = setMeta(html, 'og:image', `${API_BASE}/og/s/${slug}.png`)
+  html = setMeta(html, 'og:url', `${SITE}/s/${slug}`)
+  const dir = join(distDir, 's', slug)
+  mkdirSync(dir, { recursive: true })
+  writeFileSync(join(dir, 'index.html'), html)
+}
+console.error(`wrote ${stations.length} station stubs under dist/s/`)