refactor(website): host demo videos on Vercel Blob, not in git (#647)

The homepage DemoShowcase clips are large binaries that bloated git history on
every recut (~3.6 MB across versions). Move them to a public Vercel Blob store
(ngaf-website-assets) and reference absolute URLs; remove them from the repo and
re-ignore apps/website/public/demo/ so video bytes never re-enter history.

- DemoShowcase: DEMO_CDN constant -> blob URLs (same filenames, stable URLs).
- Add apps/website/scripts/upload-demo-media.md runbook.
- A follow-up history rewrite purges the already-committed blobs.

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: blove

.gitignore

@@ -14,6 +14,9 @@ deploy/
 .nx/workspace-data
 tmp/
 apps/website/test-results/
+# Demo media is hosted on Vercel Blob, not committed (see DemoShowcase.tsx /
+# apps/website/scripts/upload-demo-media.md). Keep these binaries out of git.
+apps/website/public/demo/
 cockpit/**/angular/test-results/
 /test-results/
 

apps/website/scripts/upload-demo-media.md

@@ -0,0 +1,42 @@
+# Homepage demo media (Vercel Blob)
+
+The homepage `DemoShowcase` plays short recorded loops of the LangGraph and
+AG-UI demos. These are **large binaries**, so they are NOT committed to git —
+they live in a public **Vercel Blob** store and are referenced by absolute URL
+from `apps/website/src/components/landing/DemoShowcase.tsx` (`DEMO_CDN`).
+
+- **Store:** `ngaf-website-assets` (id `store_ELgKDAxPSvqCrns1`), team `cacheplane`, public access.
+- **Public base:** `https://elgkdaxpsvqcrns1.public.blob.vercel-storage.com/demo`
+- **Files:** `{langgraph,ag-ui}-demo.mp4`, `{langgraph,ag-ui}-demo.webm`, `{langgraph,ag-ui}-demo-poster.webp`
+
+`apps/website/public/demo/` is gitignored so these never re-enter history.
+
+## Re-uploading (e.g. a recut)
+
+Uploads use the same pathnames, so the URLs in `DemoShowcase.tsx` stay stable —
+no code change needed unless you add/rename a file.
+
+1. Get the store's read-write token (`BLOB_READ_WRITE_TOKEN`). It is connected to
+   the `threadplane` Vercel project; pull it with the Vercel API or
+   `vercel env pull` (CLI ≥ 37 also has `vercel blob` commands).
+
+2. Upload each file with a stable pathname (no random suffix):
+
+   ```bash
+   curl -X PUT "https://blob.vercel-storage.com/demo/langgraph-demo.mp4" \
+     -H "authorization: Bearer $BLOB_READ_WRITE_TOKEN" \
+     -H "x-content-type: video/mp4" \
+     -H "x-add-random-suffix: 0" \
+     -H "x-api-version: 7" \
+     --data-binary @langgraph-demo.mp4
+   # repeat for .webm (video/webm) and -poster.webp (image/webp), both runtimes
+   ```
+
+3. Verify: `curl -I https://elgkdaxpsvqcrns1.public.blob.vercel-storage.com/demo/langgraph-demo.mp4` → `200`.
+
+## Producing the clips
+
+The clips are screen recordings of the live demos captured headlessly with
+Playwright (`recordVideo`), then trimmed/sped and encoded small with `ffmpeg`
+(H.264 mp4 + VP9 webm, first-frame `webp` poster, 1280×800). Keep each file
+well under ~1 MB.

apps/website/src/components/landing/DemoShowcase.tsx

@@ -18,9 +18,15 @@ interface DemoMedia {
   href: string;
 }
 
+// Demo media is hosted on Vercel Blob (store: ngaf-website-assets) rather than
+// committed to the repo — these clips are large binaries that would bloat git
+// history on every recut. Re-uploading with the same pathnames keeps these URLs
+// stable. See apps/website/scripts/upload-demo-media.md for the upload steps.
+const DEMO_CDN = 'https://elgkdaxpsvqcrns1.public.blob.vercel-storage.com/demo';
+
 const MEDIA: DemoMedia[] = [
-  { key: 'langgraph', tabLabel: 'LangGraph', url: 'demo.threadplane.ai', videoMp4: '/demo/langgraph-demo.mp4', videoWebm: '/demo/langgraph-demo.webm', poster: '/demo/langgraph-demo-poster.webp', href: DEMOS.find((d) => d.key === 'langgraph')!.href },
-  { key: 'ag-ui', tabLabel: 'AG-UI', url: 'ag-ui.threadplane.ai', videoMp4: '/demo/ag-ui-demo.mp4', videoWebm: '/demo/ag-ui-demo.webm', poster: '/demo/ag-ui-demo-poster.webp', href: DEMOS.find((d) => d.key === 'ag-ui')!.href },
+  { key: 'langgraph', tabLabel: 'LangGraph', url: 'demo.threadplane.ai', videoMp4: `${DEMO_CDN}/langgraph-demo.mp4`, videoWebm: `${DEMO_CDN}/langgraph-demo.webm`, poster: `${DEMO_CDN}/langgraph-demo-poster.webp`, href: DEMOS.find((d) => d.key === 'langgraph')!.href },
+  { key: 'ag-ui', tabLabel: 'AG-UI', url: 'ag-ui.threadplane.ai', videoMp4: `${DEMO_CDN}/ag-ui-demo.mp4`, videoWebm: `${DEMO_CDN}/ag-ui-demo.webm`, poster: `${DEMO_CDN}/ag-ui-demo-poster.webp`, href: DEMOS.find((d) => d.key === 'ag-ui')!.href },
 ];
 
 export function DemoShowcase() {