fix(audit): permission UI gates + preflight leak (R2-H6/H7/H8/H9 + R2-M9)

R2-H6: webhook-delivery-log Replay column was rendered for any user who could load the page; the route gates on admin.manage_webhooks. Now the entire Replay column is hidden when the user lacks the perm. R2-H7: Bulk Archive action was visible to sales_agent + viewer (clients.delete:false). Now wrapped in canBulkArchive (clients.delete). R2-H8: Bulk Add tag / Remove tag were visible to viewer (clients.edit: false). Now wrapped in canBulkTag (clients.edit). R2-H9: bulk-hard-delete silently dropped clients that became unarchived between preflight and execute. The service now returns {deletedCount, skipped[]} and the dialog stays open on partial success showing the per-row reason table — operators can see exactly which IDs were skipped and why. R2-M9: bulk-archive-preflight catch block was leaking dossier-loader error messages, letting an attacker enumerate "not found" vs "exists in another port". Replaced with a generic 'Could not load dossier — client may have been removed' blocker. 1175/1175 vitest passing. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-06 22:15:01 +02:00
parent 94331bd6ec
commit a8c6c071e6
5 changed files with 170 additions and 67 deletions
--- a/src/components/admin/webhooks/webhook-delivery-log.tsx
+++ b/src/components/admin/webhooks/webhook-delivery-log.tsx
@@ -14,6 +14,7 @@ import {
  TableRow,
 } from '@/components/ui/table';
 import { apiFetch } from '@/lib/api/client';
+import { usePermissions } from '@/hooks/use-permissions';

 interface Delivery {
  id: string;
@@ -42,6 +43,8 @@ export function WebhookDeliveryLog({ webhookId }: Props) {
  const [page, setPage] = useState(1);
  const [loading, setLoading] = useState(true);
  const [retrying, setRetrying] = useState<string | null>(null);
+  const { can } = usePermissions();
+  const canReplay = can('admin', 'manage_webhooks');

  async function retry(deliveryId: string) {
    setRetrying(deliveryId);
@@ -98,7 +101,7 @@ export function WebhookDeliveryLog({ webhookId }: Props) {
            <TableHead>HTTP</TableHead>
            <TableHead>Attempt</TableHead>
            <TableHead>Time</TableHead>
-            <TableHead className="w-16 text-right">Replay</TableHead>
+            {canReplay && <TableHead className="w-16 text-right">Replay</TableHead>}
          </TableRow>
        </TableHeader>
        <TableBody>
@@ -115,22 +118,24 @@ export function WebhookDeliveryLog({ webhookId }: Props) {
                  ? new Date(d.deliveredAt).toLocaleString()
                  : new Date(d.createdAt).toLocaleString()}
              </TableCell>
-              <TableCell className="text-right">
-                {(d.status === 'failed' || d.status === 'dead_letter') && (
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    disabled={retrying === d.id}
-                    onClick={() => retry(d.id)}
-                    title="Replay this delivery"
-                    aria-label="Replay this delivery"
-                  >
-                    <RotateCcw
-                      className={`h-3.5 w-3.5 ${retrying === d.id ? 'animate-spin' : ''}`}
-                    />
-                  </Button>
-                )}
-              </TableCell>
+              {canReplay && (
+                <TableCell className="text-right">
+                  {(d.status === 'failed' || d.status === 'dead_letter') && (
+                    <Button
+                      variant="ghost"
+                      size="sm"
+                      disabled={retrying === d.id}
+                      onClick={() => retry(d.id)}
+                      title="Replay this delivery"
+                      aria-label="Replay this delivery"
+                    >
+                      <RotateCcw
+                        className={`h-3.5 w-3.5 ${retrying === d.id ? 'animate-spin' : ''}`}
+                      />
+                    </Button>
+                  )}
+                </TableCell>
+              )}
            </TableRow>
          ))}
        </TableBody>
--- a/src/components/clients/bulk-hard-delete-dialog.tsx
+++ b/src/components/clients/bulk-hard-delete-dialog.tsx
@@ -25,7 +25,12 @@ interface Props {
  onDeleted?: (deletedCount: number) => void;
 }

-type Stage = 'intent' | 'confirm';
+type Stage = 'intent' | 'confirm' | 'partial';
+
+interface SkippedRow {
+  clientId: string;
+  reason: string;
+}

 export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted }: Props) {
  const qc = useQueryClient();
@@ -33,6 +38,8 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
  const [code, setCode] = useState('');
  const [typedPhrase, setTypedPhrase] = useState('');
  const [maskedEmail, setMaskedEmail] = useState<string | null>(null);
+  const [skipped, setSkipped] = useState<SkippedRow[]>([]);
+  const [partialDeleted, setPartialDeleted] = useState(0);

  const expectedPhrase = `DELETE ${clientIds.length} CLIENT${clientIds.length === 1 ? '' : 'S'}`;

@@ -42,6 +49,8 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
      setCode('');
      setTypedPhrase('');
      setMaskedEmail(null);
+      setSkipped([]);
+      setPartialDeleted(0);
    }
  }, [open]);

