Panopticron

The problem

At BornDigital we had multiple client projects across Vercel and GitHub. Critical information lived in different dashboards. When something broke, you'd find out late because nobody was constantly checking four different tabs. Context-switching ate time.

Panopticron puts everything in one place. Deployment status, CI results, project health - one screen.

The stack

Refine (v4) for data management and CRUD scaffolding. Next.js 14 app router for the frontend. Material UI for components with multiple color themes. Supabase for the database with real-time subscriptions. Deployed on Vercel with cron jobs for data sync.

Backend workers poll Vercel and GitHub every 30 minutes. Results get cached in Supabase. The frontend reads from the cache, so it loads fast and doesn't hammer external APIs.

LensCluster visualization

Each project shows as a cluster of colored circles - green/yellow/red for status. Three big circles (76px) for critical integrations, four smaller ones (32px) for secondary status. Click any lens and it opens the relevant external page.

The design goal was maximum information density. You open the dashboard and see immediately: these projects are fine, these need attention. No reading text, just colors.

Manual overrides

Automated scoring doesn't always match reality. Sometimes a project needs attention for reasons the system can't detect. Admins can override the calculated priority - the override is visible (distinct icon) so it's clear when a human intervened.

Automation should support decisions, not replace them.

Two views

/projects - The main view. Paginated grid of project cards with LensCluster, last updated time, priority trend sparkline, expandable details.

/dashboard - High-density table for wall displays. Ticker tape alerts, advanced filtering, expandable rows. Maximizes project count per screen.

Why Supabase instead of direct API calls?

Rate limits. Historical data. Faster rendering. Resilience when external services go down. The caching layer solves multiple problems.

Results

No more tab-switching between Vercel and GitHub. Problems surface immediately when you open the dashboard. Direct links from status indicators preserve cognitive flow. Everyone sees the same picture.