# Admin Dashboard — Social Proximity ## Purpose The admin dashboard shows anonymised platform statistics — not to monitor users, but to understand if the nudge concept is working. **What it shows:** - How many sessions were started today / this week - How many matches were made - Which interest categories are most popular (no user-level breakdown) - How many active sessions right now **What it never shows:** - Who matched with whom - Where people were - Individual user data of any kind ## Technology: Next.js (TypeScript) Simple choice: TypeScript, server-side rendering, easy to deploy. No complex state management needed — stats are read-only and refreshed periodically. ## Project Structure ``` admin/ ├── src/ │ └── app/ │ ├── layout.tsx │ ├── page.tsx ← Main dashboard │ └── api/ │ └── stats/ │ └── route.ts ← Proxy to backend /stats ├── components/ │ ├── StatCard.tsx ← Single metric card │ ├── InterestChart.tsx ← Bar chart of top interest categories │ └── ActivityChart.tsx ← Sessions/matches over time (7 days) ├── package.json └── .env.local.example ``` ## Dashboard Layout ``` ┌─────────────────────────────────────────────────────┐ │ Social Proximity — Admin │ ├──────────┬──────────┬──────────┬────────────────────┤ │ Sessions │ Matches │ Match % │ Active now │ │ today │ today │ │ │ ├──────────┴──────────┴──────────┴────────────────────┤ │ Sessions & Matches — last 7 days (line chart) │ ├─────────────────────────────────────────────────────┤ │ Top interest categories (bar chart) │ └─────────────────────────────────────────────────────┘ ``` ## Environment Variables ```env BACKEND_URL=http://localhost:8000 ``` ## Running Locally ```bash cd admin npm install npm run dev # runs on localhost:3000 ``` ## Access In MVP the dashboard has no login. It should be deployed behind a reverse proxy with IP restriction or basic auth — not exposed publicly.