[split-required] [guardrail-change] Enforce 500 LOC budget across all services

Install LOC guardrails (check-loc.sh, architecture.md, pre-commit hook)
and split all 44 files exceeding 500 LOC into domain-focused modules:

- consent-service (Go): models, handlers, services, database splits
- backend-core (Python): security_api, rbac_api, pdf_service, auth splits
- admin-core (TypeScript): 5 page.tsx + sidebar extractions
- pitch-deck (TypeScript): 6 slides, 3 UI components, engine.ts splits
- voice-service (Python): enhanced_task_orchestrator split

Result: 0 violations, 36 exempted (pipeline, tests, pure-data files).
Go build verified clean. No behavior changes — pure structural splits.

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

admin-core/app/(admin)/infrastructure/ci-cd/_components/DeploymentsTab.tsx

@@ -0,0 +1,154 @@
+'use client'
+
+import type { ContainerInfo, DockerStats } from '../types'
+
+export function DeploymentsTab({
+  dockerStats,
+  containerFilter,
+  setContainerFilter,
+  filteredContainers,
+  onContainerAction,
+  actionLoading,
+  onRefresh,
+}: {
+  dockerStats: DockerStats | null
+  containerFilter: 'all' | 'running' | 'stopped'
+  setContainerFilter: (filter: 'all' | 'running' | 'stopped') => void
+  filteredContainers: ContainerInfo[]
+  onContainerAction: (containerId: string, action: 'start' | 'stop' | 'restart') => void
+  actionLoading: string | null
+  onRefresh: () => void
+}) {
+  const getStateColor = (state: string) => {
+    switch (state) {
+      case 'running': return 'bg-green-100 text-green-800'
+      case 'exited':
+      case 'dead': return 'bg-red-100 text-red-800'
+      case 'paused': return 'bg-yellow-100 text-yellow-800'
+      case 'restarting': return 'bg-blue-100 text-blue-800'
+      default: return 'bg-slate-100 text-slate-600'
+    }
+  }
+
+  return (
+    <div className="space-y-6">
+      {/* Header */}
+      <div className="flex items-center justify-between">
+        <div>
+          <h3 className="text-lg font-semibold text-slate-800">Docker Container</h3>
+          {dockerStats && (
+            <p className="text-sm text-slate-600">
+              {dockerStats.running_containers} laufend, {dockerStats.stopped_containers} gestoppt, {dockerStats.total_containers} gesamt
+            </p>
+          )}
+        </div>
+        <div className="flex items-center gap-2">
+          <select
+            value={containerFilter}
+            onChange={(e) => setContainerFilter(e.target.value as typeof containerFilter)}
+            className="px-3 py-1.5 text-sm border border-slate-300 rounded-lg bg-white"
+          >
+            <option value="all">Alle</option>
+            <option value="running">Laufend</option>
+            <option value="stopped">Gestoppt</option>
+          </select>
+          <button
+            onClick={onRefresh}
+            className="px-3 py-1.5 text-sm border border-slate-300 text-slate-700 rounded-lg hover:bg-slate-50"
+          >
+            Aktualisieren
+          </button>
+        </div>
+      </div>
+
+      {/* Container List */}
+      {filteredContainers.length === 0 ? (
+        <div className="text-center py-8 text-slate-500">Keine Container gefunden</div>
+      ) : (
+        <div className="space-y-3">
+          {filteredContainers.map((container) => (
+            <div
+              key={container.id}
+              className={`border rounded-xl p-4 transition-colors ${
+                container.state === 'running'
+                  ? 'border-green-200 bg-green-50/30'
+                  : 'border-slate-200 bg-slate-50/50'
+              }`}
+            >
+              <div className="flex items-start justify-between gap-4">
+                <div className="flex-1 min-w-0">
+                  <div className="flex items-center gap-2 mb-1">
+                    <span className="font-semibold text-slate-900 truncate">{container.name}</span>
+                    <span className={`px-2 py-0.5 text-xs font-medium rounded-full ${getStateColor(container.state)}`}>
+                      {container.state}
+                    </span>
+                  </div>
+                  <div className="text-sm text-slate-500 mb-2">
+                    <span className="font-mono">{container.image}</span>
+                    {container.ports.length > 0 && (
+                      <span className="ml-2 text-slate-400">
+                        | {container.ports.slice(0, 2).join(', ')}
+                        {container.ports.length > 2 && ` +${container.ports.length - 2}`}
+                      </span>
+                    )}
+                  </div>
+
+                  {container.state === 'running' && (
+                    <div className="flex flex-wrap gap-4 text-sm">
+                      <div className="flex items-center gap-1">
+                        <span className="text-slate-500">CPU:</span>
+                        <span className={`font-medium ${container.cpu_percent > 80 ? 'text-red-600' : 'text-slate-700'}`}>
+                          {container.cpu_percent.toFixed(1)}%
+                        </span>
+                      </div>
+                      <div className="flex items-center gap-1">
+                        <span className="text-slate-500">RAM:</span>
+                        <span className={`font-medium ${container.memory_percent > 80 ? 'text-red-600' : 'text-slate-700'}`}>
+                          {container.memory_usage}
+                        </span>
+                        <span className="text-slate-400">({container.memory_percent.toFixed(1)}%)</span>
+                      </div>
+                      <div className="flex items-center gap-1">
+                        <span className="text-slate-500">Net:</span>
+                        <span className="text-slate-700">{container.network_rx} / {container.network_tx}</span>
+                      </div>
+                    </div>
+                  )}
+                </div>
+
+                <div className="flex items-center gap-2 flex-shrink-0">
+                  {container.state === 'running' ? (
+                    <>
+                      <button
+                        onClick={() => onContainerAction(container.id, 'restart')}
+                        disabled={actionLoading !== null}
+                        className="px-3 py-1.5 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 transition-colors"
+                      >
+                        {actionLoading === `${container.id}-restart` ? '...' : 'Restart'}
+                      </button>
+                      <button
+                        onClick={() => onContainerAction(container.id, 'stop')}
+                        disabled={actionLoading !== null}
+                        className="px-3 py-1.5 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50 transition-colors"
+                      >
+                        {actionLoading === `${container.id}-stop` ? '...' : 'Stop'}
+                      </button>
+                    </>
+                  ) : (
+                    <button
+                      onClick={() => onContainerAction(container.id, 'start')}
+                      disabled={actionLoading !== null}
+                      className="px-3 py-1.5 text-sm bg-green-600 text-white rounded-lg hover:bg-green-700 disabled:opacity-50 transition-colors"
+                    >
+                      {actionLoading === `${container.id}-start` ? '...' : 'Start'}
+                    </button>
+                  )}
+                </div>
+              </div>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/ci-cd/_components/OverviewTab.tsx

@@ -0,0 +1,168 @@
+'use client'
+
+import type { PipelineStatus, PipelineRun, SystemStats, DockerStats } from '../types'
+
+function ProgressBar({ percent, color = 'blue' }: { percent: number; color?: string }) {
+  const getColor = () => {
+    if (percent > 90) return 'bg-red-500'
+    if (percent > 70) return 'bg-yellow-500'
+    if (color === 'green') return 'bg-green-500'
+    if (color === 'purple') return 'bg-purple-500'
+    return 'bg-blue-500'
+  }
+
+  return (
+    <div className="w-full bg-slate-200 rounded-full h-2">
+      <div
+        className={`h-2 rounded-full transition-all duration-300 ${getColor()}`}
+        style={{ width: `${Math.min(percent, 100)}%` }}
+      />
+    </div>
+  )
+}
+
+export function OverviewTab({
+  pipelineStatus,
+  pipelineHistory,
+  systemStats,
+  dockerStats,
+}: {
+  pipelineStatus: PipelineStatus | null
+  pipelineHistory: PipelineRun[]
+  systemStats: SystemStats | null
+  dockerStats: DockerStats | null
+}) {
+  return (
+    <div className="space-y-6">
+      {/* Status Cards */}
+      <div className="grid grid-cols-1 md:grid-cols-4 gap-4">
+        <div className={`p-4 rounded-lg ${pipelineStatus?.gitea_connected ? 'bg-green-50' : 'bg-yellow-50'}`}>
+          <div className="flex items-center gap-2 mb-2">
+            <span className={`w-3 h-3 rounded-full ${pipelineStatus?.gitea_connected ? 'bg-green-500' : 'bg-yellow-500'}`}></span>
+            <span className="text-sm font-medium">Gitea Status</span>
+          </div>
+          <p className={`text-lg font-bold ${pipelineStatus?.gitea_connected ? 'text-green-700' : 'text-yellow-700'}`}>
+            {pipelineStatus?.gitea_connected ? 'Verbunden' : 'Nicht verbunden'}
+          </p>
+          <p className="text-xs text-slate-500">http://macmini:3003</p>
+        </div>
+
+        <div className="bg-blue-50 p-4 rounded-lg">
+          <div className="flex items-center gap-2 mb-2">
+            <svg className="w-4 h-4 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
+            </svg>
+            <span className="text-sm font-medium">Pipeline Runs</span>
+          </div>
+          <p className="text-lg font-bold text-blue-700">{pipelineStatus?.total_runs || 0}</p>
+          <p className="text-xs text-slate-500">{pipelineStatus?.successful_runs || 0} erfolgreich</p>
+        </div>
+
+        <div className="bg-purple-50 p-4 rounded-lg">
+          <div className="flex items-center gap-2 mb-2">
+            <svg className="w-4 h-4 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2" />
+            </svg>
+            <span className="text-sm font-medium">Container</span>
+          </div>
+          <p className="text-lg font-bold text-purple-700">{dockerStats?.running_containers || 0}</p>
+          <p className="text-xs text-slate-500">von {dockerStats?.total_containers || 0} laufend</p>
+        </div>
+
+        <div className="bg-slate-50 p-4 rounded-lg">
+          <div className="flex items-center gap-2 mb-2">
+            <svg className="w-4 h-4 text-slate-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+            <span className="text-sm font-medium">Letztes Update</span>
+          </div>
+          <p className="text-lg font-bold text-slate-700">
+            {pipelineStatus?.last_sbom_update ? new Date(pipelineStatus.last_sbom_update).toLocaleDateString('de-DE') : 'Nie'}
+          </p>
+          <p className="text-xs text-slate-500">
+            {pipelineStatus?.last_sbom_update ? new Date(pipelineStatus.last_sbom_update).toLocaleTimeString('de-DE') : '-'}
+          </p>
+        </div>
+      </div>
+
+      {/* System Resources */}
+      {systemStats && (
+        <div className="bg-slate-50 rounded-lg p-4">
+          <h3 className="font-medium text-slate-800 mb-4 flex items-center gap-2">
+            <svg className="w-5 h-5 text-slate-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
+            </svg>
+            Server Ressourcen ({systemStats.hostname})
+          </h3>
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+            <div className="bg-white rounded-lg p-3">
+              <div className="flex justify-between mb-2">
+                <span className="text-sm text-slate-600">CPU</span>
+                <span className={`font-bold ${systemStats.cpu.usage_percent > 80 ? 'text-red-600' : 'text-slate-900'}`}>
+                  {systemStats.cpu.usage_percent.toFixed(1)}%
+                </span>
+              </div>
+              <ProgressBar percent={systemStats.cpu.usage_percent} />
+            </div>
+            <div className="bg-white rounded-lg p-3">
+              <div className="flex justify-between mb-2">
+                <span className="text-sm text-slate-600">RAM</span>
+                <span className={`font-bold ${systemStats.memory.usage_percent > 80 ? 'text-red-600' : 'text-slate-900'}`}>
+                  {systemStats.memory.usage_percent.toFixed(1)}%
+                </span>
+              </div>
+              <ProgressBar percent={systemStats.memory.usage_percent} color="purple" />
+            </div>
+            <div className="bg-white rounded-lg p-3">
+              <div className="flex justify-between mb-2">
+                <span className="text-sm text-slate-600">Disk</span>
+                <span className={`font-bold ${systemStats.disk.usage_percent > 80 ? 'text-red-600' : 'text-slate-900'}`}>
+                  {systemStats.disk.usage_percent.toFixed(1)}%
+                </span>
+              </div>
+              <ProgressBar percent={systemStats.disk.usage_percent} color="green" />
+            </div>
+          </div>
+        </div>
+      )}
+
+      {/* Recent Pipeline Runs */}
+      {pipelineHistory.length > 0 && (
+        <div className="bg-slate-50 rounded-lg p-4">
+          <h3 className="font-medium text-slate-800 mb-3">Letzte Pipeline Runs</h3>
+          <div className="space-y-2">
+            {pipelineHistory.slice(0, 5).map((run) => (
+              <div key={run.id} className="flex items-center justify-between bg-white p-3 rounded-lg">
+                <div className="flex items-center gap-3">
+                  <span className={`w-2 h-2 rounded-full ${
+                    run.status === 'success' ? 'bg-green-500' :
+                    run.status === 'failed' ? 'bg-red-500' :
+                    run.status === 'running' ? 'bg-yellow-500 animate-pulse' : 'bg-slate-400'
+                  }`}></span>
+                  <div>
+                    <p className="text-sm font-medium text-slate-800">{run.workflow || 'SBOM Pipeline'}</p>
+                    <p className="text-xs text-slate-500">{run.branch} - {run.commit_sha.substring(0, 8)}</p>
+                  </div>
+                </div>
+                <div className="text-right">
+                  <p className={`text-sm font-medium ${
+                    run.status === 'success' ? 'text-green-600' :
+                    run.status === 'failed' ? 'text-red-600' :
+                    run.status === 'running' ? 'text-yellow-600' : 'text-slate-600'
+                  }`}>
+                    {run.status === 'success' ? 'Erfolgreich' :
+                     run.status === 'failed' ? 'Fehlgeschlagen' :
+                     run.status === 'running' ? 'Laeuft...' : run.status}
+                  </p>
+                  <p className="text-xs text-slate-500">
+                    {new Date(run.started_at).toLocaleString('de-DE')}
+                  </p>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/ci-cd/_components/PipelinesTab.tsx

@@ -0,0 +1,143 @@
+'use client'
+
+import type { PipelineRun } from '../types'
+
+export function PipelinesTab({
+  pipelineHistory,
+  triggeringPipeline,
+  onTriggerPipeline,
+}: {
+  pipelineHistory: PipelineRun[]
+  triggeringPipeline: boolean
+  onTriggerPipeline: () => void
+}) {
+  return (
+    <div className="space-y-6">
+      {/* Pipeline Controls */}
+      <div className="flex items-center justify-between">
+        <div>
+          <h3 className="text-lg font-semibold text-slate-800">Gitea Actions Pipelines</h3>
+          <p className="text-sm text-slate-600">Workflows werden bei Push auf main/develop automatisch ausgefuehrt</p>
+        </div>
+        <button
+          onClick={onTriggerPipeline}
+          disabled={triggeringPipeline}
+          className="px-4 py-2 bg-orange-600 text-white rounded-lg font-medium hover:bg-orange-700 disabled:opacity-50 transition-colors flex items-center gap-2"
+        >
+          {triggeringPipeline ? (
+            <>
+              <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white"></div>
+              Laeuft...
+            </>
+          ) : (
+            <>
+              <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+              </svg>
+              Pipeline starten
+            </>
+          )}
+        </button>
+      </div>
+
+      {/* Available Pipelines */}
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div className="bg-green-50 border border-green-200 rounded-lg p-4">
+          <div className="flex items-center gap-2 mb-2">
+            <span className="w-2 h-2 rounded-full bg-green-500"></span>
+            <span className="font-medium text-green-800">SBOM Pipeline</span>
+          </div>
+          <p className="text-sm text-green-700 mb-2">Generiert Software Bill of Materials</p>
+          <p className="text-xs text-green-600">5 Jobs: generate, scan, license, upload, summary</p>
+        </div>
+        <div className="bg-slate-50 border border-slate-200 rounded-lg p-4 opacity-60">
+          <div className="flex items-center gap-2 mb-2">
+            <span className="w-2 h-2 rounded-full bg-slate-400"></span>
+            <span className="font-medium text-slate-600">Test Pipeline</span>
+          </div>
+          <p className="text-sm text-slate-500 mb-2">Unit & Integration Tests</p>
+          <p className="text-xs text-slate-400">Geplant</p>
+        </div>
+        <div className="bg-slate-50 border border-slate-200 rounded-lg p-4 opacity-60">
+          <div className="flex items-center gap-2 mb-2">
+            <span className="w-2 h-2 rounded-full bg-slate-400"></span>
+            <span className="font-medium text-slate-600">Security Pipeline</span>
+          </div>
+          <p className="text-sm text-slate-500 mb-2">SAST, SCA, Secrets Scan</p>
+          <p className="text-xs text-slate-400">Geplant</p>
+        </div>
+      </div>
+
+      {/* Pipeline History */}
+      <div className="bg-slate-50 rounded-lg p-4">
+        <h4 className="font-medium text-slate-800 mb-4">Pipeline Historie</h4>
+        {pipelineHistory.length === 0 ? (
+          <div className="text-center py-8 text-slate-500">
+            Keine Pipeline-Runs vorhanden. Starten Sie die erste Pipeline!
+          </div>
+        ) : (
+          <div className="overflow-x-auto">
+            <table className="w-full">
+              <thead>
+                <tr className="border-b border-slate-200">
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Status</th>
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Workflow</th>
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Branch</th>
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Commit</th>
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Gestartet</th>
+                  <th className="text-left py-2 px-3 text-xs font-semibold text-slate-500 uppercase">Dauer</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y divide-slate-100">
+                {pipelineHistory.map((run) => (
+                  <tr key={run.id} className="hover:bg-white">
+                    <td className="py-2 px-3">
+                      <span className={`inline-flex items-center gap-1 px-2 py-1 rounded-full text-xs font-medium ${
+                        run.status === 'success' ? 'bg-green-100 text-green-800' :
+                        run.status === 'failed' ? 'bg-red-100 text-red-800' :
+                        run.status === 'running' ? 'bg-yellow-100 text-yellow-800' : 'bg-slate-100 text-slate-600'
+                      }`}>
+                        <span className={`w-1.5 h-1.5 rounded-full ${
+                          run.status === 'success' ? 'bg-green-500' :
+                          run.status === 'failed' ? 'bg-red-500' :
+                          run.status === 'running' ? 'bg-yellow-500 animate-pulse' : 'bg-slate-400'
+                        }`}></span>
+                        {run.status}
+                      </span>
+                    </td>
+                    <td className="py-2 px-3 text-sm text-slate-900">{run.workflow || 'SBOM Pipeline'}</td>
+                    <td className="py-2 px-3 text-sm text-slate-600">{run.branch}</td>
+                    <td className="py-2 px-3 text-sm font-mono text-slate-500">{run.commit_sha.substring(0, 8)}</td>
+                    <td className="py-2 px-3 text-sm text-slate-500">{new Date(run.started_at).toLocaleString('de-DE')}</td>
+                    <td className="py-2 px-3 text-sm text-slate-500">
+                      {run.duration_seconds ? `${run.duration_seconds}s` : '-'}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        )}
+      </div>
+
+      {/* Pipeline Architecture */}
+      <div className="bg-slate-50 rounded-lg p-4">
+        <h4 className="font-medium text-slate-800 mb-3">SBOM Pipeline Architektur</h4>
+        <pre className="bg-slate-800 text-slate-100 p-4 rounded-lg overflow-x-auto text-sm">
+{`Gitea Actions Pipeline (.gitea/workflows/sbom.yaml)
+     │
+     ├── 1. generate-sbom     → Syft generiert CycloneDX SBOM
+     │
+     ├── 2. vulnerability-scan → Grype scannt auf CVEs
+     │
+     ├── 3. license-check     → Prueft GPL/AGPL Lizenzen
+     │
+     ├── 4. upload-dashboard  → POST /api/v1/security/sbom/upload
+     │
+     └── 5. summary           → Job Summary generieren`}
+        </pre>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/ci-cd/_components/SchedulerTab.tsx

@@ -0,0 +1,187 @@
+'use client'
+
+export function SchedulerTab() {
+  return (
+    <div className="space-y-6">
+      {/* Status Overview */}
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div className="rounded-xl border p-5 bg-emerald-100 border-emerald-200 text-emerald-700">
+          <div className="flex items-start gap-4">
+            <div className="flex-shrink-0">
+              <svg className="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
+              </svg>
+            </div>
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <h4 className="font-semibold">launchd Job</h4>
+                <span className="w-2 h-2 rounded-full bg-emerald-500" />
+              </div>
+              <p className="text-sm mt-1 opacity-80">Taeglich um 07:00 Uhr automatisch</p>
+            </div>
+          </div>
+        </div>
+        <div className="rounded-xl border p-5 bg-emerald-100 border-emerald-200 text-emerald-700">
+          <div className="flex items-start gap-4">
+            <div className="flex-shrink-0">
+              <svg className="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
+              </svg>
+            </div>
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <h4 className="font-semibold">Git Hook</h4>
+                <span className="w-2 h-2 rounded-full bg-emerald-500" />
+              </div>
+              <p className="text-sm mt-1 opacity-80">Quick Tests bei voice-service Aenderungen</p>
+            </div>
+          </div>
+        </div>
+        <div className="rounded-xl border p-5 bg-emerald-100 border-emerald-200 text-emerald-700">
+          <div className="flex items-start gap-4">
+            <div className="flex-shrink-0">
+              <svg className="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
+              </svg>
+            </div>
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <h4 className="font-semibold">Benachrichtigungen</h4>
+                <span className="w-2 h-2 rounded-full bg-emerald-500" />
+              </div>
+              <p className="text-sm mt-1 opacity-80">Desktop-Alerts bei Fehlern aktiviert</p>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {/* Quick Actions */}
+      <div className="bg-slate-50 rounded-lg p-4">
+        <h3 className="font-medium text-slate-800 mb-4">Quick Actions (BQAS)</h3>
+        <div className="flex flex-wrap gap-3">
+          <a href="/ai/test-quality" className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 flex items-center gap-2">
+            <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+            Test Dashboard oeffnen
+          </a>
+          <span className="text-sm text-slate-500 self-center">Starte Tests direkt im BQAS Dashboard</span>
+        </div>
+      </div>
+
+      {/* GitHub Actions vs Local - Comparison */}
+      <div className="bg-slate-50 rounded-lg p-4">
+        <h3 className="font-medium text-slate-800 mb-4">GitHub Actions Alternative</h3>
+        <p className="text-slate-600 mb-4">
+          Der lokale BQAS Scheduler ersetzt GitHub Actions und bietet DSGVO-konforme, vollstaendig lokale Test-Ausfuehrung.
+        </p>
+        <div className="overflow-x-auto">
+          <table className="w-full text-sm">
+            <thead>
+              <tr className="border-b border-slate-200 bg-white">
+                <th className="text-left py-3 px-4 font-medium text-slate-700">Feature</th>
+                <th className="text-center py-3 px-4 font-medium text-slate-700">GitHub Actions</th>
+                <th className="text-center py-3 px-4 font-medium text-slate-700">Lokaler Scheduler</th>
+              </tr>
+            </thead>
+            <tbody>
+              {[
+                { feature: 'Taegliche Tests (07:00)', gh: 'schedule: cron', local: 'macOS launchd', localColor: 'bg-emerald-100 text-emerald-700' },
+                { feature: 'Push-basierte Tests', gh: 'on: push', local: 'Git post-commit Hook', localColor: 'bg-emerald-100 text-emerald-700' },
+                { feature: 'PR-basierte Tests', gh: 'on: pull_request', ghColor: 'bg-emerald-100 text-emerald-700', local: 'Nicht moeglich', localColor: 'bg-amber-100 text-amber-700' },
+                { feature: 'DSGVO-Konformitaet', gh: 'Daten bei GitHub (US)', ghColor: 'bg-amber-100 text-amber-700', local: '100% lokal', localColor: 'bg-emerald-100 text-emerald-700' },
+                { feature: 'Offline-Faehig', gh: 'Nein', ghColor: 'bg-red-100 text-red-700', local: 'Ja', localColor: 'bg-emerald-100 text-emerald-700' },
+              ].map((row) => (
+                <tr key={row.feature} className="border-b border-slate-100">
+                  <td className="py-3 px-4 text-slate-600">{row.feature}</td>
+                  <td className="py-3 px-4 text-center">
+                    <span className={`${row.ghColor ? `px-2 py-1 rounded text-xs font-medium ${row.ghColor}` : 'text-slate-600'}`}>{row.gh}</span>
+                  </td>
+                  <td className="py-3 px-4 text-center">
+                    <span className={`px-2 py-1 rounded text-xs font-medium ${row.localColor}`}>{row.local}</span>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      </div>
+
+      {/* Configuration Details */}
+      <div className="bg-slate-50 rounded-lg p-4">
+        <h3 className="font-medium text-slate-800 mb-4">Konfiguration</h3>
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+          <div>
+            <h4 className="font-medium text-slate-700 mb-3">launchd Job</h4>
+            <div className="bg-slate-900 rounded-lg p-4 font-mono text-sm text-slate-100 overflow-x-auto">
+              <pre>{`# ~/Library/LaunchAgents/com.breakpilot.bqas.plist
+Label: com.breakpilot.bqas
+Schedule: 07:00 taeglich
+Script: /voice-service/scripts/run_bqas.sh
+Logs: /var/log/bqas/`}</pre>
+            </div>
+          </div>
+          <div>
+            <h4 className="font-medium text-slate-700 mb-3">Umgebungsvariablen</h4>
+            <div className="space-y-2 text-sm">
+              <div className="flex justify-between p-2 bg-white rounded">
+                <span className="font-mono text-slate-600">BQAS_SERVICE_URL</span>
+                <span className="text-slate-900">http://localhost:8091</span>
+              </div>
+              <div className="flex justify-between p-2 bg-white rounded">
+                <span className="font-mono text-slate-600">BQAS_REGRESSION_THRESHOLD</span>
+                <span className="text-slate-900">0.1</span>
+              </div>
+              <div className="flex justify-between p-2 bg-white rounded">
+                <span className="font-mono text-slate-600">BQAS_NOTIFY_DESKTOP</span>
+                <span className="text-emerald-600 font-medium">true</span>
+              </div>
+              <div className="flex justify-between p-2 bg-white rounded">
+                <span className="font-mono text-slate-600">BQAS_NOTIFY_SLACK</span>
+                <span className="text-slate-400">false</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      {/* Detailed Explanation */}
+      <div className="bg-gradient-to-r from-blue-50 to-indigo-50 rounded-xl border border-blue-200 p-6">
+        <h3 className="text-lg font-semibold text-slate-900 mb-4 flex items-center gap-2">
+          <svg className="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+          Detaillierte Erklaerung
+        </h3>
+        <div className="prose prose-sm max-w-none text-slate-700">
+          <h4 className="text-base font-semibold mt-4 mb-2">Warum ein lokaler Scheduler?</h4>
+          <p className="mb-4">
+            Der lokale BQAS Scheduler wurde entwickelt, um die gleiche Funktionalitaet wie GitHub Actions zu bieten,
+            aber mit dem entscheidenden Vorteil, dass <strong>alle Daten zu 100% auf dem lokalen Mac Mini verbleiben</strong>.
+            Dies ist besonders wichtig fuer DSGVO-Konformitaet, da keine Schuelerdaten oder Testergebnisse an externe Server uebertragen werden.
+          </p>
+          <h4 className="text-base font-semibold mt-4 mb-2">Komponenten</h4>
+          <ul className="list-disc list-inside space-y-2 mb-4">
+            <li><strong>run_bqas.sh</strong> - Hauptscript das pytest ausfuehrt, Regression-Checks macht und Benachrichtigungen versendet</li>
+            <li><strong>launchd Job</strong> - macOS-nativer Scheduler der das Script taeglich um 07:00 Uhr startet</li>
+            <li><strong>Git Hook</strong> - post-commit Hook der bei Aenderungen im voice-service automatisch Quick-Tests startet</li>
+            <li><strong>Notifier</strong> - Python-Modul das Desktop-, Slack- und E-Mail-Benachrichtigungen versendet</li>
+          </ul>
+          <h4 className="text-base font-semibold mt-4 mb-2">Installation</h4>
+          <div className="bg-slate-900 rounded-lg p-3 font-mono text-sm text-slate-100 mb-4">
+            <code>./voice-service/scripts/install_bqas_scheduler.sh install</code>
+          </div>
+          <h4 className="text-base font-semibold mt-4 mb-2">Vorteile gegenueber GitHub Actions</h4>
+          <ul className="list-disc list-inside space-y-1">
+            <li>100% DSGVO-konform - alle Daten bleiben lokal</li>
+            <li>Keine Internet-Abhaengigkeit - funktioniert auch offline</li>
+            <li>Keine GitHub-Kosten fuer private Repositories</li>
+            <li>Schnellere Ausfuehrung ohne Cloud-Overhead</li>
+            <li>Volle Kontrolle ueber Scheduling und Benachrichtigungen</li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/ci-cd/_components/SetupTab.tsx

@@ -0,0 +1,152 @@
+'use client'
+
+import type { PipelineStatus } from '../types'
+
+export function SetupTab({ pipelineStatus }: { pipelineStatus: PipelineStatus | null }) {
+  return (
+    <div className="space-y-6">
+      <div>
+        <h3 className="text-lg font-semibold text-slate-800 mb-2">Erstkonfiguration - Gitea CI/CD</h3>
+        <p className="text-slate-600">
+          Anleitung zur Einrichtung der CI/CD Pipeline mit Gitea Actions auf dem Mac Mini Server.
+        </p>
+      </div>
+
+      {/* Gitea Server Info */}
+      <div className="bg-blue-50 p-4 rounded-lg">
+        <h4 className="font-medium text-blue-800 mb-3 flex items-center gap-2">
+          <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2" />
+          </svg>
+          Gitea Server
+        </h4>
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div className="bg-white p-3 rounded-lg">
+            <p className="text-sm text-slate-500">Web-URL</p>
+            <p className="font-mono text-blue-700">http://macmini:3003</p>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <p className="text-sm text-slate-500">SSH</p>
+            <p className="font-mono text-blue-700">macmini:2222</p>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <p className="text-sm text-slate-500">Status</p>
+            <p className={`font-medium ${pipelineStatus?.gitea_connected ? 'text-green-600' : 'text-yellow-600'}`}>
+              {pipelineStatus?.gitea_connected ? 'Verbunden' : 'Konfiguration erforderlich'}
+            </p>
+          </div>
+        </div>
+      </div>
+
+      {/* Implementierte Komponenten */}
+      <div className="bg-slate-50 p-4 rounded-lg">
+        <h4 className="font-medium text-slate-800 mb-3">Implementierte Komponenten</h4>
+        <div className="overflow-x-auto">
+          <table className="min-w-full text-sm">
+            <thead>
+              <tr className="border-b border-slate-200">
+                <th className="text-left py-2 px-3 font-medium text-slate-600">Komponente</th>
+                <th className="text-left py-2 px-3 font-medium text-slate-600">Pfad</th>
+                <th className="text-left py-2 px-3 font-medium text-slate-600">Beschreibung</th>
+              </tr>
+            </thead>
+            <tbody className="divide-y divide-slate-100">
+              <tr>
+                <td className="py-2 px-3 font-medium">Gitea Service</td>
+                <td className="py-2 px-3"><code className="bg-slate-200 px-1 rounded text-xs">docker-compose.yml</code></td>
+                <td className="py-2 px-3 text-slate-600">Gitea 1.22 mit Actions enabled</td>
+              </tr>
+              <tr>
+                <td className="py-2 px-3 font-medium">Gitea Runner</td>
+                <td className="py-2 px-3"><code className="bg-slate-200 px-1 rounded text-xs">docker-compose.yml</code></td>
+                <td className="py-2 px-3 text-slate-600">act_runner fuer Job-Ausfuehrung</td>
+              </tr>
+              <tr>
+                <td className="py-2 px-3 font-medium">SBOM Workflow</td>
+                <td className="py-2 px-3"><code className="bg-slate-200 px-1 rounded text-xs">.gitea/workflows/sbom.yaml</code></td>
+                <td className="py-2 px-3 text-slate-600">5 Jobs: generate, scan, license, upload, summary</td>
+              </tr>
+              <tr>
+                <td className="py-2 px-3 font-medium">Backend API</td>
+                <td className="py-2 px-3"><code className="bg-slate-200 px-1 rounded text-xs">backend/security_api.py</code></td>
+                <td className="py-2 px-3 text-slate-600">SBOM Upload, Pipeline Status, History</td>
+              </tr>
+              <tr>
+                <td className="py-2 px-3 font-medium">Runner Config</td>
+                <td className="py-2 px-3"><code className="bg-slate-200 px-1 rounded text-xs">gitea/runner-config.yaml</code></td>
+                <td className="py-2 px-3 text-slate-600">Labels: ubuntu-latest, self-hosted</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+
+      {/* Setup Steps */}
+      <div className="bg-orange-50 p-4 rounded-lg">
+        <h4 className="font-medium text-orange-800 mb-3 flex items-center gap-2">
+          <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" />
+          </svg>
+          Setup-Schritte
+        </h4>
+        <div className="space-y-3">
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">1. Gitea oeffnen</h5>
+            <code className="text-sm bg-slate-100 px-2 py-1 rounded">http://macmini:3003</code>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">2. Admin-Account erstellen</h5>
+            <p className="text-sm text-slate-600">Username: admin, Email: admin@breakpilot.de</p>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">3. Repository erstellen</h5>
+            <p className="text-sm text-slate-600">Name: breakpilot-pwa, Visibility: Private</p>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">4. Actions aktivieren</h5>
+            <p className="text-sm text-slate-600">Repository Settings → Actions → Enable Repository Actions</p>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">5. Runner Token erstellen & starten</h5>
+            <pre className="text-xs bg-slate-100 p-2 rounded mt-1 overflow-x-auto">
+{`export GITEA_RUNNER_TOKEN=<token>
+docker compose up -d gitea-runner`}
+            </pre>
+          </div>
+          <div className="bg-white p-3 rounded-lg">
+            <h5 className="font-medium text-slate-800 mb-1">6. Repository pushen</h5>
+            <pre className="text-xs bg-slate-100 p-2 rounded mt-1 overflow-x-auto">
+{`git remote add gitea http://macmini:3003/admin/breakpilot-pwa.git
+git push gitea main`}
+            </pre>
+          </div>
+        </div>
+      </div>
+
+      {/* Quick Links */}
+      <div className="bg-purple-50 p-4 rounded-lg">
+        <h4 className="font-medium text-purple-800 mb-3">Quick Links</h4>
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <a href="http://macmini:3003" target="_blank" rel="noopener noreferrer" className="flex items-center justify-between bg-white p-3 rounded-lg hover:bg-purple-100 transition-colors">
+            <div>
+              <p className="font-medium text-purple-800">Gitea</p>
+              <p className="text-xs text-slate-500">Git Server & CI/CD</p>
+            </div>
+            <svg className="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+            </svg>
+          </a>
+          <a href="http://macmini:3003/admin/breakpilot-pwa/actions" target="_blank" rel="noopener noreferrer" className="flex items-center justify-between bg-white p-3 rounded-lg hover:bg-purple-100 transition-colors">
+            <div>
+              <p className="font-medium text-purple-800">Pipeline Actions</p>
+              <p className="text-xs text-slate-500">Workflow Runs</p>
+            </div>
+            <svg className="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+            </svg>
+          </a>
+        </div>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/ci-cd/types.ts

@@ -0,0 +1,72 @@
+/**
+ * Types for CI/CD Dashboard
+ */
+
+export interface PipelineStatus {
+  gitea_connected: boolean
+  gitea_url: string
+  last_sbom_update: string | null
+  total_runs: number
+  successful_runs: number
+  failed_runs: number
+}
+
+export interface PipelineRun {
+  id: string
+  workflow: string
+  branch: string
+  commit_sha: string
+  status: 'success' | 'failed' | 'running' | 'pending'
+  started_at: string
+  finished_at: string | null
+  duration_seconds: number | null
+}
+
+export interface ContainerInfo {
+  id: string
+  name: string
+  image: string
+  status: string
+  state: string
+  created: string
+  ports: string[]
+  cpu_percent: number
+  memory_usage: string
+  memory_limit: string
+  memory_percent: number
+  network_rx: string
+  network_tx: string
+}
+
+export interface SystemStats {
+  hostname: string
+  platform: string
+  arch: string
+  uptime: number
+  cpu: {
+    model: string
+    cores: number
+    usage_percent: number
+  }
+  memory: {
+    total: string
+    used: string
+    free: string
+    usage_percent: number
+  }
+  disk: {
+    total: string
+    used: string
+    free: string
+    usage_percent: number
+  }
+}
+
+export interface DockerStats {
+  containers: ContainerInfo[]
+  total_containers: number
+  running_containers: number
+  stopped_containers: number
+}
+
+export type TabType = 'overview' | 'pipelines' | 'deployments' | 'setup' | 'scheduler'

admin-core/app/(admin)/infrastructure/middleware/_components/ConfigTab.tsx

@@ -0,0 +1,61 @@
+import type { MiddlewareConfig } from '../types'
+import { getMiddlewareDescription } from './helpers'
+
+interface ConfigTabProps {
+  configs: MiddlewareConfig[]
+  actionLoading: string | null
+  onToggle: (name: string, enabled: boolean) => void
+}
+
+export function ConfigTab({ configs, actionLoading, onToggle }: ConfigTabProps) {
+  return (
+    <div className="space-y-4">
+      {configs.map(config => {
+        const info = getMiddlewareDescription(config.middleware_name)
+        return (
+          <div key={config.id} className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+            <div className="flex justify-between items-start mb-4">
+              <div>
+                <h3 className="font-semibold text-slate-900 flex items-center gap-2">
+                  <span>{info.icon}</span>
+                  <span className="capitalize">{config.middleware_name.replace('_', ' ')}</span>
+                </h3>
+                <p className="text-sm text-slate-600">{info.desc}</p>
+              </div>
+              <div className="flex items-center gap-3">
+                <span
+                  className={`px-3 py-1 rounded-full text-xs font-semibold ${
+                    config.enabled ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
+                  }`}
+                >
+                  {config.enabled ? 'Aktiviert' : 'Deaktiviert'}
+                </span>
+                <button
+                  onClick={() => onToggle(config.middleware_name, !config.enabled)}
+                  disabled={actionLoading === config.middleware_name}
+                  className="px-4 py-1.5 text-sm border border-slate-300 rounded-lg hover:bg-slate-100 disabled:opacity-50 transition-colors"
+                >
+                  {actionLoading === config.middleware_name
+                    ? '...'
+                    : config.enabled
+                    ? 'Deaktivieren'
+                    : 'Aktivieren'}
+                </button>
+              </div>
+            </div>
+            {Object.keys(config.config).length > 0 && (
+              <div className="mt-3 pt-3 border-t border-slate-200">
+                <div className="text-xs font-semibold text-slate-500 uppercase mb-2">
+                  Konfiguration
+                </div>
+                <pre className="text-xs bg-white p-3 rounded border border-slate-200 overflow-x-auto">
+                  {JSON.stringify(config.config, null, 2)}
+                </pre>
+              </div>
+            )}
+          </div>
+        )
+      })}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/EventsTab.tsx

@@ -0,0 +1,69 @@
+import type { MiddlewareEvent } from '../types'
+import { getEventTypeColor } from './helpers'
+
+interface EventsTabProps {
+  events: MiddlewareEvent[]
+}
+
+export function EventsTab({ events }: EventsTabProps) {
+  return (
+    <div className="overflow-x-auto">
+      <table className="w-full">
+        <thead>
+          <tr className="border-b border-slate-200">
+            <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+              Zeit
+            </th>
+            <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+              Middleware
+            </th>
+            <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+              Event
+            </th>
+            <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+              IP
+            </th>
+            <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+              Pfad
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          {events.length === 0 ? (
+            <tr>
+              <td colSpan={5} className="text-center py-8 text-slate-500">
+                Keine Events vorhanden.
+              </td>
+            </tr>
+          ) : (
+            events.map(event => (
+              <tr key={event.id} className="border-b border-slate-100 hover:bg-slate-50">
+                <td className="py-3 px-4 text-sm text-slate-500">
+                  {new Date(event.created_at).toLocaleString('de-DE')}
+                </td>
+                <td className="py-3 px-4 text-sm capitalize">
+                  {event.middleware_name.replace('_', ' ')}
+                </td>
+                <td className="py-3 px-4">
+                  <span
+                    className={`px-2 py-1 rounded text-xs font-semibold ${getEventTypeColor(event.event_type)}`}
+                  >
+                    {event.event_type}
+                  </span>
+                </td>
+                <td className="py-3 px-4 text-sm font-mono text-slate-600">
+                  {event.ip_address || '-'}
+                </td>
+                <td className="py-3 px-4 text-sm text-slate-600 max-w-xs truncate">
+                  {event.request_method && event.request_path
+                    ? `${event.request_method} ${event.request_path}`
+                    : '-'}
+                </td>
+              </tr>
+            ))
+          )}
+        </tbody>
+      </table>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/IpListTab.tsx

@@ -0,0 +1,131 @@
+import type { RateLimitIP } from '../types'
+
+interface IpListTabProps {
+  ipList: RateLimitIP[]
+  actionLoading: string | null
+  newIP: string
+  newIPType: 'whitelist' | 'blacklist'
+  newIPReason: string
+  onNewIPChange: (value: string) => void
+  onNewIPTypeChange: (value: 'whitelist' | 'blacklist') => void
+  onNewIPReasonChange: (value: string) => void
+  onAddIP: (e: React.FormEvent) => void
+  onRemoveIP: (id: string) => void
+}
+
+export function IpListTab({
+  ipList,
+  actionLoading,
+  newIP,
+  newIPType,
+  newIPReason,
+  onNewIPChange,
+  onNewIPTypeChange,
+  onNewIPReasonChange,
+  onAddIP,
+  onRemoveIP,
+}: IpListTabProps) {
+  return (
+    <div>
+      {/* Add IP Form */}
+      <form onSubmit={onAddIP} className="mb-6 p-4 bg-slate-50 rounded-lg border border-slate-200">
+        <h3 className="font-semibold text-slate-900 mb-4">IP hinzufuegen</h3>
+        <div className="flex flex-wrap gap-3">
+          <input
+            type="text"
+            value={newIP}
+            onChange={e => onNewIPChange(e.target.value)}
+            placeholder="IP-Adresse (z.B. 192.168.1.1)"
+            className="flex-1 min-w-[200px] px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
+          />
+          <select
+            value={newIPType}
+            onChange={e => onNewIPTypeChange(e.target.value as 'whitelist' | 'blacklist')}
+            className="px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
+          >
+            <option value="whitelist">Whitelist</option>
+            <option value="blacklist">Blacklist</option>
+          </select>
+          <input
+            type="text"
+            value={newIPReason}
+            onChange={e => onNewIPReasonChange(e.target.value)}
+            placeholder="Grund (optional)"
+            className="flex-1 min-w-[150px] px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
+          />
+          <button
+            type="submit"
+            disabled={!newIP.trim() || actionLoading === 'add-ip'}
+            className="px-6 py-2 bg-orange-600 text-white rounded-lg font-medium hover:bg-orange-700 disabled:opacity-50 transition-colors"
+          >
+            {actionLoading === 'add-ip' ? 'Hinzufuegen...' : 'Hinzufuegen'}
+          </button>
+        </div>
+      </form>
+
+      {/* IP List Table */}
+      <div className="overflow-x-auto">
+        <table className="w-full">
+          <thead>
+            <tr className="border-b border-slate-200">
+              <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+                IP-Adresse
+              </th>
+              <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+                Typ
+              </th>
+              <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+                Grund
+              </th>
+              <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+                Hinzugefuegt
+              </th>
+              <th className="text-right py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
+                Aktion
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {ipList.length === 0 ? (
+              <tr>
+                <td colSpan={5} className="text-center py-8 text-slate-500">
+                  Keine IP-Eintraege vorhanden.
+                </td>
+              </tr>
+            ) : (
+              ipList.map(ip => (
+                <tr key={ip.id} className="border-b border-slate-100 hover:bg-slate-50">
+                  <td className="py-3 px-4 font-mono text-sm">{ip.ip_address}</td>
+                  <td className="py-3 px-4">
+                    <span
+                      className={`px-2 py-1 rounded text-xs font-semibold ${
+                        ip.list_type === 'whitelist'
+                          ? 'bg-green-100 text-green-800'
+                          : 'bg-red-100 text-red-800'
+                      }`}
+                    >
+                      {ip.list_type === 'whitelist' ? 'Whitelist' : 'Blacklist'}
+                    </span>
+                  </td>
+                  <td className="py-3 px-4 text-sm text-slate-600">{ip.reason || '-'}</td>
+                  <td className="py-3 px-4 text-sm text-slate-500">
+                    {new Date(ip.created_at).toLocaleString('de-DE')}
+                  </td>
+                  <td className="py-3 px-4 text-right">
+                    <button
+                      onClick={() => onRemoveIP(ip.id)}
+                      disabled={actionLoading === `remove-${ip.id}`}
+                      className="px-3 py-1 text-sm text-red-600 hover:bg-red-50 rounded transition-colors disabled:opacity-50"
+                    >
+                      {actionLoading === `remove-${ip.id}` ? '...' : 'Entfernen'}
+                    </button>
+                  </td>
+                </tr>
+              ))
+            )}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/OverviewTab.tsx

@@ -0,0 +1,58 @@
+import type { MiddlewareConfig } from '../types'
+import { getMiddlewareDescription } from './helpers'
+
+interface OverviewTabProps {
+  configs: MiddlewareConfig[]
+  actionLoading: string | null
+  onToggle: (name: string, enabled: boolean) => void
+}
+
+export function OverviewTab({ configs, actionLoading, onToggle }: OverviewTabProps) {
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+      {configs.map(config => {
+        const info = getMiddlewareDescription(config.middleware_name)
+        return (
+          <div
+            key={config.id}
+            className={`rounded-lg p-4 border ${
+              config.enabled
+                ? 'bg-green-50 border-green-200'
+                : 'bg-slate-50 border-slate-200'
+            }`}
+          >
+            <div className="flex justify-between items-start mb-2">
+              <div className="flex items-center gap-2">
+                <span className="text-xl">{info.icon}</span>
+                <span className="font-semibold text-slate-900 capitalize">
+                  {config.middleware_name.replace('_', ' ')}
+                </span>
+              </div>
+              <button
+                onClick={() => onToggle(config.middleware_name, !config.enabled)}
+                disabled={actionLoading === config.middleware_name}
+                className={`px-3 py-1 rounded-full text-xs font-semibold transition-colors ${
+                  config.enabled
+                    ? 'bg-green-200 text-green-800 hover:bg-green-300'
+                    : 'bg-slate-200 text-slate-600 hover:bg-slate-300'
+                }`}
+              >
+                {actionLoading === config.middleware_name
+                  ? '...'
+                  : config.enabled
+                  ? 'Aktiv'
+                  : 'Inaktiv'}
+              </button>
+            </div>
+            <p className="text-sm text-slate-600">{info.desc}</p>
+            {config.updated_at && (
+              <div className="mt-2 text-xs text-slate-400">
+                Aktualisiert: {new Date(config.updated_at).toLocaleString('de-DE')}
+              </div>
+            )}
+          </div>
+        )
+      })}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/StatsTab.tsx

@@ -0,0 +1,66 @@
+import type { MiddlewareStats } from '../types'
+import { getMiddlewareDescription, getEventTypeColor } from './helpers'
+
+interface StatsTabProps {
+  stats: MiddlewareStats[]
+}
+
+export function StatsTab({ stats }: StatsTabProps) {
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+      {stats.map(stat => {
+        const info = getMiddlewareDescription(stat.middleware_name)
+        return (
+          <div key={stat.middleware_name} className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+            <h3 className="font-semibold text-slate-900 flex items-center gap-2 mb-4">
+              <span>{info.icon}</span>
+              <span className="capitalize">{stat.middleware_name.replace('_', ' ')}</span>
+            </h3>
+            <div className="grid grid-cols-3 gap-4 mb-4">
+              <div>
+                <div className="text-2xl font-bold text-slate-900">{stat.total_events}</div>
+                <div className="text-xs text-slate-500">Gesamt</div>
+              </div>
+              <div>
+                <div className="text-2xl font-bold text-blue-600">{stat.events_last_hour}</div>
+                <div className="text-xs text-slate-500">Letzte Stunde</div>
+              </div>
+              <div>
+                <div className="text-2xl font-bold text-orange-600">{stat.events_last_24h}</div>
+                <div className="text-xs text-slate-500">24 Stunden</div>
+              </div>
+            </div>
+            {stat.top_event_types.length > 0 && (
+              <div className="mb-3">
+                <div className="text-xs font-semibold text-slate-500 uppercase mb-2">
+                  Top Event-Typen
+                </div>
+                <div className="flex flex-wrap gap-2">
+                  {stat.top_event_types.slice(0, 3).map(et => (
+                    <span
+                      key={et.event_type}
+                      className={`px-2 py-1 rounded text-xs ${getEventTypeColor(et.event_type)}`}
+                    >
+                      {et.event_type} ({et.count})
+                    </span>
+                  ))}
+                </div>
+              </div>
+            )}
+            {stat.top_ips.length > 0 && (
+              <div>
+                <div className="text-xs font-semibold text-slate-500 uppercase mb-2">Top IPs</div>
+                <div className="text-xs text-slate-600">
+                  {stat.top_ips
+                    .slice(0, 3)
+                    .map(ip => `${ip.ip_address} (${ip.count})`)
+                    .join(', ')}
+                </div>
+              </div>
+            )}
+          </div>
+        )
+      })}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/StatusOverview.tsx

@@ -0,0 +1,51 @@
+interface StatusOverviewProps {
+  configCount: number
+  whitelistCount: number
+  blacklistCount: number
+  eventCount: number
+  loading: boolean
+  onRefresh: () => void
+}
+
+export function StatusOverview({
+  configCount,
+  whitelistCount,
+  blacklistCount,
+  eventCount,
+  loading,
+  onRefresh,
+}: StatusOverviewProps) {
+  return (
+    <div className="bg-white rounded-xl border border-slate-200 p-6 mb-6">
+      <div className="flex justify-between items-center mb-6">
+        <h2 className="text-xl font-semibold text-slate-900">Middleware Status</h2>
+        <button
+          onClick={onRefresh}
+          disabled={loading}
+          className="px-4 py-2 text-sm bg-orange-600 text-white rounded-lg hover:bg-orange-700 disabled:opacity-50 transition-colors"
+        >
+          {loading ? 'Laden...' : 'Aktualisieren'}
+        </button>
+      </div>
+
+      <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+        <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+          <div className="text-2xl font-bold text-slate-900">{configCount}</div>
+          <div className="text-sm text-slate-600">Middleware</div>
+        </div>
+        <div className="bg-green-50 rounded-lg p-4 border border-green-200">
+          <div className="text-2xl font-bold text-green-600">{whitelistCount}</div>
+          <div className="text-sm text-slate-600">Whitelist IPs</div>
+        </div>
+        <div className="bg-red-50 rounded-lg p-4 border border-red-200">
+          <div className="text-2xl font-bold text-red-600">{blacklistCount}</div>
+          <div className="text-sm text-slate-600">Blacklist IPs</div>
+        </div>
+        <div className="bg-blue-50 rounded-lg p-4 border border-blue-200">
+          <div className="text-2xl font-bold text-blue-600">{eventCount}</div>
+          <div className="text-sm text-slate-600">Recent Events</div>
+        </div>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/middleware/_components/helpers.ts

@@ -0,0 +1,24 @@
+export function getMiddlewareDescription(name: string): { icon: string; desc: string } {
+  const descriptions: Record<string, { icon: string; desc: string }> = {
+    request_id: { icon: '🆔', desc: 'Generiert eindeutige Request-IDs fuer Tracing' },
+    security_headers: { icon: '🛡️', desc: 'Fuegt Security-Header hinzu (CSP, HSTS, etc.)' },
+    cors: { icon: '🌐', desc: 'Cross-Origin Resource Sharing Konfiguration' },
+    rate_limiter: { icon: '⏱️', desc: 'Rate Limiting zum Schutz vor Missbrauch' },
+    pii_redactor: { icon: '🔒', desc: 'Redaktiert personenbezogene Daten in Logs' },
+    input_gate: { icon: '🚪', desc: 'Validiert und sanitisiert Eingaben' },
+  }
+  return descriptions[name] || { icon: '⚙️', desc: 'Middleware-Komponente' }
+}
+
+export function getEventTypeColor(eventType: string) {
+  if (eventType.includes('error') || eventType.includes('blocked') || eventType.includes('blacklist')) {
+    return 'bg-red-100 text-red-800'
+  }
+  if (eventType.includes('warning') || eventType.includes('rate_limit')) {
+    return 'bg-yellow-100 text-yellow-800'
+  }
+  if (eventType.includes('success') || eventType.includes('whitelist')) {
+    return 'bg-green-100 text-green-800'
+  }
+  return 'bg-slate-100 text-slate-800'
+}

admin-core/app/(admin)/infrastructure/middleware/page.tsx

@@ -9,44 +9,13 @@
 
 import { useEffect, useState, useCallback } from 'react'
 import { PagePurpose } from '@/components/common/PagePurpose'
-
-interface MiddlewareConfig {
-  id: string
-  middleware_name: string
-  enabled: boolean
-  config: Record<string, unknown>
-  updated_at: string | null
-}
-
-interface RateLimitIP {
-  id: string
-  ip_address: string
-  list_type: 'whitelist' | 'blacklist'
-  reason: string | null
-  expires_at: string | null
-  created_at: string
-}
-
-interface MiddlewareEvent {
-  id: string
-  middleware_name: string
-  event_type: string
-  ip_address: string | null
-  user_id: string | null
-  request_path: string | null
-  request_method: string | null
-  details: Record<string, unknown> | null
-  created_at: string
-}
-
-interface MiddlewareStats {
-  middleware_name: string
-  total_events: number
-  events_last_hour: number
-  events_last_24h: number
-  top_event_types: Array<{ event_type: string; count: number }>
-  top_ips: Array<{ ip_address: string; count: number }>
-}
+import type { MiddlewareConfig, RateLimitIP, MiddlewareEvent, MiddlewareStats } from './types'
+import { StatusOverview } from './_components/StatusOverview'
+import { OverviewTab } from './_components/OverviewTab'
+import { ConfigTab } from './_components/ConfigTab'
+import { IpListTab } from './_components/IpListTab'
+import { EventsTab } from './_components/EventsTab'
+import { StatsTab } from './_components/StatsTab'
 
 export default function MiddlewareAdminPage() {
   const [configs, setConfigs] = useState<MiddlewareConfig[]>([])
@@ -184,31 +153,6 @@ export default function MiddlewareAdminPage() {
     }
   }
 
-  const getMiddlewareDescription = (name: string): { icon: string; desc: string } => {
-    const descriptions: Record<string, { icon: string; desc: string }> = {
-      request_id: { icon: '🆔', desc: 'Generiert eindeutige Request-IDs fuer Tracing' },
-      security_headers: { icon: '🛡️', desc: 'Fuegt Security-Header hinzu (CSP, HSTS, etc.)' },
-      cors: { icon: '🌐', desc: 'Cross-Origin Resource Sharing Konfiguration' },
-      rate_limiter: { icon: '⏱️', desc: 'Rate Limiting zum Schutz vor Missbrauch' },
-      pii_redactor: { icon: '🔒', desc: 'Redaktiert personenbezogene Daten in Logs' },
-      input_gate: { icon: '🚪', desc: 'Validiert und sanitisiert Eingaben' },
-    }
-    return descriptions[name] || { icon: '⚙️', desc: 'Middleware-Komponente' }
-  }
-
-  const getEventTypeColor = (eventType: string) => {
-    if (eventType.includes('error') || eventType.includes('blocked') || eventType.includes('blacklist')) {
-      return 'bg-red-100 text-red-800'
-    }
-    if (eventType.includes('warning') || eventType.includes('rate_limit')) {
-      return 'bg-yellow-100 text-yellow-800'
-    }
-    if (eventType.includes('success') || eventType.includes('whitelist')) {
-      return 'bg-green-100 text-green-800'
-    }
-    return 'bg-slate-100 text-slate-800'
-  }
-
   const whitelistCount = ipList.filter(ip => ip.list_type === 'whitelist').length
   const blacklistCount = ipList.filter(ip => ip.list_type === 'blacklist').length
 
@@ -232,38 +176,14 @@ export default function MiddlewareAdminPage() {
         defaultCollapsed={true}
       />
 
-      {/* Stats Overview */}
-      <div className="bg-white rounded-xl border border-slate-200 p-6 mb-6">
-        <div className="flex justify-between items-center mb-6">
-          <h2 className="text-xl font-semibold text-slate-900">Middleware Status</h2>
-          <button
-            onClick={fetchData}
-            disabled={loading}
-            className="px-4 py-2 text-sm bg-orange-600 text-white rounded-lg hover:bg-orange-700 disabled:opacity-50 transition-colors"
-          >
-            {loading ? 'Laden...' : 'Aktualisieren'}
-          </button>
-        </div>
-
-        <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
-          <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
-            <div className="text-2xl font-bold text-slate-900">{configs.length}</div>
-            <div className="text-sm text-slate-600">Middleware</div>
-          </div>
-          <div className="bg-green-50 rounded-lg p-4 border border-green-200">
-            <div className="text-2xl font-bold text-green-600">{whitelistCount}</div>
-            <div className="text-sm text-slate-600">Whitelist IPs</div>
-          </div>
-          <div className="bg-red-50 rounded-lg p-4 border border-red-200">
-            <div className="text-2xl font-bold text-red-600">{blacklistCount}</div>
-            <div className="text-sm text-slate-600">Blacklist IPs</div>
-          </div>
-          <div className="bg-blue-50 rounded-lg p-4 border border-blue-200">
-            <div className="text-2xl font-bold text-blue-600">{events.length}</div>
-            <div className="text-sm text-slate-600">Recent Events</div>
-          </div>
-        </div>
-      </div>
+      <StatusOverview
+        configCount={configs.length}
+        whitelistCount={whitelistCount}
+        blacklistCount={blacklistCount}
+        eventCount={events.length}
+        loading={loading}
+        onRefresh={fetchData}
+      />
 
       {/* Tabs */}
       <div className="bg-white rounded-xl border border-slate-200 overflow-hidden mb-6">
@@ -298,332 +218,28 @@ export default function MiddlewareAdminPage() {
             </div>
           ) : (
             <>
-              {/* Overview Tab */}
               {activeTab === 'overview' && (
-                <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-                  {configs.map(config => {
-                    const info = getMiddlewareDescription(config.middleware_name)
-                    return (
-                      <div
-                        key={config.id}
-                        className={`rounded-lg p-4 border ${
-                          config.enabled
-                            ? 'bg-green-50 border-green-200'
-                            : 'bg-slate-50 border-slate-200'
-                        }`}
-                      >
-                        <div className="flex justify-between items-start mb-2">
-                          <div className="flex items-center gap-2">
-                            <span className="text-xl">{info.icon}</span>
-                            <span className="font-semibold text-slate-900 capitalize">
-                              {config.middleware_name.replace('_', ' ')}
-                            </span>
-                          </div>
-                          <button
-                            onClick={() => toggleMiddleware(config.middleware_name, !config.enabled)}
-                            disabled={actionLoading === config.middleware_name}
-                            className={`px-3 py-1 rounded-full text-xs font-semibold transition-colors ${
-                              config.enabled
-                                ? 'bg-green-200 text-green-800 hover:bg-green-300'
-                                : 'bg-slate-200 text-slate-600 hover:bg-slate-300'
-                            }`}
-                          >
-                            {actionLoading === config.middleware_name
-                              ? '...'
-                              : config.enabled
-                              ? 'Aktiv'
-                              : 'Inaktiv'}
-                          </button>
-                        </div>
-                        <p className="text-sm text-slate-600">{info.desc}</p>
-                        {config.updated_at && (
-                          <div className="mt-2 text-xs text-slate-400">
-                            Aktualisiert: {new Date(config.updated_at).toLocaleString('de-DE')}
-                          </div>
-                        )}
-                      </div>
-                    )
-                  })}
-                </div>
+                <OverviewTab configs={configs} actionLoading={actionLoading} onToggle={toggleMiddleware} />
               )}
-
-              {/* Config Tab */}
               {activeTab === 'config' && (
-                <div className="space-y-4">
-                  {configs.map(config => {
-                    const info = getMiddlewareDescription(config.middleware_name)
-                    return (
-                      <div key={config.id} className="bg-slate-50 rounded-lg p-4 border border-slate-200">
-                        <div className="flex justify-between items-start mb-4">
-                          <div>
-                            <h3 className="font-semibold text-slate-900 flex items-center gap-2">
-                              <span>{info.icon}</span>
-                              <span className="capitalize">{config.middleware_name.replace('_', ' ')}</span>
-                            </h3>
-                            <p className="text-sm text-slate-600">{info.desc}</p>
-                          </div>
-                          <div className="flex items-center gap-3">
-                            <span
-                              className={`px-3 py-1 rounded-full text-xs font-semibold ${
-                                config.enabled ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-                              }`}
-                            >
-                              {config.enabled ? 'Aktiviert' : 'Deaktiviert'}
-                            </span>
-                            <button
-                              onClick={() => toggleMiddleware(config.middleware_name, !config.enabled)}
-                              disabled={actionLoading === config.middleware_name}
-                              className="px-4 py-1.5 text-sm border border-slate-300 rounded-lg hover:bg-slate-100 disabled:opacity-50 transition-colors"
-                            >
-                              {actionLoading === config.middleware_name
-                                ? '...'
-                                : config.enabled
-                                ? 'Deaktivieren'
-                                : 'Aktivieren'}
-                            </button>
-                          </div>
-                        </div>
-                        {Object.keys(config.config).length > 0 && (
-                          <div className="mt-3 pt-3 border-t border-slate-200">
-                            <div className="text-xs font-semibold text-slate-500 uppercase mb-2">
-                              Konfiguration
-                            </div>
-                            <pre className="text-xs bg-white p-3 rounded border border-slate-200 overflow-x-auto">
-                              {JSON.stringify(config.config, null, 2)}
-                            </pre>
-                          </div>
-                        )}
-                      </div>
-                    )
-                  })}
-                </div>
+                <ConfigTab configs={configs} actionLoading={actionLoading} onToggle={toggleMiddleware} />
               )}
-
-              {/* IP List Tab */}
               {activeTab === 'ip-list' && (
-                <div>
-                  {/* Add IP Form */}
-                  <form onSubmit={addIP} className="mb-6 p-4 bg-slate-50 rounded-lg border border-slate-200">
-                    <h3 className="font-semibold text-slate-900 mb-4">IP hinzufuegen</h3>
-                    <div className="flex flex-wrap gap-3">
-                      <input
-                        type="text"
-                        value={newIP}
-                        onChange={e => setNewIP(e.target.value)}
-                        placeholder="IP-Adresse (z.B. 192.168.1.1)"
-                        className="flex-1 min-w-[200px] px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
-                      />
-                      <select
-                        value={newIPType}
-                        onChange={e => setNewIPType(e.target.value as 'whitelist' | 'blacklist')}
-                        className="px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
-                      >
-                        <option value="whitelist">Whitelist</option>
-                        <option value="blacklist">Blacklist</option>
-                      </select>
-                      <input
-                        type="text"
-                        value={newIPReason}
-                        onChange={e => setNewIPReason(e.target.value)}
-                        placeholder="Grund (optional)"
-                        className="flex-1 min-w-[150px] px-4 py-2 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500"
-                      />
-                      <button
-                        type="submit"
-                        disabled={!newIP.trim() || actionLoading === 'add-ip'}
-                        className="px-6 py-2 bg-orange-600 text-white rounded-lg font-medium hover:bg-orange-700 disabled:opacity-50 transition-colors"
-                      >
-                        {actionLoading === 'add-ip' ? 'Hinzufuegen...' : 'Hinzufuegen'}
-                      </button>
-                    </div>
-                  </form>
-
-                  {/* IP List Table */}
-                  <div className="overflow-x-auto">
-                    <table className="w-full">
-                      <thead>
-                        <tr className="border-b border-slate-200">
-                          <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                            IP-Adresse
-                          </th>
-                          <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                            Typ
-                          </th>
-                          <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                            Grund
-                          </th>
-                          <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                            Hinzugefuegt
-                          </th>
-                          <th className="text-right py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                            Aktion
-                          </th>
-                        </tr>
-                      </thead>
-                      <tbody>
-                        {ipList.length === 0 ? (
-                          <tr>
-                            <td colSpan={5} className="text-center py-8 text-slate-500">
-                              Keine IP-Eintraege vorhanden.
-                            </td>
-                          </tr>
-                        ) : (
-                          ipList.map(ip => (
-                            <tr key={ip.id} className="border-b border-slate-100 hover:bg-slate-50">
-                              <td className="py-3 px-4 font-mono text-sm">{ip.ip_address}</td>
-                              <td className="py-3 px-4">
-                                <span
-                                  className={`px-2 py-1 rounded text-xs font-semibold ${
-                                    ip.list_type === 'whitelist'
-                                      ? 'bg-green-100 text-green-800'
-                                      : 'bg-red-100 text-red-800'
-                                  }`}
-                                >
-                                  {ip.list_type === 'whitelist' ? 'Whitelist' : 'Blacklist'}
-                                </span>
-                              </td>
-                              <td className="py-3 px-4 text-sm text-slate-600">{ip.reason || '-'}</td>
-                              <td className="py-3 px-4 text-sm text-slate-500">
-                                {new Date(ip.created_at).toLocaleString('de-DE')}
-                              </td>
-                              <td className="py-3 px-4 text-right">
-                                <button
-                                  onClick={() => removeIP(ip.id)}
-                                  disabled={actionLoading === `remove-${ip.id}`}
-                                  className="px-3 py-1 text-sm text-red-600 hover:bg-red-50 rounded transition-colors disabled:opacity-50"
-                                >
-                                  {actionLoading === `remove-${ip.id}` ? '...' : 'Entfernen'}
-                                </button>
-                              </td>
-                            </tr>
-                          ))
-                        )}
-                      </tbody>
-                    </table>
-                  </div>
-                </div>
-              )}
-
-              {/* Events Tab */}
-              {activeTab === 'events' && (
-                <div className="overflow-x-auto">
-                  <table className="w-full">
-                    <thead>
-                      <tr className="border-b border-slate-200">
-                        <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                          Zeit
-                        </th>
-                        <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                          Middleware
-                        </th>
-                        <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                          Event
-                        </th>
-                        <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                          IP
-                        </th>
-                        <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">
-                          Pfad
-                        </th>
-                      </tr>
-                    </thead>
-                    <tbody>
-                      {events.length === 0 ? (
-                        <tr>
-                          <td colSpan={5} className="text-center py-8 text-slate-500">
-                            Keine Events vorhanden.
-                          </td>
-                        </tr>
-                      ) : (
-                        events.map(event => (
-                          <tr key={event.id} className="border-b border-slate-100 hover:bg-slate-50">
-                            <td className="py-3 px-4 text-sm text-slate-500">
-                              {new Date(event.created_at).toLocaleString('de-DE')}
-                            </td>
-                            <td className="py-3 px-4 text-sm capitalize">
-                              {event.middleware_name.replace('_', ' ')}
-                            </td>
-                            <td className="py-3 px-4">
-                              <span
-                                className={`px-2 py-1 rounded text-xs font-semibold ${getEventTypeColor(event.event_type)}`}
-                              >
-                                {event.event_type}
-                              </span>
-                            </td>
-                            <td className="py-3 px-4 text-sm font-mono text-slate-600">
-                              {event.ip_address || '-'}
-                            </td>
-                            <td className="py-3 px-4 text-sm text-slate-600 max-w-xs truncate">
-                              {event.request_method && event.request_path
-                                ? `${event.request_method} ${event.request_path}`
-                                : '-'}
-                            </td>
-                          </tr>
-                        ))
-                      )}
-                    </tbody>
-                  </table>
-                </div>
-              )}
-
-              {/* Stats Tab */}
-              {activeTab === 'stats' && (
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-                  {stats.map(stat => {
-                    const info = getMiddlewareDescription(stat.middleware_name)
-                    return (
-                      <div key={stat.middleware_name} className="bg-slate-50 rounded-lg p-4 border border-slate-200">
-                        <h3 className="font-semibold text-slate-900 flex items-center gap-2 mb-4">
-                          <span>{info.icon}</span>
-                          <span className="capitalize">{stat.middleware_name.replace('_', ' ')}</span>
-                        </h3>
-                        <div className="grid grid-cols-3 gap-4 mb-4">
-                          <div>
-                            <div className="text-2xl font-bold text-slate-900">{stat.total_events}</div>
-                            <div className="text-xs text-slate-500">Gesamt</div>
-                          </div>
-                          <div>
-                            <div className="text-2xl font-bold text-blue-600">{stat.events_last_hour}</div>
-                            <div className="text-xs text-slate-500">Letzte Stunde</div>
-                          </div>
-                          <div>
-                            <div className="text-2xl font-bold text-orange-600">{stat.events_last_24h}</div>
-                            <div className="text-xs text-slate-500">24 Stunden</div>
-                          </div>
-                        </div>
-                        {stat.top_event_types.length > 0 && (
-                          <div className="mb-3">
-                            <div className="text-xs font-semibold text-slate-500 uppercase mb-2">
-                              Top Event-Typen
-                            </div>
-                            <div className="flex flex-wrap gap-2">
-                              {stat.top_event_types.slice(0, 3).map(et => (
-                                <span
-                                  key={et.event_type}
-                                  className={`px-2 py-1 rounded text-xs ${getEventTypeColor(et.event_type)}`}
-                                >
-                                  {et.event_type} ({et.count})
-                                </span>
-                              ))}
-                            </div>
-                          </div>
-                        )}
-                        {stat.top_ips.length > 0 && (
-                          <div>
-                            <div className="text-xs font-semibold text-slate-500 uppercase mb-2">Top IPs</div>
-                            <div className="text-xs text-slate-600">
-                              {stat.top_ips
-                                .slice(0, 3)
-                                .map(ip => `${ip.ip_address} (${ip.count})`)
-                                .join(', ')}
-                            </div>
-                          </div>
-                        )}
-                      </div>
-                    )
-                  })}
-                </div>
+                <IpListTab
+                  ipList={ipList}
+                  actionLoading={actionLoading}
+                  newIP={newIP}
+                  newIPType={newIPType}
+                  newIPReason={newIPReason}
+                  onNewIPChange={setNewIP}
+                  onNewIPTypeChange={setNewIPType}
+                  onNewIPReasonChange={setNewIPReason}
+                  onAddIP={addIP}
+                  onRemoveIP={removeIP}
+                />
               )}
+              {activeTab === 'events' && <EventsTab events={events} />}
+              {activeTab === 'stats' && <StatsTab stats={stats} />}
             </>
           )}
         </div>

admin-core/app/(admin)/infrastructure/middleware/types.ts

@@ -0,0 +1,37 @@
+export interface MiddlewareConfig {
+  id: string
+  middleware_name: string
+  enabled: boolean
+  config: Record<string, unknown>
+  updated_at: string | null
+}
+
+export interface RateLimitIP {
+  id: string
+  ip_address: string
+  list_type: 'whitelist' | 'blacklist'
+  reason: string | null
+  expires_at: string | null
+  created_at: string
+}
+
+export interface MiddlewareEvent {
+  id: string
+  middleware_name: string
+  event_type: string
+  ip_address: string | null
+  user_id: string | null
+  request_path: string | null
+  request_method: string | null
+  details: Record<string, unknown> | null
+  created_at: string
+}
+
+export interface MiddlewareStats {
+  middleware_name: string
+  total_events: number
+  events_last_hour: number
+  events_last_24h: number
+  top_event_types: Array<{ event_type: string; count: number }>
+  top_ips: Array<{ ip_address: string; count: number }>
+}

admin-core/app/(admin)/infrastructure/sbom/_components/sbom-data-libs.ts

@@ -0,0 +1,46 @@
+import type { Component } from '../types'
+
+export const GO_MODULES: Component[] = [
+  { type: 'library', name: 'gin-gonic/gin', version: '1.9+', category: 'go', description: 'Web Framework', license: 'MIT', sourceUrl: 'https://github.com/gin-gonic/gin' },
+  { type: 'library', name: 'gorm.io/gorm', version: '1.25+', category: 'go', description: 'ORM', license: 'MIT', sourceUrl: 'https://github.com/go-gorm/gorm' },
+  { type: 'library', name: 'golang-jwt/jwt', version: 'v5', category: 'go', description: 'JWT Library', license: 'MIT', sourceUrl: 'https://github.com/golang-jwt/jwt' },
+  { type: 'library', name: 'stripe/stripe-go', version: 'v76', category: 'go', description: 'Stripe SDK', license: 'MIT', sourceUrl: 'https://github.com/stripe/stripe-go' },
+  { type: 'library', name: 'spf13/viper', version: 'latest', category: 'go', description: 'Configuration', license: 'MIT', sourceUrl: 'https://github.com/spf13/viper' },
+  { type: 'library', name: 'uber-go/zap', version: 'latest', category: 'go', description: 'Structured Logging', license: 'MIT', sourceUrl: 'https://github.com/uber-go/zap' },
+  { type: 'library', name: 'swaggo/swag', version: 'latest', category: 'go', description: 'Swagger Docs', license: 'MIT', sourceUrl: 'https://github.com/swaggo/swag' },
+]
+
+export const NODE_PACKAGES: Component[] = [
+  { type: 'library', name: 'Next.js', version: '15.1', category: 'nodejs', description: 'React Framework', license: 'MIT', sourceUrl: 'https://github.com/vercel/next.js' },
+  { type: 'library', name: 'React', version: '19', category: 'nodejs', description: 'UI Library', license: 'MIT', sourceUrl: 'https://github.com/facebook/react' },
+  { type: 'library', name: 'Vue.js', version: '3.4', category: 'nodejs', description: 'UI Framework (Creator Studio)', license: 'MIT', sourceUrl: 'https://github.com/vuejs/core' },
+  { type: 'library', name: 'Angular', version: '17', category: 'nodejs', description: 'UI Framework (Policy Vault)', license: 'MIT', sourceUrl: 'https://github.com/angular/angular' },
+  { type: 'library', name: 'NestJS', version: '10', category: 'nodejs', description: 'Node.js Framework', license: 'MIT', sourceUrl: 'https://github.com/nestjs/nest' },
+  { type: 'library', name: 'TypeScript', version: '5.x', category: 'nodejs', description: 'Type System', license: 'Apache-2.0', sourceUrl: 'https://github.com/microsoft/TypeScript' },
+  { type: 'library', name: 'Tailwind CSS', version: '3.4', category: 'nodejs', description: 'Utility CSS', license: 'MIT', sourceUrl: 'https://github.com/tailwindlabs/tailwindcss' },
+  { type: 'library', name: 'Prisma', version: '5.x', category: 'nodejs', description: 'ORM (Policy Vault)', license: 'Apache-2.0', sourceUrl: 'https://github.com/prisma/prisma' },
+  { type: 'library', name: 'Material Design Icons', version: 'latest', category: 'nodejs', description: 'Icon-System (Companion UI, Studio)', license: 'Apache-2.0', sourceUrl: 'https://github.com/google/material-design-icons' },
+  { type: 'library', name: 'Recharts', version: '2.12', category: 'nodejs', description: 'React Charts (Compliance Dashboard)', license: 'MIT', sourceUrl: 'https://github.com/recharts/recharts' },
+  { type: 'library', name: 'React Flow', version: '11.x', category: 'nodejs', description: 'Node-basierte Flow-Diagramme (Screen Flow)', license: 'MIT', sourceUrl: 'https://github.com/xyflow/xyflow' },
+  { type: 'library', name: 'Playwright', version: '1.50', category: 'nodejs', description: 'E2E Testing Framework (SDK Tests)', license: 'Apache-2.0', sourceUrl: 'https://github.com/microsoft/playwright' },
+  { type: 'library', name: 'Vitest', version: '4.x', category: 'nodejs', description: 'Unit Testing Framework', license: 'MIT', sourceUrl: 'https://github.com/vitest-dev/vitest' },
+  { type: 'library', name: 'jsPDF', version: '4.x', category: 'nodejs', description: 'PDF Generation (SDK Export)', license: 'MIT', sourceUrl: 'https://github.com/parallax/jsPDF' },
+  { type: 'library', name: 'JSZip', version: '3.x', category: 'nodejs', description: 'ZIP File Creation (SDK Export)', license: 'MIT/GPL-3.0', sourceUrl: 'https://github.com/Stuk/jszip' },
+  { type: 'library', name: 'Lucide React', version: '0.468', category: 'nodejs', description: 'Icon Library', license: 'ISC', sourceUrl: 'https://github.com/lucide-icons/lucide' },
+]
+
+export const UNITY_PACKAGES: Component[] = [
+  { type: 'library', name: 'Unity Engine', version: '6000.0 (Unity 6)', category: 'unity', description: 'Game Engine', license: 'Unity EULA', sourceUrl: 'https://unity.com' },
+  { type: 'library', name: 'Universal Render Pipeline (URP)', version: '17.x', category: 'unity', description: 'Render Pipeline', license: 'Unity Companion', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.render-pipelines.universal@17.0' },
+  { type: 'library', name: 'TextMeshPro', version: '3.2', category: 'unity', description: 'Advanced Text Rendering', license: 'Unity Companion', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.textmeshpro@3.2' },
+  { type: 'library', name: 'Unity Mathematics', version: '1.3', category: 'unity', description: 'Math Library (SIMD)', license: 'Unity Companion', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.mathematics@1.3' },
+  { type: 'library', name: 'Newtonsoft.Json (Unity)', version: '3.2', category: 'unity', description: 'JSON Serialization', license: 'MIT', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.nuget.newtonsoft-json@3.2' },
+  { type: 'library', name: 'Unity UI', version: '2.0', category: 'unity', description: 'UI System', license: 'Unity Companion', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.ugui@2.0' },
+  { type: 'library', name: 'Unity Input System', version: '1.8', category: 'unity', description: 'New Input System', license: 'Unity Companion', sourceUrl: 'https://docs.unity3d.com/Packages/com.unity.inputsystem@1.8' },
+]
+
+export const CSHARP_PACKAGES: Component[] = [
+  { type: 'library', name: '.NET Standard', version: '2.1', category: 'csharp', description: 'Runtime', license: 'MIT', sourceUrl: 'https://github.com/dotnet/standard' },
+  { type: 'library', name: 'UnityWebRequest', version: 'built-in', category: 'csharp', description: 'HTTP Client', license: 'Unity Companion', sourceUrl: '-' },
+  { type: 'library', name: 'System.Text.Json', version: 'built-in', category: 'csharp', description: 'JSON Parsing', license: 'MIT', sourceUrl: 'https://github.com/dotnet/runtime' },
+]

admin-core/app/(admin)/infrastructure/sbom/_components/sbom-data-python.ts

@@ -0,0 +1,52 @@
+import type { Component } from '../types'
+
+export const PYTHON_PACKAGES: Component[] = [
+  { type: 'library', name: 'FastAPI', version: '0.109+', category: 'python', description: 'Web Framework', license: 'MIT', sourceUrl: 'https://github.com/tiangolo/fastapi' },
+  { type: 'library', name: 'Uvicorn', version: '0.38+', category: 'python', description: 'ASGI Server', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/encode/uvicorn' },
+  { type: 'library', name: 'Starlette', version: '0.49+', category: 'python', description: 'ASGI Framework (FastAPI Basis)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/encode/starlette' },
+  { type: 'library', name: 'Pydantic', version: '2.x', category: 'python', description: 'Data Validation', license: 'MIT', sourceUrl: 'https://github.com/pydantic/pydantic' },
+  { type: 'library', name: 'SQLAlchemy', version: '2.x', category: 'python', description: 'ORM', license: 'MIT', sourceUrl: 'https://github.com/sqlalchemy/sqlalchemy' },
+  { type: 'library', name: 'Alembic', version: '1.14+', category: 'python', description: 'DB Migrations (Classroom, Feedback Tables)', license: 'MIT', sourceUrl: 'https://github.com/sqlalchemy/alembic' },
+  { type: 'library', name: 'psycopg2-binary', version: '2.9+', category: 'python', description: 'PostgreSQL Driver', license: 'LGPL-3.0', sourceUrl: 'https://github.com/psycopg/psycopg2' },
+  { type: 'library', name: 'httpx', version: 'latest', category: 'python', description: 'Async HTTP Client', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/encode/httpx' },
+  { type: 'library', name: 'PyJWT', version: 'latest', category: 'python', description: 'JWT Handling', license: 'MIT', sourceUrl: 'https://github.com/jpadilla/pyjwt' },
+  { type: 'library', name: 'hvac', version: 'latest', category: 'python', description: 'Vault Client', license: 'Apache-2.0', sourceUrl: 'https://github.com/hvac/hvac' },
+  { type: 'library', name: 'python-multipart', version: 'latest', category: 'python', description: 'File Uploads', license: 'Apache-2.0', sourceUrl: 'https://github.com/andrew-d/python-multipart' },
+  { type: 'library', name: 'aiofiles', version: 'latest', category: 'python', description: 'Async File I/O', license: 'Apache-2.0', sourceUrl: 'https://github.com/Tinche/aiofiles' },
+  { type: 'library', name: 'openai', version: 'latest', category: 'python', description: 'OpenAI SDK', license: 'MIT', sourceUrl: 'https://github.com/openai/openai-python' },
+  { type: 'library', name: 'anthropic', version: 'latest', category: 'python', description: 'Anthropic Claude SDK', license: 'MIT', sourceUrl: 'https://github.com/anthropics/anthropic-sdk-python' },
+  { type: 'library', name: 'langchain', version: 'latest', category: 'python', description: 'LLM Framework', license: 'MIT', sourceUrl: 'https://github.com/langchain-ai/langchain' },
+  { type: 'library', name: 'aioimaplib', version: 'latest', category: 'python', description: 'Async IMAP Client (Unified Inbox)', license: 'MIT', sourceUrl: 'https://github.com/bamthomas/aioimaplib' },
+  { type: 'library', name: 'aiosmtplib', version: 'latest', category: 'python', description: 'Async SMTP Client (Mail Sending)', license: 'MIT', sourceUrl: 'https://github.com/cole/aiosmtplib' },
+  { type: 'library', name: 'email-validator', version: 'latest', category: 'python', description: 'Email Validation', license: 'CC0-1.0', sourceUrl: 'https://github.com/JoshData/python-email-validator' },
+  { type: 'library', name: 'cryptography', version: 'latest', category: 'python', description: 'Encryption (Mail Credentials)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/pyca/cryptography' },
+  { type: 'library', name: 'asyncpg', version: 'latest', category: 'python', description: 'Async PostgreSQL Driver', license: 'Apache-2.0', sourceUrl: 'https://github.com/MagicStack/asyncpg' },
+  { type: 'library', name: 'python-dateutil', version: 'latest', category: 'python', description: 'Date Parsing (Deadline Extraction)', license: 'Apache-2.0', sourceUrl: 'https://github.com/dateutil/dateutil' },
+  { type: 'library', name: 'faster-whisper', version: '1.0+', category: 'python', description: 'CTranslate2 Whisper (GPU-optimiert)', license: 'MIT', sourceUrl: 'https://github.com/SYSTRAN/faster-whisper' },
+  { type: 'library', name: 'pyannote.audio', version: '3.x', category: 'python', description: 'Speaker Diarization', license: 'MIT', sourceUrl: 'https://github.com/pyannote/pyannote-audio' },
+  { type: 'library', name: 'rq', version: '1.x', category: 'python', description: 'Redis Queue (Task Processing)', license: 'BSD-2-Clause', sourceUrl: 'https://github.com/rq/rq' },
+  { type: 'library', name: 'ffmpeg-python', version: '0.2+', category: 'python', description: 'FFmpeg Python Bindings', license: 'Apache-2.0', sourceUrl: 'https://github.com/kkroening/ffmpeg-python' },
+  { type: 'library', name: 'webvtt-py', version: '0.4+', category: 'python', description: 'WebVTT Subtitle Export', license: 'MIT', sourceUrl: 'https://github.com/glut23/webvtt-py' },
+  { type: 'library', name: 'minio', version: '7.x', category: 'python', description: 'MinIO S3 Client', license: 'Apache-2.0', sourceUrl: 'https://github.com/minio/minio-py' },
+  { type: 'library', name: 'structlog', version: '24.x', category: 'python', description: 'Structured Logging', license: 'Apache-2.0', sourceUrl: 'https://github.com/hynek/structlog' },
+  { type: 'library', name: 'feedparser', version: '6.x', category: 'python', description: 'RSS/Atom Feed Parser (Alerts Agent)', license: 'BSD-2-Clause', sourceUrl: 'https://github.com/kurtmckee/feedparser' },
+  { type: 'library', name: 'APScheduler', version: '3.x', category: 'python', description: 'AsyncIO Job Scheduler (Alerts Agent)', license: 'MIT', sourceUrl: 'https://github.com/agronholm/apscheduler' },
+  { type: 'library', name: 'beautifulsoup4', version: '4.x', category: 'python', description: 'HTML Parser (Email Parsing, Compliance Scraper)', license: 'MIT', sourceUrl: 'https://code.launchpad.net/beautifulsoup' },
+  { type: 'library', name: 'lxml', version: '5.x', category: 'python', description: 'XML/HTML Parser (EUR-Lex Scraping)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/lxml/lxml' },
+  { type: 'library', name: 'PyMuPDF', version: '1.24+', category: 'python', description: 'PDF Parser (BSI-TR Extraction)', license: 'AGPL-3.0', sourceUrl: 'https://github.com/pymupdf/PyMuPDF' },
+  { type: 'library', name: 'pdfplumber', version: '0.11+', category: 'python', description: 'PDF Table Extraction (Compliance Docs)', license: 'MIT', sourceUrl: 'https://github.com/jsvine/pdfplumber' },
+  { type: 'library', name: 'websockets', version: '14.x', category: 'python', description: 'WebSocket Support (Voice Streaming)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/python-websockets/websockets' },
+  { type: 'library', name: 'soundfile', version: '0.13+', category: 'python', description: 'Audio File Processing (Voice Service)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/bastibe/python-soundfile' },
+  { type: 'library', name: 'scipy', version: '1.14+', category: 'python', description: 'Signal Processing (Audio)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/scipy/scipy' },
+  { type: 'library', name: 'redis', version: '5.x', category: 'python', description: 'Valkey/Redis Client (Voice Sessions)', license: 'MIT', sourceUrl: 'https://github.com/redis/redis-py' },
+  { type: 'library', name: 'pydantic-settings', version: '2.x', category: 'python', description: 'Settings Management (Voice Config)', license: 'MIT', sourceUrl: 'https://github.com/pydantic/pydantic-settings' },
+  { type: 'library', name: 'pyspellchecker', version: '0.8.1+', category: 'python', description: 'Regel-basierte OCR-Korrektur (klausur-service Schritt 6)', license: 'MIT', sourceUrl: 'https://github.com/barrust/pyspellchecker' },
+  { type: 'library', name: 'pytesseract', version: '0.3.10+', category: 'python', description: 'Tesseract OCR Engine Wrapper (klausur-service)', license: 'Apache-2.0', sourceUrl: 'https://github.com/madmaze/pytesseract' },
+  { type: 'library', name: 'opencv-python-headless', version: '4.8+', category: 'python', description: 'Bildverarbeitung, Projektionsprofile, Inpainting (klausur-service)', license: 'Apache-2.0', sourceUrl: 'https://github.com/opencv/opencv-python' },
+  { type: 'library', name: 'rapidocr-onnxruntime', version: 'latest', category: 'python', description: 'Schnelles OCR ARM64 via ONNX (klausur-service)', license: 'Apache-2.0', sourceUrl: 'https://github.com/RapidAI/RapidOCR' },
+  { type: 'library', name: 'onnxruntime', version: 'latest', category: 'python', description: 'ONNX-Inferenz fuer RapidOCR (klausur-service)', license: 'MIT', sourceUrl: 'https://github.com/microsoft/onnxruntime' },
+  { type: 'library', name: 'eng-to-ipa', version: 'latest', category: 'python', description: 'IPA-Lautschrift-Lookup (klausur-service Vokabel-Pipeline)', license: 'MIT', sourceUrl: 'https://github.com/mphilli/English-to-IPA' },
+  { type: 'library', name: 'sentence-transformers', version: '2.2+', category: 'python', description: 'Lokale Embeddings (klausur-service, rag-service)', license: 'Apache-2.0', sourceUrl: 'https://github.com/UKPLab/sentence-transformers' },
+  { type: 'library', name: 'torch', version: '2.0+', category: 'python', description: 'ML-Framework CPU/MPS (TrOCR, klausur-service)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/pytorch/pytorch' },
+  { type: 'library', name: 'transformers', version: '4.x', category: 'python', description: 'HuggingFace Transformers (TrOCR, Handschrift-HTR)', license: 'Apache-2.0', sourceUrl: 'https://github.com/huggingface/transformers' },
+]

admin-core/app/(admin)/infrastructure/sbom/_components/sbom-data.ts

@@ -0,0 +1,76 @@
+/**
+ * Static SBOM component data
+ * Extracted from page.tsx to keep file sizes manageable
+ */
+
+import type { Component } from '../types'
+
+// Infrastructure components from docker-compose.yml and project analysis
+export const INFRASTRUCTURE_COMPONENTS: Component[] = [
+  { type: 'service', name: 'PostgreSQL', version: '16-alpine', category: 'database', port: '5432', description: 'Hauptdatenbank', license: 'PostgreSQL', sourceUrl: 'https://github.com/postgres/postgres' },
+  { type: 'service', name: 'Synapse PostgreSQL', version: '16-alpine', category: 'database', port: '-', description: 'Matrix Datenbank', license: 'PostgreSQL', sourceUrl: 'https://github.com/postgres/postgres' },
+  { type: 'service', name: 'ERPNext MariaDB', version: '10.6', category: 'database', port: '-', description: 'ERPNext Datenbank', license: 'GPL-2.0', sourceUrl: 'https://github.com/MariaDB/server' },
+  { type: 'service', name: 'MongoDB', version: '7.0', category: 'database', port: '27017', description: 'LibreChat Datenbank', license: 'SSPL-1.0', sourceUrl: 'https://github.com/mongodb/mongo' },
+  { type: 'service', name: 'Valkey', version: '8-alpine', category: 'cache', port: '6379', description: 'In-Memory Cache & Sessions (Redis OSS Fork)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/valkey-io/valkey' },
+  { type: 'service', name: 'ERPNext Valkey Queue', version: 'alpine', category: 'cache', port: '-', description: 'Job Queue', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/valkey-io/valkey' },
+  { type: 'service', name: 'ERPNext Valkey Cache', version: 'alpine', category: 'cache', port: '-', description: 'Cache Layer', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/valkey-io/valkey' },
+  { type: 'service', name: 'Qdrant', version: '1.7.4', category: 'search', port: '6333', description: 'Vector Database (RAG/Embeddings)', license: 'Apache-2.0', sourceUrl: 'https://github.com/qdrant/qdrant' },
+  { type: 'service', name: 'OpenSearch', version: '2.x', category: 'search', port: '9200', description: 'Volltext-Suche (Elasticsearch Fork)', license: 'Apache-2.0', sourceUrl: 'https://github.com/opensearch-project/OpenSearch' },
+  { type: 'service', name: 'Meilisearch', version: 'latest', category: 'search', port: '7700', description: 'Instant Search Engine', license: 'MIT', sourceUrl: 'https://github.com/meilisearch/meilisearch' },
+  { type: 'service', name: 'MinIO', version: 'latest', category: 'storage', port: '9000/9001', description: 'S3-kompatibel Object Storage', license: 'AGPL-3.0', sourceUrl: 'https://github.com/minio/minio' },
+  { type: 'service', name: 'IPFS (Kubo)', version: '0.24', category: 'storage', port: '5001', description: 'Dezentrales Speichersystem', license: 'MIT/Apache-2.0', sourceUrl: 'https://github.com/ipfs/kubo' },
+  { type: 'service', name: 'DSMS Gateway', version: '1.0', category: 'storage', port: '8082', description: 'IPFS REST API', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'HashiCorp Vault', version: '1.15', category: 'security', port: '8200', description: 'Secrets Management', license: 'BUSL-1.1', sourceUrl: 'https://github.com/hashicorp/vault' },
+  { type: 'service', name: 'Keycloak', version: '23.0', category: 'security', port: '8180', description: 'Identity Provider (SSO/OIDC)', license: 'Apache-2.0', sourceUrl: 'https://github.com/keycloak/keycloak' },
+  { type: 'service', name: 'NetBird', version: '0.64.5', category: 'security', port: '-', description: 'Zero-Trust Mesh VPN (WireGuard-basiert)', license: 'BSD-3-Clause', sourceUrl: 'https://github.com/netbirdio/netbird' },
+  { type: 'service', name: 'Matrix Synapse', version: 'latest', category: 'communication', port: '8008', description: 'E2EE Messenger Server', license: 'AGPL-3.0', sourceUrl: 'https://github.com/element-hq/synapse' },
+  { type: 'service', name: 'Jitsi Web', version: 'stable-9823', category: 'communication', port: '8443', description: 'Videokonferenz UI', license: 'Apache-2.0', sourceUrl: 'https://github.com/jitsi/jitsi-meet' },
+  { type: 'service', name: 'Jitsi Prosody (XMPP)', version: 'stable-9823', category: 'communication', port: '-', description: 'XMPP Server', license: 'MIT', sourceUrl: 'https://github.com/bjc/prosody' },
+  { type: 'service', name: 'Jitsi Jicofo', version: 'stable-9823', category: 'communication', port: '-', description: 'Conference Focus Component', license: 'Apache-2.0', sourceUrl: 'https://github.com/jitsi/jicofo' },
+  { type: 'service', name: 'Jitsi JVB', version: 'stable-9823', category: 'communication', port: '10000/udp', description: 'Videobridge (WebRTC SFU)', license: 'Apache-2.0', sourceUrl: 'https://github.com/jitsi/jitsi-videobridge' },
+  { type: 'service', name: 'Jibri', version: 'stable-9823', category: 'communication', port: '-', description: 'Recording & Streaming Service', license: 'Apache-2.0', sourceUrl: 'https://github.com/jitsi/jibri' },
+  { type: 'service', name: 'Python Backend (FastAPI)', version: '3.12', category: 'application', port: '8000', description: 'Haupt-Backend API, Studio & Alerts Agent', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Klausur Service', version: '1.0', category: 'application', port: '8086', description: 'Abitur-Klausurkorrektur (BYOEH)', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Compliance Module', version: '2.0', category: 'application', port: '8000', description: 'GRC Framework (19 Regulations, 558 Requirements, AI)', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Transcription Worker', version: '1.0', category: 'application', port: '-', description: 'Whisper + pyannote Transkription', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Go Consent Service', version: '1.21', category: 'application', port: '8081', description: 'DSGVO Consent Management', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Go School Service', version: '1.21', category: 'application', port: '8084', description: 'Klausuren, Noten, Zeugnisse', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Go Billing Service', version: '1.21', category: 'application', port: '8083', description: 'Stripe Billing Integration', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Next.js Admin Frontend', version: '15.1', category: 'application', port: '3000', description: 'Admin Dashboard (React)', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'H5P Content Service', version: 'latest', category: 'application', port: '8085', description: 'Interaktive Inhalte', license: 'MIT', sourceUrl: 'https://github.com/h5p/h5p-server' },
+  { type: 'service', name: 'Policy Vault (NestJS)', version: '1.0', category: 'application', port: '3001', description: 'Richtlinien-Verwaltung API', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Policy Vault (Angular)', version: '17', category: 'application', port: '4200', description: 'Richtlinien-Verwaltung UI', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'Creator Studio (Vue 3)', version: '3.4', category: 'application', port: '-', description: 'Content Creation UI', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'LibreChat', version: 'latest', category: 'ai', port: '3080', description: 'Multi-LLM Chat Interface', license: 'MIT', sourceUrl: 'https://github.com/danny-avila/LibreChat' },
+  { type: 'service', name: 'RAGFlow', version: 'latest', category: 'ai', port: '9380', description: 'RAG Pipeline Service', license: 'Apache-2.0', sourceUrl: 'https://github.com/infiniflow/ragflow' },
+  { type: 'service', name: 'ERPNext', version: 'v15', category: 'erp', port: '8090', description: 'Open Source ERP System', license: 'GPL-3.0', sourceUrl: 'https://github.com/frappe/erpnext' },
+  { type: 'service', name: 'Gitea', version: '1.21', category: 'cicd', port: '3003', description: 'Self-hosted Git Service with Actions CI/CD', license: 'MIT', sourceUrl: 'https://github.com/go-gitea/gitea' },
+  { type: 'service', name: 'Dokploy', version: '0.26.7', category: 'cicd', port: '3000', description: 'Self-hosted PaaS (Vercel/Heroku Alternative)', license: 'Apache-2.0', sourceUrl: 'https://github.com/Dokploy/dokploy' },
+  { type: 'service', name: 'Mailpit', version: 'latest', category: 'development', port: '8025/1025', description: 'E-Mail Testing (SMTP Catch-All)', license: 'MIT', sourceUrl: 'https://github.com/axllent/mailpit' },
+  { type: 'service', name: 'Breakpilot Drive (Unity WebGL)', version: '6000.0', category: 'game', port: '3001', description: 'Lernspiel fuer Schueler (Klasse 2-6)', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'BQAS Local Scheduler', version: '1.0', category: 'qa', port: '-', description: 'Lokale GitHub Actions Alternative (launchd)', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'BQAS LLM Judge', version: '1.0', category: 'qa', port: '-', description: 'Qwen2.5-32B basierte Test-Bewertung', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'BQAS RAG Judge', version: '1.0', category: 'qa', port: '-', description: 'RAG/Korrektur Evaluierung', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'BQAS Notifier', version: '1.0', category: 'qa', port: '-', description: 'Desktop/Slack/Email Benachrichtigungen', license: 'Proprietary', sourceUrl: '-' },
+  { type: 'service', name: 'BQAS Regression Tracker', version: '1.0', category: 'qa', port: '-', description: 'Score-Historie und Regression-Erkennung', license: 'Proprietary', sourceUrl: '-' },
+]
+
+export const SECURITY_TOOLS: Component[] = [
+  { type: 'tool', name: 'Trivy', version: 'latest', category: 'security-tool', description: 'Container Vulnerability Scanner', license: 'Apache-2.0', sourceUrl: 'https://github.com/aquasecurity/trivy' },
+  { type: 'tool', name: 'Grype', version: 'latest', category: 'security-tool', description: 'SBOM Vulnerability Scanner', license: 'Apache-2.0', sourceUrl: 'https://github.com/anchore/grype' },
+  { type: 'tool', name: 'Syft', version: 'latest', category: 'security-tool', description: 'SBOM Generator', license: 'Apache-2.0', sourceUrl: 'https://github.com/anchore/syft' },
+  { type: 'tool', name: 'Gitleaks', version: 'latest', category: 'security-tool', description: 'Secrets Detection in Git', license: 'MIT', sourceUrl: 'https://github.com/gitleaks/gitleaks' },
+  { type: 'tool', name: 'TruffleHog', version: '3.x', category: 'security-tool', description: 'Secrets Scanner (Regex/Entropy)', license: 'AGPL-3.0', sourceUrl: 'https://github.com/trufflesecurity/trufflehog' },
+  { type: 'tool', name: 'Semgrep', version: 'latest', category: 'security-tool', description: 'SAST - Static Analysis', license: 'LGPL-2.1', sourceUrl: 'https://github.com/semgrep/semgrep' },
+  { type: 'tool', name: 'Bandit', version: 'latest', category: 'security-tool', description: 'Python Security Linter', license: 'Apache-2.0', sourceUrl: 'https://github.com/PyCQA/bandit' },
+  { type: 'tool', name: 'Gosec', version: 'latest', category: 'security-tool', description: 'Go Security Scanner', license: 'Apache-2.0', sourceUrl: 'https://github.com/securego/gosec' },
+  { type: 'tool', name: 'govulncheck', version: 'latest', category: 'security-tool', description: 'Go Vulnerability Check', license: 'BSD-3-Clause', sourceUrl: 'https://pkg.go.dev/golang.org/x/vuln/cmd/govulncheck' },
+  { type: 'tool', name: 'golangci-lint', version: 'latest', category: 'security-tool', description: 'Go Linter (Security Rules)', license: 'GPL-3.0', sourceUrl: 'https://github.com/golangci/golangci-lint' },
+  { type: 'tool', name: 'npm audit', version: 'built-in', category: 'security-tool', description: 'Node.js Vulnerability Check', license: 'Artistic-2.0', sourceUrl: 'https://docs.npmjs.com/cli/commands/npm-audit' },
+  { type: 'tool', name: 'pip-audit', version: 'latest', category: 'security-tool', description: 'Python Dependency Audit', license: 'Apache-2.0', sourceUrl: 'https://github.com/pypa/pip-audit' },
+  { type: 'tool', name: 'safety', version: 'latest', category: 'security-tool', description: 'Python Safety Check', license: 'MIT', sourceUrl: 'https://github.com/pyupio/safety' },
+  { type: 'tool', name: 'CodeQL', version: 'latest', category: 'security-tool', description: 'GitHub Security Analysis', license: 'MIT', sourceUrl: 'https://github.com/github/codeql' },
+]
+
+export { PYTHON_PACKAGES } from './sbom-data-python'
+export { GO_MODULES, NODE_PACKAGES, UNITY_PACKAGES, CSHARP_PACKAGES } from './sbom-data-libs'

admin-core/app/(admin)/infrastructure/sbom/types.ts

@@ -0,0 +1,31 @@
+/**
+ * Types for SBOM page
+ */
+
+export interface Component {
+  type: string
+  name: string
+  version: string
+  purl?: string
+  licenses?: { license: { id: string } }[]
+  category?: string
+  port?: string
+  description?: string
+  license?: string
+  sourceUrl?: string
+}
+
+export interface SBOMData {
+  bomFormat?: string
+  specVersion?: string
+  version?: number
+  metadata?: {
+    timestamp?: string
+    tools?: { vendor: string; name: string; version: string }[]
+    component?: { type: string; name: string; version: string }
+  }
+  components?: Component[]
+}
+
+export type CategoryType = 'all' | 'infrastructure' | 'security-tools' | 'python' | 'go' | 'nodejs' | 'unity' | 'csharp'
+export type InfoTabType = 'audit' | 'documentation'

admin-core/app/(admin)/infrastructure/security/_components/FindingsTab.tsx

@@ -0,0 +1,102 @@
+'use client'
+
+import type { Finding } from '../types'
+
+export function FindingsTab({
+  findings,
+  severityFilter,
+  setSeverityFilter,
+  toolFilter,
+  setToolFilter,
+  getSeverityBadge,
+}: {
+  findings: Finding[]
+  severityFilter: string | null
+  setSeverityFilter: (v: string | null) => void
+  toolFilter: string | null
+  setToolFilter: (v: string | null) => void
+  getSeverityBadge: (severity: string) => string
+}) {
+  const filteredFindings = findings.filter(f => {
+    if (severityFilter && f.severity.toUpperCase() !== severityFilter.toUpperCase()) return false
+    if (toolFilter && f.tool.toLowerCase() !== toolFilter.toLowerCase()) return false
+    return true
+  })
+
+  return (
+    <div>
+      {/* Filters */}
+      <div className="flex gap-2 mb-4 flex-wrap">
+        <button
+          onClick={() => setSeverityFilter(null)}
+          className={`px-3 py-1 rounded-full text-sm ${!severityFilter ? 'bg-orange-600 text-white' : 'bg-slate-100 text-slate-600 hover:bg-slate-200'}`}
+        >
+          Alle
+        </button>
+        {['CRITICAL', 'HIGH', 'MEDIUM', 'LOW', 'INFO'].map(sev => (
+          <button
+            key={sev}
+            onClick={() => setSeverityFilter(sev)}
+            className={`px-3 py-1 rounded-full text-sm ${severityFilter === sev ? 'bg-orange-600 text-white' : 'bg-slate-100 text-slate-600 hover:bg-slate-200'}`}
+          >
+            {sev}
+          </button>
+        ))}
+        <span className="mx-2 border-l border-slate-300" />
+        {['gitleaks', 'semgrep', 'bandit', 'trivy', 'grype'].map(t => (
+          <button
+            key={t}
+            onClick={() => setToolFilter(toolFilter === t ? null : t)}
+            className={`px-3 py-1 rounded-full text-sm capitalize ${toolFilter === t ? 'bg-orange-600 text-white' : 'bg-slate-100 text-slate-600 hover:bg-slate-200'}`}
+          >
+            {t}
+          </button>
+        ))}
+      </div>
+
+      {filteredFindings.length === 0 ? (
+        <div className="text-center py-8 text-slate-500">
+          Keine Findings mit diesem Filter gefunden.
+        </div>
+      ) : (
+        <div className="overflow-x-auto">
+          <table className="w-full">
+            <thead>
+              <tr className="border-b border-slate-200">
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Severity</th>
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Tool</th>
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Finding</th>
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Datei</th>
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Zeile</th>
+                <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Gefunden</th>
+              </tr>
+            </thead>
+            <tbody>
+              {filteredFindings.map((finding, idx) => (
+                <tr key={`${finding.id}-${idx}`} className="border-b border-slate-100 hover:bg-slate-50">
+                  <td className="py-3 px-4">
+                    <span className={getSeverityBadge(finding.severity)}>{finding.severity}</span>
+                  </td>
+                  <td className="py-3 px-4 text-sm text-slate-600">{finding.tool}</td>
+                  <td className="py-3 px-4">
+                    <div className="text-sm text-slate-900">{finding.title}</div>
+                    {finding.message && (
+                      <div className="text-xs text-slate-500 mt-1">{finding.message}</div>
+                    )}
+                  </td>
+                  <td className="py-3 px-4 text-sm text-slate-500 font-mono max-w-xs truncate">
+                    {finding.file || '-'}
+                  </td>
+                  <td className="py-3 px-4 text-sm text-slate-500">{finding.line || '-'}</td>
+                  <td className="py-3 px-4 text-sm text-slate-500">
+                    {finding.found_at ? new Date(finding.found_at).toLocaleDateString('de-DE') : '-'}
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/_components/HistoryTab.tsx

@@ -0,0 +1,44 @@
+'use client'
+
+import type { HistoryItem } from '../types'
+
+export function HistoryTab({ history }: { history: HistoryItem[] }) {
+  const getHistoryStatusColor = (status: string) => {
+    switch (status) {
+      case 'success': return 'bg-green-500'
+      case 'warning': return 'bg-yellow-500'
+      case 'error': return 'bg-red-500'
+      default: return 'bg-slate-400'
+    }
+  }
+
+  if (history.length === 0) {
+    return (
+      <div className="text-center py-8 text-slate-500">
+        Keine Scan-Historie vorhanden.
+      </div>
+    )
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="relative">
+        <div className="absolute left-4 top-0 bottom-0 w-0.5 bg-slate-200" />
+        {history.map((item, idx) => (
+          <div key={idx} className="relative pl-10 pb-6">
+            <div className={`absolute left-2.5 w-3 h-3 rounded-full ${getHistoryStatusColor(item.status)}`} />
+            <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+              <div className="flex justify-between items-start mb-1">
+                <span className="font-semibold text-slate-900">{item.title}</span>
+                <span className="text-xs text-slate-500">
+                  {new Date(item.timestamp).toLocaleString('de-DE')}
+                </span>
+              </div>
+              <p className="text-sm text-slate-600">{item.description}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/_components/MonitoringTab.tsx

@@ -0,0 +1,172 @@
+'use client'
+
+import type { MonitoringMetric, ActiveAlert } from '../types'
+
+export function MonitoringTab({
+  monitoringMetrics,
+  activeAlerts,
+}: {
+  monitoringMetrics: MonitoringMetric[]
+  activeAlerts: ActiveAlert[]
+}) {
+  return (
+    <div className="space-y-6">
+      {/* Real-time Metrics */}
+      <div>
+        <h3 className="text-lg font-semibold text-slate-900 mb-4 flex items-center gap-2">
+          <svg className="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
+          </svg>
+          Security Metriken
+        </h3>
+        <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+          {monitoringMetrics.map((metric, idx) => (
+            <div
+              key={idx}
+              className={`rounded-lg p-4 border ${
+                metric.status === 'critical' ? 'bg-red-50 border-red-200' :
+                metric.status === 'warning' ? 'bg-yellow-50 border-yellow-200' :
+                'bg-green-50 border-green-200'
+              }`}
+            >
+              <div className="flex justify-between items-start mb-2">
+                <span className="text-xs text-slate-600">{metric.name}</span>
+                <span className={`text-xs ${
+                  metric.trend === 'up' ? 'text-red-600' :
+                  metric.trend === 'down' ? 'text-green-600' :
+                  'text-slate-500'
+                }`}>
+                  {metric.trend === 'up' ? '↑' : metric.trend === 'down' ? '↓' : '→'}
+                </span>
+              </div>
+              <div className={`text-2xl font-bold ${
+                metric.status === 'critical' ? 'text-red-700' :
+                metric.status === 'warning' ? 'text-yellow-700' :
+                'text-green-700'
+              }`}>
+                {metric.value}
+                <span className="text-sm font-normal ml-1">{metric.unit}</span>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+
+      {/* Active Alerts */}
+      <div>
+        <h3 className="text-lg font-semibold text-slate-900 mb-4 flex items-center gap-2">
+          <svg className="w-5 h-5 text-orange-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
+          </svg>
+          Aktive Alerts
+          {activeAlerts.filter(a => !a.acknowledged).length > 0 && (
+            <span className="ml-2 px-2 py-0.5 bg-red-500 text-white text-xs rounded-full">
+              {activeAlerts.filter(a => !a.acknowledged).length}
+            </span>
+          )}
+        </h3>
+        {activeAlerts.length === 0 ? (
+          <div className="text-center py-8 bg-green-50 rounded-lg border border-green-200">
+            <span className="text-4xl block mb-2">✓</span>
+            <span className="text-green-700">Keine aktiven Security-Alerts</span>
+          </div>
+        ) : (
+          <div className="space-y-2">
+            {activeAlerts.map((alert) => (
+              <div
+                key={alert.id}
+                className={`flex items-center justify-between p-4 rounded-lg border ${
+                  alert.severity === 'critical' ? 'bg-red-50 border-red-200' :
+                  alert.severity === 'high' ? 'bg-orange-50 border-orange-200' :
+                  alert.severity === 'medium' ? 'bg-yellow-50 border-yellow-200' :
+                  'bg-blue-50 border-blue-200'
+                }`}
+              >
+                <div className="flex items-center gap-4">
+                  <span className={`px-2 py-1 text-xs font-semibold rounded uppercase ${
+                    alert.severity === 'critical' ? 'bg-red-100 text-red-800' :
+                    alert.severity === 'high' ? 'bg-orange-100 text-orange-800' :
+                    alert.severity === 'medium' ? 'bg-yellow-100 text-yellow-800' :
+                    'bg-blue-100 text-blue-800'
+                  }`}>
+                    {alert.severity}
+                  </span>
+                  <div>
+                    <div className="font-medium text-slate-900">{alert.title}</div>
+                    <div className="text-xs text-slate-500">
+                      {alert.source} • {new Date(alert.timestamp).toLocaleString('de-DE')}
+                    </div>
+                  </div>
+                </div>
+                {!alert.acknowledged && (
+                  <button className="px-3 py-1 text-xs bg-white border border-slate-300 rounded hover:bg-slate-50">
+                    Bestaetigen
+                  </button>
+                )}
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+
+      {/* Security Overview Cards */}
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
+        <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+          <h4 className="font-medium text-slate-900 mb-3 flex items-center gap-2">
+            <svg className="w-4 h-4 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
+            </svg>
+            Authentifizierung
+          </h4>
+          <div className="space-y-2 text-sm">
+            <div className="flex justify-between"><span className="text-slate-600">Aktive Sessions</span><span className="font-medium">24</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">Fehlgeschlagene Logins (24h)</span><span className="font-medium text-green-600">0</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">2FA-Quote</span><span className="font-medium text-green-600">100%</span></div>
+          </div>
+        </div>
+        <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+          <h4 className="font-medium text-slate-900 mb-3 flex items-center gap-2">
+            <svg className="w-4 h-4 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <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>
+            SSL/TLS
+          </h4>
+          <div className="space-y-2 text-sm">
+            <div className="flex justify-between"><span className="text-slate-600">Zertifikate</span><span className="font-medium">5 aktiv</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">Naechster Ablauf</span><span className="font-medium text-green-600">45 Tage</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">TLS Version</span><span className="font-medium">1.3</span></div>
+          </div>
+        </div>
+        <div className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+          <h4 className="font-medium text-slate-900 mb-3 flex items-center gap-2">
+            <svg className="w-4 h-4 text-orange-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+            </svg>
+            Firewall
+          </h4>
+          <div className="space-y-2 text-sm">
+            <div className="flex justify-between"><span className="text-slate-600">Blockierte IPs (24h)</span><span className="font-medium">12</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">Rate Limit Hits</span><span className="font-medium text-yellow-600">7</span></div>
+            <div className="flex justify-between"><span className="text-slate-600">WAF Status</span><span className="font-medium text-green-600">Aktiv</span></div>
+          </div>
+        </div>
+      </div>
+
+      {/* Link to CI/CD */}
+      <div className="bg-blue-50 border border-blue-200 rounded-lg p-4 flex items-center justify-between">
+        <div className="flex items-center gap-3">
+          <svg className="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" />
+          </svg>
+          <div>
+            <div className="font-medium text-blue-900">Pipeline Security</div>
+            <div className="text-sm text-blue-700">Security-Scans in CI/CD Pipelines und Container-Status</div>
+          </div>
+        </div>
+        <a href="/infrastructure/ci-cd" className="px-4 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors">
+          CI/CD Dashboard →
+        </a>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/_components/SecurityDocsSection.tsx

@@ -0,0 +1,109 @@
+'use client'
+
+import { useState } from 'react'
+
+export function SecurityDocsSection() {
+  const [showFullDocs, setShowFullDocs] = useState(false)
+
+  return (
+    <div className="bg-white rounded-xl border border-slate-200 overflow-hidden">
+      <div className="p-6">
+        <div className="flex justify-between items-center mb-4">
+          <h3 className="text-lg font-semibold text-slate-900 flex items-center gap-2">
+            <svg className="w-5 h-5 text-slate-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+            </svg>
+            Security Dokumentation
+          </h3>
+          <button
+            onClick={() => setShowFullDocs(!showFullDocs)}
+            className="px-4 py-2 bg-slate-100 text-slate-700 rounded-lg hover:bg-slate-200 transition-colors flex items-center gap-2 text-sm font-medium"
+          >
+            <svg className={`w-4 h-4 transition-transform ${showFullDocs ? 'rotate-180' : ''}`} fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
+            </svg>
+            {showFullDocs ? 'Weniger anzeigen' : 'Vollstaendige Dokumentation'}
+          </button>
+        </div>
+
+        {/* Short Description */}
+        <div className="prose prose-slate max-w-none">
+          <p className="text-slate-600">
+            Das Security Dashboard bietet einen zentralen Ueberblick ueber alle DevSecOps-Aktivitaeten.
+            Es integriert 6 Security-Tools fuer umfassende Code- und Infrastruktur-Sicherheit:
+            Secrets Detection, Static Analysis (SAST), Dependency Scanning und SBOM-Generierung.
+          </p>
+        </div>
+
+        {/* Tool Quick Reference */}
+        <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-3 mt-4">
+          {[
+            { bg: 'bg-red-50', icon: '🔑', name: 'Gitleaks', label: 'Secrets', color: 'text-red-800', labelColor: 'text-red-600' },
+            { bg: 'bg-blue-50', icon: '🔍', name: 'Semgrep', label: 'SAST', color: 'text-blue-800', labelColor: 'text-blue-600' },
+            { bg: 'bg-yellow-50', icon: '🐍', name: 'Bandit', label: 'Python', color: 'text-yellow-800', labelColor: 'text-yellow-600' },
+            { bg: 'bg-purple-50', icon: '🔒', name: 'Trivy', label: 'Container', color: 'text-purple-800', labelColor: 'text-purple-600' },
+            { bg: 'bg-green-50', icon: '🐛', name: 'Grype', label: 'Dependencies', color: 'text-green-800', labelColor: 'text-green-600' },
+            { bg: 'bg-orange-50', icon: '📦', name: 'Syft', label: 'SBOM', color: 'text-orange-800', labelColor: 'text-orange-600' },
+          ].map((tool) => (
+            <div key={tool.name} className={`${tool.bg} p-3 rounded-lg text-center`}>
+              <span className="text-lg">{tool.icon}</span>
+              <p className={`text-xs font-medium ${tool.color} mt-1`}>{tool.name}</p>
+              <p className={`text-xs ${tool.labelColor}`}>{tool.label}</p>
+            </div>
+          ))}
+        </div>
+
+        {/* Full Documentation (Expandable) */}
+        {showFullDocs && (
+          <div className="mt-6 bg-slate-50 rounded-lg p-6 border border-slate-200">
+            <div className="prose prose-slate max-w-none prose-headings:text-slate-900 prose-p:text-slate-600 prose-li:text-slate-600">
+              <h3>1. Security Tools Uebersicht</h3>
+              <h4>🔑 Gitleaks - Secrets Detection</h4>
+              <p>Durchsucht die gesamte Git-Historie nach versehentlich eingecheckten Secrets wie API-Keys, Passwoertern und Tokens.</p>
+              <ul>
+                <li><strong>Scan-Bereich:</strong> Git-Historie, Commits, Branches</li>
+                <li><strong>Erkannte Secrets:</strong> AWS Keys, GitHub Tokens, Private Keys, Passwoerter</li>
+                <li><strong>Ausgabe:</strong> JSON-Report mit Fundstelle, Commit-Hash, Autor</li>
+              </ul>
+              <h4>🔍 Semgrep - Static Application Security Testing</h4>
+              <p>Fuehrt regelbasierte statische Code-Analyse durch, um Sicherheitsluecken und Anti-Patterns zu finden.</p>
+              <ul>
+                <li><strong>Unterstuetzte Sprachen:</strong> Python, JavaScript, TypeScript, Go, Java</li>
+                <li><strong>Regelsets:</strong> OWASP Top 10, CWE, Security Best Practices</li>
+                <li><strong>Findings:</strong> SQL Injection, XSS, Path Traversal, Insecure Deserialization</li>
+              </ul>
+              <h3>2. Severity-Klassifizierung</h3>
+              <table className="min-w-full text-sm">
+                <thead><tr className="border-b"><th className="text-left py-2">Severity</th><th className="text-left py-2">CVSS Score</th><th className="text-left py-2">Reaktionszeit</th></tr></thead>
+                <tbody>
+                  <tr className="border-b"><td className="py-2"><span className="px-2 py-0.5 bg-red-100 text-red-800 rounded text-xs font-semibold">CRITICAL</span></td><td>9.0 - 10.0</td><td>Sofort (24h)</td></tr>
+                  <tr className="border-b"><td className="py-2"><span className="px-2 py-0.5 bg-orange-100 text-orange-800 rounded text-xs font-semibold">HIGH</span></td><td>7.0 - 8.9</td><td>1-3 Tage</td></tr>
+                  <tr className="border-b"><td className="py-2"><span className="px-2 py-0.5 bg-yellow-100 text-yellow-800 rounded text-xs font-semibold">MEDIUM</span></td><td>4.0 - 6.9</td><td>1-2 Wochen</td></tr>
+                  <tr className="border-b"><td className="py-2"><span className="px-2 py-0.5 bg-green-100 text-green-800 rounded text-xs font-semibold">LOW</span></td><td>0.1 - 3.9</td><td>Naechster Sprint</td></tr>
+                </tbody>
+              </table>
+              <h3>3. Scan-Workflow</h3>
+              <pre className="bg-slate-800 text-slate-100 p-4 rounded-lg overflow-x-auto text-sm">
+{`1. Secrets Detection (Gitleaks)
+2. Static Analysis (Semgrep + Bandit)
+3. Dependency Scan (Trivy + Grype)
+4. SBOM Generation (Syft)
+5. Report & Dashboard`}
+              </pre>
+              <h3>4. API-Endpunkte</h3>
+              <table className="min-w-full text-sm font-mono">
+                <thead><tr className="border-b"><th className="text-left py-2">Methode</th><th className="text-left py-2">Endpoint</th><th className="text-left py-2 font-sans">Beschreibung</th></tr></thead>
+                <tbody>
+                  <tr className="border-b"><td className="py-2"><span className="bg-blue-100 text-blue-700 px-1 rounded">GET</span></td><td>/api/v1/security/tools</td><td className="font-sans">Tool-Status abrufen</td></tr>
+                  <tr className="border-b"><td className="py-2"><span className="bg-blue-100 text-blue-700 px-1 rounded">GET</span></td><td>/api/v1/security/findings</td><td className="font-sans">Alle Findings abrufen</td></tr>
+                  <tr className="border-b"><td className="py-2"><span className="bg-green-100 text-green-700 px-1 rounded">POST</span></td><td>/api/v1/security/scan/all</td><td className="font-sans">Full Scan starten</td></tr>
+                  <tr><td className="py-2"><span className="bg-green-100 text-green-700 px-1 rounded">POST</span></td><td>/api/v1/security/scan/[tool]</td><td className="font-sans">Einzelnes Tool scannen</td></tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/_components/SecurityOverviewTab.tsx

@@ -0,0 +1,122 @@
+'use client'
+
+import type { ToolStatus, Finding, ScanType } from '../types'
+
+export function SecurityOverviewTab({
+  tools,
+  findings,
+  scanning,
+  onRunScan,
+  onShowAllFindings,
+  toolDescriptions,
+  toolToScanType,
+  getSeverityBadge,
+  getStatusBadge,
+}: {
+  tools: ToolStatus[]
+  findings: Finding[]
+  scanning: string | null
+  onRunScan: (scanType: ScanType) => void
+  onShowAllFindings: () => void
+  toolDescriptions: Record<string, { icon: string; desc: string }>
+  toolToScanType: Record<string, ScanType>
+  getSeverityBadge: (severity: string) => string
+  getStatusBadge: (installed: boolean) => string
+}) {
+  return (
+    <div className="space-y-6">
+      {/* Tools Grid */}
+      <div>
+        <h3 className="text-lg font-semibold text-slate-900 mb-4">DevSecOps Tools</h3>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+          {tools.map(tool => {
+            const info = toolDescriptions[tool.name.toLowerCase()] || { icon: '🔧', desc: 'Security Tool' }
+            return (
+              <div key={tool.name} className="bg-slate-50 rounded-lg p-4 border border-slate-200">
+                <div className="flex justify-between items-start mb-2">
+                  <div className="flex items-center gap-2">
+                    <span className="text-xl">{info.icon}</span>
+                    <span className="font-semibold text-slate-900">{tool.name}</span>
+                  </div>
+                  <span className={getStatusBadge(tool.installed)}>
+                    {tool.installed ? 'Installiert' : 'Nicht installiert'}
+                  </span>
+                </div>
+                <p className="text-sm text-slate-600 mb-3">{info.desc}</p>
+                <div className="flex justify-between items-center text-xs text-slate-500">
+                  <span>{tool.version || '-'}</span>
+                  <span>Letzter Scan: {tool.last_run || 'Nie'}</span>
+                </div>
+                <button
+                  onClick={() => onRunScan(toolToScanType[tool.name.toLowerCase()] || 'all')}
+                  disabled={scanning !== null || !tool.installed}
+                  className={`mt-3 w-full px-3 py-1.5 text-sm border rounded transition-colors flex items-center justify-center gap-2 ${
+                    scanning === toolToScanType[tool.name.toLowerCase()]
+                      ? 'bg-orange-100 border-orange-300 text-orange-700'
+                      : 'bg-white border-slate-300 hover:bg-slate-50 disabled:opacity-50'
+                  }`}
+                >
+                  {scanning === toolToScanType[tool.name.toLowerCase()] ? (
+                    <>
+                      <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-orange-600" />
+                      <span>Scan laeuft...</span>
+                    </>
+                  ) : (
+                    'Scan starten'
+                  )}
+                </button>
+              </div>
+            )
+          })}
+        </div>
+      </div>
+
+      {/* Recent Findings */}
+      <div>
+        <h3 className="text-lg font-semibold text-slate-900 mb-4">Aktuelle Findings</h3>
+        {findings.length === 0 ? (
+          <div className="text-center py-8 text-slate-500">
+            <span className="text-4xl block mb-2">🎉</span>
+            Keine Findings gefunden. Das ist gut!
+          </div>
+        ) : (
+          <div className="overflow-x-auto">
+            <table className="w-full">
+              <thead>
+                <tr className="border-b border-slate-200">
+                  <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Severity</th>
+                  <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Tool</th>
+                  <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Finding</th>
+                  <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Datei</th>
+                  <th className="text-left py-3 px-4 text-xs font-semibold text-slate-500 uppercase">Gefunden</th>
+                </tr>
+              </thead>
+              <tbody>
+                {findings.slice(0, 10).map((finding, idx) => (
+                  <tr key={`${finding.id}-${idx}`} className="border-b border-slate-100 hover:bg-slate-50">
+                    <td className="py-3 px-4">
+                      <span className={getSeverityBadge(finding.severity)}>{finding.severity}</span>
+                    </td>
+                    <td className="py-3 px-4 text-sm text-slate-600">{finding.tool}</td>
+                    <td className="py-3 px-4 text-sm text-slate-900">{finding.title}</td>
+                    <td className="py-3 px-4 text-sm text-slate-500 font-mono">{finding.file || '-'}</td>
+                    <td className="py-3 px-4 text-sm text-slate-500">
+                      {finding.found_at ? new Date(finding.found_at).toLocaleString('de-DE', {
+                        day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit'
+                      }) : '-'}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+            {findings.length > 10 && (
+              <button onClick={onShowAllFindings} className="mt-4 text-sm text-orange-600 hover:text-orange-700">
+                Alle {findings.length} Findings anzeigen →
+              </button>
+            )}
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/_components/ToolsTab.tsx

@@ -0,0 +1,83 @@
+'use client'
+
+import type { ToolStatus, ScanType } from '../types'
+
+export function ToolsTab({
+  tools,
+  scanning,
+  onRunScan,
+  toolDescriptions,
+  toolToScanType,
+  getStatusBadge,
+}: {
+  tools: ToolStatus[]
+  scanning: string | null
+  onRunScan: (scanType: ScanType) => void
+  toolDescriptions: Record<string, { icon: string; desc: string }>
+  toolToScanType: Record<string, ScanType>
+  getStatusBadge: (installed: boolean) => string
+}) {
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+      {tools.map(tool => {
+        const info = toolDescriptions[tool.name.toLowerCase()] || { icon: '🔧', desc: 'Security Tool' }
+        return (
+          <div key={tool.name} className="bg-white border border-slate-200 rounded-lg p-6">
+            <div className="flex justify-between items-start mb-4">
+              <div>
+                <div className="flex items-center gap-3 mb-1">
+                  <span className="text-2xl">{info.icon}</span>
+                  <h3 className="text-lg font-semibold text-slate-900">{tool.name}</h3>
+                </div>
+                <p className="text-sm text-slate-600">{info.desc}</p>
+              </div>
+              <span className={getStatusBadge(tool.installed)}>
+                {tool.installed ? 'Installiert' : 'Nicht installiert'}
+              </span>
+            </div>
+            <div className="space-y-2 text-sm">
+              <div className="flex justify-between">
+                <span className="text-slate-500">Version:</span>
+                <span className="font-mono">{tool.version || '-'}</span>
+              </div>
+              <div className="flex justify-between">
+                <span className="text-slate-500">Letzter Scan:</span>
+                <span>{tool.last_run || 'Nie'}</span>
+              </div>
+              <div className="flex justify-between">
+                <span className="text-slate-500">Findings:</span>
+                <span className="font-semibold">{tool.last_findings}</span>
+              </div>
+            </div>
+            <div className="flex gap-2 mt-4">
+              <button
+                onClick={() => onRunScan(toolToScanType[tool.name.toLowerCase()] || 'all')}
+                disabled={scanning !== null || !tool.installed}
+                className={`flex-1 px-4 py-2 rounded-lg text-sm font-medium transition-colors flex items-center justify-center gap-2 ${
+                  scanning === toolToScanType[tool.name.toLowerCase()]
+                    ? 'bg-orange-200 text-orange-800'
+                    : 'bg-orange-600 text-white hover:bg-orange-700 disabled:opacity-50'
+                }`}
+              >
+                {scanning === toolToScanType[tool.name.toLowerCase()] ? (
+                  <>
+                    <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-orange-700" />
+                    <span>Scan laeuft...</span>
+                  </>
+                ) : (
+                  'Scan starten'
+                )}
+              </button>
+              <button
+                onClick={() => window.open(`/api/v1/security/reports/${tool.name.toLowerCase()}`, '_blank')}
+                className="px-4 py-2 border border-slate-300 text-slate-700 rounded-lg text-sm font-medium hover:bg-slate-50 transition-colors"
+              >
+                Report
+              </button>
+            </div>
+          </div>
+        )
+      })}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/security/types.ts

@@ -0,0 +1,57 @@
+/**
+ * Types for Security Dashboard
+ */
+
+export interface ToolStatus {
+  name: string
+  installed: boolean
+  version: string | null
+  last_run: string | null
+  last_findings: number
+}
+
+export interface Finding {
+  id: string
+  tool: string
+  severity: string
+  title: string
+  message: string | null
+  file: string | null
+  line: number | null
+  found_at: string
+}
+
+export interface SeveritySummary {
+  critical: number
+  high: number
+  medium: number
+  low: number
+  info: number
+  total: number
+}
+
+export interface HistoryItem {
+  timestamp: string
+  title: string
+  description: string
+  status: string
+}
+
+export type ScanType = 'secrets' | 'sast' | 'deps' | 'containers' | 'sbom' | 'all'
+
+export interface MonitoringMetric {
+  name: string
+  value: number
+  unit: string
+  status: 'ok' | 'warning' | 'critical'
+  trend: 'up' | 'down' | 'stable'
+}
+
+export interface ActiveAlert {
+  id: string
+  severity: 'critical' | 'high' | 'medium' | 'low'
+  title: string
+  source: string
+  timestamp: string
+  acknowledged: boolean
+}

admin-core/app/(admin)/infrastructure/tests/_components/BacklogTab.tsx

@@ -0,0 +1,427 @@
+'use client'
+
+import { useState } from 'react'
+import type { LLMRoutingOption } from '@/types/infrastructure-modules'
+import type { FailedTest, BacklogItem, BacklogPriority } from '../types'
+
+// ==============================================================================
+// FailedTestCard
+// ==============================================================================
+
+function FailedTestCard({
+  test,
+  onStatusChange,
+  onPriorityChange,
+  priority = 'medium',
+  failureCount = 1,
+}: {
+  test: FailedTest
+  onStatusChange: (testId: string, status: string) => void
+  onPriorityChange?: (testId: string, priority: string) => void
+  priority?: BacklogPriority
+  failureCount?: number
+}) {
+  const errorTypeColors: Record<string, string> = {
+    assertion: 'bg-amber-100 text-amber-700',
+    nil_pointer: 'bg-red-100 text-red-700',
+    type_error: 'bg-purple-100 text-purple-700',
+    network: 'bg-blue-100 text-blue-700',
+    timeout: 'bg-orange-100 text-orange-700',
+    logic_error: 'bg-slate-100 text-slate-700',
+    unknown: 'bg-slate-100 text-slate-700',
+  }
+
+  const statusColors: Record<string, string> = {
+    open: 'bg-red-100 text-red-700',
+    in_progress: 'bg-blue-100 text-blue-700',
+    fixed: 'bg-emerald-100 text-emerald-700',
+    wont_fix: 'bg-slate-100 text-slate-700',
+    flaky: 'bg-purple-100 text-purple-700',
+  }
+
+  const priorityColors: Record<string, string> = {
+    critical: 'bg-red-500 text-white',
+    high: 'bg-orange-500 text-white',
+    medium: 'bg-yellow-500 text-white',
+    low: 'bg-slate-400 text-white',
+  }
+
+  const priorityLabels: Record<string, string> = {
+    critical: '!!! Kritisch',
+    high: '!! Hoch',
+    medium: '! Mittel',
+    low: 'Niedrig',
+  }
+
+  return (
+    <div className="bg-white rounded-lg border border-slate-200 p-4 hover:border-red-300 transition-colors">
+      <div className="flex items-start justify-between mb-3">
+        <div className="flex-1 min-w-0">
+          <div className="flex items-center gap-2 mb-1 flex-wrap">
+            <span className={`px-2 py-0.5 rounded text-xs font-medium ${priorityColors[priority]}`}>
+              {priorityLabels[priority]}
+            </span>
+            <span className={`px-2 py-0.5 rounded text-xs font-medium ${errorTypeColors[test.error_type] || errorTypeColors.unknown}`}>
+              {test.error_type.replace('_', ' ')}
+            </span>
+            <span className="text-xs text-slate-400">{test.service}</span>
+            {failureCount > 1 && (
+              <span className="px-1.5 py-0.5 rounded bg-red-100 text-red-600 text-xs font-medium">
+                {failureCount}x fehlgeschlagen
+              </span>
+            )}
+          </div>
+          <h4 className="font-mono text-sm font-medium text-slate-900 truncate" title={test.name}>
+            {test.name}
+          </h4>
+          <p className="text-xs text-slate-500 truncate" title={test.file_path}>
+            {test.file_path}
+          </p>
+        </div>
+        <div className="flex flex-col gap-1 ml-2">
+          <select
+            value={test.status}
+            onChange={(e) => onStatusChange(test.id, e.target.value)}
+            className={`px-2 py-1 rounded text-xs font-medium cursor-pointer border-0 ${statusColors[test.status]}`}
+          >
+            <option value="open">Offen</option>
+            <option value="in_progress">In Arbeit</option>
+            <option value="fixed">Behoben</option>
+            <option value="wont_fix">Ignoriert</option>
+            <option value="flaky">Flaky</option>
+          </select>
+          {onPriorityChange && (
+            <select
+              value={priority}
+              onChange={(e) => onPriorityChange(test.id, e.target.value)}
+              className="px-2 py-1 rounded text-xs font-medium cursor-pointer border border-slate-200"
+            >
+              <option value="critical">Kritisch</option>
+              <option value="high">Hoch</option>
+              <option value="medium">Mittel</option>
+              <option value="low">Niedrig</option>
+            </select>
+          )}
+        </div>
+      </div>
+
+      <div className="bg-red-50 rounded-lg p-3 mb-3">
+        <p className="text-sm text-red-800 font-medium mb-1">Fehlermeldung:</p>
+        <p className="text-xs text-red-700 font-mono break-words">
+          {test.error_message || 'Keine Details verfuegbar'}
+        </p>
+      </div>
+
+      {test.suggestion && (
+        <div className="bg-emerald-50 rounded-lg p-3">
+          <p className="text-sm text-emerald-800 font-medium mb-1">💡 Loesungsvorschlag:</p>
+          <p className="text-xs text-emerald-700">
+            {test.suggestion}
+          </p>
+        </div>
+      )}
+
+      <div className="mt-3 pt-3 border-t border-slate-100 flex items-center justify-between text-xs text-slate-400">
+        <span>Zuletzt fehlgeschlagen: {test.last_failed ? new Date(test.last_failed).toLocaleString('de-DE') : 'Unbekannt'}</span>
+        <button
+          className="text-orange-600 hover:text-orange-700 font-medium"
+          onClick={() => {
+            navigator.clipboard.writeText(test.id)
+          }}
+        >
+          ID kopieren
+        </button>
+      </div>
+    </div>
+  )
+}
+
+// ==============================================================================
+// BacklogTab
+// ==============================================================================
+
+export function BacklogTab({
+  failedTests,
+  onStatusChange,
+  onPriorityChange,
+  isLoading,
+  backlogItems,
+  usePostgres = false,
+}: {
+  failedTests: FailedTest[]
+  onStatusChange: (testId: string, status: string) => void
+  onPriorityChange?: (testId: string, priority: string) => void
+  isLoading: boolean
+  backlogItems?: BacklogItem[]
+  usePostgres?: boolean
+}) {
+  const [filterStatus, setFilterStatus] = useState<string>('open')
+  const [filterService, setFilterService] = useState<string>('all')
+  const [filterPriority, setFilterPriority] = useState<string>('all')
+  const [llmAutoAnalysis, setLlmAutoAnalysis] = useState<boolean>(true)
+  const [llmRouting, setLlmRouting] = useState<LLMRoutingOption>('smart_routing')
+
+  // Nutze PostgreSQL-Backlog wenn verfuegbar, sonst Legacy
+  const items = usePostgres && backlogItems ? backlogItems : failedTests
+
+  // Gruppiere nach Service
+  const services = [...new Set(items.map(t => 'service' in t ? t.service : (t as BacklogItem).service))]
+
+  // Filtere Items
+  const filteredItems = items.filter(item => {
+    const status = 'status' in item ? item.status : 'open'
+    const service = 'service' in item ? item.service : ''
+    const priority = 'priority' in item ? (item as BacklogItem).priority : 'medium'
+
+    if (filterStatus !== 'all' && status !== filterStatus) return false
+    if (filterService !== 'all' && service !== filterService) return false
+    if (filterPriority !== 'all' && priority !== filterPriority) return false
+    return true
+  })
+
+  // Zaehle nach Status
+  const openCount = items.filter(t => t.status === 'open').length
+  const inProgressCount = items.filter(t => t.status === 'in_progress').length
+  const fixedCount = items.filter(t => t.status === 'fixed').length
+  const flakyCount = items.filter(t => t.status === 'flaky').length
+
+  // Zaehle nach Prioritaet (nur bei PostgreSQL)
+  const criticalCount = backlogItems?.filter(t => t.priority === 'critical').length || 0
+  const highCount = backlogItems?.filter(t => t.priority === 'high').length || 0
+
+  if (isLoading) {
+    return (
+      <div className="flex items-center justify-center py-12">
+        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-orange-600"></div>
+      </div>
+    )
+  }
+
+  // Konvertiere BacklogItem zu FailedTest fuer die Anzeige
+  const convertToFailedTest = (item: BacklogItem): FailedTest => ({
+    id: String(item.id),
+    name: item.test_name,
+    service: item.service,
+    file_path: item.test_file || '',
+    error_message: item.error_message || '',
+    error_type: item.error_type || 'unknown',
+    suggestion: item.fix_suggestion || '',
+    run_id: '',
+    last_failed: item.last_failed_at,
+    status: item.status,
+  })
+
+  return (
+    <div className="space-y-6">
+      {/* Stats */}
+      <div className="grid grid-cols-2 md:grid-cols-5 gap-4">
+        <div className="bg-red-50 border border-red-200 rounded-xl p-4">
+          <p className="text-2xl font-bold text-red-600">{openCount}</p>
+          <p className="text-sm text-red-700">Offene Fehler</p>
+        </div>
+        <div className="bg-blue-50 border border-blue-200 rounded-xl p-4">
+          <p className="text-2xl font-bold text-blue-600">{inProgressCount}</p>
+          <p className="text-sm text-blue-700">In Arbeit</p>
+        </div>
+        <div className="bg-emerald-50 border border-emerald-200 rounded-xl p-4">
+          <p className="text-2xl font-bold text-emerald-600">{fixedCount}</p>
+          <p className="text-sm text-emerald-700">Behoben</p>
+        </div>
+        <div className="bg-purple-50 border border-purple-200 rounded-xl p-4">
+          <p className="text-2xl font-bold text-purple-600">{flakyCount}</p>
+          <p className="text-sm text-purple-700">Flaky</p>
+        </div>
+        {usePostgres && criticalCount + highCount > 0 && (
+          <div className="bg-orange-50 border border-orange-200 rounded-xl p-4">
+            <p className="text-2xl font-bold text-orange-600">{criticalCount + highCount}</p>
+            <p className="text-sm text-orange-700">Kritisch/Hoch</p>
+          </div>
+        )}
+      </div>
+
+      {/* PostgreSQL Badge */}
+      {usePostgres && (
+        <div className="flex items-center gap-2 px-3 py-1.5 bg-emerald-50 border border-emerald-200 rounded-lg w-fit">
+          <svg className="w-4 h-4 text-emerald-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
+          </svg>
+          <span className="text-xs text-emerald-700 font-medium">Persistente Speicherung aktiv (PostgreSQL)</span>
+        </div>
+      )}
+
+      {/* LLM Analysis Toggle */}
+      <div className="bg-gradient-to-r from-violet-50 to-purple-50 border border-violet-200 rounded-xl p-4">
+        <div className="flex items-center justify-between">
+          <div className="flex items-center gap-3">
+            <div className="w-10 h-10 bg-violet-100 rounded-lg flex items-center justify-center">
+              <svg className="w-5 h-5 text-violet-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
+              </svg>
+            </div>
+            <div>
+              <h4 className="font-medium text-slate-800">Automatische LLM-Analyse</h4>
+              <p className="text-xs text-slate-500">KI-gestuetzte Fix-Vorschlaege fuer Backlog-Eintraege</p>
+            </div>
+          </div>
+          <label className="relative inline-flex items-center cursor-pointer">
+            <input
+              type="checkbox"
+              checked={llmAutoAnalysis}
+              onChange={(e) => setLlmAutoAnalysis(e.target.checked)}
+              className="sr-only peer"
+            />
+            <div className="w-11 h-6 bg-slate-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-violet-300 rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-slate-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-violet-600"></div>
+          </label>
+        </div>
+
+        {llmAutoAnalysis && (
+          <div className="mt-4 pt-4 border-t border-violet-200">
+            <p className="text-xs text-slate-600 mb-3">LLM-Routing Strategie:</p>
+            <div className="flex flex-wrap gap-2">
+              {([
+                { value: 'local_only' as const, label: 'Nur lokales 32B LLM', badge: 'DSGVO', badgeColor: 'bg-emerald-100 text-emerald-700' },
+                { value: 'claude_preferred' as const, label: 'Claude bevorzugt', badge: 'Qualitaet', badgeColor: 'bg-blue-100 text-blue-700' },
+                { value: 'smart_routing' as const, label: 'Smart Routing', badge: 'Empfohlen', badgeColor: 'bg-amber-100 text-amber-700' },
+              ]).map((option) => (
+                <label key={option.value} className={`flex items-center gap-2 px-3 py-2 rounded-lg border cursor-pointer transition-colors ${
+                  llmRouting === option.value
+                    ? 'bg-violet-100 border-violet-300 text-violet-800'
+                    : 'bg-white border-slate-200 text-slate-600 hover:bg-slate-50'
+                }`}>
+                  <input
+                    type="radio"
+                    name="llm-routing"
+                    value={option.value}
+                    checked={llmRouting === option.value}
+                    onChange={() => setLlmRouting(option.value)}
+                    className="sr-only"
+                  />
+                  <span className="text-sm font-medium">{option.label}</span>
+                  <span className={`text-xs px-1.5 py-0.5 ${option.badgeColor} rounded`}>{option.badge}</span>
+                </label>
+              ))}
+            </div>
+            <p className="text-xs text-slate-500 mt-2">
+              {llmRouting === 'local_only' && 'Alle Analysen werden mit Qwen2.5-32B lokal durchgefuehrt. Keine Daten verlassen den Server.'}
+              {llmRouting === 'claude_preferred' && 'Verwendet Claude fuer beste Fix-Qualitaet. Nur Code-Snippets werden uebertragen.'}
+              {llmRouting === 'smart_routing' && 'Privacy Classifier entscheidet automatisch: Sensitive Daten → lokal, Code → Claude.'}
+            </p>
+          </div>
+        )}
+      </div>
+
+      {/* Filter */}
+      <div className="flex flex-wrap gap-4 items-center">
+        <div>
+          <label className="text-sm text-slate-600 mr-2">Status:</label>
+          <select
+            value={filterStatus}
+            onChange={(e) => setFilterStatus(e.target.value)}
+            className="px-3 py-1.5 rounded-lg border border-slate-200 text-sm"
+          >
+            <option value="all">Alle</option>
+            <option value="open">Offen ({openCount})</option>
+            <option value="in_progress">In Arbeit ({inProgressCount})</option>
+            <option value="fixed">Behoben ({fixedCount})</option>
+            <option value="flaky">Flaky ({flakyCount})</option>
+            <option value="wont_fix">Ignoriert</option>
+          </select>
+        </div>
+        <div>
+          <label className="text-sm text-slate-600 mr-2">Service:</label>
+          <select
+            value={filterService}
+            onChange={(e) => setFilterService(e.target.value)}
+            className="px-3 py-1.5 rounded-lg border border-slate-200 text-sm"
+          >
+            <option value="all">Alle Services</option>
+            {services.map(s => (
+              <option key={s} value={s}>{s}</option>
+            ))}
+          </select>
+        </div>
+        {usePostgres && (
+          <div>
+            <label className="text-sm text-slate-600 mr-2">Prioritaet:</label>
+            <select
+              value={filterPriority}
+              onChange={(e) => setFilterPriority(e.target.value)}
+              className="px-3 py-1.5 rounded-lg border border-slate-200 text-sm"
+            >
+              <option value="all">Alle</option>
+              <option value="critical">Kritisch</option>
+              <option value="high">Hoch</option>
+              <option value="medium">Mittel</option>
+              <option value="low">Niedrig</option>
+            </select>
+          </div>
+        )}
+        <div className="ml-auto text-sm text-slate-500">
+          {filteredItems.length} von {items.length} Tests angezeigt
+        </div>
+      </div>
+
+      {/* Test-Liste */}
+      {filteredItems.length === 0 ? (
+        <div className="text-center py-12 bg-emerald-50 rounded-xl border border-emerald-200">
+          <svg className="w-12 h-12 mx-auto text-emerald-400 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+          <p className="text-emerald-700 font-medium">
+            {filterStatus === 'open' ? 'Keine offenen Fehler! 🎉' : 'Keine Tests mit diesem Filter gefunden.'}
+          </p>
+          {filterStatus === 'open' && (
+            <p className="text-sm text-emerald-600 mt-2">
+              Alle Tests bestanden. Bereit fuer Go-Live!
+            </p>
+          )}
+        </div>
+      ) : (
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
+          {filteredItems.map((item) => {
+            const test = usePostgres && 'test_name' in item
+              ? convertToFailedTest(item as BacklogItem)
+              : item as FailedTest
+            const itemPriority = usePostgres && 'priority' in item
+              ? (item as BacklogItem).priority
+              : 'medium'
+            const failureCount = usePostgres && 'failure_count' in item
+              ? (item as BacklogItem).failure_count
+              : 1
+
+            return (
+              <FailedTestCard
+                key={test.id}
+                test={test}
+                onStatusChange={onStatusChange}
+                onPriorityChange={onPriorityChange}
+                priority={itemPriority}
+                failureCount={failureCount}
+              />
+            )
+          })}
+        </div>
+      )}
+
+      {/* Info */}
+      <div className="bg-blue-50 border border-blue-200 rounded-xl p-4">
+        <div className="flex items-start gap-3">
+          <svg className="w-5 h-5 text-blue-600 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+          <div>
+            <p className="text-sm text-blue-800 font-medium">Workflow fuer fehlgeschlagene Tests:</p>
+            <ol className="text-xs text-blue-700 mt-2 space-y-1 list-decimal list-inside">
+              <li>Markiere den Test als "In Arbeit" wenn du daran arbeitest</li>
+              <li>Analysiere die Fehlermeldung und den Loesungsvorschlag</li>
+              <li>Behebe den Fehler im Code</li>
+              <li>Fuehre den Test erneut aus (Button im Service-Tab)</li>
+              <li>Markiere als "Behoben" wenn der Test besteht</li>
+              {usePostgres && <li>Setze "Flaky" fuer sporadisch fehlschlagende Tests</li>}
+            </ol>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/CoverageChart.tsx

@@ -0,0 +1,42 @@
+'use client'
+
+import type { CoverageData } from '../types'
+
+export function CoverageChart({ data }: { data: CoverageData[] }) {
+  if (data.length === 0) {
+    return (
+      <div className="text-center py-8 text-slate-400">
+        Keine Coverage-Daten verfuegbar
+      </div>
+    )
+  }
+
+  const sortedData = [...data].sort((a, b) => b.coverage_percent - a.coverage_percent)
+
+  return (
+    <div className="space-y-3">
+      {sortedData.map((item) => (
+        <div key={item.service}>
+          <div className="flex items-center justify-between text-sm mb-1">
+            <span className="text-slate-600 truncate max-w-[200px]">{item.display_name}</span>
+            <span
+              className={`font-medium ${
+                item.coverage_percent >= 80 ? 'text-emerald-600' : item.coverage_percent >= 60 ? 'text-amber-600' : 'text-red-600'
+              }`}
+            >
+              {item.coverage_percent.toFixed(1)}%
+            </span>
+          </div>
+          <div className="h-2 bg-slate-100 rounded-full overflow-hidden">
+            <div
+              className={`h-full rounded-full transition-all ${
+                item.coverage_percent >= 80 ? 'bg-emerald-500' : item.coverage_percent >= 60 ? 'bg-amber-500' : 'bg-red-500'
+              }`}
+              style={{ width: `${item.coverage_percent}%` }}
+            />
+          </div>
+        </div>
+      ))}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/FrameworkDistribution.tsx

@@ -0,0 +1,43 @@
+'use client'
+
+export function FrameworkDistribution({ data }: { data: Record<string, number> }) {
+  const total = Object.values(data).reduce((a, b) => a + b, 0)
+  if (total === 0) return null
+
+  const frameworkLabels: Record<string, string> = {
+    go_test: 'Go Tests',
+    pytest: 'Python (pytest)',
+    jest: 'Jest (TS)',
+    vitest: 'Vitest (SDK)',
+    playwright: 'Playwright (E2E)',
+    bqas_golden: 'BQAS Golden',
+    bqas_rag: 'BQAS RAG',
+    bqas_synthetic: 'BQAS Synthetic',
+  }
+
+  const frameworkColors: Record<string, string> = {
+    go_test: 'bg-cyan-500',
+    pytest: 'bg-yellow-500',
+    jest: 'bg-blue-500',
+    vitest: 'bg-orange-500',
+    playwright: 'bg-purple-500',
+    bqas_golden: 'bg-emerald-500',
+    bqas_rag: 'bg-teal-500',
+    bqas_synthetic: 'bg-amber-500',
+  }
+
+  return (
+    <div className="space-y-3">
+      {Object.entries(data)
+        .sort((a, b) => b[1] - a[1])
+        .map(([framework, count]) => (
+          <div key={framework} className="flex items-center gap-3">
+            <div className={`w-3 h-3 rounded-full ${frameworkColors[framework] || 'bg-slate-400'}`} />
+            <span className="text-sm text-slate-600 flex-1">{frameworkLabels[framework] || framework}</span>
+            <span className="text-sm font-medium text-slate-900">{count}</span>
+            <span className="text-xs text-slate-400">({((count / total) * 100).toFixed(0)}%)</span>
+          </div>
+        ))}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/GuideTab.tsx

@@ -0,0 +1,232 @@
+'use client'
+
+import Link from 'next/link'
+
+export function GuideTab() {
+  return (
+    <div className="space-y-8">
+      <div className="bg-gradient-to-r from-orange-50 to-amber-50 rounded-xl border border-orange-200 p-6">
+        <h2 className="text-xl font-bold text-slate-900 mb-4 flex items-center gap-2">
+          <svg className="w-6 h-6 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
+          </svg>
+          Was ist das Test Dashboard?
+        </h2>
+        <p className="text-slate-700 leading-relaxed">
+          Das <strong>Test Dashboard</strong> ist die zentrale Uebersicht fuer alle 260+ Tests im Breakpilot-System.
+          Es aggregiert Tests aus verschiedenen Services (Go, Python, TypeScript) ohne diese physisch zu migrieren.
+          Tests bleiben an ihren konventionellen Orten, werden aber hier zentral ueberwacht und ausgefuehrt.
+          Seit 2026-02 inklusive AI Compliance SDK Unit Tests (Vitest) und E2E Tests (Playwright).
+        </p>
+      </div>
+
+      <div className="bg-white rounded-xl border border-slate-200 p-6">
+        <h3 className="text-lg font-semibold text-slate-900 mb-4">Test-Kategorien</h3>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
+          <div className="p-4 bg-cyan-50 rounded-lg border border-cyan-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🐹</span>
+              <h4 className="font-medium text-cyan-800">Go Unit Tests (~57)</h4>
+            </div>
+            <p className="text-sm text-cyan-700">
+              consent-service, billing-service, school-service, edu-search-service, ai-compliance-sdk
+            </p>
+          </div>
+          <div className="p-4 bg-yellow-50 rounded-lg border border-yellow-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🐍</span>
+              <h4 className="font-medium text-yellow-800">Python Tests (~50)</h4>
+            </div>
+            <p className="text-sm text-yellow-700">
+              backend, voice-service, klausur-service, geo-service
+            </p>
+          </div>
+          <div className="p-4 bg-emerald-50 rounded-lg border border-emerald-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🎯</span>
+              <h4 className="font-medium text-emerald-800">BQAS Golden (97)</h4>
+            </div>
+            <p className="text-sm text-emerald-700">
+              Validierte Referenz-Tests mit LLM-Judge fuer Intent-Erkennung
+            </p>
+          </div>
+          <div className="p-4 bg-teal-50 rounded-lg border border-teal-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">📚</span>
+              <h4 className="font-medium text-teal-800">BQAS RAG (~20)</h4>
+            </div>
+            <p className="text-sm text-teal-700">
+              RAG-Judge Tests fuer Retrieval, Citations, Hallucination-Control
+            </p>
+          </div>
+          <div className="p-4 bg-blue-50 rounded-lg border border-blue-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">📘</span>
+              <h4 className="font-medium text-blue-800">TypeScript Jest (~8)</h4>
+            </div>
+            <p className="text-sm text-blue-700">
+              Website Unit Tests fuer React-Komponenten
+            </p>
+          </div>
+          <div className="p-4 bg-orange-50 rounded-lg border border-orange-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">⚡</span>
+              <h4 className="font-medium text-orange-800">SDK Vitest (~43)</h4>
+            </div>
+            <p className="text-sm text-orange-700">
+              AI Compliance SDK Unit Tests: Types, Export, Components, Reducer
+            </p>
+          </div>
+          <div className="p-4 bg-purple-50 rounded-lg border border-purple-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🎭</span>
+              <h4 className="font-medium text-purple-800">SDK Playwright (~25)</h4>
+            </div>
+            <p className="text-sm text-purple-700">
+              SDK E2E Tests: Navigation, Workflow, Command Bar, Export
+            </p>
+          </div>
+          <div className="p-4 bg-slate-50 rounded-lg border border-slate-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🌐</span>
+              <h4 className="font-medium text-slate-800">Website E2E (~5)</h4>
+            </div>
+            <p className="text-sm text-slate-700">
+              End-to-End Tests fuer kritische User Flows
+            </p>
+          </div>
+          <div className="p-4 bg-indigo-50 rounded-lg border border-indigo-200">
+            <div className="flex items-center gap-2 mb-2">
+              <span className="text-xl">🔗</span>
+              <h4 className="font-medium text-indigo-800">Integration Tests (~15)</h4>
+            </div>
+            <p className="text-sm text-indigo-700">
+              Docker Compose basierte E2E-Tests mit Backend, Consent-Service, DB
+            </p>
+          </div>
+        </div>
+      </div>
+
+      <div className="bg-white rounded-xl border border-slate-200 p-6">
+        <h3 className="text-lg font-semibold text-slate-900 mb-4">Architektur</h3>
+        <pre className="bg-slate-50 p-4 rounded-lg text-xs overflow-x-auto">
+{`┌────────────────────────────────────────────────────────────────────┐
+│               Admin-v2 Test Dashboard                               │
+│               /infrastructure/tests                                 │
+├────────────────────────────────────────────────────────────────────┤
+│  ┌────────────┐  ┌────────────┐  ┌────────────┐  ┌─────────────┐  │
+│  │ Unit Tests │  │ SDK Tests  │  │   BQAS     │  │ E2E Tests   │  │
+│  │  (Go, Py)  │  │  (Vitest)  │  │ (LLM/RAG)  │  │ (Playwright)│  │
+│  └────────────┘  └────────────┘  └────────────┘  └─────────────┘  │
+│        │               │               │               │           │
+│        ▼               ▼               ▼               ▼           │
+│  ┌──────────────────────────────────────────────────────────────┐ │
+│  │                    Test Registry API                          │ │
+│  │              /backend/api/tests/registry.py                   │ │
+│  └──────────────────────────────────────────────────────────────┘ │
+└────────────────────────────────────────────────────────────────────┘
+
+Tests bleiben wo sie sind:
+- /consent-service/internal/**/*_test.go
+- /backend/tests/test_*.py
+- /voice-service/tests/bqas/
+- /admin-v2/components/sdk/__tests__/*.test.ts   (Vitest)
+- /admin-v2/e2e/specs/*.spec.ts                  (Playwright)`}
+        </pre>
+      </div>
+
+      {/* CI/CD Workflow Anleitung */}
+      <div className="bg-blue-50 rounded-xl border border-blue-200 p-6">
+        <h3 className="text-lg font-semibold text-blue-900 mb-4 flex items-center gap-2">
+          <svg className="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+          </svg>
+          CI/CD Integration
+        </h3>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <div>
+            <h4 className="font-medium text-blue-800 mb-2">🤖 Automatisch (bei jedem Push/PR)</h4>
+            <ul className="space-y-2 text-sm text-blue-700">
+              <li className="flex items-start gap-2">
+                <span className="text-green-500 mt-1">✓</span>
+                <span><strong>Unit Tests</strong> - Go & Python Tests laufen automatisch</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-green-500 mt-1">✓</span>
+                <span><strong>Test-Ergebnisse</strong> - Werden ans Dashboard gesendet</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-green-500 mt-1">✓</span>
+                <span><strong>Backlog</strong> - Fehlgeschlagene Tests erscheinen hier</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-green-500 mt-1">✓</span>
+                <span><strong>Linting</strong> - Code-Qualitaet bei PRs pruefen</span>
+              </li>
+            </ul>
+          </div>
+
+          <div>
+            <h4 className="font-medium text-blue-800 mb-2">👆 Manuell (Button oder Tag)</h4>
+            <ul className="space-y-2 text-sm text-blue-700">
+              <li className="flex items-start gap-2">
+                <span className="text-orange-500 mt-1">▶</span>
+                <span><strong>Docker Builds</strong> - Container erstellen</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-orange-500 mt-1">▶</span>
+                <span><strong>SBOM/Scans</strong> - Sicherheitsanalyse ausfuehren</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-orange-500 mt-1">▶</span>
+                <span><strong>Deployment</strong> - In Produktion deployen</span>
+              </li>
+              <li className="flex items-start gap-2">
+                <span className="text-orange-500 mt-1">▶</span>
+                <span><strong>Pipeline starten</strong> - Im CI/CD Dashboard</span>
+              </li>
+            </ul>
+          </div>
+        </div>
+
+        <div className="mt-4 pt-4 border-t border-blue-200">
+          <p className="text-sm text-blue-600">
+            <strong>Daten-Fluss:</strong> Gitea Actions → POST /api/tests/ci-result → PostgreSQL → Test Dashboard
+          </p>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+        <Link
+          href="/ai/test-quality"
+          className="p-4 bg-slate-50 rounded-lg border border-slate-200 hover:border-orange-300 hover:bg-orange-50 transition-colors"
+        >
+          <div className="flex items-center gap-3">
+            <svg className="w-8 h-8 text-slate-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+            <div>
+              <p className="font-medium text-slate-900">BQAS Dashboard</p>
+              <p className="text-xs text-slate-500">Detaillierte BQAS-Metriken und Trend-Analyse</p>
+            </div>
+          </div>
+        </Link>
+        <Link
+          href="/infrastructure/ci-cd"
+          className="p-4 bg-slate-50 rounded-lg border border-slate-200 hover:border-orange-300 hover:bg-orange-50 transition-colors"
+        >
+          <div className="flex items-center gap-3">
+            <svg className="w-8 h-8 text-slate-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+            <div>
+              <p className="font-medium text-slate-900">CI/CD Pipelines</p>
+              <p className="text-xs text-slate-500">Gitea Actions und automatische Test-Planung</p>
+            </div>
+          </div>
+        </Link>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/MetricCard.tsx

@@ -0,0 +1,55 @@
+'use client'
+
+export function MetricCard({
+  title,
+  value,
+  subtitle,
+  trend,
+  color = 'blue',
+}: {
+  title: string
+  value: string | number
+  subtitle?: string
+  trend?: 'up' | 'down' | 'stable'
+  color?: 'blue' | 'green' | 'red' | 'yellow' | 'orange' | 'purple'
+}) {
+  const colorClasses = {
+    blue: 'bg-blue-50 border-blue-200',
+    green: 'bg-emerald-50 border-emerald-200',
+    red: 'bg-red-50 border-red-200',
+    yellow: 'bg-amber-50 border-amber-200',
+    orange: 'bg-orange-50 border-orange-200',
+    purple: 'bg-purple-50 border-purple-200',
+  }
+
+  const trendIcons = {
+    up: (
+      <svg className="w-4 h-4 text-emerald-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 10l7-7m0 0l7 7m-7-7v18" />
+      </svg>
+    ),
+    down: (
+      <svg className="w-4 h-4 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 14l-7 7m0 0l-7-7m7 7V3" />
+      </svg>
+    ),
+    stable: (
+      <svg className="w-4 h-4 text-slate-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 12h14" />
+      </svg>
+    ),
+  }
+
+  return (
+    <div className={`rounded-xl border p-5 ${colorClasses[color]}`}>
+      <div className="flex items-start justify-between">
+        <div>
+          <p className="text-sm font-medium text-slate-600">{title}</p>
+          <p className="mt-1 text-2xl font-bold text-slate-900">{value}</p>
+          {subtitle && <p className="mt-1 text-xs text-slate-500">{subtitle}</p>}
+        </div>
+        {trend && <div className="mt-1">{trendIcons[trend]}</div>}
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/ServiceTestCard.tsx

@@ -0,0 +1,147 @@
+'use client'
+
+import type { ServiceTestInfo, ServiceProgress } from '../types'
+
+export function ServiceTestCard({
+  service,
+  onRun,
+  isRunning,
+  progress,
+}: {
+  service: ServiceTestInfo
+  onRun: (service: string) => void
+  isRunning: boolean
+  progress?: ServiceProgress
+}) {
+  const passRate = service.total_tests > 0 ? (service.passed_tests / service.total_tests) * 100 : 0
+
+  const getLanguageIcon = (lang: string) => {
+    switch (lang) {
+      case 'go':
+        return '🐹'
+      case 'python':
+        return '🐍'
+      case 'typescript':
+        return '📘'
+      case 'mixed':
+        return '🔀'
+      default:
+        return '📦'
+    }
+  }
+
+  const getStatusColor = (status: string) => {
+    switch (status) {
+      case 'passed':
+        return 'bg-emerald-100 text-emerald-700'
+      case 'failed':
+        return 'bg-red-100 text-red-700'
+      case 'running':
+        return 'bg-blue-100 text-blue-700'
+      default:
+        return 'bg-slate-100 text-slate-700'
+    }
+  }
+
+  return (
+    <div className="bg-white rounded-xl border border-slate-200 p-5 hover:border-orange-300 transition-colors">
+      <div className="flex items-start justify-between mb-4">
+        <div className="flex items-center gap-3">
+          <span className="text-2xl">{getLanguageIcon(service.language)}</span>
+          <div>
+            <h3 className="font-semibold text-slate-900">{service.display_name}</h3>
+            <p className="text-xs text-slate-500">
+              {service.port ? `Port ${service.port}` : 'Library'} • {service.language}
+            </p>
+          </div>
+        </div>
+        <span className={`px-2 py-1 rounded text-xs font-medium ${getStatusColor(service.status)}`}>
+          {service.status === 'passed' ? 'Bestanden' : service.status === 'failed' ? 'Fehler' : 'Ausstehend'}
+        </span>
+      </div>
+
+      <div className="space-y-3">
+        <div>
+          <div className="flex items-center justify-between text-sm mb-1">
+            <span className="text-slate-600">Pass Rate</span>
+            <span className="font-medium text-slate-900">{passRate.toFixed(0)}%</span>
+          </div>
+          <div className="h-2 bg-slate-100 rounded-full overflow-hidden">
+            <div
+              className={`h-full rounded-full transition-all ${
+                passRate >= 80 ? 'bg-emerald-500' : passRate >= 60 ? 'bg-amber-500' : 'bg-red-500'
+              }`}
+              style={{ width: `${passRate}%` }}
+            />
+          </div>
+        </div>
+
+        <div className="grid grid-cols-3 gap-2 text-center">
+          <div className="p-2 bg-slate-50 rounded-lg">
+            <p className="text-lg font-bold text-slate-900">{service.total_tests}</p>
+            <p className="text-xs text-slate-500">Tests</p>
+          </div>
+          <div className="p-2 bg-emerald-50 rounded-lg">
+            <p className="text-lg font-bold text-emerald-600">{service.passed_tests}</p>
+            <p className="text-xs text-slate-500">Bestanden</p>
+          </div>
+          <div className="p-2 bg-red-50 rounded-lg">
+            <p className="text-lg font-bold text-red-600">{service.failed_tests}</p>
+            <p className="text-xs text-slate-500">Fehler</p>
+          </div>
+        </div>
+
+        {service.coverage_percent && (
+          <div className="flex items-center justify-between text-sm pt-2 border-t border-slate-100">
+            <span className="text-slate-600">Coverage</span>
+            <span className={`font-medium ${service.coverage_percent >= 70 ? 'text-emerald-600' : 'text-amber-600'}`}>
+              {service.coverage_percent.toFixed(1)}%
+            </span>
+          </div>
+        )}
+
+        {/* Progress-Anzeige wenn Tests laufen */}
+        {isRunning && progress && progress.status === 'running' && (
+          <div className="mb-3 p-3 bg-orange-50 rounded-lg border border-orange-200">
+            <div className="flex items-center justify-between text-xs text-orange-700 mb-2">
+              <span className="font-mono truncate max-w-[180px]">{progress.current_file || 'Starte...'}</span>
+              <span>{progress.files_done}/{progress.files_total} Dateien</span>
+            </div>
+            <div className="h-1.5 bg-orange-100 rounded-full overflow-hidden">
+              <div
+                className="h-full bg-orange-500 rounded-full transition-all"
+                style={{ width: `${progress.files_total > 0 ? (progress.files_done / progress.files_total) * 100 : 0}%` }}
+              />
+            </div>
+            <div className="flex items-center justify-between mt-2 text-xs">
+              <span className="text-emerald-600 font-medium">{progress.passed} bestanden</span>
+              <span className="text-red-600 font-medium">{progress.failed} fehler</span>
+            </div>
+          </div>
+        )}
+
+        <button
+          onClick={() => onRun(service.service)}
+          disabled={isRunning}
+          className={`w-full py-2 rounded-lg text-sm font-medium transition-all ${
+            isRunning
+              ? 'bg-orange-100 text-orange-600 cursor-wait'
+              : 'bg-orange-600 text-white hover:bg-orange-700 active:scale-98'
+          }`}
+        >
+          {isRunning ? (
+            <span className="flex items-center justify-center gap-2">
+              <svg className="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
+                <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
+                <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z" />
+              </svg>
+              {progress && progress.status === 'running' ? `${progress.passed + progress.failed} Tests...` : 'Laeuft...'}
+            </span>
+          ) : (
+            'Tests starten'
+          )}
+        </button>
+      </div>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/TestRunsTable.tsx

@@ -0,0 +1,66 @@
+'use client'
+
+import type { TestRun } from '../types'
+
+export function TestRunsTable({ runs }: { runs: TestRun[] }) {
+  if (runs.length === 0) {
+    return (
+      <div className="text-center py-8 text-slate-400">
+        Keine Test-Laeufe vorhanden
+      </div>
+    )
+  }
+
+  return (
+    <div className="overflow-x-auto">
+      <table className="w-full text-sm">
+        <thead>
+          <tr className="border-b border-slate-200">
+            <th className="text-left py-3 px-4 font-medium text-slate-600">ID</th>
+            <th className="text-left py-3 px-4 font-medium text-slate-600">Service</th>
+            <th className="text-left py-3 px-4 font-medium text-slate-600">Zeitpunkt</th>
+            <th className="text-right py-3 px-4 font-medium text-slate-600">Tests</th>
+            <th className="text-right py-3 px-4 font-medium text-slate-600">Bestanden</th>
+            <th className="text-right py-3 px-4 font-medium text-slate-600">Dauer</th>
+            <th className="text-center py-3 px-4 font-medium text-slate-600">Status</th>
+          </tr>
+        </thead>
+        <tbody>
+          {runs.map((run) => (
+            <tr key={run.id} className="border-b border-slate-100 hover:bg-slate-50">
+              <td className="py-3 px-4 font-mono text-xs text-slate-500">{run.id.slice(-8)}</td>
+              <td className="py-3 px-4 text-slate-900">{run.service}</td>
+              <td className="py-3 px-4 text-slate-600">
+                {new Date(run.started_at).toLocaleString('de-DE')}
+              </td>
+              <td className="py-3 px-4 text-right text-slate-600">{run.total_tests}</td>
+              <td className="py-3 px-4 text-right">
+                <span className="text-emerald-600">{run.passed_tests}</span>
+                <span className="text-slate-400"> / </span>
+                <span className="text-red-600">{run.failed_tests}</span>
+              </td>
+              <td className="py-3 px-4 text-right text-slate-500">
+                {run.duration_seconds.toFixed(1)}s
+              </td>
+              <td className="py-3 px-4 text-center">
+                <span
+                  className={`px-2 py-1 rounded text-xs font-medium ${
+                    run.status === 'completed'
+                      ? 'bg-emerald-100 text-emerald-700'
+                      : run.status === 'failed'
+                        ? 'bg-red-100 text-red-700'
+                        : run.status === 'running'
+                          ? 'bg-blue-100 text-blue-700'
+                          : 'bg-slate-100 text-slate-700'
+                  }`}
+                >
+                  {run.status}
+                </span>
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_components/ToastContainer.tsx

@@ -0,0 +1,55 @@
+'use client'
+
+import type { Toast } from '../types'
+
+export function ToastContainer({ toasts, onDismiss }: { toasts: Toast[]; onDismiss: (id: number) => void }) {
+  return (
+    <div className="fixed bottom-4 right-4 z-50 space-y-2">
+      {toasts.map((toast) => (
+        <div
+          key={toast.id}
+          className={`flex items-center gap-3 px-4 py-3 rounded-lg shadow-lg border animate-slide-in ${
+            toast.type === 'success'
+              ? 'bg-emerald-50 border-emerald-200 text-emerald-800'
+              : toast.type === 'error'
+                ? 'bg-red-50 border-red-200 text-red-800'
+                : toast.type === 'loading'
+                  ? 'bg-blue-50 border-blue-200 text-blue-800'
+                  : 'bg-slate-50 border-slate-200 text-slate-800'
+          }`}
+        >
+          {toast.type === 'loading' ? (
+            <svg className="animate-spin h-5 w-5" fill="none" viewBox="0 0 24 24">
+              <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
+              <path
+                className="opacity-75"
+                fill="currentColor"
+                d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+              />
+            </svg>
+          ) : toast.type === 'success' ? (
+            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
+            </svg>
+          ) : toast.type === 'error' ? (
+            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          ) : (
+            <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+            </svg>
+          )}
+          <span className="text-sm font-medium">{toast.message}</span>
+          {toast.type !== 'loading' && (
+            <button onClick={() => onDismiss(toast.id)} className="ml-2 opacity-60 hover:opacity-100">
+              <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
+              </svg>
+            </button>
+          )}
+        </div>
+      ))}
+    </div>
+  )
+}

admin-core/app/(admin)/infrastructure/tests/_hooks/useTestDashboard.ts

@@ -0,0 +1,313 @@
+'use client'
+
+import { useState, useEffect, useCallback, useRef } from 'react'
+import type {
+  ServiceTestInfo,
+  TestRegistryStats,
+  TestRun,
+  CoverageData,
+  TabType,
+  Toast,
+  FailedTest,
+  BacklogItem,
+  ServiceProgress,
+} from '../types'
+
+const API_BASE = '/api/tests'
+
+// Demo data for when API is not available
+const DEMO_SERVICES: ServiceTestInfo[] = [
+  { service: 'consent-service', display_name: 'Consent Service', port: 8081, language: 'go', total_tests: 22, passed_tests: 20, failed_tests: 2, skipped_tests: 0, pass_rate: 90.9, coverage_percent: 82.3, last_run: new Date().toISOString(), status: 'failed' },
+  { service: 'backend', display_name: 'Python Backend', port: 8000, language: 'python', total_tests: 40, passed_tests: 38, failed_tests: 2, skipped_tests: 0, pass_rate: 95.0, coverage_percent: 75.1, last_run: new Date().toISOString(), status: 'failed' },
+  { service: 'klausur-service', display_name: 'Klausur Service', port: 8086, language: 'python', total_tests: 8, passed_tests: 8, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: 71.2, last_run: new Date().toISOString(), status: 'passed' },
+  { service: 'billing-service', display_name: 'Billing Service', port: 8082, language: 'go', total_tests: 5, passed_tests: 5, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: 78.5, last_run: new Date().toISOString(), status: 'passed' },
+  { service: 'school-service', display_name: 'School Service', port: 8084, language: 'go', total_tests: 6, passed_tests: 6, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: 81.4, last_run: new Date().toISOString(), status: 'passed' },
+  { service: 'sdk-unit', display_name: 'SDK Unit Tests (Vitest)', port: undefined, language: 'typescript', total_tests: 43, passed_tests: 43, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: 85.2, last_run: new Date().toISOString(), status: 'passed' },
+  { service: 'sdk-e2e', display_name: 'SDK E2E Tests (Playwright)', port: undefined, language: 'typescript', total_tests: 25, passed_tests: 25, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: undefined, last_run: new Date().toISOString(), status: 'passed' },
+  { service: 'integration-tests', display_name: 'Integration Tests', port: undefined, language: 'python', total_tests: 15, passed_tests: 15, failed_tests: 0, skipped_tests: 0, pass_rate: 100, coverage_percent: undefined, last_run: new Date().toISOString(), status: 'passed' },
+]
+
+const DEMO_STATS: TestRegistryStats = {
+  total_tests: 278,
+  total_passed: 263,
+  total_failed: 15,
+  total_skipped: 0,
+  overall_pass_rate: 94.6,
+  average_coverage: 78.5,
+  services_count: 11,
+  by_category: { unit: 118, bqas: 117, e2e: 30, integration: 15 },
+  by_framework: { go_test: 57, pytest: 68, bqas_golden: 97, bqas_rag: 20, jest: 8, vitest: 43, playwright: 30 },
+}
+
+export function useTestDashboard() {
+  const [activeTab, setActiveTab] = useState<TabType>('overview')
+  const [isLoading, setIsLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+
+  // Toast state
+  const [toasts, setToasts] = useState<Toast[]>([])
+  const toastIdRef = useRef(0)
+
+  const addToast = useCallback((type: Toast['type'], message: string) => {
+    const id = ++toastIdRef.current
+    setToasts((prev) => [...prev, { id, type, message }])
+    if (type !== 'loading') {
+      setTimeout(() => {
+        setToasts((prev) => prev.filter((t) => t.id !== id))
+      }, 5000)
+    }
+    return id
+  }, [])
+
+  const removeToast = useCallback((id: number) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id))
+  }, [])
+
+  const updateToast = useCallback((id: number, type: Toast['type'], message: string) => {
+    setToasts((prev) => prev.map((t) => (t.id === id ? { ...t, type, message } : t)))
+    if (type !== 'loading') {
+      setTimeout(() => {
+        setToasts((prev) => prev.filter((t) => t.id !== id))
+      }, 5000)
+    }
+  }, [])
+
+  // Data states
+  const [services, setServices] = useState<ServiceTestInfo[]>([])
+  const [stats, setStats] = useState<TestRegistryStats | null>(null)
+  const [coverage, setCoverage] = useState<CoverageData[]>([])
+  const [testRuns, setTestRuns] = useState<TestRun[]>([])
+  const [failedTests, setFailedTests] = useState<FailedTest[]>([])
+  const [backlogItems, setBacklogItems] = useState<BacklogItem[]>([])
+  const [usePostgres, setUsePostgres] = useState(false)
+
+  // Running states
+  const [runningServices, setRunningServices] = useState<Set<string>>(new Set())
+
+  // Progress states fuer laufende Tests
+  const [serviceProgress, setServiceProgress] = useState<Record<string, ServiceProgress>>({})
+
+  // Fetch data
+  const fetchData = useCallback(async () => {
+    setIsLoading(true)
+    setError(null)
+
+    try {
+      const registryResponse = await fetch(`${API_BASE}/registry`)
+      if (registryResponse.ok) {
+        const data = await registryResponse.json()
+        setServices(data.services || DEMO_SERVICES)
+        setStats(data.stats || DEMO_STATS)
+      } else {
+        setServices(DEMO_SERVICES)
+        setStats(DEMO_STATS)
+      }
+
+      const coverageResponse = await fetch(`${API_BASE}/coverage`)
+      if (coverageResponse.ok) {
+        const data = await coverageResponse.json()
+        setCoverage(data.services || [])
+      } else {
+        setCoverage(DEMO_SERVICES.filter(s => s.coverage_percent).map(s => ({
+          service: s.service,
+          display_name: s.display_name,
+          coverage_percent: s.coverage_percent!,
+          language: s.language,
+        })))
+      }
+
+      const runsResponse = await fetch(`${API_BASE}/runs`)
+      if (runsResponse.ok) {
+        const data = await runsResponse.json()
+        setTestRuns(data.runs || [])
+      }
+
+      // Lade fehlgeschlagene Tests fuer Backlog
+      const failedResponse = await fetch(`${API_BASE}/failed`)
+      if (failedResponse.ok) {
+        const data = await failedResponse.json()
+        setFailedTests(data.tests || [])
+      }
+
+      // Versuche PostgreSQL-Backlog zu laden (neue API)
+      try {
+        const backlogResponse = await fetch(`${API_BASE}/backlog`)
+        if (backlogResponse.ok) {
+          const data = await backlogResponse.json()
+          if (data.items && data.items.length > 0) {
+            setBacklogItems(data.items)
+            setUsePostgres(true)
+          }
+        }
+      } catch {
+        // PostgreSQL nicht verfuegbar, nutze Legacy
+        setUsePostgres(false)
+      }
+
+    } catch (err) {
+      console.error('Failed to fetch test registry data:', err)
+      setServices(DEMO_SERVICES)
+      setStats(DEMO_STATS)
+      setCoverage(DEMO_SERVICES.filter(s => s.coverage_percent).map(s => ({
+        service: s.service,
+        display_name: s.display_name,
+        coverage_percent: s.coverage_percent!,
+        language: s.language,
+      })))
+    } finally {
+      setIsLoading(false)
+    }
+  }, [])
+
+  useEffect(() => {
+    fetchData()
+  }, [fetchData])
+
+  // Update failed test status
+  const updateTestStatus = async (testId: string, status: string) => {
+    try {
+      const endpoint = usePostgres
+        ? `${API_BASE}/backlog/${testId}/status`
+        : `${API_BASE}/failed/${encodeURIComponent(testId)}/status?status=${status}`
+
+      const response = await fetch(endpoint, {
+        method: 'POST',
+        headers: usePostgres ? { 'Content-Type': 'application/json' } : undefined,
+        body: usePostgres ? JSON.stringify({ status }) : undefined,
+      })
+
+      if (response.ok) {
+        if (usePostgres) {
+          setBacklogItems(prev =>
+            prev.map(t => String(t.id) === testId ? { ...t, status: status as any } : t)
+          )
+        }
+        setFailedTests(prev =>
+          prev.map(t => t.id === testId ? { ...t, status: status as any } : t)
+        )
+        addToast('success', `Test-Status auf "${status}" gesetzt`)
+      }
+    } catch (err) {
+      console.error('Failed to update test status:', err)
+      setFailedTests(prev =>
+        prev.map(t => t.id === testId ? { ...t, status: status as any } : t)
+      )
+      if (usePostgres) {
+        setBacklogItems(prev =>
+          prev.map(t => String(t.id) === testId ? { ...t, status: status as any } : t)
+        )
+      }
+    }
+  }
+
+  // Update failed test priority (nur PostgreSQL)
+  const updateTestPriority = async (testId: string, priority: string) => {
+    if (!usePostgres) return
+
+    try {
+      const response = await fetch(`${API_BASE}/backlog/${testId}/priority`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ priority }),
+      })
+
+      if (response.ok) {
+        setBacklogItems(prev =>
+          prev.map(t => String(t.id) === testId ? { ...t, priority: priority as any } : t)
+        )
+        addToast('success', `Prioritaet auf "${priority}" gesetzt`)
+      }
+    } catch (err) {
+      console.error('Failed to update test priority:', err)
+      setBacklogItems(prev =>
+        prev.map(t => String(t.id) === testId ? { ...t, priority: priority as any } : t)
+      )
+    }
+  }
+
+  // Run tests mit Progress-Polling
+  const runTests = async (service: string) => {
+    setRunningServices((prev) => new Set(prev).add(service))
+    const loadingToast = addToast('loading', `Tests fuer ${service} werden gestartet...`)
+
+    // Progress-Polling starten
+    let pollInterval: NodeJS.Timeout | null = null
+    const pollProgress = async () => {
+      try {
+        const progressResponse = await fetch(`${API_BASE}/progress/${service}`)
+        if (progressResponse.ok) {
+          const progress = await progressResponse.json()
+          setServiceProgress((prev) => ({
+            ...prev,
+            [service]: progress,
+          }))
+
+          if (progress.status === 'running' && progress.files_total > 0) {
+            const toastMsg = `${service}: ${progress.current_file} (${progress.passed} bestanden, ${progress.failed} fehler)`
+            updateToast(loadingToast, 'loading', toastMsg)
+          }
+        }
+      } catch (err) {
+        // Ignore polling errors
+      }
+    }
+
+    pollInterval = setInterval(pollProgress, 1000)
+
+    try {
+      const response = await fetch(`${API_BASE}/run/${service}`, {
+        method: 'POST',
+      })
+
+      if (response.ok) {
+        await new Promise(resolve => setTimeout(resolve, 500))
+        await pollProgress()
+        const finalProgress = serviceProgress[service]
+        const passedMsg = finalProgress ? `${finalProgress.passed} bestanden, ${finalProgress.failed} fehler` : 'abgeschlossen'
+        updateToast(loadingToast, 'success', `${service}: Tests ${passedMsg}`)
+        await fetchData()
+      } else {
+        updateToast(loadingToast, 'info', `${service}: Demo-Modus (API nicht verfuegbar)`)
+      }
+    } catch (err) {
+      console.error('Failed to run tests:', err)
+      updateToast(loadingToast, 'info', `${service}: Demo-Modus (API nicht verfuegbar)`)
+    } finally {
+      if (pollInterval) {
+        clearInterval(pollInterval)
+      }
+      setRunningServices((prev) => {
+        const next = new Set(prev)
+        next.delete(service)
+        return next
+      })
+      setServiceProgress((prev) => {
+        const next = { ...prev }
+        delete next[service]
+        return next
+      })
+    }
+  }
+
+  return {
+    activeTab,
+    setActiveTab,
+    isLoading,
+    error,
+    toasts,
+    removeToast,
+    services,
+    stats,
+    coverage,
+    testRuns,
+    failedTests,
+    backlogItems,
+    usePostgres,
+    runningServices,
+    serviceProgress,
+    fetchData,
+    updateTestStatus,
+    updateTestPriority,
+    runTests,
+  }
+}

admin-core/app/(admin)/infrastructure/tests/types.ts

@@ -0,0 +1,102 @@
+/**
+ * Types for Test Dashboard
+ */
+
+export interface ServiceTestInfo {
+  service: string
+  display_name: string
+  port?: number
+  language: string
+  total_tests: number
+  passed_tests: number
+  failed_tests: number
+  skipped_tests: number
+  pass_rate: number
+  coverage_percent?: number
+  last_run: string
+  status: string
+}
+
+export interface TestRegistryStats {
+  total_tests: number
+  total_passed: number
+  total_failed: number
+  total_skipped: number
+  overall_pass_rate: number
+  average_coverage: number
+  services_count: number
+  by_category: Record<string, number>
+  by_framework: Record<string, number>
+}
+
+export interface TestRun {
+  id: string
+  service: string
+  started_at: string
+  total_tests: number
+  passed_tests: number
+  failed_tests: number
+  duration_seconds: number
+  status: string
+}
+
+export interface CoverageData {
+  service: string
+  display_name: string
+  coverage_percent: number
+  language: string
+}
+
+export type TabType = 'overview' | 'unit' | 'bqas' | 'history' | 'backlog' | 'guide'
+
+export interface Toast {
+  id: number
+  type: 'success' | 'error' | 'loading' | 'info'
+  message: string
+}
+
+export interface FailedTest {
+  id: string
+  name: string
+  service: string
+  file_path: string
+  error_message: string
+  error_type: string
+  suggestion: string
+  run_id: string
+  last_failed: string
+  status: string
+}
+
+export type BacklogPriority = 'critical' | 'high' | 'medium' | 'low'
+export type BacklogStatus = 'open' | 'in_progress' | 'fixed' | 'wont_fix' | 'flaky'
+
+export interface BacklogItem {
+  id: number
+  test_name: string
+  service: string
+  test_file?: string
+  error_message?: string
+  error_type?: string
+  fix_suggestion?: string
+  priority: BacklogPriority
+  status: BacklogStatus
+  failure_count: number
+  last_failed_at: string
+}
+
+export interface TrendDataPoint {
+  date: string
+  passed: number
+  failed: number
+  total: number
+}
+
+export interface ServiceProgress {
+  current_file: string
+  files_done: number
+  files_total: number
+  passed: number
+  failed: number
+  status: string
+}

admin-core/components/infrastructure/DevOpsPipelineSidebar.tsx

@@ -20,108 +20,17 @@
 import Link from 'next/link'
 import { useState, useEffect } from 'react'
 import type {
-  DevOpsToolId,
   DevOpsPipelineSidebarProps,
   DevOpsPipelineSidebarResponsiveProps,
-  PipelineLiveStatus,
 } from '@/types/infrastructure-modules'
 import { DEVOPS_PIPELINE_MODULES } from '@/types/infrastructure-modules'
-
-// =============================================================================
-// Icons
-// =============================================================================
-
-const ToolIcon = ({ id }: { id: DevOpsToolId }) => {
-  switch (id) {
-    case 'ci-cd':
-      return (
-        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-            d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
-        </svg>
-      )
-    case 'tests':
-      return (
-        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-            d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
-        </svg>
-      )
-    case 'sbom':
-      return (
-        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-            d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4" />
-        </svg>
-      )
-    case 'security':
-      return (
-        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <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>
-      )
-    default:
-      return null
-  }
-}
-
-// Server/Pipeline Icon fuer Header
-const ServerIcon = () => (
-  <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-      d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2m-2-4h.01M17 16h.01" />
-  </svg>
-)
-
-// Play Icon fuer Quick Action
-const PlayIcon = () => (
-  <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-      d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
-    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
-      d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
-  </svg>
-)
-
-// =============================================================================
-// Live Status Hook (optional - fetches status from API)
-// =============================================================================
-
-function usePipelineLiveStatus(): PipelineLiveStatus | null {
-  const [status, setStatus] = useState<PipelineLiveStatus | null>(null)
-
-  useEffect(() => {
-    // Live status fetching not yet implemented
-  }, [])
-
-  return status
-}
-
-// =============================================================================
-// Status Badge Component
-// =============================================================================
-
-interface StatusBadgeProps {
-  count: number
-  type: 'backlog' | 'security' | 'running'
-}
-
-function StatusBadge({ count, type }: StatusBadgeProps) {
-  if (count === 0) return null
-
-  const colors = {
-    backlog: 'bg-amber-500',
-    security: 'bg-red-500',
-    running: 'bg-green-500 animate-pulse',
-  }
-
-  return (
-    <span className={`${colors[type]} text-white text-xs font-medium px-1.5 py-0.5 rounded-full min-w-[1.25rem] text-center`}>
-      {count}
-    </span>
-  )
-}
+import {
+  ToolIcon,
+  ServerIcon,
+  PlayIcon,
+  StatusBadge,
+  usePipelineLiveStatus,
+} from './DevOpsPipelineSidebarParts'
 
 // =============================================================================
 // Main Sidebar Component

admin-core/components/infrastructure/DevOpsPipelineSidebarParts.tsx

@@ -0,0 +1,106 @@
+'use client'
+
+/**
+ * DevOps Pipeline Sidebar — shared icons, badge, and live-status hook.
+ *
+ * Extracted from DevOpsPipelineSidebar.tsx to stay within the 500 LOC budget.
+ */
+
+import { useState, useEffect } from 'react'
+import type { DevOpsToolId, PipelineLiveStatus } from '@/types/infrastructure-modules'
+
+// =============================================================================
+// Icons
+// =============================================================================
+
+export const ToolIcon = ({ id }: { id: DevOpsToolId }) => {
+  switch (id) {
+    case 'ci-cd':
+      return (
+        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+            d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+        </svg>
+      )
+    case 'tests':
+      return (
+        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+            d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+        </svg>
+      )
+    case 'sbom':
+      return (
+        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+            d="M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4" />
+        </svg>
+      )
+    case 'security':
+      return (
+        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <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>
+      )
+    default:
+      return null
+  }
+}
+
+// Server/Pipeline Icon fuer Header
+export const ServerIcon = () => (
+  <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+      d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2m-2-4h.01M17 16h.01" />
+  </svg>
+)
+
+// Play Icon fuer Quick Action
+export const PlayIcon = () => (
+  <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+      d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
+    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
+      d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+  </svg>
+)
+
+// =============================================================================
+// Live Status Hook (optional - fetches status from API)
+// =============================================================================
+
+export function usePipelineLiveStatus(): PipelineLiveStatus | null {
+  const [status, setStatus] = useState<PipelineLiveStatus | null>(null)
+
+  useEffect(() => {
+    // Live status fetching not yet implemented
+  }, [])
+
+  return status
+}
+
+// =============================================================================
+// Status Badge Component
+// =============================================================================
+
+interface StatusBadgeProps {
+  count: number
+  type: 'backlog' | 'security' | 'running'
+}
+
+export function StatusBadge({ count, type }: StatusBadgeProps) {
+  if (count === 0) return null
+
+  const colors = {
+    backlog: 'bg-amber-500',
+    security: 'bg-red-500',
+    running: 'bg-green-500 animate-pulse',
+  }
+
+  return (
+    <span className={`${colors[type]} text-white text-xs font-medium px-1.5 py-0.5 rounded-full min-w-[1.25rem] text-center`}>
+      {count}
+    </span>
+  )
+}