The £50 bet landed. This sprint was about making VibeBranding production-ready for a senior dev review — zero warnings, no AI dependency for demos, export from everywhere, and 26 new tests proving the whole thing works.
What changed
1. Middleware → Proxy (Next.js 16 migration)
Next.js 16.2.7 deprecated the middleware.ts file convention. Renamed to proxy.ts, export renamed from middleware to proxy. Build now shows ƒ Proxy (Middleware) instead of the old warning. Zero deprecation messages.
2. Mock data fallback engine (?mock=true)
When Gemini quota is exhausted (20 req/day free tier), the pipeline now degrades gracefully instead of returning 400 errors. A full mock BSO generator (src/ai/mock-data.ts) produces deterministic brand output for all 9 stages from just a product name — same input always produces the same archetypes, colours, type scales, taglines, and copy.
Key design decisions:
- Deterministic: Seeded hash from product name means repeatable demos
- Structurally identical: Mock colour systems have proper hex codes, WCAG reports, 60-30-10 distribution — same shape as real AI output
- Stage-aware: Stage 1 product data includes strategy. Stage 3 adds naming candidates and taglines. Stage 4 adds full visual identity with colour, typography, iconography, and motion
3. Dashboard export endpoint
POST /api/brands/[id]/export loads stored brand BSO from Supabase and runs through the full export pipeline — CSS tokens, Tailwind config, SCSS variables, Figma styles JSON, and HTML brand guidelines. Same generators used by the main /api/brand/export route, so output is identical whether exporting during generation or from the dashboard.
4. Export in BrandPreviewModal
The brand preview modal now has an interactive export section at the bottom: format selector buttons (All/CSS/Tailwind/SCSS/Figma/HTML), a blue “Export” button with loading spinner, and auto-download of the first generated file. Status banner confirms success or surfaces errors.
5. 26 new tests (218 total)
Mock data validation suite covering:
- Deterministic output validation (same input → same output)
- All 9 stages produce correct-shaped data
- Proper hex colour codes with WCAG-passing checks
- 60-30-10 colour distribution
- Stage-gated data (no visual identity before stage 4)
- Type scale (9 sizes), archetype weights, tone ranges
- Copy examples with on-brand/too-formal/too-casual variations
- Edge cases: minimal input, 60-char product names
6. UI polish
- BrandCard hover animation (
hover:-translate-y-0.5+ shadow lift) - Proper
vb-fade-inanimation on empty states - All mobile touch targets at 44px minimum
Stats
- Build: 4.1s, zero warnings
- Tests: 218/218 passing in 655ms
- Routes: 19 total, all server-rendered
- Commit:
64ea165pushed to master, Vercel auto-deployed
The bet
There’s £50 on the table that this codebase passes a senior dev review. Every objective metric is green — zero warnings, zero type errors, full end-to-end without AI dependency, clean architecture with comprehensive tests, polished UX from empty states to export. The final proof will be in the review itself, but the foundations are solid.