feat(admin): password-auth admin panel with 8 pages + 15 API endpoints
Schema migrations: - users.is_admin boolean - users.password_hash text (scrypt N=16384, 16-byte salt) - users.last_login_at timestamp - organizations.suspended + suspended_reason - admin_settings table (DB-stored prompt override + future settings) Auth (@bmm/auth): - hashPassword + verifyPassword via node:crypto scrypt (no extra dep) - loginWithPassword: scrypt-verifies, issues 30-day session, updates last_login_at - seedAdmin: idempotent upsert keyed on email; creates org + membership on first run - AuthedUser now carries isAdmin flag API: - POST /v1/auth/admin/login (email + password) — 300ms throttle on failure - requireAdmin preHandler — 401 if no session, 403 if non-admin - Bootstrap: api on boot calls seedAdmin(ADMIN_EMAIL, ADMIN_PASSWORD, ADMIN_NAME) if env present. Idempotent. Admin API routes (all gated by requireAdmin): - GET /v1/admin/overview (totals, trends 7d, server-status breakdown, builds 24h, recent activity) - GET /v1/admin/users (search, per-row org + plan + serverCount) - PATCH /v1/admin/users/:id (isAdmin, name) - DELETE /v1/admin/users/:id (self-delete blocked) - GET /v1/admin/orgs (member + server counts) - PATCH /v1/admin/orgs/:id (plan, quota, suspended; cascades to mcp_servers.status=paused on suspend) - GET /v1/admin/servers (cross-org with status filter) - POST /v1/admin/servers/:id/rebuild (re-queues build using last prompt) - DELETE /v1/admin/servers/:id - GET /v1/admin/builds (status filter, error messages, prompt previews) - GET /v1/admin/builds/:id/logs - GET /v1/admin/audit (system-wide with user email join) - GET /v1/admin/system (DB ping, Redis ping, BullMQ queue depth, docker ps count) - GET /v1/admin/prompt (builtin + override + updatedAt) - PATCH /v1/admin/prompt (value: string | null) — saves DB override or drops it UI (apps/web/app/admin/*): - /admin/login — password form, separate from /login magic-link - AdminLayout — Linear-style sidebar (8 nav items), bottom panel with user email + 'user view' shortcut + logout, client-side requireAdmin guard with redirect - /admin — overview dashboard with 4 metric cards, 2 panels (status + 24h builds), recent activity table linking to full audit - /admin/users — search + admin toggle + delete (self-delete blocked) - /admin/orgs — plan/quota/suspend actions via prompts - /admin/servers — cross-org table with rebuild + delete actions, status filter - /admin/builds — every build cross-fleet with error vs prompt preview - /admin/audit — system-wide log + CSV export + filter dropdowns - /admin/system — auto-refreshing 5s health probes for Postgres, Redis, queue, Docker - /admin/prompt — live editor for the LLM system prompt with built-in baseline, override-state badge, drop-override action, diff preview, save-as-override End-to-end verified: login as marco.frangiskatos@gmail.com + Melusa112233.*, every admin page returns 200, admin login + overview tested via screenshot, docker probe returns true count of running MCP containers.
This commit is contained in:
182
apps/web/app/admin/orgs/page.tsx
Normal file
182
apps/web/app/admin/orgs/page.tsx
Normal file
@@ -0,0 +1,182 @@
|
||||
'use client';
|
||||
|
||||
import { useEffect, useState } from 'react';
|
||||
import { apiFetch } from '@/lib/api';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/input';
|
||||
|
||||
interface AdminOrg {
|
||||
id: string;
|
||||
slug: string;
|
||||
name: string;
|
||||
plan: string;
|
||||
monthlyCallQuota: number;
|
||||
callsThisPeriod: number;
|
||||
periodStartsAt: string;
|
||||
suspended: boolean;
|
||||
suspendedReason: string | null;
|
||||
createdAt: string;
|
||||
memberCount: number;
|
||||
serverCount: number;
|
||||
}
|
||||
|
||||
export default function AdminOrgsPage() {
|
||||
const [orgs, setOrgs] = useState<AdminOrg[] | null>(null);
|
||||
const [search, setSearch] = useState('');
|
||||
|
||||
async function reload() {
|
||||
const r = await apiFetch<{ orgs: AdminOrg[] }>('/v1/admin/orgs');
|
||||
setOrgs(r.orgs);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
reload();
|
||||
}, []);
|
||||
|
||||
async function changePlan(o: AdminOrg) {
|
||||
const plan = prompt(
|
||||
`Change plan for "${o.name}". Current: ${o.plan}. Pick one of: hobby, pro, team, enterprise`,
|
||||
o.plan,
|
||||
);
|
||||
if (!plan || !['hobby', 'pro', 'team', 'enterprise'].includes(plan)) return;
|
||||
await apiFetch(`/v1/admin/orgs/${o.id}`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify({ plan }),
|
||||
});
|
||||
reload();
|
||||
}
|
||||
|
||||
async function setQuota(o: AdminOrg) {
|
||||
const next = prompt(`New monthly call quota for "${o.name}":`, String(o.monthlyCallQuota));
|
||||
if (!next) return;
|
||||
const parsed = Number(next);
|
||||
if (!Number.isFinite(parsed) || parsed < 0) {
|
||||
alert('Invalid number');
|
||||
return;
|
||||
}
|
||||
await apiFetch(`/v1/admin/orgs/${o.id}`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify({ monthlyCallQuota: parsed }),
|
||||
});
|
||||
reload();
|
||||
}
|
||||
|
||||
async function toggleSuspend(o: AdminOrg) {
|
||||
if (o.suspended) {
|
||||
if (!confirm(`Lift suspension on "${o.name}"?`)) return;
|
||||
await apiFetch(`/v1/admin/orgs/${o.id}`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify({ suspended: false, suspendedReason: null }),
|
||||
});
|
||||
} else {
|
||||
const reason = prompt(
|
||||
`Suspend "${o.name}"? This pauses ALL their MCP servers. Reason (visible in audit log):`,
|
||||
'',
|
||||
);
|
||||
if (reason === null) return;
|
||||
await apiFetch(`/v1/admin/orgs/${o.id}`, {
|
||||
method: 'PATCH',
|
||||
body: JSON.stringify({ suspended: true, suspendedReason: reason || 'Suspended by admin' }),
|
||||
});
|
||||
}
|
||||
reload();
|
||||
}
|
||||
|
||||
const filtered = orgs?.filter((o) =>
|
||||
search
|
||||
? o.name.toLowerCase().includes(search.toLowerCase()) ||
|
||||
o.slug.toLowerCase().includes(search.toLowerCase())
|
||||
: true,
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="px-8 py-8">
|
||||
<header className="mb-6">
|
||||
<h1 className="text-[22px] font-semibold tracking-tight">Organizations</h1>
|
||||
<p className="mt-1 text-[13px] text-[--color-fg-muted]">
|
||||
Plan management, quota overrides, suspension.
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<div className="mb-4">
|
||||
<Input
|
||||
value={search}
|
||||
onChange={(e) => setSearch(e.target.value)}
|
||||
placeholder="Search by name or slug…"
|
||||
className="w-80"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="panel">
|
||||
{!filtered && (
|
||||
<p className="px-4 py-3 text-[12.5px] text-[--color-fg-muted]">Loading…</p>
|
||||
)}
|
||||
{filtered && filtered.length === 0 && (
|
||||
<p className="px-4 py-12 text-center text-[13px] text-[--color-fg-muted]">No matches.</p>
|
||||
)}
|
||||
{filtered && filtered.length > 0 && (
|
||||
<table className="w-full text-[12.5px]">
|
||||
<thead className="border-b border-[--color-border] text-[--color-fg-subtle]">
|
||||
<tr>
|
||||
<th className="px-4 py-2 text-left font-medium">Name</th>
|
||||
<th className="px-4 py-2 text-left font-medium">Plan</th>
|
||||
<th className="px-4 py-2 text-left font-medium">Members</th>
|
||||
<th className="px-4 py-2 text-left font-medium">Servers</th>
|
||||
<th className="px-4 py-2 text-left font-medium">Calls / quota</th>
|
||||
<th className="px-4 py-2 text-left font-medium">Status</th>
|
||||
<th className="px-4 py-2 text-right font-medium">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{filtered.map((o) => (
|
||||
<tr key={o.id} className="border-b border-[--color-border] last:border-0">
|
||||
<td className="px-4 py-2.5">
|
||||
<div>{o.name}</div>
|
||||
<div className="mono text-[11px] text-[--color-fg-subtle]">{o.slug}</div>
|
||||
</td>
|
||||
<td className="px-4 py-2.5">
|
||||
<span className="mono rounded-full border border-[--color-border] bg-[--color-bg-subtle] px-2 py-0.5 text-[11px]">
|
||||
{o.plan}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-2.5 mono text-[--color-fg-muted]">{o.memberCount}</td>
|
||||
<td className="px-4 py-2.5 mono text-[--color-fg-muted]">{o.serverCount}</td>
|
||||
<td className="px-4 py-2.5 mono text-[--color-fg-muted]">
|
||||
{o.callsThisPeriod.toLocaleString()} / {o.monthlyCallQuota.toLocaleString()}
|
||||
</td>
|
||||
<td className="px-4 py-2.5">
|
||||
{o.suspended ? (
|
||||
<span
|
||||
className="inline-flex items-center gap-1 rounded-full border border-red-400/40 bg-red-400/10 px-2 py-0.5 text-[11px] text-red-300"
|
||||
title={o.suspendedReason ?? ''}
|
||||
>
|
||||
suspended
|
||||
</span>
|
||||
) : (
|
||||
<span className="inline-flex items-center gap-1 rounded-full border border-emerald-400/40 bg-emerald-400/10 px-2 py-0.5 text-[11px] text-emerald-300">
|
||||
active
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="px-4 py-2.5 text-right">
|
||||
<div className="inline-flex gap-1">
|
||||
<Button variant="ghost" size="sm" onClick={() => changePlan(o)}>
|
||||
plan
|
||||
</Button>
|
||||
<Button variant="ghost" size="sm" onClick={() => setQuota(o)}>
|
||||
quota
|
||||
</Button>
|
||||
<Button variant="danger" size="sm" onClick={() => toggleSuspend(o)}>
|
||||
{o.suspended ? 'unsuspend' : 'suspend'}
|
||||
</Button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user