@burdenoff/microfe-vibecontrols 2026.528.1 → 2026.528.3

package/README.md

@@ -5,6 +5,7 @@ VibeControls microfrontend for Burdenoff products - a modern development environ
 ## Overview
 
 This microfrontend provides:
+
 - **Agents Management**: Control and monitor development agents
 - **Sessions**: Terminal and SSH session management
 - **Vibes**: Project workflow management

package/dist/components/audit/AuditLogDetail.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuditLogDetail.js","names":[],"sources":["../../../src/components/audit/AuditLogDetail.tsx"],"sourcesContent":["import { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useEffect, useState } from 'react';\nimport { X, ChevronDown, ChevronRight, Copy, Check, Terminal } from 'lucide-react';\nimport type { VibeAuditLogDetailFragment } from '@/generated/wspace-operations';\nimport { StatusBadge } from '@/components/shared';\n\ninterface AuditLogDetailProps {\n  log: VibeAuditLogDetailFragment;\n  onClose: () => void;\n}\n\nfunction JsonViewer({ data, label }: { data: unknown; label: string }) {\n  const [expanded, setExpanded] = useState(false);\n  if (!data) return null;\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <button\n        type=\"button\"\n        onClick={() => setExpanded(!expanded)}\n        className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium bg-bg-secondary/50 hover:bg-bg-secondary\"\n      >\n        {expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}\n        {label}\n      </button>\n      {expanded && (\n        <pre className=\"px-3 py-2 text-xs overflow-auto max-h-64 bg-bg-sunken\">\n          {JSON.stringify(data, null, 2)}\n        </pre>\n      )}\n    </div>\n  );\n}\n\nfunction CommandBlock({\n  command,\n  output,\n  exitCode,\n}: {\n  command?: string | null;\n  output?: string | null;\n  exitCode?: number | null;\n}) {\n  const [copied, setCopied] = useState(false);\n  if (!command && !output) return null;\n\n  const handleCopy = () => {\n    if (command) {\n      navigator.clipboard.writeText(command);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n    }\n  };\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <div className=\"flex items-center justify-between px-3 py-2 bg-bg-secondary/50\">\n        <span className=\"flex items-center gap-2 text-sm font-medium\">\n          <Terminal size={14} />\n          Command Execution\n          {exitCode !== null && exitCode !== undefined && (\n            <span\n              className={`px-1.5 py-0.5 rounded text-xs ${exitCode === 0 ? 'bg-status-success-bg text-status-success-text' : 'bg-status-error-bg text-status-error-text'}`}\n            >\n              exit {exitCode}\n            </span>\n          )}\n        </span>\n        {command && (\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            className=\"p-1 rounded hover:bg-bg-secondary text-text-secondary\"\n            title=\"Copy command\"\n          >\n            {copied ? <Check size={14} /> : <Copy size={14} />}\n          </button>\n        )}\n      </div>\n      {command && (\n        <div className=\"px-3 py-2 bg-bg-sunken text-text-secondary font-mono text-xs\">\n          <span className=\"text-status-success-text\">$</span> {command}\n        </div>\n      )}\n      {output && (\n        <pre className=\"px-3 py-2 text-xs bg-bg-sunken text-text-tertiary font-mono overflow-auto max-h-48\">\n          {output}\n        </pre>\n      )}\n    </div>\n  );\n}\n\nfunction ChangesetViewer({ changeset }: { changeset: Record<string, unknown> | null | undefined }) {\n  const [expanded, setExpanded] = useState(false);\n  if (!changeset || typeof changeset !== 'object') return null;\n\n  const changes = Object.entries(changeset as Record<string, { from: unknown; to: unknown }>);\n  if (changes.length === 0) return null;\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <button\n        type=\"button\"\n        onClick={() => setExpanded(!expanded)}\n        className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium bg-bg-secondary/50 hover:bg-bg-secondary\"\n      >\n        {expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}\n        Changes ({changes.length} field{changes.length !== 1 ? 's' : ''})\n      </button>\n      {expanded && (\n        <div className=\"px-3 py-2 space-y-2\">\n          {changes.map(([field, change]) => (\n            <div key={field} className=\"text-xs\">\n              <span className=\"font-medium text-text-primary\">{field}</span>\n              <div className=\"ml-4 mt-1 space-y-0.5\">\n                <div className=\"flex items-center gap-2\">\n                  <span className=\"text-status-error-text font-mono\">-</span>\n                  <span className=\"text-status-error-text\">\n                    {JSON.stringify((change as { from: unknown }).from)}\n                  </span>\n                </div>\n                <div className=\"flex items-center gap-2\">\n                  <span className=\"text-status-success-text font-mono\">+</span>\n                  <span className=\"text-status-success-text\">\n                    {JSON.stringify((change as { to: unknown }).to)}\n                  </span>\n                </div>\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport function AuditLogDetail({ log, onClose }: AuditLogDetailProps) {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n\n  useEffect(() => {\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyDown);\n    return () => window.removeEventListener('keydown', handleKeyDown);\n  }, [onClose]);\n\n  return (\n    <div className=\"fixed inset-0 z-[1000] flex justify-end bg-bg-overlay/40\">\n      <button\n        type=\"button\"\n        aria-label={tr('audit.closeDetailOverlay', 'Close audit log detail')}\n        className=\"absolute inset-0 cursor-default\"\n        onClick={onClose}\n      />\n      <aside className=\"relative flex h-full w-full max-w-[480px] flex-col border-l border-border-default bg-bg-surface shadow-xl\">\n        {/* Header */}\n        <div className=\"flex items-center justify-between px-4 py-3 border-b border-border-default\">\n          <div>\n            <h3 className=\"text-sm font-semibold\">\n              {log.action.replace(/_/g, ' ')}\n            </h3>\n            <p className=\"text-xs text-text-secondary\">\n              {log.resourceType.replace(/_/g, ' ')}\n              {log.resourceName ? ` · ${log.resourceName}` : ''}\n            </p>\n            <details className=\"mt-1\">\n              <summary className=\"cursor-pointer text-[10px] uppercase tracking-wider text-text-secondary hover:text-text-primary\">\n                Event ID\n              </summary>\n              <span className=\"mt-1 block break-all font-mono text-[11px] text-text-secondary\">\n                {log.id}\n              </span>\n            </details>\n          </div>\n          <button\n            type=\"button\"\n            aria-label={tr('audit.closeDetail', 'Close audit log detail')}\n            onClick={onClose}\n            className=\"flex size-10 items-center justify-center rounded hover:bg-bg-secondary\"\n          >\n            <X size={16} />\n          </button>\n        </div>\n\n        {/* Content */}\n        <div className=\"flex-1 overflow-y-auto p-4 space-y-4\">\n          {/* Summary */}\n          <div className=\"grid grid-cols-2 gap-3 text-sm\">\n            <div>\n              <span className=\"text-text-secondary text-xs\">Action</span>\n              <div className=\"font-medium\">{log.action}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Status</span>\n              <div>\n                <StatusBadge status={log.status} size=\"sm\" />\n              </div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Resource Type</span>\n              <div className=\"font-medium\">{log.resourceType.replace(/_/g, ' ')}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Resource ID</span>\n              <div className=\"font-mono text-xs truncate\">{log.resourceId || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Resource Name</span>\n              <div>{log.resourceName || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Description</span>\n              <div className=\"text-text-secondary\">{log.description || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Actor</span>\n              <div className=\"flex items-center gap-2\">\n                <span className=\"capitalize\">\n                  {(log.actorType || 'unknown').toLowerCase().replace(/_/g, ' ')}\n                </span>\n                <details className=\"text-xs text-text-secondary\">\n                  <summary className=\"cursor-pointer hover:text-text-primary\">\n                    ID\n                  </summary>\n                  <span className=\"ml-2 break-all font-mono text-[11px]\">\n                    {log.actorId}\n                  </span>\n                </details>\n              </div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Timestamp</span>\n              <div className=\"text-xs\">{new Date(log.createdAt).toLocaleString()}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">IP Address</span>\n              <div className=\"font-mono text-xs\">{log.ipAddress || '-'}</div>\n            </div>\n            {log.expiresAt && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Expires At</span>\n                <div className=\"text-xs text-status-warning-text\">\n                  {new Date(log.expiresAt).toLocaleString()}\n                </div>\n              </div>\n            )}\n            {log.errorMessage && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Error</span>\n                <div className=\"text-status-error-text text-xs\">{log.errorMessage}</div>\n              </div>\n            )}\n            {log.deleteReason && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Delete Reason</span>\n                <div className=\"text-xs\">{log.deleteReason}</div>\n              </div>\n            )}\n          </div>\n\n          {/* Command execution */}\n          <CommandBlock command={log.command} output={log.output} exitCode={log.exitCode} />\n\n          {/* Changeset */}\n          <ChangesetViewer changeset={log.changeset as Record<string, unknown> | null} />\n\n          {/* State snapshots */}\n          <JsonViewer data={log.previousState} label=\"Previous State\" />\n          <JsonViewer data={log.newState} label=\"New State\" />\n          <JsonViewer data={log.metadata} label=\"Metadata\" />\n        </div>\n      </aside>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"AuditLogDetail.js","names":[],"sources":["../../../src/components/audit/AuditLogDetail.tsx"],"sourcesContent":["import { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useEffect, useState } from 'react';\nimport { X, ChevronDown, ChevronRight, Copy, Check, Terminal } from 'lucide-react';\nimport type { VibeAuditLogDetailFragment } from '@/generated/wspace-operations';\nimport { StatusBadge } from '@/components/shared';\n\ninterface AuditLogDetailProps {\n  log: VibeAuditLogDetailFragment;\n  onClose: () => void;\n}\n\nfunction JsonViewer({ data, label }: { data: unknown; label: string }) {\n  const [expanded, setExpanded] = useState(false);\n  if (!data) return null;\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <button\n        type=\"button\"\n        onClick={() => setExpanded(!expanded)}\n        className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium bg-bg-secondary/50 hover:bg-bg-secondary\"\n      >\n        {expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}\n        {label}\n      </button>\n      {expanded && (\n        <pre className=\"px-3 py-2 text-xs overflow-auto max-h-64 bg-bg-sunken\">\n          {JSON.stringify(data, null, 2)}\n        </pre>\n      )}\n    </div>\n  );\n}\n\nfunction CommandBlock({\n  command,\n  output,\n  exitCode,\n}: {\n  command?: string | null;\n  output?: string | null;\n  exitCode?: number | null;\n}) {\n  const [copied, setCopied] = useState(false);\n  if (!command && !output) return null;\n\n  const handleCopy = () => {\n    if (command) {\n      navigator.clipboard.writeText(command);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n    }\n  };\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <div className=\"flex items-center justify-between px-3 py-2 bg-bg-secondary/50\">\n        <span className=\"flex items-center gap-2 text-sm font-medium\">\n          <Terminal size={14} />\n          Command Execution\n          {exitCode !== null && exitCode !== undefined && (\n            <span\n              className={`px-1.5 py-0.5 rounded text-xs ${exitCode === 0 ? 'bg-status-success-bg text-status-success-text' : 'bg-status-error-bg text-status-error-text'}`}\n            >\n              exit {exitCode}\n            </span>\n          )}\n        </span>\n        {command && (\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            className=\"p-1 rounded hover:bg-bg-secondary text-text-secondary\"\n            title=\"Copy command\"\n          >\n            {copied ? <Check size={14} /> : <Copy size={14} />}\n          </button>\n        )}\n      </div>\n      {command && (\n        <div className=\"px-3 py-2 bg-bg-sunken text-text-secondary font-mono text-xs\">\n          <span className=\"text-status-success-text\">$</span> {command}\n        </div>\n      )}\n      {output && (\n        <pre className=\"px-3 py-2 text-xs bg-bg-sunken text-text-tertiary font-mono overflow-auto max-h-48\">\n          {output}\n        </pre>\n      )}\n    </div>\n  );\n}\n\nfunction ChangesetViewer({ changeset }: { changeset: Record<string, unknown> | null | undefined }) {\n  const [expanded, setExpanded] = useState(false);\n  if (!changeset || typeof changeset !== 'object') return null;\n\n  const changes = Object.entries(changeset as Record<string, { from: unknown; to: unknown }>);\n  if (changes.length === 0) return null;\n\n  return (\n    <div className=\"border border-border-primary rounded-lg overflow-hidden\">\n      <button\n        type=\"button\"\n        onClick={() => setExpanded(!expanded)}\n        className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium bg-bg-secondary/50 hover:bg-bg-secondary\"\n      >\n        {expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}\n        Changes ({changes.length} field{changes.length !== 1 ? 's' : ''})\n      </button>\n      {expanded && (\n        <div className=\"px-3 py-2 space-y-2\">\n          {changes.map(([field, change]) => (\n            <div key={field} className=\"text-xs\">\n              <span className=\"font-medium text-text-primary\">{field}</span>\n              <div className=\"ml-4 mt-1 space-y-0.5\">\n                <div className=\"flex items-center gap-2\">\n                  <span className=\"text-status-error-text font-mono\">-</span>\n                  <span className=\"text-status-error-text\">\n                    {JSON.stringify((change as { from: unknown }).from)}\n                  </span>\n                </div>\n                <div className=\"flex items-center gap-2\">\n                  <span className=\"text-status-success-text font-mono\">+</span>\n                  <span className=\"text-status-success-text\">\n                    {JSON.stringify((change as { to: unknown }).to)}\n                  </span>\n                </div>\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport function AuditLogDetail({ log, onClose }: AuditLogDetailProps) {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string) => {\n    const v = t(key);\n    return v === key ? fallback : v;\n  };\n\n  useEffect(() => {\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyDown);\n    return () => window.removeEventListener('keydown', handleKeyDown);\n  }, [onClose]);\n\n  return (\n    <div className=\"fixed inset-0 z-[1000] flex justify-end bg-bg-overlay/40\">\n      <button\n        type=\"button\"\n        aria-label={tr('audit.closeDetailOverlay', 'Close audit log detail')}\n        className=\"absolute inset-0 cursor-default\"\n        onClick={onClose}\n      />\n      <aside className=\"relative flex h-full w-full max-w-[480px] flex-col border-l border-border-default bg-bg-surface shadow-xl\">\n        {/* Header */}\n        <div className=\"flex items-center justify-between px-4 py-3 border-b border-border-default\">\n          <div>\n            <h3 className=\"text-sm font-semibold\">{log.action.replace(/_/g, ' ')}</h3>\n            <p className=\"text-xs text-text-secondary\">\n              {log.resourceType.replace(/_/g, ' ')}\n              {log.resourceName ? ` · ${log.resourceName}` : ''}\n            </p>\n            <details className=\"mt-1\">\n              <summary className=\"cursor-pointer text-[10px] uppercase tracking-wider text-text-secondary hover:text-text-primary\">\n                Event ID\n              </summary>\n              <span className=\"mt-1 block break-all font-mono text-[11px] text-text-secondary\">\n                {log.id}\n              </span>\n            </details>\n          </div>\n          <button\n            type=\"button\"\n            aria-label={tr('audit.closeDetail', 'Close audit log detail')}\n            onClick={onClose}\n            className=\"flex size-10 items-center justify-center rounded hover:bg-bg-secondary\"\n          >\n            <X size={16} />\n          </button>\n        </div>\n\n        {/* Content */}\n        <div className=\"flex-1 overflow-y-auto p-4 space-y-4\">\n          {/* Summary */}\n          <div className=\"grid grid-cols-2 gap-3 text-sm\">\n            <div>\n              <span className=\"text-text-secondary text-xs\">Action</span>\n              <div className=\"font-medium\">{log.action}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Status</span>\n              <div>\n                <StatusBadge status={log.status} size=\"sm\" />\n              </div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Resource Type</span>\n              <div className=\"font-medium\">{log.resourceType.replace(/_/g, ' ')}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Resource ID</span>\n              <div className=\"font-mono text-xs truncate\">{log.resourceId || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Resource Name</span>\n              <div>{log.resourceName || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Description</span>\n              <div className=\"text-text-secondary\">{log.description || '-'}</div>\n            </div>\n            <div className=\"col-span-2\">\n              <span className=\"text-text-secondary text-xs\">Actor</span>\n              <div className=\"flex items-center gap-2\">\n                <span className=\"capitalize\">\n                  {(log.actorType || 'unknown').toLowerCase().replace(/_/g, ' ')}\n                </span>\n                <details className=\"text-xs text-text-secondary\">\n                  <summary className=\"cursor-pointer hover:text-text-primary\">ID</summary>\n                  <span className=\"ml-2 break-all font-mono text-[11px]\">{log.actorId}</span>\n                </details>\n              </div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">Timestamp</span>\n              <div className=\"text-xs\">{new Date(log.createdAt).toLocaleString()}</div>\n            </div>\n            <div>\n              <span className=\"text-text-secondary text-xs\">IP Address</span>\n              <div className=\"font-mono text-xs\">{log.ipAddress || '-'}</div>\n            </div>\n            {log.expiresAt && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Expires At</span>\n                <div className=\"text-xs text-status-warning-text\">\n                  {new Date(log.expiresAt).toLocaleString()}\n                </div>\n              </div>\n            )}\n            {log.errorMessage && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Error</span>\n                <div className=\"text-status-error-text text-xs\">{log.errorMessage}</div>\n              </div>\n            )}\n            {log.deleteReason && (\n              <div className=\"col-span-2\">\n                <span className=\"text-text-secondary text-xs\">Delete Reason</span>\n                <div className=\"text-xs\">{log.deleteReason}</div>\n              </div>\n            )}\n          </div>\n\n          {/* Command execution */}\n          <CommandBlock command={log.command} output={log.output} exitCode={log.exitCode} />\n\n          {/* Changeset */}\n          <ChangesetViewer changeset={log.changeset as Record<string, unknown> | null} />\n\n          {/* State snapshots */}\n          <JsonViewer data={log.previousState} label=\"Previous State\" />\n          <JsonViewer data={log.newState} label=\"New State\" />\n          <JsonViewer data={log.metadata} label=\"Metadata\" />\n        </div>\n      </aside>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/audit/AuditLogTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuditLogTable.js","names":[],"sources":["../../../src/components/audit/AuditLogTable.tsx"],"sourcesContent":["import { ChevronRight, Terminal, Trash2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { StatusBadge } from '@/components/shared';\nimport { SelectionCheckbox } from '@/components/shared/SelectionCheckbox';\nimport type { VibeAuditLogFieldsFragment } from '@/generated/wspace-operations';\n\ninterface AuditLogTableProps {\n  items: VibeAuditLogFieldsFragment[];\n  total: number;\n  hasMore: boolean;\n  page: number;\n  pageSize: number;\n  onPageChange: (page: number) => void;\n  onSelectLog: (id: string) => void;\n  onDeleteLog: (id: string) => void;\n  selectedLogId: string | null;\n  selectedLogIds: Set<string>;\n  allVisibleSelected: boolean;\n  partiallySelected: boolean;\n  onToggleLogSelection: (id: string, checked: boolean) => void;\n  onToggleAllVisible: (checked: boolean) => void;\n}\n\nconst statusVariantMap: Record<string, 'success' | 'error' | 'warning' | 'info'> = {\n  SUCCESS: 'success',\n  FAILURE: 'error',\n  DENIED: 'warning',\n  ERROR: 'error',\n};\n\nconst actionColors: Record<string, string> = {\n  CREATE: 'bg-status-success-bg text-status-success-text',\n  UPDATE: 'bg-status-info-bg text-status-info-text',\n  DELETE: 'bg-status-error-bg text-status-error-text',\n  EXECUTE: 'bg-action-primary-bg/15 text-action-primary-text',\n  EXPORT: 'bg-status-warning-bg text-status-warning-text',\n  SHARE: 'bg-status-success-bg text-status-success-text',\n  REVOKE: 'bg-status-warning-bg text-status-warning-text',\n  ARCHIVE: 'bg-bg-muted text-text-secondary',\n  RESTORE: 'bg-status-info-bg text-status-info-text',\n};\n\nfunction formatDate(dateString: string): string {\n  const date = new Date(dateString);\n  return date.toLocaleString('en-US', {\n    month: 'short',\n    day: 'numeric',\n    hour: '2-digit',\n    minute: '2-digit',\n    second: '2-digit',\n  });\n}\n\nfunction formatResourceType(type: string): string {\n  return type\n    .replace(/_/g, ' ')\n    .toLowerCase()\n    .replace(/\\b\\w/g, (character) => character.toUpperCase());\n}\n\nexport function AuditLogTable({\n  items,\n  total,\n  hasMore,\n  page,\n  pageSize,\n  onPageChange,\n  onSelectLog,\n  onDeleteLog,\n  selectedLogId,\n  selectedLogIds,\n  allVisibleSelected,\n  partiallySelected,\n  onToggleLogSelection,\n  onToggleAllVisible,\n}: AuditLogTableProps) {\n  const { t } = useI18n();\n  const totalPages = Math.max(1, Math.ceil(total / pageSize));\n\n  const tr = (key: string, fallback: string) => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  return (\n    <div>\n      <div className=\"space-y-3 md:hidden\">\n        {items.map((item) => {\n          const isSelected = selectedLogIds.has(item.id);\n          return (\n            <article\n              key={item.id}\n              className={`rounded-lg border border-border-primary p-4 transition-colors ${\n                selectedLogId === item.id ? 'bg-bg-secondary/50' : 'bg-bg-surface'\n              }`}\n            >\n              <div className=\"flex items-start justify-between gap-3\">\n                <div className=\"flex items-start gap-3\">\n                  <SelectionCheckbox\n                    checked={isSelected}\n                    onChange={(checked) => onToggleLogSelection(item.id, checked)}\n                    ariaLabel={`Select audit log ${item.id}`}\n                    className=\"mt-1\"\n                  />\n                  <div className=\"min-w-0\">\n                    <p className=\"text-xs text-text-secondary\">{formatDate(item.createdAt)}</p>\n                    <p className=\"mt-1 truncate font-medium text-text-primary\">\n                      {item.resourceName || item.description || '-'}\n                    </p>\n                    <p className=\"mt-1 text-xs text-text-secondary\">\n                      {formatResourceType(item.resourceType)}\n                    </p>\n                  </div>\n                </div>\n                <span\n                  className={`inline-flex shrink-0 items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n                    actionColors[item.action] || 'bg-bg-secondary text-text-secondary'\n                  }`}\n                >\n                  {item.command ? <Terminal size={12} /> : null}\n                  {item.action}\n                </span>\n              </div>\n              <div className=\"mt-3 flex items-center justify-between gap-3\">\n                <p className=\"min-w-0 truncate text-xs capitalize text-text-secondary\">\n                  {(item.actorType || 'unknown')\n                    .toLowerCase()\n                    .replace(/_/g, ' ')}\n                  {item.resourceName ? ` · ${item.resourceName}` : ''}\n                </p>\n                <StatusBadge\n                  status={item.status}\n                  variant={statusVariantMap[item.status]}\n                  size=\"sm\"\n                />\n              </div>\n              <div className=\"mt-4 flex items-center justify-end gap-2\">\n                <button\n                  type=\"button\"\n                  onClick={() => onSelectLog(item.id)}\n                  className=\"inline-flex items-center gap-1 rounded-md border border-border-primary px-3 py-1.5 text-sm text-text-primary transition-colors hover:bg-bg-secondary\"\n                >\n                  View details\n                  <ChevronRight size={14} />\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => onDeleteLog(item.id)}\n                  className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg hover:text-status-error-text\"\n                  title={tr('audit.deleteAuditLog', 'Delete audit log')}\n                >\n                  <Trash2 size={14} />\n                </button>\n              </div>\n            </article>\n          );\n        })}\n      </div>\n\n      <div className=\"hidden overflow-x-auto rounded-lg border border-border-primary md:block\">\n        <table className=\"w-full min-w-[860px] text-sm\">\n          <thead>\n            <tr className=\"border-b border-border-primary bg-bg-secondary/50\">\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                <SelectionCheckbox\n                  checked={allVisibleSelected}\n                  indeterminate={partiallySelected}\n                  onChange={onToggleAllVisible}\n                  ariaLabel=\"Select all visible audit logs\"\n                />\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.time', 'Time')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.action', 'Action')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.resource', 'Resource')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.name', 'Name')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.actor', 'Actor')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.status', 'Status')}\n              </th>\n              <th className=\"px-4 py-3 text-right font-medium text-text-secondary\">\n                {tr('audit.actions', 'Actions')}\n              </th>\n            </tr>\n          </thead>\n          <tbody>\n            {items.map((item) => {\n              const isSelected = selectedLogIds.has(item.id);\n              return (\n                <tr\n                  key={item.id}\n                  className={`border-b border-border-primary/50 transition-colors hover:bg-bg-secondary/30 ${\n                    selectedLogId === item.id ? 'bg-bg-secondary/50' : ''\n                  }`}\n                >\n                  <td className=\"px-4 py-3 align-top\">\n                    <SelectionCheckbox\n                      checked={isSelected}\n                      onChange={(checked) => onToggleLogSelection(item.id, checked)}\n                      ariaLabel={`Select audit log ${item.id}`}\n                    />\n                  </td>\n                  <td className=\"whitespace-nowrap px-4 py-3 text-xs text-text-secondary\">\n                    {formatDate(item.createdAt)}\n                  </td>\n                  <td className=\"px-4 py-3\">\n                    <span\n                      className={`inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n                        actionColors[item.action] || 'bg-bg-secondary text-text-secondary'\n                      }`}\n                    >\n                      {item.command ? <Terminal size={12} /> : null}\n                      {item.action}\n                    </span>\n                  </td>\n                  <td className=\"px-4 py-3 text-xs text-text-secondary\">\n                    {formatResourceType(item.resourceType)}\n                  </td>\n                  <td\n                    className=\"max-w-[220px] truncate px-4 py-3\"\n                    title={item.resourceName || item.description || ''}\n                  >\n                    {item.resourceName || item.description || '-'}\n                  </td>\n                  <td\n                    className=\"max-w-[140px] truncate px-4 py-3 text-xs capitalize text-text-secondary\"\n                    title={item.actorId}\n                  >\n                    {(item.actorType || 'unknown')\n                      .toLowerCase()\n                      .replace(/_/g, ' ')}\n                  </td>\n                  <td className=\"px-4 py-3\">\n                    <StatusBadge\n                      status={item.status}\n                      variant={statusVariantMap[item.status]}\n                      size=\"sm\"\n                    />\n                  </td>\n                  <td className=\"px-4 py-3 text-right\">\n                    <div className=\"flex items-center justify-end gap-1\">\n                      <button\n                        type=\"button\"\n                        onClick={() => onSelectLog(item.id)}\n                        className=\"rounded p-1 text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary\"\n                        title={tr('audit.viewAuditLog', 'View details')}\n                      >\n                        <ChevronRight size={14} />\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => onDeleteLog(item.id)}\n                        className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg hover:text-status-error-text\"\n                        title={tr('audit.deleteAuditLog', 'Delete audit log')}\n                      >\n                        <Trash2 size={14} />\n                      </button>\n                    </div>\n                  </td>\n                </tr>\n              );\n            })}\n          </tbody>\n        </table>\n      </div>\n\n      <div className=\"mt-4 flex flex-col gap-3 text-sm text-text-secondary sm:flex-row sm:items-center sm:justify-between\">\n        <span>\n          {tr('audit.showing', 'Showing')} {page * pageSize + 1}-\n          {Math.min((page + 1) * pageSize, total)} {tr('audit.of', 'of')} {total}\n        </span>\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <button\n            type=\"button\"\n            disabled={page === 0}\n            onClick={() => onPageChange(page - 1)}\n            className=\"rounded border border-border-primary px-3 py-1 transition-colors hover:bg-bg-secondary disabled:opacity-50\"\n          >\n            {tr('audit.previous', 'Previous')}\n          </button>\n          <span>\n            {tr('audit.page', 'Page')} {page + 1} {tr('audit.of', 'of')} {totalPages}\n          </span>\n          <button\n            type=\"button\"\n            disabled={!hasMore}\n            onClick={() => onPageChange(page + 1)}\n            className=\"rounded border border-border-primary px-3 py-1 transition-colors hover:bg-bg-secondary disabled:opacity-50\"\n          >\n            {tr('audit.next', 'Next')}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAuBA,IAAM,IAA6E;CACjF,SAAS;CACT,SAAS;CACT,QAAQ;CACR,OAAO;CACR,EAEK,IAAuC;CAC3C,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,SAAS;CACT,SAAS;CACV;AAED,SAAS,EAAW,GAA4B;AAE9C,QADa,IAAI,KAAK,EAAW,CACrB,eAAe,SAAS;EAClC,OAAO;EACP,KAAK;EACL,MAAM;EACN,QAAQ;EACR,QAAQ;EACT,CAAC;;AAGJ,SAAS,EAAmB,GAAsB;AAChD,QAAO,EACJ,QAAQ,MAAM,IAAI,CAClB,aAAa,CACb,QAAQ,UAAU,MAAc,EAAU,aAAa,CAAC;;AAG7D,SAAgB,EAAc,EAC5B,UACA,UACA,YACA,SACA,aACA,iBACA,gBACA,gBACA,kBACA,mBACA,uBACA,sBACA,yBACA,yBACqB;CACrB,IAAM,EAAE,SAAM,GAAS,EACjB,IAAa,KAAK,IAAI,GAAG,KAAK,KAAK,IAAQ,EAAS,CAAC,EAErD,KAAM,GAAa,MAAqB;EAC5C,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;;AAGpC,QACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAM,KAAK,MAAS;IACnB,IAAM,IAAa,EAAe,IAAI,EAAK,GAAG;AAC9C,WACE,kBAAC,WAAD;KAEE,WAAW,iEACT,MAAkB,EAAK,KAAK,uBAAuB;eAHvD;MAME,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,GAAD;SACE,SAAS;SACT,WAAW,MAAY,EAAqB,EAAK,IAAI,EAAQ;SAC7D,WAAW,oBAAoB,EAAK;SACpC,WAAU;SACV,CAAA,EACF,kBAAC,OAAD;SAAK,WAAU;mBAAf;UACE,kBAAC,KAAD;WAAG,WAAU;qBAA+B,EAAW,EAAK,UAAU;WAAK,CAAA;UAC3E,kBAAC,KAAD;WAAG,WAAU;qBACV,EAAK,gBAAgB,EAAK,eAAe;WACxC,CAAA;UACJ,kBAAC,KAAD;WAAG,WAAU;qBACV,EAAmB,EAAK,aAAa;WACpC,CAAA;UACA;WACF;WACN,kBAAC,QAAD;QACE,WAAW,mFACT,EAAa,EAAK,WAAW;kBAFjC,CAKG,EAAK,UAAU,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA,GAAG,MACxC,EAAK,OACD;UACH;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,KAAD;QAAG,WAAU;kBAAb,EACI,EAAK,aAAa,WACjB,aAAa,CACb,QAAQ,MAAM,IAAI,EACpB,EAAK,eAAe,MAAM,EAAK,iBAAiB,GAC/C;WACJ,kBAAC,GAAD;QACE,QAAQ,EAAK;QACb,SAAS,EAAiB,EAAK;QAC/B,MAAK;QACL,CAAA,CACE;;MACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAY,EAAK,GAAG;QACnC,WAAU;kBAHZ,CAIC,gBAEC,kBAAC,GAAD,EAAc,MAAM,IAAM,CAAA,CACnB;WACT,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAY,EAAK,GAAG;QACnC,WAAU;QACV,OAAO,EAAG,wBAAwB,mBAAmB;kBAErD,kBAAC,GAAD,EAAQ,MAAM,IAAM,CAAA;QACb,CAAA,CACL;;MACE;OA/DH,EAAK,GA+DF;KAEZ;GACE,CAAA;EAEN,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,SAAD;IAAO,WAAU;cAAjB,CACE,kBAAC,SAAD,EAAA,UACE,kBAAC,MAAD;KAAI,WAAU;eAAd;MACE,kBAAC,MAAD;OAAI,WAAU;iBACZ,kBAAC,GAAD;QACE,SAAS;QACT,eAAe;QACf,UAAU;QACV,WAAU;QACV,CAAA;OACC,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,cAAc,OAAO;OACtB,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,gBAAgB,SAAS;OAC1B,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,kBAAkB,WAAW;OAC9B,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,cAAc,OAAO;OACtB,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,eAAe,QAAQ;OACxB,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,gBAAgB,SAAS;OAC1B,CAAA;MACL,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAG,iBAAiB,UAAU;OAC5B,CAAA;MACF;QACC,CAAA,EACR,kBAAC,SAAD,EAAA,UACG,EAAM,KAAK,MAAS;KACnB,IAAM,IAAa,EAAe,IAAI,EAAK,GAAG;AAC9C,YACE,kBAAC,MAAD;MAEE,WAAW,gFACT,MAAkB,EAAK,KAAK,uBAAuB;gBAHvD;OAME,kBAAC,MAAD;QAAI,WAAU;kBACZ,kBAAC,GAAD;SACE,SAAS;SACT,WAAW,MAAY,EAAqB,EAAK,IAAI,EAAQ;SAC7D,WAAW,oBAAoB,EAAK;SACpC,CAAA;QACC,CAAA;OACL,kBAAC,MAAD;QAAI,WAAU;kBACX,EAAW,EAAK,UAAU;QACxB,CAAA;OACL,kBAAC,MAAD;QAAI,WAAU;kBACZ,kBAAC,QAAD;SACE,WAAW,0EACT,EAAa,EAAK,WAAW;mBAFjC,CAKG,EAAK,UAAU,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA,GAAG,MACxC,EAAK,OACD;;QACJ,CAAA;OACL,kBAAC,MAAD;QAAI,WAAU;kBACX,EAAmB,EAAK,aAAa;QACnC,CAAA;OACL,kBAAC,MAAD;QACE,WAAU;QACV,OAAO,EAAK,gBAAgB,EAAK,eAAe;kBAE/C,EAAK,gBAAgB,EAAK,eAAe;QACvC,CAAA;OACL,kBAAC,MAAD;QACE,WAAU;QACV,OAAO,EAAK;mBAEV,EAAK,aAAa,WACjB,aAAa,CACb,QAAQ,MAAM,IAAI;QAClB,CAAA;OACL,kBAAC,MAAD;QAAI,WAAU;kBACZ,kBAAC,GAAD;SACE,QAAQ,EAAK;SACb,SAAS,EAAiB,EAAK;SAC/B,MAAK;SACL,CAAA;QACC,CAAA;OACL,kBAAC,MAAD;QAAI,WAAU;kBACZ,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,UAAD;UACE,MAAK;UACL,eAAe,EAAY,EAAK,GAAG;UACnC,WAAU;UACV,OAAO,EAAG,sBAAsB,eAAe;oBAE/C,kBAAC,GAAD,EAAc,MAAM,IAAM,CAAA;UACnB,CAAA,EACT,kBAAC,UAAD;UACE,MAAK;UACL,eAAe,EAAY,EAAK,GAAG;UACnC,WAAU;UACV,OAAO,EAAG,wBAAwB,mBAAmB;oBAErD,kBAAC,GAAD,EAAQ,MAAM,IAAM,CAAA;UACb,CAAA,CACL;;QACH,CAAA;OACF;QArEE,EAAK,GAqEP;MAEP,EACI,CAAA,CACF;;GACJ,CAAA;EAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD,EAAA,UAAA;IACG,EAAG,iBAAiB,UAAU;IAAC;IAAE,IAAO,IAAW;IAAE;IACrD,KAAK,KAAK,IAAO,KAAK,GAAU,EAAM;IAAC;IAAE,EAAG,YAAY,KAAK;IAAC;IAAE;IAC5D,EAAA,CAAA,EACP,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,UAAD;MACE,MAAK;MACL,UAAU,MAAS;MACnB,eAAe,EAAa,IAAO,EAAE;MACrC,WAAU;gBAET,EAAG,kBAAkB,WAAW;MAC1B,CAAA;KACT,kBAAC,QAAD,EAAA,UAAA;MACG,EAAG,cAAc,OAAO;MAAC;MAAE,IAAO;MAAE;MAAE,EAAG,YAAY,KAAK;MAAC;MAAE;MACzD,EAAA,CAAA;KACP,kBAAC,UAAD;MACE,MAAK;MACL,UAAU,CAAC;MACX,eAAe,EAAa,IAAO,EAAE;MACrC,WAAU;gBAET,EAAG,cAAc,OAAO;MAClB,CAAA;KACL;MACF;;EACF,EAAA,CAAA"}
+{"version":3,"file":"AuditLogTable.js","names":[],"sources":["../../../src/components/audit/AuditLogTable.tsx"],"sourcesContent":["import { ChevronRight, Terminal, Trash2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { StatusBadge } from '@/components/shared';\nimport { SelectionCheckbox } from '@/components/shared/SelectionCheckbox';\nimport type { VibeAuditLogFieldsFragment } from '@/generated/wspace-operations';\n\ninterface AuditLogTableProps {\n  items: VibeAuditLogFieldsFragment[];\n  total: number;\n  hasMore: boolean;\n  page: number;\n  pageSize: number;\n  onPageChange: (page: number) => void;\n  onSelectLog: (id: string) => void;\n  onDeleteLog: (id: string) => void;\n  selectedLogId: string | null;\n  selectedLogIds: Set<string>;\n  allVisibleSelected: boolean;\n  partiallySelected: boolean;\n  onToggleLogSelection: (id: string, checked: boolean) => void;\n  onToggleAllVisible: (checked: boolean) => void;\n}\n\nconst statusVariantMap: Record<string, 'success' | 'error' | 'warning' | 'info'> = {\n  SUCCESS: 'success',\n  FAILURE: 'error',\n  DENIED: 'warning',\n  ERROR: 'error',\n};\n\nconst actionColors: Record<string, string> = {\n  CREATE: 'bg-status-success-bg text-status-success-text',\n  UPDATE: 'bg-status-info-bg text-status-info-text',\n  DELETE: 'bg-status-error-bg text-status-error-text',\n  EXECUTE: 'bg-action-primary-bg/15 text-action-primary-text',\n  EXPORT: 'bg-status-warning-bg text-status-warning-text',\n  SHARE: 'bg-status-success-bg text-status-success-text',\n  REVOKE: 'bg-status-warning-bg text-status-warning-text',\n  ARCHIVE: 'bg-bg-muted text-text-secondary',\n  RESTORE: 'bg-status-info-bg text-status-info-text',\n};\n\nfunction formatDate(dateString: string): string {\n  const date = new Date(dateString);\n  return date.toLocaleString('en-US', {\n    month: 'short',\n    day: 'numeric',\n    hour: '2-digit',\n    minute: '2-digit',\n    second: '2-digit',\n  });\n}\n\nfunction formatResourceType(type: string): string {\n  return type\n    .replace(/_/g, ' ')\n    .toLowerCase()\n    .replace(/\\b\\w/g, (character) => character.toUpperCase());\n}\n\nexport function AuditLogTable({\n  items,\n  total,\n  hasMore,\n  page,\n  pageSize,\n  onPageChange,\n  onSelectLog,\n  onDeleteLog,\n  selectedLogId,\n  selectedLogIds,\n  allVisibleSelected,\n  partiallySelected,\n  onToggleLogSelection,\n  onToggleAllVisible,\n}: AuditLogTableProps) {\n  const { t } = useI18n();\n  const totalPages = Math.max(1, Math.ceil(total / pageSize));\n\n  const tr = (key: string, fallback: string) => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  return (\n    <div>\n      <div className=\"space-y-3 md:hidden\">\n        {items.map((item) => {\n          const isSelected = selectedLogIds.has(item.id);\n          return (\n            <article\n              key={item.id}\n              className={`rounded-lg border border-border-primary p-4 transition-colors ${\n                selectedLogId === item.id ? 'bg-bg-secondary/50' : 'bg-bg-surface'\n              }`}\n            >\n              <div className=\"flex items-start justify-between gap-3\">\n                <div className=\"flex items-start gap-3\">\n                  <SelectionCheckbox\n                    checked={isSelected}\n                    onChange={(checked) => onToggleLogSelection(item.id, checked)}\n                    ariaLabel={`Select audit log ${item.id}`}\n                    className=\"mt-1\"\n                  />\n                  <div className=\"min-w-0\">\n                    <p className=\"text-xs text-text-secondary\">{formatDate(item.createdAt)}</p>\n                    <p className=\"mt-1 truncate font-medium text-text-primary\">\n                      {item.resourceName || item.description || '-'}\n                    </p>\n                    <p className=\"mt-1 text-xs text-text-secondary\">\n                      {formatResourceType(item.resourceType)}\n                    </p>\n                  </div>\n                </div>\n                <span\n                  className={`inline-flex shrink-0 items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n                    actionColors[item.action] || 'bg-bg-secondary text-text-secondary'\n                  }`}\n                >\n                  {item.command ? <Terminal size={12} /> : null}\n                  {item.action}\n                </span>\n              </div>\n              <div className=\"mt-3 flex items-center justify-between gap-3\">\n                <p className=\"min-w-0 truncate text-xs capitalize text-text-secondary\">\n                  {(item.actorType || 'unknown').toLowerCase().replace(/_/g, ' ')}\n                  {item.resourceName ? ` · ${item.resourceName}` : ''}\n                </p>\n                <StatusBadge\n                  status={item.status}\n                  variant={statusVariantMap[item.status]}\n                  size=\"sm\"\n                />\n              </div>\n              <div className=\"mt-4 flex items-center justify-end gap-2\">\n                <button\n                  type=\"button\"\n                  onClick={() => onSelectLog(item.id)}\n                  className=\"inline-flex items-center gap-1 rounded-md border border-border-primary px-3 py-1.5 text-sm text-text-primary transition-colors hover:bg-bg-secondary\"\n                >\n                  View details\n                  <ChevronRight size={14} />\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => onDeleteLog(item.id)}\n                  className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg hover:text-status-error-text\"\n                  title={tr('audit.deleteAuditLog', 'Delete audit log')}\n                >\n                  <Trash2 size={14} />\n                </button>\n              </div>\n            </article>\n          );\n        })}\n      </div>\n\n      <div className=\"hidden overflow-x-auto rounded-lg border border-border-primary md:block\">\n        <table className=\"w-full min-w-[860px] text-sm\">\n          <thead>\n            <tr className=\"border-b border-border-primary bg-bg-secondary/50\">\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                <SelectionCheckbox\n                  checked={allVisibleSelected}\n                  indeterminate={partiallySelected}\n                  onChange={onToggleAllVisible}\n                  ariaLabel=\"Select all visible audit logs\"\n                />\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.time', 'Time')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.action', 'Action')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.resource', 'Resource')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.name', 'Name')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.actor', 'Actor')}\n              </th>\n              <th className=\"px-4 py-3 text-left font-medium text-text-secondary\">\n                {tr('audit.status', 'Status')}\n              </th>\n              <th className=\"px-4 py-3 text-right font-medium text-text-secondary\">\n                {tr('audit.actions', 'Actions')}\n              </th>\n            </tr>\n          </thead>\n          <tbody>\n            {items.map((item) => {\n              const isSelected = selectedLogIds.has(item.id);\n              return (\n                <tr\n                  key={item.id}\n                  className={`border-b border-border-primary/50 transition-colors hover:bg-bg-secondary/30 ${\n                    selectedLogId === item.id ? 'bg-bg-secondary/50' : ''\n                  }`}\n                >\n                  <td className=\"px-4 py-3 align-top\">\n                    <SelectionCheckbox\n                      checked={isSelected}\n                      onChange={(checked) => onToggleLogSelection(item.id, checked)}\n                      ariaLabel={`Select audit log ${item.id}`}\n                    />\n                  </td>\n                  <td className=\"whitespace-nowrap px-4 py-3 text-xs text-text-secondary\">\n                    {formatDate(item.createdAt)}\n                  </td>\n                  <td className=\"px-4 py-3\">\n                    <span\n                      className={`inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n                        actionColors[item.action] || 'bg-bg-secondary text-text-secondary'\n                      }`}\n                    >\n                      {item.command ? <Terminal size={12} /> : null}\n                      {item.action}\n                    </span>\n                  </td>\n                  <td className=\"px-4 py-3 text-xs text-text-secondary\">\n                    {formatResourceType(item.resourceType)}\n                  </td>\n                  <td\n                    className=\"max-w-[220px] truncate px-4 py-3\"\n                    title={item.resourceName || item.description || ''}\n                  >\n                    {item.resourceName || item.description || '-'}\n                  </td>\n                  <td\n                    className=\"max-w-[140px] truncate px-4 py-3 text-xs capitalize text-text-secondary\"\n                    title={item.actorId}\n                  >\n                    {(item.actorType || 'unknown').toLowerCase().replace(/_/g, ' ')}\n                  </td>\n                  <td className=\"px-4 py-3\">\n                    <StatusBadge\n                      status={item.status}\n                      variant={statusVariantMap[item.status]}\n                      size=\"sm\"\n                    />\n                  </td>\n                  <td className=\"px-4 py-3 text-right\">\n                    <div className=\"flex items-center justify-end gap-1\">\n                      <button\n                        type=\"button\"\n                        onClick={() => onSelectLog(item.id)}\n                        className=\"rounded p-1 text-text-secondary transition-colors hover:bg-bg-secondary hover:text-text-primary\"\n                        title={tr('audit.viewAuditLog', 'View details')}\n                      >\n                        <ChevronRight size={14} />\n                      </button>\n                      <button\n                        type=\"button\"\n                        onClick={() => onDeleteLog(item.id)}\n                        className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg hover:text-status-error-text\"\n                        title={tr('audit.deleteAuditLog', 'Delete audit log')}\n                      >\n                        <Trash2 size={14} />\n                      </button>\n                    </div>\n                  </td>\n                </tr>\n              );\n            })}\n          </tbody>\n        </table>\n      </div>\n\n      <div className=\"mt-4 flex flex-col gap-3 text-sm text-text-secondary sm:flex-row sm:items-center sm:justify-between\">\n        <span>\n          {tr('audit.showing', 'Showing')} {page * pageSize + 1}-\n          {Math.min((page + 1) * pageSize, total)} {tr('audit.of', 'of')} {total}\n        </span>\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <button\n            type=\"button\"\n            disabled={page === 0}\n            onClick={() => onPageChange(page - 1)}\n            className=\"rounded border border-border-primary px-3 py-1 transition-colors hover:bg-bg-secondary disabled:opacity-50\"\n          >\n            {tr('audit.previous', 'Previous')}\n          </button>\n          <span>\n            {tr('audit.page', 'Page')} {page + 1} {tr('audit.of', 'of')} {totalPages}\n          </span>\n          <button\n            type=\"button\"\n            disabled={!hasMore}\n            onClick={() => onPageChange(page + 1)}\n            className=\"rounded border border-border-primary px-3 py-1 transition-colors hover:bg-bg-secondary disabled:opacity-50\"\n          >\n            {tr('audit.next', 'Next')}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/security/SecurityScanList.js

@@ -0,0 +1,308 @@
+import { useSecurityRecentScansQuery as e } from "./hooks.js";
+import { useMemo as t } from "react";
+import { AlertCircle as n, CheckCircle2 as r, Clock as i, Loader2 as a, MinusCircle as o, ShieldAlert as s, XCircle as c } from "lucide-react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/security/SecurityScanList.tsx
+var f = {
+	queued: "bg-bg-sunken text-text-secondary",
+	running: "bg-status-info-bg/20 text-status-info-text",
+	succeeded: "bg-status-success-bg/20 text-status-success-text",
+	failed: "bg-status-error-bg/20 text-status-error-text",
+	errored: "bg-status-error-bg/20 text-status-error-text",
+	cancelled: "bg-bg-sunken text-text-tertiary"
+}, p = {
+	pass: "bg-status-success-bg/20 text-status-success-text",
+	warn: "bg-status-warning-bg/20 text-status-warning-text",
+	fail: "bg-status-error-bg/20 text-status-error-text",
+	skipped: "bg-bg-sunken text-text-tertiary"
+};
+function m(e) {
+	switch (e) {
+		case "queued": return /* @__PURE__ */ u(i, {
+			className: "size-3.5",
+			"aria-hidden": "true"
+		});
+		case "running": return /* @__PURE__ */ u(a, {
+			className: "size-3.5 animate-spin",
+			"aria-hidden": "true"
+		});
+		case "succeeded": return /* @__PURE__ */ u(r, {
+			className: "size-3.5",
+			"aria-hidden": "true"
+		});
+		case "failed":
+		case "errored": return /* @__PURE__ */ u(c, {
+			className: "size-3.5",
+			"aria-hidden": "true"
+		});
+		case "cancelled": return /* @__PURE__ */ u(o, {
+			className: "size-3.5",
+			"aria-hidden": "true"
+		});
+	}
+}
+function h(e) {
+	if (!e) return "—";
+	let t = Date.now() - e, n = Math.round(t / 1e3);
+	if (n < 60) return `${n}s ago`;
+	let r = Math.round(n / 60);
+	if (r < 60) return `${r}m ago`;
+	let i = Math.round(r / 60);
+	return i < 24 ? `${i}h ago` : `${Math.round(i / 24)}d ago`;
+}
+function g(e) {
+	if (e == null) return "—";
+	if (e < 1e3) return `${e}ms`;
+	let t = e / 1e3;
+	if (t < 60) return `${t.toFixed(1)}s`;
+	let n = t / 60;
+	return n < 60 ? `${n.toFixed(1)}m` : `${(n / 60).toFixed(1)}h`;
+}
+function _(e) {
+	return e.replace(/\./g, " ");
+}
+function v({ run: e }) {
+	let t = e.summary;
+	return t.critical + t.high + t.medium + t.low + t.info === 0 ? /* @__PURE__ */ u("span", {
+		className: "text-xs text-text-tertiary",
+		children: "clean"
+	}) : /* @__PURE__ */ d("div", {
+		className: "flex items-center gap-1 text-xs",
+		children: [
+			t.critical > 0 && /* @__PURE__ */ d("span", {
+				className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-error-bg/20 text-status-error-text font-mono",
+				title: `${t.critical} critical`,
+				children: ["C ", t.critical]
+			}),
+			t.high > 0 && /* @__PURE__ */ d("span", {
+				className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-warning-bg/20 text-status-warning-text font-mono",
+				title: `${t.high} high`,
+				children: ["H ", t.high]
+			}),
+			t.medium > 0 && /* @__PURE__ */ d("span", {
+				className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-warning-bg/10 text-status-warning-text/80 font-mono",
+				title: `${t.medium} medium`,
+				children: ["M ", t.medium]
+			}),
+			t.low > 0 && /* @__PURE__ */ d("span", {
+				className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-bg-sunken text-text-secondary font-mono",
+				title: `${t.low} low`,
+				children: ["L ", t.low]
+			}),
+			t.info > 0 && /* @__PURE__ */ d("span", {
+				className: "inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-bg-sunken text-text-tertiary font-mono",
+				title: `${t.info} info`,
+				children: ["I ", t.info]
+			})
+		]
+	});
+}
+function y({ rowKey: e }) {
+	return /* @__PURE__ */ d("tr", {
+		className: "border-t border-border-subtle",
+		children: [
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-20 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-24 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-16 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-16 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-20 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-14 rounded bg-bg-sunken animate-pulse" })
+			}),
+			/* @__PURE__ */ u("td", {
+				className: "px-3 py-2",
+				children: /* @__PURE__ */ u("div", { className: "h-3 w-28 rounded bg-bg-sunken animate-pulse" })
+			})
+		]
+	}, e);
+}
+function b({ vibeId: r, agentId: i, tunnelUrl: a, apiKey: o, profile: c, limit: b = 20 }) {
+	let { data: x, isLoading: S, error: C, isFetching: w, refetch: T } = e(t(() => ({
+		agentId: i,
+		tunnelUrl: a,
+		apiKey: o,
+		profile: c
+	}), [
+		i,
+		a,
+		o,
+		c
+	]), r, b);
+	return i && a && o ? /* @__PURE__ */ d("section", {
+		"data-testid": "security-scan-list",
+		className: "rounded-lg border border-border-default bg-bg-surface",
+		children: [
+			/* @__PURE__ */ d("header", {
+				className: "flex items-center justify-between gap-3 border-b border-border-default px-4 py-3",
+				children: [/* @__PURE__ */ d("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ u("h3", {
+						className: "text-sm font-semibold text-text-primary",
+						children: "Recent scan runs"
+					}), /* @__PURE__ */ d("p", {
+						className: "text-xs text-text-secondary mt-0.5",
+						children: [
+							"Read live from the agent. Showing up to ",
+							b,
+							" most recently active runs for this vibe."
+						]
+					})]
+				}), /* @__PURE__ */ u("button", {
+					type: "button",
+					onClick: () => void T(),
+					disabled: w,
+					className: "px-2.5 py-1 text-xs rounded-md border border-border-default bg-bg-sunken text-text-primary hover:bg-action-primary-bg-hover disabled:opacity-50",
+					children: w ? "Refreshing…" : "Refresh"
+				})]
+			}),
+			C && /* @__PURE__ */ d("div", {
+				className: "m-4 flex items-start gap-2 rounded-md border border-status-error-border bg-status-error-bg/10 p-3 text-sm",
+				children: [/* @__PURE__ */ u(n, { className: "size-4 text-status-error-text mt-0.5 shrink-0" }), /* @__PURE__ */ d("div", {
+					className: "text-text-primary",
+					children: [/* @__PURE__ */ u("p", {
+						className: "font-medium",
+						children: "Couldn't load scan runs"
+					}), /* @__PURE__ */ u("p", {
+						className: "mt-0.5 text-xs text-text-secondary",
+						children: C.message
+					})]
+				})]
+			}),
+			/* @__PURE__ */ u("div", {
+				className: "overflow-x-auto",
+				children: /* @__PURE__ */ d("table", {
+					className: "w-full text-sm",
+					children: [/* @__PURE__ */ u("thead", {
+						className: "bg-bg-sunken/40 text-text-secondary",
+						children: /* @__PURE__ */ d("tr", { children: [
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Stage"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Provider"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Status"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Conclusion"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Started"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Duration"
+							}),
+							/* @__PURE__ */ u("th", {
+								className: "px-3 py-2 text-left text-xs font-medium",
+								children: "Findings"
+							})
+						] })
+					}), /* @__PURE__ */ d("tbody", { children: [
+						S && x === void 0 && /* @__PURE__ */ d(l, { children: [
+							/* @__PURE__ */ u(y, { rowKey: 0 }),
+							/* @__PURE__ */ u(y, { rowKey: 1 }),
+							/* @__PURE__ */ u(y, { rowKey: 2 })
+						] }),
+						!S && (x?.length ?? 0) === 0 && !C && /* @__PURE__ */ u("tr", { children: /* @__PURE__ */ u("td", {
+							colSpan: 7,
+							className: "px-3 py-8",
+							children: /* @__PURE__ */ d("div", {
+								className: "flex flex-col items-center gap-2 text-center",
+								children: [
+									/* @__PURE__ */ u(s, { className: "size-6 text-text-tertiary" }),
+									/* @__PURE__ */ u("p", {
+										className: "text-sm text-text-primary",
+										children: "No scans yet"
+									}),
+									/* @__PURE__ */ u("p", {
+										className: "text-xs text-text-secondary max-w-md",
+										children: "Install a provider above and run a scan to see results here. Findings live in the agent's local SQLite cache."
+									})
+								]
+							})
+						}) }),
+						(x ?? []).map((e) => /* @__PURE__ */ d("tr", {
+							className: "border-t border-border-subtle align-middle",
+							children: [
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2",
+									children: /* @__PURE__ */ u("span", {
+										className: "inline-flex items-center rounded-md bg-bg-sunken px-2 py-0.5 text-xs text-text-primary",
+										children: _(e.stage)
+									})
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2 text-xs text-text-primary",
+									children: e.providerName
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2",
+									children: /* @__PURE__ */ d("span", {
+										className: `inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-xs font-medium ${f[e.status]}`,
+										children: [m(e.status), e.status]
+									})
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2",
+									children: e.conclusion ? /* @__PURE__ */ u("span", {
+										className: `inline-flex items-center rounded-md px-2 py-0.5 text-xs font-medium ${p[e.conclusion]}`,
+										children: e.conclusion
+									}) : /* @__PURE__ */ u("span", {
+										className: "text-xs text-text-tertiary",
+										children: "—"
+									})
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2 text-xs text-text-secondary",
+									children: /* @__PURE__ */ u("span", {
+										title: e.startedAt ? new Date(e.startedAt).toLocaleString() : "",
+										children: h(e.startedAt)
+									})
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2 text-xs text-text-secondary font-mono",
+									children: g(e.durationMs)
+								}),
+								/* @__PURE__ */ u("td", {
+									className: "px-3 py-2",
+									children: /* @__PURE__ */ u(v, { run: e })
+								})
+							]
+						}, e.runId))
+					] })]
+				})
+			})
+		]
+	}) : /* @__PURE__ */ u("section", {
+		"data-testid": "security-scan-list",
+		className: "rounded-lg border border-border-default bg-bg-surface p-4 text-sm text-text-secondary",
+		children: "Connect to a reachable agent to load scan history. Scan runs are read directly from the agent over the tunnel — there's no backend cache."
+	});
+}
+//#endregion
+export { b as SecurityScanList };
+
+//# sourceMappingURL=SecurityScanList.js.map

