73 lines
2.7 KiB
Markdown
73 lines
2.7 KiB
Markdown
|
# 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.
|