Phase 5: Dashboard UI — usage, billing, locations, rebook, dual-rank, competitor structured diffs

[crewcricle]

What changed

UX refactor making the dashboard demo-ready with TaxFlow-inspired design patterns. The 8 flat nav pages are now 3 collapsible groups, scattered DemoBadges are replaced by a single central indicator, and all pages use consistent card/stat/table patterns.

New infrastructure

• 5 demo personas (lib/demo-personas.ts) — Dr Sarah Chen (Dental/Growth), Marco Rossi (6-venue Enterprise), James Mitchell (Trial expiring), Emma Lewis (Physio/Growth), Tom Nguyen (Fitness/Starter)
• PersonaSwitcher dropdown in the header to hot-switch between personas
• DemoHeader — single "Demo" ribbon with persona switcher
• useDemoPersona hook — sessionStorage persistence

Navigation refactor

• Collapsible sidebar (collapsed default, w-16 → w-56 expanded)
• 3 nav groups: Dashboard (Review Queue), Growth (Rankings & Competitors), Operations (Locations + Rebook)
• Settings pinned at bottom with business name + plan badge
• pathname.startsWith for active detection

Page changes

• New /dashboard/growth — Rankings + Competitors (replaces flat /dashboard/reports)
• Merged Settings — single page with Preferences / Billing / Usage tabs
• Dashboard — TaxFlow stat cards (icon chip + tabular-nums + uppercase label)
• Locations / Rebook — ring-1 card patterns, toast notifications
• Clients — pattern-aligned table, ring-1 cards

Visual consistency

• ring-1 ring-foreground/10 rounded-xl card pattern (replaces border border-border)
• text-xl font-semibold page headers + text-sm text-muted-foreground descriptions
• Stat cards: h-9 w-9 rounded-lg icon chip + text-2xl font-semibold tabular-nums value
• Table headers: text-xs font-semibold uppercase tracking-wider
• sonner toasts on all mutation points (install, approve, save, PDF, coming soon)

DemoBadge cleanup

• Removed from TrialBanner (2 instances), ReviewCard, Reports page, Locations page, Rebook page, Settings page (6→1)
• Single central indicator now in DemoHeader

Files changed

18 files, +1908 / -169

Testing

• Build: 13 routes generated, TypeScript clean, ESLint clean
• Tests: 30/30 pass (14 usage + 16 stats)
• Preview verified: all 5 pages return 200, snapshot confirms collapsible sidebar, DemoHeader, PersonaSwitcher, and Toaster rendering

---

Session Details

• Session: View Session
• Requested by: Unknown
• Address comments on this PR. Add (aside) to your comment to have me ignore it.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
localmate	Error		Jul 22, 2026 8:50pm