feat(dsms): Stufe 2+3 — Evidence/TechFile → DSMS + Version Chains + Audit Timeline

Stufe 2A: Evidence Upload → automatische DSMS-Archivierung
- Nach SHA-256 Hash → archive_to_dsms(), CID im Audit-Trail
- Evidence mit CID wird automatisch zu E2 (hash-verifiziert) hochgestuft

Stufe 2B: IACE Tech-File Export → DSMS
- PDF/Excel/DOCX/Markdown Exporte werden nach DSMS archiviert
- archiveTechFile() Helper fuer alle 4 Formate

Stufe 3A: DSMS Gateway — parent_cid + History Endpoint
- parent_cid + tenant_id Felder in DocumentMetadata
- GET /documents/{cid}/history — folgt parent_cid-Chain (max 50 deep)

Stufe 3C: Audit Timeline UI
- Neue Seite /sdk/audit-timeline
- Vertikale Timeline mit farbigen Action-Dots
- Filter: Alle, Nachweis, DSMS-Archiv, Control, Dokument, DSFA, VVT, TOM
- CID-Badges fuer DSMS-archivierte Eintraege

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

admin-compliance/app/sdk/audit-timeline/_hooks/useAuditTimeline.ts

@@ -0,0 +1,46 @@
+'use client'
+
+import { useState, useEffect } from 'react'
+
+export interface AuditEntry {
+  id: string
+  entity_type: string
+  entity_id: string
+  entity_name: string
+  action: string
+  field_changed: string | null
+  old_value: string | null
+  new_value: string | null
+  change_summary: string | null
+  performed_by: string
+  performed_at: string
+}
+
+export function useAuditTimeline() {
+  const [entries, setEntries] = useState<AuditEntry[]>([])
+  const [loading, setLoading] = useState(true)
+  const [filter, setFilter] = useState<string>('all')
+
+  useEffect(() => {
+    loadEntries()
+  }, [filter]) // eslint-disable-line react-hooks/exhaustive-deps
+
+  async function loadEntries() {
+    setLoading(true)
+    try {
+      const params = new URLSearchParams({ limit: '100' })
+      if (filter !== 'all') params.set('entity_type', filter)
+      const res = await fetch(`/api/sdk/v1/compliance/audit-trail?${params}`)
+      if (res.ok) {
+        const json = await res.json()
+        setEntries(json.entries || json.audit_trail || json || [])
+      }
+    } catch (err) {
+      console.error('Failed to load audit trail:', err)
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  return { entries, loading, filter, setFilter }
+}

admin-compliance/app/sdk/audit-timeline/page.tsx

@@ -0,0 +1,117 @@
+'use client'
+
+import { useAuditTimeline, type AuditEntry } from './_hooks/useAuditTimeline'
+
+const ENTITY_LABELS: Record<string, string> = {
+  evidence: 'Nachweis', control: 'Control', document: 'Dokument',
+  dsfa: 'DSFA', vvt: 'VVT', tom: 'TOM', policy: 'Richtlinie',
+  dsms_archive: 'DSMS-Archiv', risk: 'Risiko',
+}
+
+const ACTION_COLORS: Record<string, string> = {
+  create: 'bg-green-500', update: 'bg-blue-500', delete: 'bg-red-500',
+  approve: 'bg-purple-500', archive: 'bg-emerald-500', review: 'bg-yellow-500',
+  sign: 'bg-indigo-500', reject: 'bg-red-400',
+}
+
+const FILTER_OPTIONS = ['all', 'evidence', 'dsms_archive', 'control', 'document', 'dsfa', 'vvt', 'tom']
+
+export default function AuditTimelinePage() {
+  const { entries, loading, filter, setFilter } = useAuditTimeline()
+
+  return (
+    <div className="max-w-4xl mx-auto space-y-6">
+      <div>
+        <h1 className="text-2xl font-bold text-gray-900 dark:text-white">Audit Timeline</h1>
+        <p className="text-sm text-gray-500 mt-1">Chronologische Compliance-Historie mit DSMS-Nachweisen</p>
+      </div>
+
+      {/* Filter */}
+      <div className="flex gap-2 flex-wrap">
+        {FILTER_OPTIONS.map((f) => (
+          <button
+            key={f}
+            onClick={() => setFilter(f)}
+            className={`px-3 py-1.5 rounded-full text-xs font-medium transition-colors ${
+              filter === f
+                ? 'bg-purple-600 text-white'
+                : 'bg-gray-100 text-gray-600 hover:bg-gray-200 dark:bg-gray-700 dark:text-gray-300'
+            }`}
+          >
+            {f === 'all' ? 'Alle' : ENTITY_LABELS[f] || f}
+          </button>
+        ))}
+      </div>
+
+      {loading ? (
+        <div className="flex items-center justify-center h-32">
+          <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-purple-600" />
+        </div>
+      ) : entries.length === 0 ? (
+        <div className="text-center py-16 text-gray-500">
+          Keine Eintraege gefunden. Compliance-Aktionen werden automatisch protokolliert.
+        </div>
+      ) : (
+        <div className="relative">
+          {/* Timeline line */}
+          <div className="absolute left-6 top-0 bottom-0 w-0.5 bg-gray-200 dark:bg-gray-700" />
+
+          <div className="space-y-4">
+            {entries.map((entry) => (
+              <TimelineEntry key={entry.id} entry={entry} />
+            ))}
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}
+
+function TimelineEntry({ entry }: { entry: AuditEntry }) {
+  const dotColor = ACTION_COLORS[entry.action] || 'bg-gray-400'
+  const isCID = entry.field_changed === 'dsms_cid' || entry.action === 'archive'
+  const date = new Date(entry.performed_at)
+
+  return (
+    <div className="relative flex gap-4 pl-3">
+      {/* Dot */}
+      <div className={`relative z-10 w-3 h-3 rounded-full mt-1.5 flex-shrink-0 ring-4 ring-white dark:ring-gray-900 ${dotColor}`} />
+
+      {/* Content */}
+      <div className="flex-1 bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 p-4 min-w-0">
+        <div className="flex items-start justify-between gap-3">
+          <div className="min-w-0">
+            <div className="flex items-center gap-2 flex-wrap">
+              <span className="text-sm font-medium text-gray-900 dark:text-white">{entry.entity_name}</span>
+              <span className="px-2 py-0.5 rounded text-[10px] font-medium bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300">
+                {ENTITY_LABELS[entry.entity_type] || entry.entity_type}
+              </span>
+              <span className={`px-2 py-0.5 rounded text-[10px] font-medium text-white ${dotColor}`}>
+                {entry.action}
+              </span>
+            </div>
+            {entry.change_summary && (
+              <p className="text-xs text-gray-600 dark:text-gray-400 mt-1">{entry.change_summary}</p>
+            )}
+            {isCID && entry.new_value && (
+              <div className="mt-2 flex items-center gap-2">
+                <svg className="w-3.5 h-3.5 text-emerald-600 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
+                </svg>
+                <code className="text-[10px] bg-emerald-50 text-emerald-700 px-2 py-0.5 rounded font-mono dark:bg-emerald-900/30 dark:text-emerald-300">
+                  {entry.new_value.length > 20 ? entry.new_value.slice(0, 8) + '...' + entry.new_value.slice(-6) : entry.new_value}
+                </code>
+                <span className="text-[10px] text-emerald-500">DSMS/IPFS</span>
+              </div>
+            )}
+          </div>
+          <div className="text-right flex-shrink-0">
+            <div className="text-xs text-gray-400">{date.toLocaleDateString('de-DE')}</div>
+            <div className="text-[10px] text-gray-300">{date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}</div>
+            <div className="text-[10px] text-gray-300 mt-0.5">{entry.performed_by}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}