package/dist/components/security/SecurityScanList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SecurityScanList.js","names":[],"sources":["../../../src/components/security/SecurityScanList.tsx"],"sourcesContent":["/**\n * Recent scan runs list for a vibe, read directly from the agent over\n * the tunnel. No backend GraphQL — see `./agentClient.ts` for the\n * REST surface and `./hooks.ts` for the React Query wrappers.\n *\n * The agent doesn't expose a list-runs endpoint; we derive distinct\n * run ids from the findings cache (see `listRecentScanRuns`). When a\n * vibe has zero findings the list will be empty even if scans have\n * been queued — that's correct: an in-flight queued/running scan\n * doesn't yet have any findings, and the empty state already nudges\n * the user toward kicking off a scan.\n */\nimport { useMemo, type ReactElement } from 'react';\nimport {\n  AlertCircle,\n  CheckCircle2,\n  Clock,\n  Loader2,\n  MinusCircle,\n  ShieldAlert,\n  XCircle,\n} from 'lucide-react';\n\nimport { useSecurityRecentScansQuery, type UseSecurityAgentContext } from './hooks';\nimport type { AgentScanConclusion, AgentScanStatus, SecurityScanRun } from './agentClient';\n\ninterface Props extends UseSecurityAgentContext {\n  vibeId: string;\n  /** Max rows to surface. Defaults to 20. */\n  limit?: number;\n}\n\nconst STATUS_BADGE: Record<AgentScanStatus, string> = {\n  queued: 'bg-bg-sunken text-text-secondary',\n  running: 'bg-status-info-bg/20 text-status-info-text',\n  succeeded: 'bg-status-success-bg/20 text-status-success-text',\n  failed: 'bg-status-error-bg/20 text-status-error-text',\n  errored: 'bg-status-error-bg/20 text-status-error-text',\n  cancelled: 'bg-bg-sunken text-text-tertiary',\n};\n\nconst CONCLUSION_BADGE: Record<AgentScanConclusion, string> = {\n  pass: 'bg-status-success-bg/20 text-status-success-text',\n  warn: 'bg-status-warning-bg/20 text-status-warning-text',\n  fail: 'bg-status-error-bg/20 text-status-error-text',\n  skipped: 'bg-bg-sunken text-text-tertiary',\n};\n\nfunction statusIcon(status: AgentScanStatus): ReactElement {\n  switch (status) {\n    case 'queued':\n      return <Clock className=\"size-3.5\" aria-hidden=\"true\" />;\n    case 'running':\n      return <Loader2 className=\"size-3.5 animate-spin\" aria-hidden=\"true\" />;\n    case 'succeeded':\n      return <CheckCircle2 className=\"size-3.5\" aria-hidden=\"true\" />;\n    case 'failed':\n    case 'errored':\n      return <XCircle className=\"size-3.5\" aria-hidden=\"true\" />;\n    case 'cancelled':\n      return <MinusCircle className=\"size-3.5\" aria-hidden=\"true\" />;\n  }\n}\n\nfunction relativeTime(epochMs?: number): string {\n  if (!epochMs) return '—';\n  const diff = Date.now() - epochMs;\n  const sec = Math.round(diff / 1000);\n  if (sec < 60) return `${sec}s ago`;\n  const min = Math.round(sec / 60);\n  if (min < 60) return `${min}m ago`;\n  const hr = Math.round(min / 60);\n  if (hr < 24) return `${hr}h ago`;\n  const day = Math.round(hr / 24);\n  return `${day}d ago`;\n}\n\nfunction formatDuration(ms?: number): string {\n  if (ms === undefined || ms === null) return '—';\n  if (ms < 1000) return `${ms}ms`;\n  const sec = ms / 1000;\n  if (sec < 60) return `${sec.toFixed(1)}s`;\n  const min = sec / 60;\n  if (min < 60) return `${min.toFixed(1)}m`;\n  const hr = min / 60;\n  return `${hr.toFixed(1)}h`;\n}\n\n/**\n * Prettify the agent's dotted stage id (e.g. `pull_request.fast` →\n * `pull_request fast`). We don't gate on the canonical 14-stage taxonomy\n * here because providers can — in principle — emit arbitrary stages and\n * we want to surface them rather than hide them.\n */\nfunction formatStage(stage: string): string {\n  return stage.replace(/\\./g, ' ');\n}\n\nfunction SummaryCell({ run }: { run: SecurityScanRun }): ReactElement {\n  const s = run.summary;\n  const total = s.critical + s.high + s.medium + s.low + s.info;\n  if (total === 0) {\n    return <span className=\"text-xs text-text-tertiary\">clean</span>;\n  }\n  return (\n    <div className=\"flex items-center gap-1 text-xs\">\n      {s.critical > 0 && (\n        <span\n          className=\"inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-error-bg/20 text-status-error-text font-mono\"\n          title={`${s.critical} critical`}\n        >\n          C {s.critical}\n        </span>\n      )}\n      {s.high > 0 && (\n        <span\n          className=\"inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-warning-bg/20 text-status-warning-text font-mono\"\n          title={`${s.high} high`}\n        >\n          H {s.high}\n        </span>\n      )}\n      {s.medium > 0 && (\n        <span\n          className=\"inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-status-warning-bg/10 text-status-warning-text/80 font-mono\"\n          title={`${s.medium} medium`}\n        >\n          M {s.medium}\n        </span>\n      )}\n      {s.low > 0 && (\n        <span\n          className=\"inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-bg-sunken text-text-secondary font-mono\"\n          title={`${s.low} low`}\n        >\n          L {s.low}\n        </span>\n      )}\n      {s.info > 0 && (\n        <span\n          className=\"inline-flex items-center gap-0.5 rounded px-1.5 py-0.5 bg-bg-sunken text-text-tertiary font-mono\"\n          title={`${s.info} info`}\n        >\n          I {s.info}\n        </span>\n      )}\n    </div>\n  );\n}\n\nfunction SkeletonRow({ rowKey }: { rowKey: number }): ReactElement {\n  return (\n    <tr key={rowKey} className=\"border-t border-border-subtle\">\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-20 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-24 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-16 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-16 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-20 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-14 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n      <td className=\"px-3 py-2\">\n        <div className=\"h-3 w-28 rounded bg-bg-sunken animate-pulse\" />\n      </td>\n    </tr>\n  );\n}\n\nexport function SecurityScanList({\n  vibeId,\n  agentId,\n  tunnelUrl,\n  apiKey,\n  profile,\n  limit = 20,\n}: Props): ReactElement {\n  const ctx = useMemo(\n    () => ({ agentId, tunnelUrl, apiKey, profile }),\n    [agentId, tunnelUrl, apiKey, profile]\n  );\n  const { data, isLoading, error, isFetching, refetch } = useSecurityRecentScansQuery(\n    ctx,\n    vibeId,\n    limit\n  );\n\n  const ready = !!agentId && !!tunnelUrl && !!apiKey;\n\n  if (!ready) {\n    return (\n      <section\n        data-testid=\"security-scan-list\"\n        className=\"rounded-lg border border-border-default bg-bg-surface p-4 text-sm text-text-secondary\"\n      >\n        Connect to a reachable agent to load scan history. Scan runs are read directly from the\n        agent over the tunnel — there's no backend cache.\n      </section>\n    );\n  }\n\n  return (\n    <section\n      data-testid=\"security-scan-list\"\n      className=\"rounded-lg border border-border-default bg-bg-surface\"\n    >\n      <header className=\"flex items-center justify-between gap-3 border-b border-border-default px-4 py-3\">\n        <div className=\"min-w-0\">\n          <h3 className=\"text-sm font-semibold text-text-primary\">Recent scan runs</h3>\n          <p className=\"text-xs text-text-secondary mt-0.5\">\n            Read live from the agent. Showing up to {limit} most recently active runs for this vibe.\n          </p>\n        </div>\n        <button\n          type=\"button\"\n          onClick={() => void refetch()}\n          disabled={isFetching}\n          className=\"px-2.5 py-1 text-xs rounded-md border border-border-default bg-bg-sunken text-text-primary hover:bg-action-primary-bg-hover disabled:opacity-50\"\n        >\n          {isFetching ? 'Refreshing…' : 'Refresh'}\n        </button>\n      </header>\n\n      {error && (\n        <div className=\"m-4 flex items-start gap-2 rounded-md border border-status-error-border bg-status-error-bg/10 p-3 text-sm\">\n          <AlertCircle className=\"size-4 text-status-error-text mt-0.5 shrink-0\" />\n          <div className=\"text-text-primary\">\n            <p className=\"font-medium\">Couldn't load scan runs</p>\n            <p className=\"mt-0.5 text-xs text-text-secondary\">{error.message}</p>\n          </div>\n        </div>\n      )}\n\n      <div className=\"overflow-x-auto\">\n        <table className=\"w-full text-sm\">\n          <thead className=\"bg-bg-sunken/40 text-text-secondary\">\n            <tr>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Stage</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Provider</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Status</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Conclusion</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Started</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Duration</th>\n              <th className=\"px-3 py-2 text-left text-xs font-medium\">Findings</th>\n            </tr>\n          </thead>\n          <tbody>\n            {isLoading && data === undefined && (\n              <>\n                <SkeletonRow rowKey={0} />\n                <SkeletonRow rowKey={1} />\n                <SkeletonRow rowKey={2} />\n              </>\n            )}\n            {!isLoading && (data?.length ?? 0) === 0 && !error && (\n              <tr>\n                <td colSpan={7} className=\"px-3 py-8\">\n                  <div className=\"flex flex-col items-center gap-2 text-center\">\n                    <ShieldAlert className=\"size-6 text-text-tertiary\" />\n                    <p className=\"text-sm text-text-primary\">No scans yet</p>\n                    <p className=\"text-xs text-text-secondary max-w-md\">\n                      Install a provider above and run a scan to see results here. Findings live in\n                      the agent's local SQLite cache.\n                    </p>\n                  </div>\n                </td>\n              </tr>\n            )}\n            {(data ?? []).map((run) => (\n              <tr key={run.runId} className=\"border-t border-border-subtle align-middle\">\n                <td className=\"px-3 py-2\">\n                  <span className=\"inline-flex items-center rounded-md bg-bg-sunken px-2 py-0.5 text-xs text-text-primary\">\n                    {formatStage(run.stage)}\n                  </span>\n                </td>\n                <td className=\"px-3 py-2 text-xs text-text-primary\">{run.providerName}</td>\n                <td className=\"px-3 py-2\">\n                  <span\n                    className={`inline-flex items-center gap-1 rounded-md px-2 py-0.5 text-xs font-medium ${STATUS_BADGE[run.status]}`}\n                  >\n                    {statusIcon(run.status)}\n                    {run.status}\n                  </span>\n                </td>\n                <td className=\"px-3 py-2\">\n                  {run.conclusion ? (\n                    <span\n                      className={`inline-flex items-center rounded-md px-2 py-0.5 text-xs font-medium ${CONCLUSION_BADGE[run.conclusion]}`}\n                    >\n                      {run.conclusion}\n                    </span>\n                  ) : (\n                    <span className=\"text-xs text-text-tertiary\">—</span>\n                  )}\n                </td>\n                <td className=\"px-3 py-2 text-xs text-text-secondary\">\n                  <span title={run.startedAt ? new Date(run.startedAt).toLocaleString() : ''}>\n                    {relativeTime(run.startedAt)}\n                  </span>\n                </td>\n                <td className=\"px-3 py-2 text-xs text-text-secondary font-mono\">\n                  {formatDuration(run.durationMs)}\n                </td>\n                <td className=\"px-3 py-2\">\n                  <SummaryCell run={run} />\n                </td>\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      </div>\n    </section>\n  );\n}\n"],"mappings":"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"}

