The Beach Dashboard
The internal dashboard that shows how BTT's own site and socials are performing.
What it is
The Beach Dashboard (/(hub)/beach) is an admin-only page showing BTT's own marketing and SEO performance. Unlike client-facing pages, this tracks our own presence: GA4 traffic to bristechtonic.co.uk, GSC impressions and clicks, AI citations, and Instagram engagement. Restricted to admin, exec, and management roles.
Data sources
Snapshot architecture (Phase 4)
The default page load reads from the beach_snapshots Supabase table -- a single query returning the latest-per-source values plus the last 12 weeks of history per source for sparklines. This means the page loads in under 100ms on most requests.
The cron /api/cron/beach-refresh runs every Monday at 06:00 UTC. It calls all live data sources in parallel and writes one row per source per ISO week to beach_snapshots.
Admin users see a Live refresh button that bypasses the snapshot and forces a real-time pull by calling /api/beach?refresh=1. This does not write to the snapshots table -- the weekly cron owns that.
Sparklines and trend arrows
Every numeric tile on the Beach Dashboard shows a sparkline (12-week trend line) and a coloured trend arrow (green up, red down, grey flat). The Sparkline and TrendArrow components are shared and reused. The inverted prop on TrendArrow reverses the colour polarity for metrics where lower is better (e.g. GSC average position).
Mobile layout
The tile grid uses minmax(140px, 1fr) so it auto-fits to the viewport width. Narrow-viewport padding is tightened so tiles do not clip on phones.
Relevant files
- Page: app/(hub)/beach/page.js
- API route: app/api/beach/route.js
- Cron: app/api/cron/beach-refresh/route.js
- Instagram data layer: lib/social/instagram.js
- Snapshot table: beach_snapshots (migration 20260522080000_beach_snapshots.sql)
- Sparkline component: components/Sparkline.js
- TrendArrow component: components/TrendArrow.js