feat: restructure the admin panel into six tabs, add read-only view-as

The admin panel was one page of stacked cards. It is now General / Apps / AI /
Config / Health / Enterprise, with the active tab in the URL so a tab is a
link you can send.

General — an About block (running version, latest release, public URL) and an
administrator access matrix showing, per person, whether their role grants
super access, admin-panel access and view-as. Plus the feature those columns
describe:

View as a user (read-only impersonation)
- A signed, short-lived cookie ticket carrying BOTH the actor and the target;
  getCurrentDbUser resolves the target so every page renders exactly what that
  person sees, with the real actor named in a permanent banner.
- Read-only by construction. requireWriter() is the new guard on every
  mutating server action and refuses while a ticket is active; requirePermission
  blocks writes too, with an explicit requirePermissionForRead opt-out for the
  handful of permissioned reads. Writes are blocked by DEFAULT, so an action
  added later is safe until someone says otherwise.
- Rails: only holders of the new system.impersonate permission may start one;
  accounts with full access can never be viewed as (wearing an owner's session
  is indistinguishable from being one); no nesting; no self-impersonation;
  disabled accounts excluded; the ticket is bound to the actor's session, so
  signing out ends it by construction; both start and stop are written to the
  previously-unused audit_logs table.

Config — SMTP settings are now editable at runtime, stored encrypted in
app_settings and overriding the environment, with a test that actually sends a
message. States the honest limitation in the UI: magic-link sign-in reads its
providers at startup, so it picks these up on restart; app-sent mail uses a
per-send transport and applies immediately.

Health — an operational/degraded/outage rollup (datastores are load-bearing, a
dead worker is degraded not an outage), the web app's own uptime/memory, and
migration-state detection: applied migrations vs what the build ships, which
catches the deploy where the pre-deploy migration step didn't run. Verified the
query against a real Postgres 16 after running the actual migrator.

Enterprise — licence key stored encrypted, gating flagged features. Honest
copy: an honour-system switch on a self-hosted MIT product, not a
cryptographic lock, and nothing phones home.

AI — unchanged provider management; usage reporting added as coming-soon and
enterprise-gated, with an explicit note that nothing is metered today.

New tests cover ticket signing/expiry/tampering and every impersonation rail;
EXPECTED_MIGRATION_COUNT is asserted against the journal so adding a migration
without bumping it fails CI. 275 tests pass, typecheck and build green.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018A8f7g1t5FMFkYgx12aiu9

Author: byw1

ROADMAP.md

@@ -80,12 +80,17 @@ What makes Comms enterprise rather than a personal bridge.
 - ✅ Split inbox by correspondent — People / Unknown / Automated / Verification
   codes, classified from traffic at ingest, with a copy-the-code chip on OTP rows.
   Shipped ON by default (seeded shared folders, toggleable in Settings → Workspace)
-- ✅ **Admin panel** (Settings → Other) — version + update check, administrators
-  and recent users, AI provider management, runtime-tunable config (undo window,
-  send caps — no redeploy), and a Health tab: Postgres/Redis latency, queue
-  depths, worker heartbeat, bridge status
-- ✅ Automations can route to a team, mute a thread, and condition on the
-  correspondent kind
+- ✅ **Admin panel** (Settings → Other) — six tabs, linkable by URL:
+  - **General** — about/version + update check, an administrator access matrix
+    (super · admin panel · view-as), and read-only **view as a user**
+  - **Apps** — catalogue placeholder
+  - **AI** — multi-provider keys and models; usage reporting flagged enterprise
+  - **Config** — runtime-editable email/SMTP (no redeploy) with a real test
+    send, send caps and the undo window, plus read-only deployment config
+  - **Health** — operational/degraded/outage rollup, Postgres/Redis/worker/web,
+    queue depths, bridge status, and migration state (schema drift detection)
+  - **Enterprise** — licence key storage and feature gating
+- ✅ Automations can mute a thread and condition on the correspondent kind
 - ⬜ Merge/split/link conversations; cross-handle entity resolution
 - ⬜ Full business-hours-aware SLA windows
 

apps/web/src/app/(app)/layout.tsx

