// analytics.jsx — Admin analytics (live data via admin_analytics_stats RPC) // Metrics with no backing data in the schema (login frequency, composite scores, // reschedule/no-show tracking, revenue/billing) render honest empty states. function Sparkline({ data, color }) { const arr = (data && data.length) ? data : [0, 0]; const max = Math.max(1, ...arr); const pts = arr.map((v, i) => `${i / Math.max(arr.length - 1, 1) * 76},${28 - v / max * 24}`).join(' '); return ( ); } const AN_COLORS = ['#0F52BA', '#4FB7A6', '#E8B24C', '#B79BED', '#FF6B6B', '#5BC0DE', '#D76C82', '#4CAF88']; function anColor(name) { let h = 0; const s = name || ''; for (let i = 0; i < s.length; i++) h = (h * 31 + s.charCodeAt(i)) >>> 0; return AN_COLORS[h % AN_COLORS.length]; } function anInitials(n) { return (n || 'M').trim().split(/\s+/).map((w) => w[0]).join('').toUpperCase().slice(0, 2); } function anTier(t) { return t ? t.charAt(0).toUpperCase() + t.slice(1) : 'Foundations'; } function anLastActive(iso) { if (!iso) return 'Never'; const d = new Date(iso); const s = (Date.now() - d.getTime()) / 1000; if (s < 3600) return 'Just now'; const h = Math.floor(s / 3600); if (h < 24) return h + 'h ago'; const days = Math.floor(h / 24); if (days === 1) return 'Yesterday'; if (days < 30) return days + 'd ago'; return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }); } function anDaysSince(iso) { if (!iso) return Infinity; return (Date.now() - new Date(iso).getTime()) / 86400000; } function AnStat({ label, value, sub, color, loading }) { return (
{label}
{loading ? '—' : value}
{sub}
); } function AnEmpty({ title, note }) { return (
{title}
{note}
); } // ---------- At-Risk Banner (members with no activity for 7+ days) ---------- function AtRiskBanner({ members }) { const atRisk = (members || []).filter((m) => anDaysSince(m.last_active) >= 7); if (atRisk.length === 0) return null; return (
notifications
{atRisk.length} member{atRisk.length > 1 ? 's' : ''} at risk — no activity for 7+ days
These members need outreach before they disengage fully.
{atRisk.map((m) =>
{m.name || 'Member'} {m.last_active ? Math.floor(anDaysSince(m.last_active)) + 'd inactive' : 'No activity yet'}
)}
); } // ---------- Engagement Tab ---------- function EngagementTab({ stats, loading }) { const members = stats?.members || []; const sorted = [...members].sort((a, b) => (b.hours || 0) - (a.hours || 0)); return (
Member engagement health
Sorted by focus time
{loading ? (
Loading…
) : sorted.length === 0 ? ( ) : ( {['Member', 'Plan', 'Focus / wk', 'Streak', 'Tasks done', 'Last active'].map((h) => )} {sorted.map((m) => )}
{h}
{m.name || 'Member'}
{anTier(m.tier)} {(m.hours || 0)}h 0 ? 'var(--coral)' : 'var(--text-3)', display: 'inline-flex', alignItems: 'center', gap: 4 }}> local_fire_department{m.streak || 0} {m.tasks_done || 0} {anLastActive(m.last_active)}
)}
Login frequency and composite engagement scores aren't tracked yet — focus time and task activity stand in as the engagement signal.
); } // ---------- Tasks & Goals Tab ---------- function TasksGoalsTab({ stats, loading }) { const subjects = stats?.subject_completion || []; const volume = stats?.weekly_task_volume || []; const volMax = Math.max(1, ...volume.map((w) => w.count || 0)); const goalsTotal = Math.max(1, stats?.goals_total ?? 0); const goalRows = [ { label: 'In progress', v: stats?.goals_active ?? 0, color: 'var(--accent)' }, { label: 'Stalled', v: stats?.goals_stalled ?? 0, color: 'var(--coral)' }, { label: 'Completed', v: stats?.goals_completed ?? 0, color: 'var(--teal-600)' }, ]; return (
Subject area completion
{loading ? (
Loading…
) : subjects.length === 0 ? ( ) : (
{subjects.map((s, i) =>
{s.s}
= 65 ? 'var(--teal-600)' : s.pct >= 45 ? 'var(--accent)' : 'var(--coral)', transition: 'width .4s ease' }} />
{s.pct}% · {s.total}
)}
)}
Goals status breakdown
{loading ? (
Loading…
) : (stats?.goals_total ?? 0) === 0 ? ( ) : ( goalRows.map((g) =>
{g.label} {g.v} goal{g.v === 1 ? '' : 's'}
) )}
Task assignment volume
{loading ? (
Loading…
) : volume.length === 0 ? ( ) : ( <>
{volume.map((w, i) =>
{w.week}
)}
{volume[volume.length - 1]?.count || 0} tasks created this week
)}
); } // ---------- Sessions Tab ---------- function SessionMetricsTab({ stats, loading }) { const th = stats?.townhall_attendance ?? 0; const oto = stats?.onetoone_attendance ?? 0; return (
Attendance by type
{loading ? (
Loading…
) : (th + oto) === 0 ? ( ) : (
{[{ label: '1:1 sessions', v: oto, color: 'var(--accent)' }, { label: 'Town halls', v: th, color: 'var(--coral)' }].map((r) =>
{r.label} {r.v}
)}
)}
); } // ---------- Revenue Tab (no billing data in the schema) ---------- function RevenueTab() { return (
); } // ---------- Main AdminAnalytics ---------- function AdminAnalytics() { const [tab, setTab] = useState('engagement'); const [stats, setStats] = useState(null); const [loading, setLoading] = useState(true); useEffect(() => { let active = true; window._supabase.rpc('admin_analytics_stats').then(({ data, error }) => { if (!active) return; if (error) console.error('Analytics stats failed:', error.message); setStats(error ? null : data); setLoading(false); }); return () => { active = false; }; }, []); return ( <>
Admin · Analytics

The numbers

Engagement, tasks, and sessions across all members — pulled live from the platform.
{tab === 'engagement' && } {tab === 'tasks' && } {tab === 'sessions' && } {tab === 'revenue' && } ); } Object.assign(window, { AdminAnalytics });