portal-mojo 0.2.2 → 0.2.4

package/src/admin/phonehub/api.ts

@@ -3,10 +3,15 @@ import { mojoCall, mojoList } from '../../client/runtime';
 import { PhoneConfigModel, sanitizePhoneConfigRow, sanitizePhoneNumberRow, type PhoneConfigRow, type PhoneNumberRow, type PhoneRelation } from './models';
 
 export const PHONE_GROUP_CHOICE_LIMIT=100;
+export const DEFAULT_MOJO_REMOTE_URL='https://api.mojoverify.com';
 export const PHONE_SECRET_FIELDS=['twilio_account_sid','twilio_auth_token','aws_access_key_id','aws_secret_access_key','mojo_api_key'] as const;
 export type PhoneSecretField=(typeof PHONE_SECRET_FIELDS)[number];
 export type SecretEdit={mode:'untouched'}|{mode:'replace';value:string}|{mode:'clear';confirmed:true};
 
+export function resolveMojoRemoteUrl(value:unknown):string{
+    return typeof value==='string'&&value.trim()?value.trim():DEFAULT_MOJO_REMOTE_URL;
+}
+
 export async function normalizePhoneNumber(phoneNumber:string,countryCode?:string):Promise<string>{
     const body=await mojoCall('/api/phonehub/number/normalize',{method:'POST',body:{phone_number:phoneNumber,...(countryCode?{country_code:countryCode}:{})}});
     const value=(body.data as {phone_number?:unknown}|undefined)?.phone_number;
@@ -25,6 +30,7 @@ export async function lookupPhoneNumber(phoneNumber:string,previous?:PhoneNumber
 }
 export function buildPhoneConfigPayload(scalars:Record<string,unknown>,credentials:Partial<Record<PhoneSecretField,SecretEdit>>):Record<string,unknown>{
     const body={...scalars};
+    if(body.provider==='mojo')body.mojo_remote_url=resolveMojoRemoteUrl(body.mojo_remote_url);
     for(const field of PHONE_SECRET_FIELDS){const edit=credentials[field];if(!edit||edit.mode==='untouched')continue;if(edit.mode==='clear')body[field]=null;else{const value=edit.value.trim();if(!value)throw new Error(`${field} replacements cannot be empty.`);body[field]=value;}}
     return body;
 }
@@ -36,13 +42,13 @@ export async function savePhoneConfigImperative(qc:QueryClient,id:number|null,sc
     const row=sanitizePhoneConfigRow(response.data as PhoneConfigRow);
     qc.setQueryData(PhoneConfigModel.keys.one(row.id),row);await qc.invalidateQueries({queryKey:PhoneConfigModel.keys.root});return row;
 }
-// Deliberately NOT client/action-result's `mojoAction`: `status` here is the
-// connection test's VERDICT (a result datum), not an action refusal — a failed
-// test must resolve so the panel can render it.
-export async function testPhoneConfigImperative(id:number):Promise<{status:boolean;message:string}>{
+// PhoneConfig returns `success` as its provider verdict; envelope `status`
+// only says the REST action ran. A failed test resolves for inline display.
+export async function testPhoneConfigImperative(id:number):Promise<{status:boolean;message:string;testMode:boolean;errorCode:string|null}>{
     const response=await mojoCall(`${PhoneConfigModel.endpoint}/${id}`,{method:'POST',body:{test_connection:1}});
     const data=(response.data??response) as Record<string,unknown>;
-    return {status:data.status!==false,message:typeof data.message==='string'?data.message:'Connection test completed.'};
+    const status=data.success===true;
+    return {status,testMode:data.test_mode===true,errorCode:typeof data.error==='string'?data.error:null,message:typeof data.message==='string'?data.message:status?'Connection verified.':'The server did not confirm the provider connection.'};
 }
 export async function fetchPhoneGroupChoices():Promise<PhoneRelation[]>{
     const result=await mojoList<Record<string,unknown>>('/api/group',{graph:'basic',sort:'name',start:0,size:PHONE_GROUP_CHOICE_LIMIT});

package/src/admin/rules/RuleSetDetailPage.tsx

@@ -1,14 +1,17 @@
-import { useMemo } from 'react';
+import { useMemo, useEffect, useRef } from 'react';
 import { useCan } from '../../client/runtime';
 import { Badge, DetailView, FlatRow, JsonBlock, ModelTable, fmt, modal, toast, type BatchAction, type Column } from '../../ui';
 import { HandlerChainBuilder } from './HandlerChainBuilder';
-import { parseHandlerChain, runtimeEffectiveHandlerChain, validateHandlerChain } from './handler-dsl';
+import { conditionRemovalEffect } from './condition-removal';
 import { confirmCatchAllEnable, openHandlerChainEditor, openRuleEditor, openRuleSetEditor } from './editors';
+import { parseHandlerChain, runtimeEffectiveHandlerChain, validateHandlerChain } from './handler-dsl';
 import { BUNDLE_BY_OPTIONS, RULESET_MANAGE_PERMS, RuleModel, RuleSetModel, type RuleRow } from './models';
 
 export function RuleSetDetail({ id, onClose }: { id: number; onClose: () => void }) {
-    const { can: canManage } = useCan(RULESET_MANAGE_PERMS); const query = RuleSetModel.useOne(Number.isFinite(id) ? id : null);
-    const rules = RuleModel.useList({ parent: id, size: 250, sort: 'index' }); const save = RuleSetModel.useSave(); const destroy = RuleSetModel.useDelete(); const destroyRule = RuleModel.useDelete();
+    const { can: canManage } = useCan(RULESET_MANAGE_PERMS);
+    const permission = useRef(canManage); permission.current = canManage;
+    useEffect(() => { permission.current = canManage; return () => { permission.current = false; }; }, [canManage]); const query = RuleSetModel.useOne(Number.isFinite(id) ? id : null);
+    const rules = RuleModel.useList({ parent: id, size: 250, sort: 'index' }); const save = RuleSetModel.useSave(); const destroyRule = RuleModel.useDelete();
     const duplicateIndexes = useMemo(() => { const counts = new Map<number, number>(); for (const row of rules.data?.rows ?? []) counts.set(row.index, (counts.get(row.index) ?? 0) + 1); return [...counts].filter(([, count]) => count > 1).map(([index]) => index); }, [rules.data]);
     if (!Number.isFinite(id)) return <div className="modal-pad text-bad">Invalid rule-set id. <button type="button" className="btn" onClick={onClose}>Close</button></div>;
     if (query.isPending || !query.data) return <div className="modal-pad dim">Loading rule set… <button type="button" className="btn" onClick={onClose}>Close</button></div>;
@@ -19,12 +22,33 @@ export function RuleSetDetail({ id, onClose }: { id: number; onClose: () => void
         { key: 'comparator', label: 'Comparator', render: (rule) => <code>{rule.comparator}</code> }, { key: 'value', label: 'Value', render: (rule) => <code>{rule.value_type}:{rule.value}</code> },
         { key: 'is_required', label: 'Required', render: (rule) => rule.is_required ? 'Yes' : 'No' },
     ];
-    const ruleActions: BatchAction<RuleRow>[] = canManage ? [{ key: 'delete', label: 'Delete conditions', icon: 'bi-trash', danger: true, confirm: 'Delete the selected conditions? This cannot be undone.', run: (rule) => destroyRule.mutateAsync({ id: rule.id }) }] : [];
+    const ruleActions: BatchAction<RuleRow>[] = canManage ? [{
+        key: 'delete', label: 'Remove conditions', icon: 'bi-trash', danger: true, confirm: false,
+        prepare: async selected => {
+            try {
+            if (!permission.current) return null;
+            const [parent, children] = await Promise.all([query.refetch(), rules.refetch()]);
+            if (!parent.data || !children.data || parent.error || children.error) throw new Error('Authoritative rule state unavailable. No conditions removed.');
+            const current = selected.map(item => children.data!.rows.find(child => child.id === item.id));
+            if (current.some(item => !item)) throw new Error('Selected conditions changed; refresh and select again.');
+            const effect = conditionRemovalEffect(parent.data, children.data.count, selected.length);
+            const confirmed = await modal.confirm({ title: `Remove ${selected.length} conditions?`, danger: true, confirmText: 'Remove conditions', message: <div><p>Rule set: {parent.data.name} (#{id}) · {parent.data.match_by === 0 ? 'ALL' : 'ANY'}</p><ul>{current.map(item => <li key={item!.id}>{item!.name} (#{item!.id})</li>)}</ul><p>{effect}</p><p>These conditions cannot be restored by this action.</p></div> });
+            return confirmed && permission.current ? selected.map(item => item.id) : null;
+            } catch (error) { toast.error(error instanceof Error ? error.message : 'Condition state unavailable'); return null; }
+        },
+        runBatch: async selected => {
+            if (!permission.current) throw new Error('Permission to remove conditions was revoked.');
+            const results = await Promise.allSettled(selected.map(rule => destroyRule.mutateAsync({ id: rule.id })));
+            await Promise.all([query.refetch(), rules.refetch()]);
+            const failed = results.filter(result => result.status === 'rejected');
+            if (failed.length) throw new Error(`${results.length - failed.length} removed; ${failed.length} refused. Authoritative parent and conditions refreshed. ${String((failed[0] as PromiseRejectedResult).reason)}`);
+        },
+    }] : [];
     const setActive = async (next: boolean) => { if (next && !(await confirmCatchAllEnable(row, rules.data?.count ?? 0))) return; try { await save.mutateAsync({ id, changes: { is_active: next } }); toast.success(next ? 'Rule set enabled' : 'Rule set disabled'); } catch (error) { toast.error(error instanceof Error ? error.message : 'State change failed'); } };
     const bundleLabel = BUNDLE_BY_OPTIONS.find((option) => Number(option.value) === row.bundle_by)?.label ?? `Unknown (${row.bundle_by})`;
-    return <DetailView icon="bi-diagram-3" title={row.name || `Rule set #${row.id}`} subtitle={`${row.category} · priority ${row.priority} · first active match wins`} chips={[{ text: row.is_active ? 'ACTIVE' : 'INACTIVE', tone: row.is_active ? 'success' : 'muted' }, { text: `${rules.data?.count ?? 0} CONDITIONS`, tone: duplicateIndexes.length ? 'warning' : 'info' }]} active={canManage ? { value: row.is_active, onChange: (next) => void setActive(next) } : undefined} onClose={onClose} menuContext={row} contextMenu={canManage ? [{ label: 'Edit rule set', onSelect: () => void openRuleSetEditor(row) }, { label: 'Edit handler chain', onSelect: () => void openHandlerChainEditor(row) }, { divider: true }, { label: 'Delete rule set and conditions', danger: true, onSelect: async () => { if (!(await modal.confirm({ title: 'Delete rule set?', message: `Delete “${row.name}” and all ${rules.data?.count ?? 0} conditions?`, confirmText: 'Delete rule set', danger: true }))) return; await destroy.mutateAsync({ id }); onClose(); } }] : []} sections={[
+    return <DetailView icon="bi-diagram-3" title={row.name || `Rule set #${row.id}`} subtitle={`${row.category} · priority ${row.priority} · first active match wins`} chips={[{ text: row.is_active ? 'ACTIVE' : 'INACTIVE', tone: row.is_active ? 'success' : 'muted' }, { text: `${rules.data?.count ?? 0} CONDITIONS`, tone: duplicateIndexes.length ? 'warning' : 'info' }]} active={canManage ? { value: row.is_active, disabled: save.isPending, onChange: (next) => void setActive(next) } : undefined} onClose={onClose} menuContext={row} contextMenu={canManage ? [{ label: 'Edit rule set', onSelect: () => void openRuleSetEditor(row) }, { label: 'Edit handler chain', onSelect: () => void openHandlerChainEditor(row) }, { label: row.is_active ? 'Deactivate' : 'Reactivate', disabled: save.isPending, onSelect: () => void setActive(!row.is_active) }] : []} sections={[
         { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-stack"><FlatRow label="State">{row.is_active ? 'Active' : 'Inactive'}</FlatRow><FlatRow label="Category"><code>{row.category}</code></FlatRow><FlatRow label="Priority">{row.priority} (lower is evaluated first within this category)</FlatRow><FlatRow label="Matching">{row.match_by === 0 ? 'All conditions' : row.match_by === 1 ? 'Any condition' : `Unknown (${row.match_by})`}</FlatRow><FlatRow label="Created">{fmt.datetime(row.created)}</FlatRow></div> },
-        { key: 'conditions', label: 'Conditions', icon: 'bi-funnel', render: () => <div>{duplicateIndexes.length > 0 && <div className="rule-priority-warning">Duplicate condition indexes {duplicateIndexes.join(', ')} have undefined tie order.</div>}<ModelTable model={RuleModel} title="Conditions" columns={ruleColumns} searchable={false} defaultParams={{ parent: id, sort: 'index' }} onRowClick={canManage ? (rule) => void openRuleEditor(id, rule, nextIndex) : undefined} {...(canManage ? { addLabel: 'Add condition', onAdd: () => void openRuleEditor(id, undefined, nextIndex), selectable: true, batchActions: ruleActions } : {})} /></div> },
+        { key: 'conditions', label: 'Conditions', icon: 'bi-funnel', render: () => <div>{duplicateIndexes.length > 0 && <div className="rule-priority-warning">Duplicate condition indexes {duplicateIndexes.join(', ')} have undefined tie order.</div>}<ModelTable model={RuleModel} title="Conditions" columns={ruleColumns} searchable={false} fixedParams={{ parent: id }} defaultParams={{ sort: 'index' }} onRowClick={canManage ? (rule) => void openRuleEditor(id, rule, nextIndex) : undefined} {...(canManage ? { addLabel: 'Add condition', onAdd: () => void openRuleEditor(id, undefined, nextIndex), selectable: true, batchActions: ruleActions } : {})} /></div> },
         { key: 'triggering', label: 'Triggering', icon: 'bi-lightning', render: () => <div className="detail-stack"><FlatRow label="Bundle by">{bundleLabel}</FlatRow><FlatRow label="Bundle window">{row.bundle_minutes == null ? 'Unbounded' : row.bundle_minutes === 0 ? 'Disabled (no time bundling)' : `${row.bundle_minutes} minutes`}</FlatRow><FlatRow label="Trigger">{row.trigger_count == null ? 'Immediately on first event' : `${row.trigger_count} events${row.trigger_window == null ? '' : ` within ${row.trigger_window} minutes`}`}</FlatRow><FlatRow label="Re-trigger">{row.retrigger_every == null ? 'Once per incident' : `Every ${row.retrigger_every} additional events`}</FlatRow></div> },
         { key: 'handler', label: 'Handler', icon: 'bi-diagram-3', render: () => <div><div className="handler-section-actions"><p>{runtimeEffectiveHandlerChain(chain).length} runtime-effective dispatch step(s). Publication follows the order below; completion is asynchronous.</p>{canManage && <button type="button" className="btn btn-primary" onClick={() => void openHandlerChainEditor(row)}>Edit chain</button>}</div><HandlerChainBuilder value={row.handler ?? ''} onChange={() => undefined} disabled />{handlerIssues.length > 0 && <p className="dim">Legacy warnings remain visible and byte-preserved until explicitly changed.</p>}</div> },
         { key: 'agent', label: 'Agent prompt', icon: 'bi-stars', render: () => <div className="detail-stack"><FlatRow label="Prompt">{typeof row.metadata.agent_prompt === 'string' ? row.metadata.agent_prompt : 'No agent prompt configured.'}</FlatRow><p className="dim">The prompt is stored in RuleSet metadata. General edits merge only targeted metadata keys.</p></div> },

package/src/admin/rules/condition-removal.ts

@@ -0,0 +1,7 @@
+/** Empty ALL and ANY condition sets both match every event server-side. */
+export function conditionRemovalEffect(parent: { match_by: number; is_active: boolean }, count: number, selected: number): string {
+    if (parent.match_by !== 0 && parent.match_by !== 1) throw new Error('Unknown matching mode; refresh and inspect before removing conditions.');
+    if (selected < 1 || selected > count) throw new Error('Condition selection changed; refresh before removing conditions.');
+    if (count === selected) return `${parent.is_active ? 'This active' : 'This inactive'} rule set becomes catch-all: either matching mode accepts every event without conditions.`;
+    return parent.match_by === 0 ? 'ALL mode: removal broadens matching because fewer conditions must hold.' : 'ANY mode: removal narrows matching because fewer alternatives can match.';
+}

package/src/admin/security/geoip/models.ts

@@ -113,6 +113,11 @@ export interface GeoLocatedIPRow {
     whitelisted_reason: string | null;
     whitelisted_until: number | null;
 
+    firewall_generation: number;
+    firewall_pending: boolean;
+    firewall_sync_error: string;
+    firewall_observed_at: number | null;
+
     expires_at: number | null;
 
     /** `extra` on every graph — computed Python properties. */

package/src/admin/security/tickets.tsx

@@ -1,18 +1,40 @@
-import { useEffect, useMemo, useRef, useState, type MouseEvent } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
-import { mojoSave, useCan } from '../../client/runtime';
+import { useEffect, useMemo, useRef, useState, type MouseEvent } from 'react';
 import type { RecordFeedItem } from '../../client/record-feed';
+import { createTicketNoteAdapter } from '../../client/record-feed';
+import { mojoSave, useCan } from '../../client/runtime';
 import {
-    Badge, CollectionSelect, DetailView, MarkdownView, ModelTable, RecordFeed, SchemaForm, fmt, modal, toast,
-    type Column, type Field, type FilterDef, type FormData, type Tone,
+    Badge,
+    CollectionSelect,
+    DetailView,
+    MarkdownView,
+    ModelTable,
+    RecordFeed,
+    SchemaForm,
+    fmt,
+    modal,
+    toast,
+    type Column,
+    type Field,
+    type FilterDef,
+    type FormData,
+    type Tone,
 } from '../../ui';
 import { AssistantContextLauncher } from '../assistant/launchers';
-import { createTicketNoteAdapter } from '../../client/record-feed';
 import {
-    MaestroItemLinkModel, TICKET_MANAGE_PERMS, TICKET_USER_LOOKUP_PERMS,
-    TicketModel, buildTicketActionResponseBody, invalidateTicketDependents,
-    isTicketActionDisabled, isTicketTerminal, knownOptionsWithCurrent, relationId, relationLabel,
-    type TicketNoteAction, type TicketRow,
+    MaestroItemLinkModel,
+    TICKET_MANAGE_PERMS,
+    TICKET_USER_LOOKUP_PERMS,
+    TicketModel,
+    buildTicketActionResponseBody,
+    invalidateTicketDependents,
+    isTicketActionDisabled,
+    isTicketTerminal,
+    knownOptionsWithCurrent,
+    relationId,
+    relationLabel,
+    type TicketNoteAction,
+    type TicketRow,
 } from './models';
 
 export const TICKET_STATUSES = [
@@ -407,6 +429,12 @@ function TicketDetail({ ticketId, close }: { ticketId: number; close(): void })
             ]}
             onClose={close}
             menuContext={ticket}
+            contextMenu={canManage ? [
+                { label: 'Edit ticket', disabled: busy, onSelect: () => void openTicketEditor(ticket) },
+                { label: llmEnabled ? 'Disable LLM' : 'Enable LLM', disabled: busy, onSelect: () => void runLlm() },
+                { label: 'Close ticket', disabled: busy || isTicketTerminal(ticket.status), onSelect: () => void patch({ status: 'closed' }, 'Ticket closed') },
+                { label: 'Push to Maestro', disabled: busy || Boolean(link), onSelect: () => void push() },
+            ] : []}
             sections={[
                 {
                     key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => (
@@ -439,9 +467,9 @@ function TicketDetail({ ticketId, close }: { ticketId: number; close(): void })
                     ),
                 },
                 ...(canManage ? [{
-                    key: 'manage', label: 'Manage', icon: 'bi-sliders', render: () => (
+                    key: 'properties', label: 'Properties', icon: 'bi-sliders', render: () => (
                 <section className="ticket-detail-controls" aria-label="Ticket controls">
-                    <h4>Manage ticket</h4>
+                    <h4>Ticket properties</h4>
                     {error && <div className="form-alert" role="alert">{error}</div>}
                     <div className="ticket-control-grid">
                         <label className="field"><span className="field-label">Status</span>
@@ -481,12 +509,7 @@ function TicketDetail({ ticketId, close }: { ticketId: number; close(): void })
                             if (descriptionDraft !== (ticket.description ?? '')) void patch({ description: descriptionDraft }, 'Description updated');
                         }} />
                     </label>
-                    <div className="ticket-control-actions">
-                        <button type="button" className="btn" disabled={busy} onClick={() => void runLlm()}>{llmEnabled ? 'Disable LLM' : 'Enable LLM'}</button>
-                        <button type="button" className="btn" disabled={busy || isTicketTerminal(ticket.status)} onClick={() => void patch({ status: 'closed' }, 'Ticket closed')}>Close ticket</button>
-                        <button type="button" className="btn" disabled={busy || Boolean(link)} onClick={() => void push()}>{pushToMaestro.isPending ? 'Queueing…' : 'Push to Maestro'}</button>
-                        <button type="button" className="btn" disabled={busy} onClick={() => void openTicketEditor(ticket)}>Edit all fields</button>
-                    </div>
+
                 </section>
                     ),
                 }] : []),

package/src/admin/shortlinks/ShortlinkDetail.tsx

@@ -1,13 +1,21 @@
-import { useState } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
-import { ArmedButton, DetailView, FlatRow, fmt, toast } from '../../ui';
+import { useState } from 'react';
+import { useCan } from '../../client/runtime';
+import { DetailView, FlatRow, fmt, toast } from '../../ui';
 import {
-    ShortlinkModel, ShortlinkReconciliationError, deleteShortlink, functionalShortlinkUrl,
-    refreshShortlinks, setShortlinkActive, useTrackedCounts,
+    SHORTLINK_MANAGE_PERMISSIONS,
+    ShortlinkModel,
+    ShortlinkReconciliationError,
+    functionalShortlinkUrl,
+    refreshShortlinks,
+    setShortlinkActive,
+    useTrackedCounts,
 } from './models';
 
 export function ShortlinkDetail({ id, onClose }: { id: number; onClose: () => void }) {
     const queryClient = useQueryClient();
+    const canManage = useCan(SHORTLINK_MANAGE_PERMISSIONS).can;
+    const [pending, setPending] = useState(false);
     const query = ShortlinkModel.useOne(id);
     const [retryBlocked, setRetryBlocked] = useState(false);
     const counts = useTrackedCounts(query.data ?? null);
@@ -15,13 +23,14 @@ export function ShortlinkDetail({ id, onClose }: { id: number; onClose: () => vo
     const row = query.data;
     const capability = functionalShortlinkUrl(row.code);
     const act = async (action: () => Promise<unknown>, success: string): Promise<boolean> => {
-        if (retryBlocked) return false;
+        if (!canManage || pending || retryBlocked) return false;
+        setPending(true);
         try { await action(); toast.success(success); await query.refetch(); return true; }
         catch (error) {
             if (error instanceof ShortlinkReconciliationError) setRetryBlocked(true);
             toast.error(error instanceof Error ? error.message : 'Shortlink operation failed');
             return false;
-        }
+        } finally { setPending(false); }
     };
     const refresh = async () => {
         try { await refreshShortlinks(queryClient); await query.refetch(); setRetryBlocked(false); toast.success('Authoritative shortlink state refreshed'); }
@@ -29,6 +38,8 @@ export function ShortlinkDetail({ id, onClose }: { id: number; onClose: () => vo
     };
     return <DetailView title={row.code} subtitle={row.source || 'No source label'} icon="bi-link-45deg"
         chips={[{ text: row.is_active ? 'Active' : 'Inactive', tone: row.is_active ? 'success' : 'muted' }]}
+        active={canManage ? { value: row.is_active, disabled: pending || retryBlocked, onChange: next => void act(() => setShortlinkActive(queryClient, row, next), next ? 'Shortlink reactivated' : 'Shortlink deactivated') } : undefined}
+        contextMenu={canManage ? [{ label: row.is_active ? 'Deactivate' : 'Reactivate', disabled: pending || retryBlocked, onSelect: () => void act(() => setShortlinkActive(queryClient, row, !row.is_active), 'Shortlink updated') }] : []}
         onClose={onClose} sections={[
             { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section">
                 {retryBlocked && <div className="form-alert">The last change may have persisted, but reconciliation failed. Refresh successfully before retrying.</div>}
@@ -45,11 +56,6 @@ export function ShortlinkDetail({ id, onClose }: { id: number; onClose: () => vo
                 <h3>Tracked records</h3><p className="dim">Human and bot values count retained tracking records. Total hits may also include requests made while tracking was off.</p>
                 {counts.isLoading ? <p>Loading counts…</p> : counts.isError ? <div className="form-alert">Tracked counts unavailable.</div> : <div className="shortlink-counts"><div><b>{counts.data?.human ?? 0}</b><span>Human records</span></div><div><b>{counts.data?.bot ?? 0}</b><span>Bot records</span></div><div><b>{counts.data?.remainder ?? row.hit_count}</b><span>Hit-count remainder</span></div></div>}
             </div> },
-            { key: 'controls', label: 'Controls', icon: 'bi-sliders', render: () => <div className="detail-section">
-                <h3>{row.is_active ? 'Deactivate link' : 'Reactivate link'}</h3><p>Changes use a single non-retrying request followed by an authoritative refresh.</p>
-                <button className="btn" disabled={retryBlocked} onClick={() => void act(() => setShortlinkActive(queryClient, row, !row.is_active), row.is_active ? 'Shortlink deactivated' : 'Shortlink reactivated')}>{row.is_active ? 'Deactivate' : 'Reactivate'}</button>
-                <h3>Delete link</h3><p>Deletion is permanent. Click history is removed by the backend cascade.</p>
-                <ArmedButton label="Delete shortlink" armedLabel={`Click again to delete ${row.code}`} disabled={retryBlocked} onConfirm={async () => { if (await act(() => deleteShortlink(queryClient, row), 'Shortlink deleted')) onClose(); }} />
-            </div> },
+
         ]} />;
 }

package/src/admin/storage/BucketDetail.tsx

@@ -1,9 +1,15 @@
-import { useState } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
+import { useEffect, useRef, useState } from 'react';
+import { useCan } from '../../client/runtime';
 import { ArmedButton, DetailView, FlatRow, SchemaForm, fmt, modal, toast } from '../../ui';
 import {
-    BUCKET_MANAGE_PERMS, emptyBucket, setBucketPublic,
-    type BucketEmptyResult, type BucketMutationOutcome, type S3BucketRow, type S3FailureEvidence,
+    BUCKET_MANAGE_PERMS,
+    emptyBucket,
+    setBucketPublic,
+    type BucketEmptyResult,
+    type BucketMutationOutcome,
+    type S3BucketRow,
+    type S3FailureEvidence,
 } from './models';
 
 function message(error: unknown): string { return error instanceof Error ? error.message : 'Storage operation failed'; }
@@ -29,6 +35,9 @@ function Outcome({ value }: { value: BucketMutationOutcome<unknown> | null }) {
 
 export function BucketDetail({ bucket, onClose }: { bucket: S3BucketRow; onClose: () => void }) {
     const queryClient = useQueryClient();
+    const canManage = useCan(BUCKET_MANAGE_PERMS).can;
+    const permission = useRef(canManage); permission.current = canManage;
+    useEffect(() => { permission.current = canManage; return () => { permission.current = false; }; }, [canManage]);
     const [outcome, setOutcome] = useState<BucketMutationOutcome<unknown> | null>(null);
     const [emptyResult, setEmptyResult] = useState<BucketEmptyResult | null>(null);
 
@@ -40,13 +49,15 @@ export function BucketDetail({ bucket, onClose }: { bucket: S3BucketRow; onClose
                 : <>This applies the all-private Public Access Block posture to <code>{bucket.name}</code>. The operation is externally observable and not atomic.</>,
             confirmText: isPublic ? 'Make public' : 'Make private', danger: isPublic,
         });
-        if (!confirmed) return;
+        if (!confirmed || !permission.current) return;
         const next = await setBucketPublic(queryClient, bucket.name, isPublic);
         setOutcome(next);
         if (next.data) toast.success(`${bucket.name} verified ${next.data.is_public ? 'public' : 'private'}`);
     };
 
     const confirmEmpty = async () => {
+        if (!permission.current) return;
+        let pending = false;
         await modal.open((close) => (
             <div className="modal-pad">
                 <h2 className="modal-title">Empty {bucket.name}</h2>
@@ -56,9 +67,13 @@ export function BucketDetail({ bucket, onClose }: { bucket: S3BucketRow; onClose
                     submitText="Empty bucket"
                     onCancel={() => close(null)}
                     onSubmit={async (data) => {
+                        if (!permission.current) throw new Error('Permission to empty this bucket was revoked.');
                         const exact = String(data.confirm_name ?? '');
                         if (exact !== bucket.name) throw new Error('Bucket name does not match exactly. No request was sent.');
-                        const next = await emptyBucket(queryClient, bucket.name, exact);
+                        pending = true;
+                        let next;
+                        try { next = await emptyBucket(queryClient, bucket.name, exact); }
+                        finally { pending = false; }
                         setOutcome(next);
                         if (next.error) throw next.error;
                         if (next.data) { setEmptyResult(next.data); toast.success(`${bucket.name} empty acknowledged`); }
@@ -66,12 +81,16 @@ export function BucketDetail({ bucket, onClose }: { bucket: S3BucketRow; onClose
                     }}
                 />
             </div>
-        ), { size: 'sm' });
+        ), { size: 'sm', canDismiss: () => !pending });
     };
 
-    return <DetailView title={bucket.name} subtitle="Account-level S3 bucket" icon="bi-bucket" chips={[{ text: 'Global', tone: 'info' }]} sections={[
+    return <DetailView title={bucket.name} subtitle="Account-level S3 bucket" icon="bi-bucket" chips={[{ text: 'Global', tone: 'info' }]} contextMenu={canManage ? [
+        { label: 'Make public…', danger: true, onSelect: () => void access(true) },
+        { label: 'Make private…', onSelect: () => void access(false) },
+        { label: 'Empty bucket…', danger: true, onSelect: () => void modal.open(close => <div className="modal-pad"><h2 className="modal-title">Empty {bucket.name}</h2><p className="modal-message">Permanently removes objects, versions, delete markers and multipart uploads. Stop writers first. The bucket is retained.</p><div className="modal-actions"><button className="btn" onClick={() => close(null)}>Cancel</button><ArmedButton className="btn-danger" label="Empty bucket" armedLabel="Continue to exact-name confirmation" onConfirm={async () => { await confirmEmpty(); close(null); }} /></div></div>, { size: 'sm' }) },
+    ] : []} sections={[
         { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><FlatRow label="Name"><code>{bucket.name}</code></FlatRow><FlatRow label="Created">{fmt.datetime(bucket.created)}</FlatRow><FlatRow label="Inventory">Complete account inventory row</FlatRow><Outcome value={outcome} />{emptyResult && <div className="storage-counts"><b>Last acknowledged empty counts</b><span>Objects {emptyResult.deleted_objects}</span><span>Versions {emptyResult.deleted_versions}</span><span>Delete markers {emptyResult.deleted_markers}</span><span>Multipart uploads {emptyResult.aborted_uploads}</span></div>}</div> },
-        { key: 'access', label: 'Access', icon: 'bi-shield-lock', permissions: BUCKET_MANAGE_PERMS, render: () => <div className="detail-section"><h3>Verified access posture</h3><p className="dim">Every attempt refreshes inventory in a finally path. A rejection can still represent partial external change.</p><div className="storage-action-row"><button className="btn btn-danger" onClick={() => void access(true)}>Make public…</button><button className="btn" onClick={() => void access(false)}>Make private…</button></div></div> },
-        { key: 'danger', label: 'Danger zone', icon: 'bi-exclamation-octagon', permissions: BUCKET_MANAGE_PERMS, render: () => <div className="detail-section storage-danger"><h3>Empty bucket</h3><p>Irreversible and non-atomic against active writers. Bucket deletion is unavailable.</p><ArmedButton className="btn-danger" icon="bi-trash3" label="Empty bucket" armedLabel="Click again — remove all objects, versions, markers, and uploads" onConfirm={confirmEmpty} /></div> },
+        { key: 'access', label: 'Access', icon: 'bi-shield-lock', permissions: BUCKET_MANAGE_PERMS, render: () => <div className="detail-section"><h3>Verified access posture</h3><p className="dim">Every attempt refreshes inventory in a finally path. A rejection can still represent partial external change.</p></div> },
+
     ]} initialSection="overview" onClose={onClose} />;
 }

package/src/admin/storage/FileManagerDetail.tsx

@@ -1,9 +1,10 @@
 import { useQueryClient } from '@tanstack/react-query';
-import { Badge, DetailView, FlatRow, fmt, modal, toast } from '../../ui';
+import { useState } from 'react';
 import { useCan } from '../../client/runtime';
+import { Badge, DetailView, FlatRow, fmt, modal, toast } from '../../ui';
 import { FileView } from './FileView';
+import { FileManagerModel, FileModel, GROUP_DIRECTORY_PERMS, STORAGE_MANAGE_PERMS, USER_DIRECTORY_PERMS, runFileManagerAction, saveFileManagerAtomic, storageRelationId } from './models';
 import { openFileManagerEditor } from './storage-dialogs';
-import { FileManagerModel, FileModel, GROUP_DIRECTORY_PERMS, STORAGE_MANAGE_PERMS, USER_DIRECTORY_PERMS, storageRelationId, runFileManagerAction, saveFileManagerAtomic } from './models';
 
 function NestedFiles({ managerId }: { managerId: number }) {
     const query = FileModel.useList({ file_manager: managerId, start: 0, size: 10, sort: '-created' });
@@ -15,6 +16,7 @@ function NestedFiles({ managerId }: { managerId: number }) {
 
 export function FileManagerDetail({ id, onClose }: { id: number; onClose: () => void }) {
     const queryClient = useQueryClient();
+    const [pending, setPending] = useState(false);
     const query = FileManagerModel.useOne(id);
     const managerPermission = useCan(STORAGE_MANAGE_PERMS);
     const groupDirectoryPermission = useCan(GROUP_DIRECTORY_PERMS);
@@ -28,9 +30,25 @@ export function FileManagerDetail({ id, onClose }: { id: number; onClose: () =>
     const action = async (name: 'test_connection' | 'check_cors' | 'fix_cors') => { try { const result = await runFileManagerAction(id, name); toast.success(name === 'test_connection' ? 'Connection succeeded' : `${name.replace('_', ' ')} completed`); await modal.open((close) => <div className="modal-pad"><h2 className="modal-title">{name.replaceAll('_', ' ')}</h2><pre className="storage-result-json">{JSON.stringify(result, null, 2)}</pre><div className="modal-actions"><button className="btn" onClick={() => close(null)}>Close</button></div></div>); } catch (error) { toast.error(error instanceof Error ? error.message : `${name} failed`); } };
     const clone = async () => { const ok = await modal.confirm({ title: 'Clone backend?', message: <>Create a private clone of <b>{row.name}</b> under the same explicit owner scope?</>, confirmText: 'Clone' }); if (!ok) return; try { await runFileManagerAction(id, 'clone'); await FileManagerModel.invalidate(queryClient); toast.success(`${row.name} cloned`); } catch (error) { toast.error(error instanceof Error ? error.message : 'Clone failed'); } };
     const toggle = async () => { const ok = await modal.confirm({ title: row.is_public ? 'Make backend private?' : 'Make backend public?', message: 'This changes prefix policy on the storage provider. Continue?', confirmText: row.is_public ? 'Make private' : 'Make public', danger: !row.is_public }); if (!ok) return; try { await saveFileManagerAtomic({ queryClient, id, changes: { is_public: !row.is_public } }); await query.refetch(); } catch (error) { toast.error(error instanceof Error ? error.message : 'Access change failed'); } };
-    return <DetailView title={row.name} subtitle={`${row.backend_type} · ${row.backend_url}`} icon="bi-hdd-stack" chips={[{ text: row.is_active ? 'Active' : 'Inactive', tone: row.is_active ? 'success' : 'muted' }, { text: row.is_public ? 'Public' : 'Private', tone: row.is_public ? 'warning' : 'success' }]} sections={[
-        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><div className="storage-action-row">{canManage && <><button className="btn" onClick={() => void edit('general')}>Edit</button><button className="btn" onClick={() => void edit('credentials')}>Credentials</button>{canChangeOwner && <button className="btn" onClick={() => void edit('owner')}>Owner scope</button>}<button className="btn" onClick={() => void toggle()}>{row.is_public ? 'Make private…' : 'Make public…'}</button></>}</div><FlatRow label="Backend"><Badge tone="info">{row.backend_type}</Badge></FlatRow><FlatRow label="Use">{row.use || '—'}</FlatRow><FlatRow label="URL"><code>{row.backend_url}</code></FlatRow><FlatRow label="Owner">{storageRelationId(row.group) != null ? `Group #${storageRelationId(row.group)}` : storageRelationId(row.user) != null ? `User #${storageRelationId(row.user)}` : 'System'}</FlatRow><FlatRow label="Default">{row.is_default ? 'Yes' : 'No'}</FlatRow><FlatRow label="Region">{row.aws_region || '—'}</FlatRow><FlatRow label="Access key">{row.aws_key_masked || 'Not configured'}</FlatRow><FlatRow label="Secret key">{row.aws_secret_masked || 'Not configured'}</FlatRow><FlatRow label="Created">{fmt.datetime(row.created)}</FlatRow></div> },
+    const setActive = async (next: boolean) => {
+        if (!canManage || pending) return; setPending(true);
+        try { await saveFileManagerAtomic({ queryClient, id, changes: { is_active: next } }); await query.refetch(); }
+        catch (error) { toast.error(error instanceof Error ? error.message : 'State change failed'); }
+        finally { setPending(false); }
+    };
+    return <DetailView active={canManage ? { value: row.is_active, disabled: pending, onChange: next => void setActive(next) } : undefined}
+        contextMenu={canManage ? [
+            { label: 'Edit backend', onSelect: () => void edit('general') },
+            { label: 'Credentials…', onSelect: () => void edit('credentials') },
+            ...(canChangeOwner ? [{ label: 'Owner scope…', onSelect: () => void edit('owner') }] : []),
+            { label: row.is_active ? 'Deactivate' : 'Reactivate', disabled: pending, onSelect: () => void setActive(!row.is_active) },
+            { label: row.is_public ? 'Make private…' : 'Make public…', onSelect: () => void toggle() },
+            { label: 'Test connection', onSelect: () => void action('test_connection') },
+            ...(row.backend_type === 's3' ? [{ label: 'Check CORS', onSelect: () => void action('check_cors') }, { label: 'Fix CORS', onSelect: () => void action('fix_cors') }] : []),
+            { label: 'Clone…', onSelect: () => void clone() },
+        ] : []} title={row.name} subtitle={`${row.backend_type} · ${row.backend_url}`} icon="bi-hdd-stack" chips={[{ text: row.is_active ? 'Active' : 'Inactive', tone: row.is_active ? 'success' : 'muted' }, { text: row.is_public ? 'Public' : 'Private', tone: row.is_public ? 'warning' : 'success' }]} sections={[
+        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><FlatRow label="Backend"><Badge tone="info">{row.backend_type}</Badge></FlatRow><FlatRow label="Use">{row.use || '—'}</FlatRow><FlatRow label="URL"><code>{row.backend_url}</code></FlatRow><FlatRow label="Owner">{storageRelationId(row.group) != null ? `Group #${storageRelationId(row.group)}` : storageRelationId(row.user) != null ? `User #${storageRelationId(row.user)}` : 'System'}</FlatRow><FlatRow label="Default">{row.is_default ? 'Yes' : 'No'}</FlatRow><FlatRow label="Region">{row.aws_region || '—'}</FlatRow><FlatRow label="Access key">{row.aws_key_masked || 'Not configured'}</FlatRow><FlatRow label="Secret key">{row.aws_secret_masked || 'Not configured'}</FlatRow><FlatRow label="Created">{fmt.datetime(row.created)}</FlatRow></div> },
         { key: 'files', label: 'Files', icon: 'bi-files', render: () => <div className="detail-section"><h3>Recent files</h3><p className="dim">Newest 10 for this backend. This bounded child inventory does not own URL table state.</p><NestedFiles managerId={id} /></div> },
-        { key: 'operations', label: 'Operations', icon: 'bi-tools', permissions: STORAGE_MANAGE_PERMS, render: () => <div className="detail-section"><h3>Provider operations</h3><div className="storage-action-row"><button className="btn" onClick={() => void action('test_connection')}>Test connection</button>{row.backend_type === 's3' && <><button className="btn" onClick={() => void action('check_cors')}>Check CORS</button><button className="btn" onClick={() => void action('fix_cors')}>Fix CORS</button></>}<button className="btn" onClick={() => void clone()}>Clone…</button></div><p className="dim">Backend deletion and public-access audit shortcuts are deliberately unavailable.</p></div> },
+
     ]} initialSection="overview" onClose={onClose} />;
 }

package/src/admin/storage/FileView.tsx

@@ -1,10 +1,10 @@
-import { useEffect, useRef, useState } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
-import { ArmedButton, Badge, DataView, DetailView, FlatRow, SchemaForm, fmt, modal, toast } from '../../ui';
+import { useEffect, useRef, useState } from 'react';
 import { useCan } from '../../client/runtime';
+import { Badge, DataView, DetailView, FlatRow, SchemaForm, fmt, modal, toast } from '../../ui';
 import { FilePreview, filePreviewCategory } from './FilePreview';
-import { normalizeRenditions, normalizeRenditionRoles, pollRenditionConvergence, renditionTargetSignature, type RenditionPollStop } from './file-renditions';
-import { FileModel, ShortLinkShareModel, STORAGE_MANAGE_PERMS, createFileShare, deleteFileShare, isSafeCapabilityUrl, openCapabilityUrl, setFileShareActive, saveFileAndReconcileGroup, type FileRenditionRow } from './models';
+import { normalizeRenditionRoles, normalizeRenditions, pollRenditionConvergence, renditionTargetSignature, type RenditionPollStop } from './file-renditions';
+import { FileModel, STORAGE_MANAGE_PERMS, ShortLinkShareModel, createFileShare, isSafeCapabilityUrl, openCapabilityUrl, saveFileAndReconcileGroup, setFileShareActive, type FileRenditionRow } from './models';
 
 function ShareResult({ url, close }: { url: string; close: () => void }) {
     return <div className="modal-pad"><h2 className="modal-title">Share link created</h2><p className="modal-message">This newly minted capability is shown once from component-local state.</p><code className="storage-capability">{url}</code><div className="modal-actions"><button className="btn" onClick={() => void navigator.clipboard.writeText(url)}>Copy</button><button className="btn btn-primary" onClick={close}>Done</button></div></div>;
@@ -19,8 +19,12 @@ export function FileView({ id, onClose }: { id: number; onClose: () => void }) {
     const queryClient = useQueryClient();
     const query = FileModel.useOne(id);
     const canManage = useCan(STORAGE_MANAGE_PERMS).can;
+    const [pendingShares, setPendingShares] = useState<Set<number>>(() => new Set());
+    const shareLocks = useRef(new Set<number>());
+    const permission = useRef(canManage); permission.current = canManage;
+    useEffect(() => { permission.current = canManage; return () => { permission.current = false; }; }, [canManage]);
     const regenerate = FileModel.useAction('regenerate_renditions');
-    const remove = FileModel.useDelete();
+
     const shares = ShortLinkShareModel.useList({ file: id, start: 0, size: 25 }, { enabled: canManage });
     const alive = useRef(true);
     const initialPollStarted = useRef(false);
@@ -65,12 +69,12 @@ export function FileView({ id, onClose }: { id: number; onClose: () => void }) {
     const updatePublic = async () => {
         const next = !file.is_public;
         const ok = await modal.confirm({ title: next ? 'Make file public?' : 'Make file private?', message: <>Change access for <b>{file.filename}</b>?</>, confirmText: next ? 'Make public' : 'Make private', danger: next });
-        if (!ok) return;
+        if (!ok || !permission.current) return;
         try { await saveFileAndReconcileGroup(queryClient, id, { is_public: next }); await query.refetch(); } catch (error) { toast.error(error instanceof Error ? error.message : 'Access change failed'); }
     };
     const createShare = async () => {
         const values = await modal.open<Record<string, unknown>>((close) => <div className="modal-pad"><h2 className="modal-title">Create share link</h2><SchemaForm fields={[{ name: 'expire_days', type: 'text', label: 'Expire after days', help: '0 means no expiry.' }, { name: 'track_clicks', type: 'switch', label: 'Track clicks' }, { name: 'note', type: 'textarea', label: 'Audit note' }]} initial={{ expire_days: '30', track_clicks: false, note: '' }} submitText="Create share" onCancel={() => close(null as never)} onSubmit={(data) => close(data as unknown as Record<string, unknown>)} /></div>);
-        if (!values) return;
+        if (!values || !permission.current) return;
         try {
             const result = await createFileShare(id, { expire_days: Number(values.expire_days ?? 30), track_clicks: Boolean(values.track_clicks), note: String(values.note ?? '') });
             await modal.open((close) => <ShareResult url={result.url} close={() => close(null)} />, { size: 'sm' });
@@ -84,7 +88,7 @@ export function FileView({ id, onClose }: { id: number; onClose: () => void }) {
         const normalized = normalizeRenditionRoles(roles);
         try {
             const ok = await modal.confirm({ title: normalized.length ? `Regenerate ${normalized.join(', ')}?` : 'Regenerate all renditions?', message: 'The renderer is asynchronous. This viewer polls finite observable state for up to 12 attempts.', confirmText: 'Queue regeneration' });
-            if (!ok) return;
+            if (!ok || !permission.current) return;
             const currentRoles = normalizeRenditions(file.renditions).map((row) => row.role);
             const targetRoles = normalized.length > 0 ? normalized : currentRoles.length > 0 ? currentRoles : ['thumbnail', 'preview'];
             const before = renditionTargetSignature(file, targetRoles);
@@ -93,17 +97,25 @@ export function FileView({ id, onClose }: { id: number; onClose: () => void }) {
         } catch (error) { toast.error(error instanceof Error ? error.message : 'Could not queue renditions'); }
         finally { regenerationBusyRef.current = false; setRegenerationBusy(false); }
     };
-    const deleteOne = async () => {
-        await modal.open((close) => <div className="modal-pad"><h2 className="modal-title">Delete {file.filename}</h2><p className="modal-message">Enter the exact filename. This deletes the record, original backend object, and renditions.</p><SchemaForm fields={[{ name: 'filename', type: 'text', label: 'Exact filename', required: true }]} submitText="Delete file" onCancel={() => close(null)} onSubmit={async (data) => { if (String(data.filename ?? '') !== file.filename) throw new Error('Filename does not match. No request was sent.'); await remove.mutateAsync({ id }); close(true); onClose(); }} /></div>, { size: 'sm' });
-    };
 
-    return <DetailView title={file.filename} subtitle={`${file.content_type} · ${file.file_size == null ? 'unknown size' : fmt.filesize(file.file_size)}`} icon="bi-file-earmark" chips={[{ text: file.upload_status, tone: file.upload_status === 'completed' ? 'success' : file.upload_status === 'failed' ? 'danger' : 'warning' }, { text: file.is_public ? 'Public' : 'Private', tone: file.is_public ? 'warning' : 'muted' }]} sections={[
-        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><div className="storage-action-row">{isSafeCapabilityUrl(file.url) && <><button className="btn" onClick={() => openCapabilityUrl(file.url!)}><i className="bi bi-box-arrow-up-right" /> Open</button><button className="btn" onClick={() => openCapabilityUrl(file.url!, true)}><i className="bi bi-download" /> Download</button><button className="btn" onClick={() => void navigator.clipboard.writeText(file.url!)}><i className="bi bi-copy" /> Copy URL</button></>}{canManage && <button className="btn" onClick={() => void updatePublic()}>{file.is_public ? 'Make private…' : 'Make public…'}</button>}</div>{!isSafeCapabilityUrl(file.url) && <p className="storage-unsafe">The backend URL is absent or unsafe; Open, Download, and Copy are refused.</p>}<FlatRow label="Filename">{file.filename}</FlatRow><FlatRow label="Category">{file.category || 'Unknown'}</FlatRow><FlatRow label="Upload status"><Badge tone={file.upload_status === 'completed' ? 'success' : 'warning'}>{file.upload_status}</Badge></FlatRow><FlatRow label="Public">{file.is_public ? 'Yes' : 'No'}</FlatRow><FlatRow label="Active">{file.is_active ? 'Yes' : 'No'}</FlatRow></div> },
+
+    const toggleShare = async (shareId: number, next: boolean) => {
+        if (!permission.current || shareLocks.current.has(shareId)) return;
+        shareLocks.current.add(shareId); setPendingShares(new Set(shareLocks.current));
+        try { await setFileShareActive(shareId, next); }
+        catch (error) { toast.error(error instanceof Error ? error.message : 'Share state change failed'); }
+        finally { await shares.refetch(); shareLocks.current.delete(shareId); setPendingShares(new Set(shareLocks.current)); }
+    };
+    return <DetailView contextMenu={[
+        ...(isSafeCapabilityUrl(file.url) ? [{ label: 'Open file', onSelect: () => { openCapabilityUrl(file.url!); } }, { label: 'Download file', onSelect: () => { openCapabilityUrl(file.url!, true); } }, { label: 'Copy URL', onSelect: () => void navigator.clipboard.writeText(file.url!).catch(() => toast.error('Copy failed')) }] : []),
+        ...(canManage ? [{ label: file.is_public ? 'Make private…' : 'Make public…', onSelect: () => void updatePublic() }, { label: 'Create share…', onSelect: () => void createShare() }, { label: 'Regenerate all renditions…', disabled: regenerationBusy || pollState === 'polling', onSelect: () => void runRegenerate() }] : []),
+    ]} title={file.filename} subtitle={`${file.content_type} · ${file.file_size == null ? 'unknown size' : fmt.filesize(file.file_size)}`} icon="bi-file-earmark" chips={[{ text: file.upload_status, tone: file.upload_status === 'completed' ? 'success' : file.upload_status === 'failed' ? 'danger' : 'warning' }, { text: file.is_public ? 'Public' : 'Private', tone: file.is_public ? 'warning' : 'muted' }]} sections={[
+        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section">{!isSafeCapabilityUrl(file.url) && <p className="storage-unsafe">The backend URL is absent or unsafe; Open, Download, and Copy are refused.</p>}<FlatRow label="Filename">{file.filename}</FlatRow><FlatRow label="Category">{file.category || 'Unknown'}</FlatRow><FlatRow label="Upload status"><Badge tone={file.upload_status === 'completed' ? 'success' : 'warning'}>{file.upload_status}</Badge></FlatRow><FlatRow label="Public">{file.is_public ? 'Yes' : 'No'}</FlatRow><FlatRow label="Active">{file.is_active ? 'Yes' : 'No'}</FlatRow></div> },
         { key: 'preview', label: 'Preview', icon: 'bi-eye', render: () => <div className="detail-section"><FilePreview file={file} /></div> },
         { key: 'details', label: 'Details', icon: 'bi-card-list', render: () => <div className="detail-section"><FlatRow label="ID">{file.id}</FlatRow><FlatRow label="Content type">{file.content_type}</FlatRow><FlatRow label="Size">{file.file_size == null ? 'Unknown' : fmt.filesize(file.file_size)}</FlatRow><FlatRow label="Group">{typeof file.group === 'object' && file.group ? file.group.name || `#${file.group.id}` : file.group == null ? 'System' : `#${file.group}`}</FlatRow><FlatRow label="Backend">{typeof file.file_manager === 'object' && file.file_manager ? file.file_manager.name || `#${file.file_manager.id}` : `#${file.file_manager ?? '—'}`}</FlatRow><FlatRow label="Created">{fmt.datetime(file.created)}</FlatRow><FlatRow label="Modified">{fmt.datetime(file.modified)}</FlatRow></div> },
-        { key: 'renditions', label: 'Renditions', icon: 'bi-images', render: () => { const pollingDisabled = regenerationBusy || pollState === 'polling'; return <div className="detail-section"><div className="storage-section-head"><div><h3>Renditions</h3><p className="dim">Derived from the role-keyed File graph; no duplicate rendition store.</p></div>{canManage && <button className="btn" disabled={pollingDisabled} onClick={() => void runRegenerate()}>Regenerate all…</button>}</div><RenditionRows rows={renditionRows} canManage={canManage} pollingDisabled={pollingDisabled} onRegenerate={(roles) => void runRegenerate(roles)} />{pollState === 'polling' && <p className="dim"><i className="bi bi-arrow-repeat spin" /> Waiting for observable rendition change…</p>}{pollState === 'timeout' && <div className="form-alert">No convergence after 12 attempts. The job may still be running. <button className="btn btn-compact" onClick={() => void query.refetch()}>Refresh now</button></div>}{pollState && ['failed', 'expired'].includes(pollState) && <div className="form-alert">Polling stopped because upload state is {pollState}.</div>}</div>; } },
-        { key: 'shares', label: 'Shares', icon: 'bi-share', render: () => <div className="detail-section"><div className="storage-section-head"><div><h3>Visible shares</h3><p className="dim">Owner-visible rows only unless the caller separately holds global shortlink authority.</p></div>{canManage && <button className="btn btn-primary" onClick={() => void createShare()}>Create share…</button>}</div>{!canManage ? <p className="dim">Share controls are unavailable for this viewer.</p> : shares.isError ? <div className="form-alert">Visible shares unavailable. File inspection remains available.</div> : (shares.data?.rows ?? []).length === 0 ? <p className="dim">No visible shares.</p> : <div className="storage-shares">{shares.data!.rows.map((share) => <div key={share.id}><span><code>{share.code}</code><small>{share.is_active ? 'Active' : 'Inactive'} · {share.expires_at ? fmt.datetime(share.expires_at) : 'No expiry'} · {share.hit_count} hits · {share.track_clicks ? 'tracking' : 'not tracking'}{share.note ? ` · ${share.note}` : ''}</small></span><div className="storage-action-row"><button className="btn btn-compact" onClick={async () => { await setFileShareActive(share.id, !share.is_active); await shares.refetch(); }}>{share.is_active ? 'Deactivate' : 'Activate'}</button><button className="btn btn-compact" onClick={async () => { if (!await modal.confirm({ title: `Delete ${share.code}?`, message: 'This permanently deletes the share and its click history.', confirmText: 'Delete', danger: true })) return; await deleteFileShare(share.id); await shares.refetch(); }}>Delete</button></div></div>)}</div>}</div> },
+        { key: 'renditions', label: 'Renditions', icon: 'bi-images', render: () => { const pollingDisabled = regenerationBusy || pollState === 'polling'; return <div className="detail-section"><div className="storage-section-head"><div><h3>Renditions</h3><p className="dim">Derived from the role-keyed File graph; no duplicate rendition store.</p></div></div><RenditionRows rows={renditionRows} canManage={canManage} pollingDisabled={pollingDisabled} onRegenerate={(roles) => void runRegenerate(roles)} />{pollState === 'polling' && <p className="dim"><i className="bi bi-arrow-repeat spin" /> Waiting for observable rendition change…</p>}{pollState === 'timeout' && <div className="form-alert">No convergence after 12 attempts. The job may still be running. <button className="btn btn-compact" onClick={() => void query.refetch()}>Refresh now</button></div>}{pollState && ['failed', 'expired'].includes(pollState) && <div className="form-alert">Polling stopped because upload state is {pollState}.</div>}</div>; } },
+        { key: 'shares', label: 'Shares', icon: 'bi-share', render: () => <div className="detail-section"><div className="storage-section-head"><div><h3>Visible shares</h3><p className="dim">Owner-visible rows only unless the caller separately holds global shortlink authority.</p></div>{canManage && <button className="btn btn-primary" onClick={() => void createShare()}>Create share…</button>}</div>{!canManage ? <p className="dim">Share controls are unavailable for this viewer.</p> : shares.isError ? <div className="form-alert">Visible shares unavailable. File inspection remains available.</div> : (shares.data?.rows ?? []).length === 0 ? <p className="dim">No visible shares.</p> : <div className="storage-shares">{shares.data!.rows.map((share) => <div key={share.id}><span><code>{share.code}</code><small>{share.is_active ? 'Active' : 'Inactive'} · {share.expires_at ? fmt.datetime(share.expires_at) : 'No expiry'} · {share.hit_count} hits · {share.track_clicks ? 'tracking' : 'not tracking'}{share.note ? ` · ${share.note}` : ''}</small></span><div className="storage-action-row"><button className="btn btn-compact" disabled={pendingShares.has(share.id)} onClick={() => void toggleShare(share.id, !share.is_active)}>{share.is_active ? 'Deactivate' : 'Activate'}</button></div></div>)}</div>}</div> },
         { key: 'metadata', label: 'Metadata', icon: 'bi-braces', render: () => <div className="detail-section"><DataView data={file.metadata ?? {}} columns={2} /></div> },
-        ...(canManage ? [{ key: 'danger', label: 'Danger zone', icon: 'bi-exclamation-octagon', permissions: STORAGE_MANAGE_PERMS, render: () => <div className="detail-section storage-danger"><h3>Delete file</h3><p>This removes the backend object and derived renditions. It cannot be undone.</p><ArmedButton className="btn-danger" icon="bi-trash" label="Delete file" armedLabel="Click again — open exact-filename confirmation" onConfirm={deleteOne} /></div> }] : []),
+
     ]} initialSection="overview" onClose={onClose} />;
 }

package/src/admin/storage/FilesPage.tsx

@@ -1,9 +1,9 @@
-import { useState } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
-import { Badge, CollectionSelect, ModelTable, fmt, modal, type BatchAction, type Column, type FilterDef } from '../../ui';
+import { useState } from 'react';
 import { useCan } from '../../client/runtime';
-import { FileView } from './FileView';
+import { Badge, CollectionSelect, ModelTable, fmt, modal, type BatchAction, type Column, type FilterDef } from '../../ui';
 import { FileUploadSurface } from './FileUploadSurface';
+import { FileView } from './FileView';
 import { FileModel, GROUP_DIRECTORY_PERMS, STORAGE_MANAGE_PERMS, exportFiles, openCapabilityUrl, saveFileAndReconcileGroup, type FileRow, type RelationRow } from './models';
 
 const COLUMNS: Column<FileRow>[] = [
@@ -36,14 +36,13 @@ export function FilesPage() {
     const queryClient = useQueryClient();
     const canManage = useCan(STORAGE_MANAGE_PERMS).can;
     const canChooseGroup = useCan(GROUP_DIRECTORY_PERMS).can;
-    const remove = FileModel.useDelete();
+
     const saveAccess = (row: FileRow, value: boolean) => saveFileAndReconcileGroup(queryClient, row.id, { is_public: value });
     const batches: BatchAction<FileRow>[] = [
         { key: 'public', label: 'Make public', eligible: (row) => !row.is_public, confirm: 'Make the selected files public?', run: (row) => saveAccess(row, true) },
         { key: 'private', label: 'Make private', eligible: (row) => row.is_public, run: (row) => saveAccess(row, false) },
         ...(canChooseGroup ? [{ key: 'move', label: 'Move to group', confirm: false as const, prepare: (rows: FileRow[]) => modal.open<number>((close) => <MoveGroupDialog rows={rows} close={(value) => close(value as number)} />), run: (row: FileRow, prepared: unknown) => saveFileAndReconcileGroup(queryClient, row.id, { group: Number(prepared) }, Number(prepared)) }] : []),
         { key: 'download', label: 'Download selected', confirm: false, run: async (row) => { if (!openCapabilityUrl(row.url ?? '', true)) throw new Error(`${row.filename} has no safe download URL`); } },
-        { key: 'delete', label: 'Delete', danger: true, confirm: 'Delete the selected files and their backend objects? This cannot be undone.', run: (row) => remove.mutateAsync({ id: row.id }) },
     ];
     const table = (openUpload?: () => void) => <ModelTable model={FileModel} eyebrow="Infrastructure · Storage" title="Files" columns={COLUMNS} filters={FILTERS} presets={[{ key: 'all', label: 'All', params: {} }, { key: 'ready', label: 'Ready', params: { upload_status: 'completed' } }, { key: 'failed', label: 'Failed', params: { upload_status: 'failed' } }, { key: 'public', label: 'Public', params: { is_public: 'true' } }]} defaultSort="-created" searchable searchPlaceholder="Search filename or content type" selectable={canManage} batchActions={canManage ? batches : []} columnChooser persistState persistKey="admin:storage:files" exportFormats={['csv', 'json']} exporter={exportFiles} onAdd={openUpload} addLabel="Add File" onRowClick={(row) => showFileView(row.id)} />;
     // Do not mount picker/drop/manager queries for view-only operators.