@@ -9,6 +9,7 @@ import {
 import { Sidebar } from '@/components/app/sidebar';
 import { RealtimeProvider } from '@/components/app/realtime-provider';
 import { ChannelHealthBanner } from '@/components/app/channel-health-banner';
+import { ImpersonationBanner } from '@/components/app/impersonation-banner';
 import { CommandPalette } from '@/components/app/command-palette';
 import { pendingCount } from '@/server/actions/scheduled';
 import { KeymapProvider } from '@/components/app/keymap-provider';
@@ -70,6 +71,12 @@ export default async function AppLayout({ children }: { children: React.ReactNod
     >
       <KeymapProvider preference={user.preferences?.keymap as KeymapPreference | undefined}>
       <div className="flex h-dvh flex-col overflow-hidden">
+        {user.impersonatedBy && (
+          <ImpersonationBanner
+            viewingAs={user.name ?? user.email}
+            actorName={user.impersonatedBy.name ?? user.impersonatedBy.email}
+          />
+        )}
         <ChannelHealthBanner initial={unhealthy} />
         <MobileTopBar />
         <div className="flex min-h-0 flex-1">

apps/web/src/app/(app)/settings/(admin)/admin/page.tsx

@@ -8,19 +8,23 @@ import {
   getVersionInfo,
   listAiProvidersSafe,
 } from '@/server/system';
+import { getEmailStatus } from '@/server/smtp';
+import { getLicense } from '@/server/license';
 import { AdminPanel } from '@/components/settings/admin-panel';
 
 export const dynamic = 'force-dynamic';
 
 export default async function AdminPanelPage() {
-  await requirePermissionPage('system.admin');
+  const me = await requirePermissionPage('system.admin');
   const cfg = loadConfig();
-  const [version, health, overview, ai, overrides] = await Promise.all([
+  const [version, health, overview, ai, overrides, email, license] = await Promise.all([
     getVersionInfo(),
     getSystemHealth(),
     getAdminOverview(),
     listAiProvidersSafe(),
     getRuntimeOverrides(),
+    getEmailStatus(),
+    getLicense(),
   ]);
 
   // What the deployment is, in one glance — values only, never secrets.
@@ -29,7 +33,6 @@ export default async function AdminPanelPage() {
     { label: 'Database', value: cfg.DATABASE_URL ? 'configured' : 'missing' },
     { label: 'Redis', value: cfg.REDIS_URL ? 'configured' : 'missing' },
     { label: 'Attachments (S3)', value: cfg.storageEnabled ? 'configured' : 'not configured' },
-    { label: 'Email (SMTP)', value: cfg.smtpEnabled ? 'configured' : 'not configured' },
     {
       label: 'Google sign-in',
       value: process.env.GOOGLE_CLIENT_ID ? 'configured' : 'not configured',
@@ -49,19 +52,27 @@ export default async function AdminPanelPage() {
       <div>
         <h2 className="text-lg font-semibold">Admin panel</h2>
         <p className="text-sm text-muted-foreground">
-          The machine room: version, providers, runtime settings and service health.
+          The machine room: what this instance is running, who administers it, and whether the
+          pieces are alive.
         </p>
       </div>
 
       <AdminPanel
         version={version}
-        health={health}
-        admins={overview.admins.map((a) => ({
-          id: a.id,
-          name: a.name,
-          email: a.email,
-          role: a.role,
-          image: a.image,
+        health={{
+          ...health,
+          worker: {
+            ...health.worker,
+            lastSeenAt: health.worker.lastSeenAt,
+          },
+        }}
+        administrators={overview.administrators.map((a) => ({
+          ...a,
+          lastSeenAt: a.lastSeenAt?.toISOString() ?? null,
+        }))}
+        allUsers={overview.allUsers.map((a) => ({
+          ...a,
+          lastSeenAt: a.lastSeenAt?.toISOString() ?? null,
         }))}
         recentUsers={overview.recent.map((u) => ({
           id: u.id,
@@ -71,6 +82,8 @@ export default async function AdminPanelPage() {
           status: u.status,
           lastSeenAt: u.lastSeenAt?.toISOString() ?? null,
         }))}
+        currentUserId={me.id}
+        canImpersonate={me.permissions.includes('*') || me.permissions.includes('system.impersonate')}
         providers={ai.providers}
         envAnthropicKey={ai.envAnthropicKey}
         envModel={ai.envModel}
@@ -83,6 +96,9 @@ export default async function AdminPanelPage() {
         }}
         readOnlyConfig={readOnlyConfig}
         suggestedModels={SUGGESTED_MODELS}
+        email={email}
+        license={license}
+        orgName={cfg.appUrl}
       />
     </div>
   );

apps/web/src/components/app/impersonation-banner.tsx

@@ -0,0 +1,50 @@
+'use client';
+
+import { useTransition } from 'react';
+import { useRouter } from 'next/navigation';
+import { Eye, X } from 'lucide-react';
+import { stopImpersonation } from '@/server/actions/impersonation';
+
+/**
+ * A permanent, unmissable strip across the top of every page while a view-as
+ * session is running.
+ *
+ * Deliberately loud and never dismissible: the entire danger of impersonation
+ * is forgetting you are in it, and a banner you can close is a banner that
+ * will be closed.
+ */
+export function ImpersonationBanner({
+  viewingAs,
+  actorName,
+}: {
+  viewingAs: string;
+  actorName: string;
+}) {
+  const router = useRouter();
+  const [pending, start] = useTransition();
+
+  return (
+    <div className="flex shrink-0 items-center gap-2 bg-warning px-3 py-1.5 text-warning-foreground">
+      <Eye className="h-3.5 w-3.5 shrink-0" />
+      <p className="min-w-0 flex-1 truncate text-[12.5px] font-medium">
+        Viewing as <span className="font-semibold">{viewingAs}</span> — read only. Signed in as{' '}
+        {actorName}.
+      </p>
+      <button
+        type="button"
+        disabled={pending}
+        onClick={() =>
+          start(async () => {
+            await stopImpersonation();
+            router.push('/settings/admin?tab=general');
+            router.refresh();
+          })
+        }
+        className="flex shrink-0 items-center gap-1 rounded-md bg-warning-foreground/10 px-2 py-0.5 text-[12px] font-semibold transition-colors hover:bg-warning-foreground/20 disabled:opacity-60"
+      >
+        <X className="h-3 w-3" />
+        {pending ? 'Stopping…' : 'Stop viewing'}
+      </button>
+    </div>
+  );
+}