@@ -63,21 +72,29 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted

  const bulkDelete = useMutation({
    mutationFn: () =>
-      apiFetch<{ data: { deletedCount: number } }>('/api/v1/clients/bulk-hard-delete', {
+      apiFetch<{
+        data: { deletedCount: number; skipped: SkippedRow[] };
+      }>('/api/v1/clients/bulk-hard-delete', {
        method: 'POST',
        body: { ids: clientIds, code, typedPhrase },
      }),
    onSuccess: (res) => {
      const n = res.data.deletedCount;
-      const failed = clientIds.length - n;
-      if (failed === 0) {
-        toast.success(`${n} client${n === 1 ? '' : 's'} permanently deleted.`);
-      } else {
-        toast.warning(`${n} of ${clientIds.length} deleted. ${failed} failed (see audit log).`);
-      }
+      const skippedRows = res.data.skipped ?? [];
      qc.invalidateQueries({ queryKey: ['clients'] });
-      onOpenChange(false);
-      onDeleted?.(n);
+      if (skippedRows.length === 0) {
+        toast.success(`${n} client${n === 1 ? '' : 's'} permanently deleted.`);
+        onOpenChange(false);
+        onDeleted?.(n);
+      } else {
+        // Stay open so the operator can see exactly which IDs were
+        // skipped and why (e.g. unarchived between preflight + execute,
+        // already deleted by another operator).
+        setSkipped(skippedRows);
+        setPartialDeleted(n);
+        setStage('partial');
+        toast.warning(`${n} of ${clientIds.length} deleted. ${skippedRows.length} skipped.`);
+      }
    },
    onError: (err: unknown) => {
      toast.error(err instanceof Error ? err.message : 'Bulk delete failed');
@@ -100,7 +117,7 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
          </DialogDescription>
        </DialogHeader>

-        {stage === 'intent' ? (
+        {stage === 'intent' && (
          <div className="space-y-3 text-sm text-muted-foreground">
            <p>
              We&rsquo;ll email a 4-digit confirmation code to your account address. The code is
@@ -112,7 +129,9 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
              files and reminders are detached but kept.
            </div>
          </div>
-        ) : (
+        )}
+
+        {stage === 'confirm' && (
          <div className="space-y-3">
            <div className="flex items-start gap-2 rounded-md border border-blue-300 bg-blue-50 p-3 text-xs text-blue-900">
              <Mail className="h-4 w-4 shrink-0 mt-0.5" />
@@ -150,11 +169,42 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
          </div>
        )}

+        {stage === 'partial' && (
+          <div className="space-y-3 text-sm">
+            <div className="rounded-md border border-amber-300 bg-amber-50 p-3 text-amber-900">
+              {partialDeleted} of {clientIds.length} permanently deleted. {skipped.length} skipped —
+              see below.
+            </div>
+            <div className="rounded-md border max-h-60 overflow-y-auto">
+              <table className="w-full text-xs">
+                <thead className="bg-muted/50 sticky top-0">
+                  <tr>
+                    <th className="text-left px-2 py-1.5 font-medium">Client ID</th>
+                    <th className="text-left px-2 py-1.5 font-medium">Reason</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {skipped.map((row) => (
+                    <tr key={row.clientId} className="border-t">
+                      <td className="px-2 py-1.5 font-mono text-[11px]">
+                        {row.clientId.slice(0, 8)}…
+                      </td>
+                      <td className="px-2 py-1.5">{row.reason}</td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          </div>
+        )}
+
        <DialogFooter>
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
-            Cancel
-          </Button>
-          {stage === 'intent' ? (
+          {stage !== 'partial' && (
+            <Button variant="outline" onClick={() => onOpenChange(false)}>
+              Cancel
+            </Button>
+          )}
+          {stage === 'intent' && (
            <Button
              variant="destructive"
              onClick={() => requestCode.mutate()}
@@ -168,7 +218,8 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
                'Send confirmation code'
              )}
            </Button>
-          ) : (
+          )}
+          {stage === 'confirm' && (
            <Button
              variant="destructive"
              onClick={() => bulkDelete.mutate()}
@@ -183,6 +234,16 @@ export function BulkHardDeleteDialog({ open, onOpenChange, clientIds, onDeleted
              )}
            </Button>
          )}
+          {stage === 'partial' && (
+            <Button
+              onClick={() => {
+                onOpenChange(false);
+                onDeleted?.(partialDeleted);
+              }}
+            >
+              Done
+            </Button>
+          )}
        </DialogFooter>
      </DialogContent>
    </Dialog>
--- a/src/components/clients/client-list.tsx
+++ b/src/components/clients/client-list.tsx
@@ -51,6 +51,8 @@ export function ClientList() {

  const { can } = usePermissions();
  const canHardDelete = can('admin', 'permanently_delete_clients');
+  const canBulkArchive = can('clients', 'delete');
+  const canBulkTag = can('clients', 'edit');

  const {
    data,
@@ -161,33 +163,41 @@ export function ClientList() {
          isLoading={isFetching && !isLoading}
          getRowId={(row) => row.id}
          bulkActions={[
-            {
-              label: 'Add tag',
-              icon: TagIcon,
-              onClick: (ids) => {
-                if (ids.length === 0) return;
-                setTagChoice([]);
-                setTagDialog({ ids, mode: 'add' });
-              },
-            },
-            {
-              label: 'Remove tag',
-              icon: TagsIcon,
-              onClick: (ids) => {
-                if (ids.length === 0) return;
-                setTagChoice([]);
-                setTagDialog({ ids, mode: 'remove' });
-              },
-            },
-            {
-              label: 'Archive',
-              icon: Archive,
-              variant: 'destructive',
-              onClick: (ids) => {
-                if (ids.length === 0) return;
-                setBulkArchiveIds(ids);
-              },
-            },
+            ...(canBulkTag
+              ? [
+                  {
+                    label: 'Add tag',
+                    icon: TagIcon,
+                    onClick: (ids: string[]) => {
+                      if (ids.length === 0) return;
+                      setTagChoice([]);
+                      setTagDialog({ ids, mode: 'add' });
+                    },
+                  },
+                  {
+                    label: 'Remove tag',
+                    icon: TagsIcon,
+                    onClick: (ids: string[]) => {
+                      if (ids.length === 0) return;
+                      setTagChoice([]);
+                      setTagDialog({ ids, mode: 'remove' });
+                    },
+                  },
+                ]
+              : []),
+            ...(canBulkArchive
+              ? [
+                  {
+                    label: 'Archive',
+                    icon: Archive,
+                    variant: 'destructive' as const,
+                    onClick: (ids: string[]) => {
+                      if (ids.length === 0) return;
+                      setBulkArchiveIds(ids);
+                    },
+                  },
+                ]
+              : []),
            ...(canHardDelete
              ? [
                  {