portal-mojo 0.1.0

package/src/admin/assistant/streaming.ts

@@ -0,0 +1,238 @@
+import {
+    defineRealtimeEvent, type RealtimeClient, type RealtimeLifecycleStatus,
+} from '../../client/realtime';
+import { projectBlocks } from './data';
+import { getAssistantConversation, listAssistantConversations } from './api';
+import type { AssistantBlock, AssistantConversation, AssistantMessage } from './types';
+
+const MAX_TEXT = 20_000;
+const MAX_TOOL_NAME = 160;
+const MAX_TOOLS = 32;
+const MAX_PLAN_STEPS = 20;
+const object = (value: unknown): Record<string, unknown> | null => value != null && typeof value === 'object' && !Array.isArray(value) ? value as Record<string, unknown> : null;
+const text = (value: unknown, cap: number): string | null => typeof value === 'string' && value.length > 0 ? value.slice(0, cap) : null;
+const conversationId = (value: unknown): number | null => typeof value === 'number' && Number.isSafeInteger(value) && value > 0 ? value : null;
+
+export interface AssistantThinkingEvent { type: 'thinking'; conversationId: number }
+export interface AssistantTextEvent { type: 'text'; conversationId: number; text: string; blocks: AssistantBlock[] }
+export interface AssistantToolEvent { type: 'tool'; conversationId: number; name: string; status: 'running'; count: number }
+export interface AssistantPlanStep { id: number; description: string; status: 'pending' | 'in_progress' | 'done' | 'skipped'; summary?: string }
+export interface AssistantPlanEvent { type: 'plan'; conversationId: number; planId: string; title: string; steps: AssistantPlanStep[] }
+export interface AssistantPlanUpdateEvent { type: 'plan_update'; conversationId: number; planId: string; stepId: number; status: AssistantPlanStep['status']; summary?: string }
+export interface AssistantResponseEvent { type: 'response'; conversationId: number; messageId: number | string | null; created: number | string; response: string; blocks: AssistantBlock[]; toolCount: number; durationMs: number }
+export interface AssistantErrorEvent { type: 'error'; conversationId: number | null; error: string }
+export type AssistantProjectedEvent = AssistantThinkingEvent | AssistantTextEvent | AssistantToolEvent | AssistantPlanEvent | AssistantPlanUpdateEvent | AssistantResponseEvent | AssistantErrorEvent;
+
+function exact(value: unknown, expectedType: string): Record<string, unknown> | null {
+    const raw = object(value);
+    return raw?.type === expectedType ? raw : null;
+}
+
+export function projectAssistantThinking(value: unknown): AssistantThinkingEvent | null {
+    const raw = exact(value, 'assistant_thinking'); const id = raw && conversationId(raw.conversation_id);
+    return id == null ? null : { type: 'thinking', conversationId: id };
+}
+
+export function projectAssistantText(value: unknown): AssistantTextEvent | null {
+    const raw = exact(value, 'assistant_text'); const id = raw && conversationId(raw.conversation_id); const content = raw && text(raw.text, MAX_TEXT);
+    return id == null || content == null ? null : { type: 'text', conversationId: id, text: content, blocks: projectBlocks(raw.blocks) };
+}
+
+export function projectAssistantToolCall(value: unknown): AssistantToolEvent | null {
+    const raw = exact(value, 'assistant_tool_call'); const id = raw && conversationId(raw.conversation_id); const name = raw && text(raw.tool, MAX_TOOL_NAME);
+    return id == null || name == null ? null : { type: 'tool', conversationId: id, name, status: 'running', count: 1 };
+}
+
+const PLAN_STATUSES = new Set<AssistantPlanStep['status']>(['pending', 'in_progress', 'done', 'skipped']);
+function planStatus(value: unknown): AssistantPlanStep['status'] | null {
+    return typeof value === 'string' && PLAN_STATUSES.has(value as AssistantPlanStep['status']) ? value as AssistantPlanStep['status'] : null;
+}
+
+export function projectAssistantPlan(value: unknown): AssistantPlanEvent | null {
+    const raw = exact(value, 'assistant_plan'); const id = raw && conversationId(raw.conversation_id); const plan = raw && object(raw.plan);
+    const planId = plan && text(plan.plan_id, 80); const title = plan && text(plan.title, 200);
+    if (id == null || !plan || !planId || !title || !Array.isArray(plan.steps) || plan.steps.length < 1 || plan.steps.length > MAX_PLAN_STEPS) return null;
+    const steps = plan.steps.map(object).map((step) => {
+        const stepId = step && conversationId(step.id); const description = step && text(step.description, 500); const status = step && planStatus(step.status);
+        if (stepId == null || !description || !status) return null;
+        const summary = text(step.summary, 500);
+        return { id: stepId, description, status, ...(summary ? { summary } : {}) };
+    });
+    return steps.every(Boolean) ? { type: 'plan', conversationId: id, planId, title, steps: steps as AssistantPlanStep[] } : null;
+}
+
+export function projectAssistantPlanUpdate(value: unknown): AssistantPlanUpdateEvent | null {
+    const raw = exact(value, 'assistant_plan_update'); const id = raw && conversationId(raw.conversation_id); const planId = raw && text(raw.plan_id, 80);
+    const stepId = raw && conversationId(raw.step_id); const status = raw && planStatus(raw.status); const summary = raw && text(raw.summary, 500);
+    return id == null || !planId || stepId == null || !status ? null : { type: 'plan_update', conversationId: id, planId, stepId, status, ...(summary ? { summary } : {}) };
+}
+
+export function projectAssistantResponse(value: unknown): AssistantResponseEvent | null {
+    const raw = exact(value, 'assistant_response'); const id = raw && conversationId(raw.conversation_id); const response = raw && typeof raw.response === 'string' ? raw.response.slice(0, MAX_TEXT) : null;
+    if (id == null || response == null) return null;
+    const messageId = typeof raw.message_id === 'number' && Number.isSafeInteger(raw.message_id) && raw.message_id > 0
+        ? raw.message_id : typeof raw.message_id === 'string' && raw.message_id.length > 0 && raw.message_id.length <= 160 ? raw.message_id : null;
+    const created = typeof raw.created === 'number' || typeof raw.created === 'string' ? raw.created : 0;
+    const toolCount = Array.isArray(raw.tool_calls_made) ? Math.min(raw.tool_calls_made.length, MAX_TOOLS) : typeof raw.tool_calls_made === 'number' ? Math.min(Math.max(0, raw.tool_calls_made), MAX_TOOLS) : 0;
+    const durationMs = typeof raw.duration_ms === 'number' && Number.isFinite(raw.duration_ms) ? Math.max(0, raw.duration_ms) : 0;
+    return { type: 'response', conversationId: id, messageId, created, response, blocks: projectBlocks(raw.blocks), toolCount, durationMs };
+}
+
+export function projectAssistantError(value: unknown): AssistantErrorEvent | null {
+    const raw = exact(value, 'assistant_error'); const error = raw && text(raw.error, 1_000);
+    return !raw || !error ? null : { type: 'error', conversationId: conversationId(raw.conversation_id), error };
+}
+
+export const ASSISTANT_REALTIME_EVENTS = {
+    thinking: defineRealtimeEvent('assistant_thinking', projectAssistantThinking),
+    text: defineRealtimeEvent('assistant_text', projectAssistantText),
+    tool: defineRealtimeEvent('assistant_tool_call', projectAssistantToolCall),
+    plan: defineRealtimeEvent('assistant_plan', projectAssistantPlan),
+    planUpdate: defineRealtimeEvent('assistant_plan_update', projectAssistantPlanUpdate),
+    response: defineRealtimeEvent('assistant_response', projectAssistantResponse),
+    error: defineRealtimeEvent('assistant_error', projectAssistantError),
+} as const;
+
+export type AssistantTransportChoice = 'websocket' | 'rest' | 'inspect';
+export function chooseAssistantTransport(input: { owner: boolean; textOnly: boolean; hasViewAdmin: boolean; realtimeStatus: RealtimeLifecycleStatus }): AssistantTransportChoice {
+    if (!input.owner) return 'inspect';
+    return input.textOnly && input.hasViewAdmin && input.realtimeStatus === 'ready' ? 'websocket' : 'rest';
+}
+
+export class AssistantOutcomeUnknownError extends Error {
+    constructor() {
+        super('Outcome unknown: the connection ended before the server assigned a conversation. The conversation list was refreshed; the message was not resent.');
+        this.name = 'AssistantOutcomeUnknownError';
+    }
+}
+
+export interface AssistantRealtimeProgress {
+    tools: Array<{ name: string; status: 'running'; count: number }>;
+    plan: AssistantPlanEvent | null;
+}
+
+export interface AssistantRealtimeTurnCallbacks {
+    onConversation(id: number): void;
+    onText(message: AssistantMessage): void;
+    onProgress(progress: AssistantRealtimeProgress): void;
+    onResponse(message: AssistantMessage): void;
+    onReconcile(conversation: AssistantConversation): void;
+    onUnknown(): void;
+}
+
+export interface AssistantRealtimeTurn {
+    promise: Promise<void>;
+    cancel(): void;
+}
+
+export function startAssistantRealtimeTurn(
+    client: RealtimeClient,
+    input: {
+        message: string;
+        conversationId?: number;
+        seenMessageIds: Set<number | string>;
+        reconcile?: (conversationId: number) => Promise<AssistantConversation>;
+        refreshList?: () => Promise<unknown>;
+    },
+    callbacks: AssistantRealtimeTurnCallbacks,
+): AssistantRealtimeTurn {
+    let expected = input.conversationId ?? null;
+    let active = true;
+    let disconnected = false;
+    let interimSequence = 0;
+    const tools = new Map<string, { name: string; status: 'running'; count: number }>();
+    let plan: AssistantPlanEvent | null = null;
+    const cleanups: Array<() => void> = [];
+    let resolvePromise!: () => void;
+    let rejectPromise!: (error: Error) => void;
+    const promise = new Promise<void>((resolve, reject) => { resolvePromise = resolve; rejectPromise = reject; });
+
+    const finish = (error?: Error) => {
+        if (!active) return;
+        active = false;
+        cleanups.splice(0).forEach((cleanup) => cleanup());
+        if (error) rejectPromise(error); else resolvePromise();
+    };
+    const correlated = (id: number | null): id is number => id != null && (expected == null || expected === id);
+    const adopt = (id: number) => {
+        if (expected == null) { expected = id; callbacks.onConversation(id); }
+    };
+    const progress = () => callbacks.onProgress({ tools: [...tools.values()].slice(0, MAX_TOOLS), plan });
+
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.thinking, ({ data }) => {
+        if (!active || !correlated(data.conversationId)) return;
+        adopt(data.conversationId);
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.text, ({ data }) => {
+        if (!active || !correlated(data.conversationId)) return;
+        adopt(data.conversationId);
+        callbacks.onText({ id: `stream-${data.conversationId}-${++interimSequence}`, role: 'assistant', content: data.text, created: Math.floor(Date.now() / 1000), blocks: data.blocks });
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.tool, ({ data }) => {
+        if (!active || !correlated(data.conversationId)) return;
+        adopt(data.conversationId);
+        const current = tools.get(data.name);
+        tools.set(data.name, { name: data.name, status: 'running', count: Math.min(MAX_TOOLS, (current?.count ?? 0) + 1) });
+        progress();
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.plan, ({ data }) => {
+        if (!active || !correlated(data.conversationId)) return;
+        adopt(data.conversationId); plan = data; progress();
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.planUpdate, ({ data }) => {
+        if (!active || !correlated(data.conversationId) || !plan || plan.planId !== data.planId) return;
+        plan = { ...plan, steps: plan.steps.map((step) => step.id === data.stepId ? { ...step, status: data.status, ...(data.summary ? { summary: data.summary } : {}) } : step) };
+        progress();
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.response, ({ data }) => {
+        if (!active || !correlated(data.conversationId)) return;
+        adopt(data.conversationId);
+        if (data.messageId == null) {
+            void (input.reconcile ?? getAssistantConversation)(data.conversationId).then((conversation) => {
+                if (!active) return;
+                callbacks.onReconcile(conversation);
+                for (const message of conversation.messages) input.seenMessageIds.add(message.id);
+                finish();
+            }, (cause) => finish(cause instanceof Error ? cause : new Error('Assistant terminal reconciliation failed')));
+            return;
+        }
+        if (!input.seenMessageIds.has(data.messageId)) {
+            input.seenMessageIds.add(data.messageId);
+            callbacks.onResponse({ id: data.messageId, role: 'assistant', content: data.response, created: data.created, blocks: data.blocks });
+        }
+        finish();
+    }));
+    cleanups.push(client.on(ASSISTANT_REALTIME_EVENTS.error, ({ data }) => {
+        if (!active || (data.conversationId != null && !correlated(data.conversationId))) return;
+        if (data.conversationId != null) adopt(data.conversationId);
+        finish(new Error(data.error));
+    }));
+    cleanups.push(client.subscribeStatus(() => {
+        if (!active) return;
+        const status = client.getStatus().status;
+        if (status !== 'ready') {
+            if (expected == null) {
+                callbacks.onUnknown();
+                void (input.refreshList ?? listAssistantConversations)().catch(() => undefined);
+                finish(new AssistantOutcomeUnknownError());
+            } else {
+                disconnected = true;
+            }
+        } else if (disconnected && expected != null) {
+            disconnected = false;
+            void (input.reconcile ?? getAssistantConversation)(expected).then((conversation) => {
+                if (!active) return;
+                callbacks.onReconcile(conversation);
+                for (const message of conversation.messages) input.seenMessageIds.add(message.id);
+                finish();
+            }, (cause) => finish(cause instanceof Error ? cause : new Error('Assistant reconciliation failed')));
+        }
+    }));
+
+    try {
+        client.send({ type: 'assistant_message', message: input.message, ...(input.conversationId != null ? { conversation_id: input.conversationId } : {}) });
+    } catch (cause) {
+        finish(cause instanceof Error ? cause : new Error('Realtime Assistant send failed'));
+    }
+    return { promise, cancel: () => finish(new Error('Assistant stream cancelled')) };
+}

package/src/admin/assistant/types.ts

@@ -0,0 +1,30 @@
+import type { FileReference, RecordFeedId } from '../../client/record-feed';
+
+export type AssistantScalar = string | number | boolean | null;
+export type AssistantBlock =
+    | { type: 'table'; title?: string; columns: string[]; rows: AssistantScalar[][] }
+    | { type: 'chart'; title?: string; chart_type: 'line' | 'bar' | 'pie' | 'area'; labels: string[]; series: Array<{ name: string; values: number[] }> }
+    | { type: 'stat'; title?: string; items: Array<{ label: string; value: AssistantScalar }> }
+    | { type: 'list'; title?: string; items: Array<{ label: string; value: AssistantScalar }> }
+    | { type: 'action'; title?: string; description?: string; action_id?: string; actions: Array<{ label: string; value: string }> }
+    | { type: 'alert'; level: 'info' | 'success' | 'warning' | 'error'; title?: string; message: string }
+    | { type: 'file'; filename: string; url: string; size?: number; format?: string; row_count?: number; expires_in?: string }
+    | { type: 'attachment'; files: FileReference[] }
+    | { type: 'context'; references: Array<{ model: 'incident.Incident' | 'incident.Ticket'; pk: RecordFeedId; label?: string }> };
+
+export interface AssistantUser { id: number; display_name: string }
+export interface AssistantMessage {
+    id: RecordFeedId; role: 'user' | 'assistant'; content: string; created: number | string;
+    blocks: AssistantBlock[];
+}
+export interface AssistantConversation {
+    id: number; title: string; created: number | string; modified: number | string;
+    user: AssistantUser; messages: AssistantMessage[];
+}
+export interface AssistantConversationSummary extends Omit<AssistantConversation, 'messages'> {}
+export interface AssistantSkill {
+    id: number; tier: 'global' | 'user' | 'group'; name: string; description: string;
+    auto_execute: boolean; is_active: boolean; created: number | string; modified: number | string;
+    user: AssistantUser | null; triggers: string[]; steps: Array<{ tool: string; description: string; condition?: string }>;
+}
+export interface AssistantReply { response: string; conversation_id: number; tool_calls_made: number; duration_ms: number; blocks: AssistantBlock[] }

package/src/admin/bouncer/devices.tsx

@@ -0,0 +1,230 @@
+import { useState } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
+import {
+    Badge, DetailView, Eyebrow, FlatRow, ModelTable,
+    fmt, modal,
+    type Column, type FilterDef, type Tone,
+} from '../../ui';
+import {
+    BOUNCER_INCIDENT_VIEW_PERMS,
+    BouncerDeviceModel, BouncerIncidentModel, BouncerSignalModel,
+    type BouncerDeviceRow, type BouncerIncidentRow, type BouncerRiskTier,
+} from './models';
+import { bouncerDecisionTone, bouncerRiskTone, showBouncerSignalDetail } from './signals';
+import { showIncidentDetail } from '../incidents';
+
+function riskTierTone(tier: BouncerRiskTier): Tone {
+    if (tier === 'low') return 'success';
+    if (tier === 'medium') return 'warning';
+    if (tier === 'high' || tier === 'blocked') return 'danger';
+    return 'muted';
+}
+
+function LocalPager({ start, size, count, onStart }: {
+    start: number;
+    size: number;
+    count: number;
+    onStart: (start: number) => void;
+}) {
+    if (count <= size) return null;
+    const first = count === 0 ? 0 : start + 1;
+    const last = Math.min(count, start + size);
+    return (
+        <div className="bouncer-local-pager">
+            <span className="dim">{first}–{last} of {count}</span>
+            <div>
+                <button className="btn btn-compact" disabled={start === 0} onClick={() => onStart(Math.max(0, start - size))}>
+                    <i className="bi bi-chevron-left" /> Previous
+                </button>
+                <button className="btn btn-compact" disabled={start + size >= count} onClick={() => onStart(start + size)}>
+                    Next <i className="bi bi-chevron-right" />
+                </button>
+            </div>
+        </div>
+    );
+}
+
+function RelatedSignals({ device }: { device: BouncerDeviceRow }) {
+    const size = 10;
+    const [start, setStart] = useState(0);
+    const query = BouncerSignalModel.useList({
+        size, start, sort: '-created', muid: device.muid,
+    });
+    const rows = query.data?.rows ?? [];
+    if (query.isPending) return <p className="dim">Loading related signals…</p>;
+    if (query.error) return <p className="text-bad">{query.error.message}</p>;
+    if (!rows.length) return <p className="dim-italic">No signal assessments found for this MUID.</p>;
+    return (
+        <div className="bouncer-local-table">
+            <table className="tbl">
+                <thead><tr><th>Time</th><th>IP</th><th>Decision</th><th className="align-end">Risk</th><th>Page</th></tr></thead>
+                <tbody>
+                    {rows.map((row) => (
+                        <tr key={row.id} className="row-click" onClick={() => showBouncerSignalDetail(row.id)}>
+                            <td>{fmt.relative(row.created)}</td>
+                            <td><code>{row.ip_address || '—'}</code></td>
+                            <td><Badge tone={bouncerDecisionTone(row.decision)}>{row.decision.toUpperCase()}</Badge></td>
+                            <td className="align-end"><strong className={`bouncer-risk bouncer-risk-${bouncerRiskTone(row.risk_score)}`}>{row.risk_score}</strong></td>
+                            <td>{row.page_type || '—'}</td>
+                        </tr>
+                    ))}
+                </tbody>
+            </table>
+            <LocalPager start={start} size={size} count={query.data?.count ?? 0} onStart={setStart} />
+        </div>
+    );
+}
+
+function incidentPriorityTone(priority: number): Tone {
+    if (priority >= 7) return 'danger';
+    if (priority >= 5) return 'warning';
+    if (priority > 0) return 'info';
+    return 'muted';
+}
+
+function RelatedIncidents({ device }: { device: BouncerDeviceRow }) {
+    const size = 10;
+    const [start, setStart] = useState(0);
+    const query = BouncerIncidentModel.useList({
+        size,
+        start,
+        sort: '-created',
+        category__startswith: 'security:bouncer',
+        search: device.muid,
+    });
+    const rows: BouncerIncidentRow[] = query.data?.rows ?? [];
+    if (query.isPending) return <p className="dim">Loading related incidents…</p>;
+    if (query.error) return <p className="text-bad">{query.error.message}</p>;
+    if (!rows.length) return <p className="dim-italic">No Bouncer incidents are linked to this device.</p>;
+    return (
+        <div className="bouncer-local-table">
+            <table className="tbl">
+                <thead><tr><th>Created</th><th>Status</th><th>Priority</th><th>Category</th><th>Title</th></tr></thead>
+                <tbody>
+                    {rows.map((row) => (
+                        <tr key={row.id} className="row-click" onClick={() => showIncidentDetail(row.id)}>
+                            <td>{fmt.datetime(row.created)}</td>
+                            <td><Badge>{row.status}</Badge></td>
+                            <td><Badge tone={incidentPriorityTone(row.priority)}>{row.priority}</Badge></td>
+                            <td><code>{row.category}</code></td>
+                            <td>{row.title || row.details || `Incident #${row.id}`}</td>
+                        </tr>
+                    ))}
+                </tbody>
+            </table>
+            <LocalPager start={start} size={size} count={query.data?.count ?? 0} onStart={setStart} />
+        </div>
+    );
+}
+
+export function BouncerDeviceDetail({ id, onClose }: { id: number; onClose: () => void }) {
+    const queryClient = useQueryClient();
+    const { data: device, isPending, error } = BouncerDeviceModel.useOne(id);
+    if (isPending) return <div className="modal-pad dim">Loading Bouncer device…</div>;
+    if (!device || error) return <div className="modal-pad text-bad">{error?.message ?? 'Bouncer device not found'}</div>;
+
+    return (
+        <DetailView
+            icon="bi-fingerprint"
+            title="Bouncer Device"
+            subtitle={`MUID ${device.muid}`}
+            chips={[
+                { text: device.risk_tier.toUpperCase(), tone: riskTierTone(device.risk_tier) },
+                { text: `${device.event_count} events`, tone: 'info' },
+                { text: `${device.block_count} blocks`, tone: device.block_count ? 'danger' : 'muted' },
+            ]}
+            sections={[
+                {
+                    key: 'overview', label: 'Overview', icon: 'bi-grid-1x2', render: () => (
+                        <>
+                            <Eyebrow>Device identity</Eyebrow>
+                            <FlatRow label="MUID"><code>{device.muid}</code></FlatRow>
+                            <FlatRow label="DUID"><code>{device.duid || '—'}</code></FlatRow>
+                            <FlatRow label="MSID"><code>{device.msid || '—'}</code></FlatRow>
+                            <FlatRow label="Fingerprint"><code>{device.fingerprint_id || '—'}</code></FlatRow>
+                            <FlatRow label="Risk tier"><Badge tone={riskTierTone(device.risk_tier)}>{device.risk_tier.toUpperCase()}</Badge></FlatRow>
+                            <FlatRow label="Last IP"><code>{device.last_seen_ip || '—'}</code></FlatRow>
+                            <FlatRow label="First seen">{device.first_seen ? fmt.datetime(device.first_seen) : '—'}</FlatRow>
+                            <FlatRow label="Last seen">{fmt.datetime(device.last_seen)}</FlatRow>
+                            <Eyebrow>Activity</Eyebrow>
+                            <FlatRow label="Events">{device.event_count}</FlatRow>
+                            <FlatRow label="Blocks">{device.block_count}</FlatRow>
+                            <FlatRow label="Linked MUIDs">
+                                <span className="bouncer-token-list">
+                                    {device.linked_muids?.length
+                                        ? device.linked_muids.map((muid) => <code className="bouncer-code-token" key={muid}>{muid}</code>)
+                                        : <span className="dim">None</span>}
+                                </span>
+                            </FlatRow>
+                        </>
+                    ),
+                },
+                { key: 'signals', label: 'Signals', icon: 'bi-activity', render: () => <RelatedSignals device={device} /> },
+                {
+                    key: 'incidents', label: 'Incidents', icon: 'bi-shield-exclamation',
+                    permissions: BOUNCER_INCIDENT_VIEW_PERMS,
+                    render: () => <RelatedIncidents device={device} />,
+                },
+            ]}
+            initialSection="overview"
+            contextMenu={[
+                {
+                    label: 'Refresh', icon: 'bi-arrow-clockwise', onSelect: () => {
+                        void queryClient.invalidateQueries({ queryKey: BouncerDeviceModel.keys.one(device.id) });
+                    },
+                },
+            ]}
+            onClose={onClose}
+        />
+    );
+}
+
+export function showBouncerDeviceDetail(id: number): void {
+    void modal.detail((close) => (
+        <BouncerDeviceDetail id={id} onClose={() => close(null)} />
+    ));
+}
+
+const DEVICE_COLUMNS: Column<BouncerDeviceRow>[] = [
+    { key: 'muid', label: 'MUID', sortable: true, hideable: false, render: (row) => <code title={row.muid}>{fmt.truncateMiddle(row.muid, 18)}</code> },
+    { key: 'risk_tier', label: 'Risk Tier', sortable: true, render: (row) => <Badge tone={riskTierTone(row.risk_tier)}>{row.risk_tier.toUpperCase()}</Badge> },
+    { key: 'event_count', label: 'Events', sortable: true, align: 'end' },
+    { key: 'block_count', label: 'Blocks', sortable: true, align: 'end', render: (row) => <strong className={row.block_count ? 'text-bad' : undefined}>{row.block_count}</strong> },
+    { key: 'last_seen_ip', label: 'Last IP', render: (row) => <code>{row.last_seen_ip || '—'}</code> },
+    { key: 'last_seen', label: 'Last Seen', sortable: true, render: (row) => fmt.relative(row.last_seen) },
+];
+
+const DEVICE_FILTERS: FilterDef[] = [
+    { key: 'muid', label: 'MUID', type: 'text' },
+    { key: 'risk_tier', label: 'Risk tier', type: 'select', options: [
+        { value: 'unknown', label: 'Unknown' }, { value: 'low', label: 'Low' },
+        { value: 'medium', label: 'Medium' }, { value: 'high', label: 'High' },
+        { value: 'blocked', label: 'Blocked' },
+    ] },
+    { key: 'last_seen_ip', label: 'Last IP', type: 'text' },
+    { key: 'last_seen', label: 'Last seen', type: 'daterange' },
+];
+
+export function BouncerDevicesPage() {
+    return (
+        <ModelTable<BouncerDeviceRow>
+            model={BouncerDeviceModel}
+            eyebrow="Security · Bouncer"
+            title="Device Reputation"
+            searchPlaceholder="Search MUID, DUID, fingerprint, or IP"
+            columns={DEVICE_COLUMNS}
+            filters={DEVICE_FILTERS}
+            presets={[
+                { key: 'all', label: 'All', params: {} },
+                { key: 'high', label: 'High risk', params: { risk_tier: 'high' } },
+                { key: 'blocked', label: 'Blocked', params: { risk_tier: 'blocked' } },
+            ]}
+            defaultSort="-last_seen"
+            columnChooser
+            persistState
+            persistKey="admin:bouncer:devices"
+            exportFormats={['csv', 'json']}
+            onRowClick={(row) => showBouncerDeviceDetail(row.id)}
+        />
+    );
+}

package/src/admin/bouncer/index.ts

@@ -0,0 +1,34 @@
+import type { AdminSection } from '../index';
+import { BOUNCER_VIEW_PERMS } from './models';
+import { BouncerSignalsPage } from './signals';
+import { BouncerDevicesPage } from './devices';
+import { BotSignaturesPage } from './signatures';
+
+export * from './models';
+export * from './signals';
+export * from './devices';
+export * from './signatures';
+
+/** Mount-point-relative Bouncer contribution for standalone or embedded admin. */
+export const BOUNCER_ADMIN_SECTION: AdminSection = {
+    id: 'bouncer',
+    basePath: 'security/bouncer',
+    title: 'Bouncer',
+    icon: 'bi-shield-check',
+    navigationGroup: 'security',
+    permissions: BOUNCER_VIEW_PERMS,
+    routes: [
+        {
+            path: 'signals', label: 'Signal Decisions',
+            component: BouncerSignalsPage, permissions: BOUNCER_VIEW_PERMS,
+        },
+        {
+            path: 'devices', label: 'Device Reputation',
+            component: BouncerDevicesPage, permissions: BOUNCER_VIEW_PERMS,
+        },
+        {
+            path: 'signatures', label: 'Bot Signatures',
+            component: BotSignaturesPage, permissions: BOUNCER_VIEW_PERMS,
+        },
+    ],
+};