package/dist/components/security/SecurityTabPanel.js

@@ -1,48 +1,52 @@
 import { SECURITY_META_PACKAGE as e, SECURITY_PROVIDER_PACKAGES as t } from "../../constants/pluginCatalog.js";
 import { PluginGate as n } from "../shared/PluginGate.js";
 import { PluginHarnessPicker as r } from "../ai/PluginHarnessPicker.js";
-import { Shield as i } from "lucide-react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { SecurityScanList as i } from "./SecurityScanList.js";
+import { Shield as a } from "lucide-react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/security/SecurityTabPanel.tsx
-function s({ vibeId: s, agentId: c }) {
-	return /* @__PURE__ */ o("div", {
+function c({ vibeId: c, agentId: l, profile: u = "default", tunnelUrl: d = null, apiKey: f = null }) {
+	return /* @__PURE__ */ s("div", {
 		"data-testid": "security-tab-panel",
 		className: "space-y-4",
-		children: [/* @__PURE__ */ o("header", {
+		children: [/* @__PURE__ */ s("header", {
 			className: "flex items-start gap-3",
-			children: [/* @__PURE__ */ a("div", {
+			children: [/* @__PURE__ */ o("div", {
 				className: "size-9 rounded-md bg-bg-sunken flex items-center justify-center shrink-0",
-				children: /* @__PURE__ */ a(i, { className: "size-4 text-text-secondary" })
-			}), /* @__PURE__ */ o("div", {
+				children: /* @__PURE__ */ o(a, { className: "size-4 text-text-secondary" })
+			}), /* @__PURE__ */ s("div", {
 				className: "min-w-0",
-				children: [/* @__PURE__ */ a("h2", {
+				children: [/* @__PURE__ */ o("h2", {
 					className: "text-base font-semibold text-text-primary",
 					children: "Security"
-				}), /* @__PURE__ */ a("p", {
+				}), /* @__PURE__ */ o("p", {
 					className: "text-sm text-text-secondary mt-0.5",
 					children: "Install + run security scans across the 14-stage lifecycle. Plugins run on the agent; findings live in its local SQLite cache."
 				})]
 			})]
-		}), /* @__PURE__ */ o(n, {
-			agentId: c,
+		}), /* @__PURE__ */ s(n, {
+			agentId: l,
 			required: [e],
 			mode: "all",
 			eyebrow: "Security plugin required",
 			title: "Install the Security Orchestrator",
 			description: "@vibecontrols/vibe-plugin-security routes scans across per-stage providers. Required before installing individual stage providers.",
-			children: [/* @__PURE__ */ a(r, {
+			children: [/* @__PURE__ */ o(r, {
 				packages: t,
-				agentId: c,
+				agentId: l,
 				title: "Security Providers",
 				description: "One plugin per stage in the security lifecycle. Install the providers you want to use; uninstalled stages stay skipped."
-			}), /* @__PURE__ */ a("div", {
-				className: "rounded-lg border border-border-default bg-bg-surface p-4 text-sm text-text-secondary",
-				children: "Findings, scan runs, and evidence will surface here once the agent-tunnel fetch helpers land. For now this tab is the install + visibility surface for security plugins."
+			}), /* @__PURE__ */ o(i, {
+				vibeId: c,
+				agentId: l,
+				tunnelUrl: d,
+				apiKey: f,
+				profile: u
 			})]
 		})]
 	});
 }
 //#endregion
-export { s as SecurityTabPanel };
+export { c as SecurityTabPanel };
 
 //# sourceMappingURL=SecurityTabPanel.js.map