refactor(developer-portal): split iace, docs, byoeh pages

Extract each page into colocated _components/ sections to bring
page.tsx files from 1008/891/769 LOC down to 57/23/21 LOC,
well within the 500-line hard cap.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sharang Parnerkar
2026-04-18 08:45:13 +02:00
parent a7fe32fb82
commit 9ec72ed681
25 changed files with 2182 additions and 2614 deletions

View File

@@ -0,0 +1,119 @@
import { CodeBlock, InfoBox } from '@/components/DevPortalLayout'
export function ComplianceEngineSection() {
return (
<>
<h2 id="compliance-engine">4. Die Compliance Engine: Wie Bewertungen funktionieren</h2>
<p>
Das Kernmodul des Compliance Hub ist die <strong>UCCA Engine</strong> (Unified Compliance
Control Assessment). Sie bewertet, ob ein geplanter KI-Anwendungsfall zulaessig ist.
</p>
<h3>4.1 Der Fragebogen (Use Case Intake)</h3>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Bereich</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Typische Fragen</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Warum relevant?</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">Datentypen</td><td className="px-4 py-3">Werden personenbezogene Daten verarbeitet? Besondere Kategorien (Art. 9)?</td><td className="px-4 py-3">Art. 9-Daten (Gesundheit, Religion, etc.) erfordern besondere Schutzmassnahmen</td></tr>
<tr><td className="px-4 py-3 font-medium">Verarbeitungszweck</td><td className="px-4 py-3">Wird Profiling betrieben? Scoring? Automatisierte Entscheidungen?</td><td className="px-4 py-3">Art. 22 DSGVO schuetzt vor vollautomatischen Entscheidungen</td></tr>
<tr><td className="px-4 py-3 font-medium">Modellnutzung</td><td className="px-4 py-3">Wird das Modell nur genutzt (Inference) oder mit Nutzerdaten trainiert (Fine-Tuning)?</td><td className="px-4 py-3">Training mit personenbezogenen Daten erfordert besondere Rechtsgrundlage</td></tr>
<tr><td className="px-4 py-3 font-medium">Automatisierungsgrad</td><td className="px-4 py-3">Assistenzsystem, teil- oder vollautomatisch?</td><td className="px-4 py-3">Vollautomatische Systeme unterliegen strengeren Auflagen</td></tr>
<tr><td className="px-4 py-3 font-medium">Datenspeicherung</td><td className="px-4 py-3">Wie lange werden Daten gespeichert? Wo?</td><td className="px-4 py-3">DSGVO Art. 5: Speicherbegrenzung / Zweckbindung</td></tr>
<tr><td className="px-4 py-3 font-medium">Hosting-Standort</td><td className="px-4 py-3">EU, USA, oder anderswo?</td><td className="px-4 py-3">Drittlandtransfers erfordern zusaetzliche Garantien (SCC, DPF)</td></tr>
<tr><td className="px-4 py-3 font-medium">Branche</td><td className="px-4 py-3">Gesundheit, Finanzen, Bildung, Automotive, ...?</td><td className="px-4 py-3">Bestimmte Branchen unterliegen zusaetzlichen Regulierungen</td></tr>
<tr><td className="px-4 py-3 font-medium">Menschliche Aufsicht</td><td className="px-4 py-3">Gibt es einen Human-in-the-Loop?</td><td className="px-4 py-3">AI Act fordert menschliche Aufsicht fuer Hochrisiko-KI</td></tr>
</tbody>
</table>
</div>
<h3>4.2 Die Pruefregeln (Policy Engine)</h3>
<p>
Die Antworten des Fragebogens werden gegen ein <strong>Regelwerk von ueber 45 Regeln</strong>
geprueft. Jede Regel ist in einer YAML-Datei definiert. Die Regeln sind in <strong>10 Kategorien</strong> organisiert:
</p>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Kategorie</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Regel-IDs</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Prueft</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Beispiel</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">A. Datenklassifikation</td><td className="px-4 py-3">R-001 bis R-006</td><td className="px-4 py-3">Welche Daten werden verarbeitet?</td><td className="px-4 py-3">R-001: Werden personenbezogene Daten verarbeitet? &rarr; +10 Risiko</td></tr>
<tr><td className="px-4 py-3 font-medium">B. Zweck &amp; Kontext</td><td className="px-4 py-3">R-010 bis R-013</td><td className="px-4 py-3">Warum und wie werden Daten genutzt?</td><td className="px-4 py-3">R-011: Profiling? &rarr; DSFA empfohlen</td></tr>
<tr><td className="px-4 py-3 font-medium">C. Automatisierung</td><td className="px-4 py-3">R-020 bis R-025</td><td className="px-4 py-3">Wie stark ist die Automatisierung?</td><td className="px-4 py-3">R-023: Vollautomatisch? &rarr; Art. 22 Risiko</td></tr>
<tr><td className="px-4 py-3 font-medium">D. Training vs. Nutzung</td><td className="px-4 py-3">R-030 bis R-035</td><td className="px-4 py-3">Wird das Modell trainiert?</td><td className="px-4 py-3">R-035: Training + Art. 9-Daten? &rarr; BLOCK</td></tr>
<tr><td className="px-4 py-3 font-medium">E. Speicherung</td><td className="px-4 py-3">R-040 bis R-042</td><td className="px-4 py-3">Wie lange werden Daten gespeichert?</td><td className="px-4 py-3">R-041: Unbegrenzte Speicherung? &rarr; WARN</td></tr>
<tr><td className="px-4 py-3 font-medium">F. Hosting</td><td className="px-4 py-3">R-050 bis R-052</td><td className="px-4 py-3">Wo werden Daten gehostet?</td><td className="px-4 py-3">R-051: Hosting in USA? &rarr; SCC/DPF pruefen</td></tr>
<tr><td className="px-4 py-3 font-medium">G. Transparenz</td><td className="px-4 py-3">R-060 bis R-062</td><td className="px-4 py-3">Werden Nutzer informiert?</td><td className="px-4 py-3">R-060: Keine Offenlegung? &rarr; AI Act Verstoss</td></tr>
<tr><td className="px-4 py-3 font-medium">H. Branchenspezifisch</td><td className="px-4 py-3">R-070 bis R-074</td><td className="px-4 py-3">Gelten Sonderregeln fuer die Branche?</td><td className="px-4 py-3">R-070: Gesundheitsbranche? &rarr; zusaetzliche Anforderungen</td></tr>
<tr><td className="px-4 py-3 font-medium">I. Aggregation</td><td className="px-4 py-3">R-090 bis R-092</td><td className="px-4 py-3">Meta-Regeln ueber andere Regeln</td><td className="px-4 py-3">R-090: Zu viele WARN-Regeln? &rarr; Gesamtrisiko erhoeht</td></tr>
<tr><td className="px-4 py-3 font-medium">J. Erklaerung</td><td className="px-4 py-3">R-100</td><td className="px-4 py-3">Warum hat das System so entschieden?</td><td className="px-4 py-3">Automatisch generierte Begruendung</td></tr>
</tbody>
</table>
</div>
<InfoBox type="info" title="Warum YAML-Regeln statt Code?">
Die Regeln sind bewusst in YAML-Dateien definiert: (1) Sie sind fuer Nicht-Programmierer
lesbar und damit <strong>auditierbar</strong>. (2) Sie koennen <strong>versioniert</strong>
werden -- wenn sich ein Gesetz aendert, wird die Regelaenderung im Versionsverlauf sichtbar.
</InfoBox>
<h3>4.3 Das Ergebnis: Die Compliance-Bewertung</h3>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Ergebnis</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Beschreibung</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr>
<td className="px-4 py-3 font-medium">Machbarkeit</td>
<td className="px-4 py-3">
<span className="inline-block px-2 py-0.5 rounded bg-green-100 text-green-800 text-xs font-bold mr-1">YES</span>
<span className="inline-block px-2 py-0.5 rounded bg-yellow-100 text-yellow-800 text-xs font-bold mr-1">CONDITIONAL</span>
<span className="inline-block px-2 py-0.5 rounded bg-red-100 text-red-800 text-xs font-bold">NO</span>
</td>
</tr>
<tr><td className="px-4 py-3 font-medium">Risikoscore</td><td className="px-4 py-3">0-100 Punkte. Je hoeher, desto mehr Massnahmen sind erforderlich.</td></tr>
<tr><td className="px-4 py-3 font-medium">Risikostufe</td><td className="px-4 py-3">MINIMAL / LOW / MEDIUM / HIGH / UNACCEPTABLE</td></tr>
<tr><td className="px-4 py-3 font-medium">Ausgeloeste Regeln</td><td className="px-4 py-3">Liste aller Regeln, die angeschlagen haben, mit Schweregrad und Gesetzesreferenz</td></tr>
<tr><td className="px-4 py-3 font-medium">Erforderliche Controls</td><td className="px-4 py-3">Konkrete Massnahmen, die umgesetzt werden muessen</td></tr>
<tr><td className="px-4 py-3 font-medium">DSFA erforderlich?</td><td className="px-4 py-3">Ob eine Datenschutz-Folgenabschaetzung nach Art. 35 DSGVO durchgefuehrt werden muss</td></tr>
</tbody>
</table>
</div>
<CodeBlock language="text" filename="Beispiel: Bewertung eines Chatbots mit Kundendaten">
{`Anwendungsfall: "Chatbot fuer Kundenservice mit Zugriff auf Bestellhistorie"
Machbarkeit: CONDITIONAL (bedingt zulaessig)
Risikoscore: 35/100 (LOW)
Ausgeloeste Regeln:
R-001 WARN Personenbezogene Daten werden verarbeitet (Art. 6 DSGVO)
R-010 INFO Verarbeitungszweck: Kundenservice (Art. 5 DSGVO)
R-060 WARN Nutzer muessen ueber KI-Nutzung informiert werden (AI Act Art. 52)
Erforderliche Controls:
C_EXPLICIT_CONSENT Einwilligung fuer Chatbot-Nutzung einholen
C_TRANSPARENCY Hinweis "Sie sprechen mit einer KI"
C_DATA_MINIMIZATION Nur notwendige Bestelldaten abrufen
DSFA erforderlich: Nein (Risikoscore unter 40)
Eskalation: E0 (keine manuelle Pruefung noetig)`}
</CodeBlock>
</>
)
}

View File

@@ -0,0 +1,101 @@
import { CodeBlock } from '@/components/DevPortalLayout'
export function EscalationControlsSection() {
return (
<>
<h2 id="eskalation">5. Das Eskalations-System: Wann Menschen entscheiden</h2>
<p>
Nicht jede Bewertung ist eindeutig. Fuer heikle Faelle gibt es ein abgestuftes
Eskalations-System, das sicherstellt, dass die richtigen Menschen die endgueltige
Entscheidung treffen.
</p>
<div className="not-prose my-6 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Stufe</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Wann?</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Wer prueft?</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Frist (SLA)</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Beispiel</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr className="bg-green-50"><td className="px-4 py-3 font-bold text-green-800">E0</td><td className="px-4 py-3">Nur INFO-Regeln, Risiko &lt; 20</td><td className="px-4 py-3">Niemand (automatisch freigegeben)</td><td className="px-4 py-3">--</td><td className="px-4 py-3">Spam-Filter ohne personenbezogene Daten</td></tr>
<tr className="bg-yellow-50"><td className="px-4 py-3 font-bold text-yellow-800">E1</td><td className="px-4 py-3">WARN-Regeln, Risiko 20-39</td><td className="px-4 py-3">Teamleiter</td><td className="px-4 py-3">24 Stunden</td><td className="px-4 py-3">Chatbot mit Kundendaten</td></tr>
<tr className="bg-orange-50"><td className="px-4 py-3 font-bold text-orange-800">E2</td><td className="px-4 py-3">Art. 9-Daten ODER Risiko 40-59 ODER DSFA empfohlen</td><td className="px-4 py-3">Datenschutzbeauftragter (DSB)</td><td className="px-4 py-3">8 Stunden</td><td className="px-4 py-3">KI-System, das Gesundheitsdaten verarbeitet</td></tr>
<tr className="bg-red-50"><td className="px-4 py-3 font-bold text-red-800">E3</td><td className="px-4 py-3">BLOCK-Regel ODER Risiko &ge; 60 ODER Art. 22-Risiko</td><td className="px-4 py-3">DSB + Rechtsabteilung</td><td className="px-4 py-3">4 Stunden</td><td className="px-4 py-3">Vollautomatische Kreditentscheidung</td></tr>
</tbody>
</table>
</div>
<h2 id="controls">6. Controls, Nachweise und Risiken</h2>
<h3>6.1 Was sind Controls?</h3>
<p>
Ein <strong>Control</strong> ist eine konkrete Massnahme, die eine Organisation umsetzt,
um ein Compliance-Risiko zu beherrschen. Es gibt drei Arten:
</p>
<ul>
<li><strong>Technische Controls:</strong> Verschluesselung, Zugangskontrollen, Firewalls, Pseudonymisierung</li>
<li><strong>Organisatorische Controls:</strong> Schulungen, Richtlinien, Verantwortlichkeiten, Audits</li>
<li><strong>Physische Controls:</strong> Zutrittskontrolle zu Serverraeumen, Schliesssysteme</li>
</ul>
<p>
Der Compliance Hub verwaltet einen <strong>Katalog von ueber 100 vordefinierten Controls</strong>,
die in 9 Domaenen organisiert sind:
</p>
<div className="not-prose my-4">
<div className="grid grid-cols-3 gap-2">
{[
{ code: 'AC', name: 'Zugriffsmanagement', desc: 'Wer darf was?' },
{ code: 'DP', name: 'Datenschutz', desc: 'Schutz personenbezogener Daten' },
{ code: 'NS', name: 'Netzwerksicherheit', desc: 'Sichere Kommunikation' },
{ code: 'IR', name: 'Incident Response', desc: 'Reaktion auf Sicherheitsvorfaelle' },
{ code: 'BC', name: 'Business Continuity', desc: 'Geschaeftskontinuitaet' },
{ code: 'VM', name: 'Vendor Management', desc: 'Dienstleister-Steuerung' },
{ code: 'AM', name: 'Asset Management', desc: 'Verwaltung von IT-Werten' },
{ code: 'CR', name: 'Kryptographie', desc: 'Verschluesselung & Schluessel' },
{ code: 'PS', name: 'Physische Sicherheit', desc: 'Gebaeude & Hardware' },
].map(d => (
<div key={d.code} className="border border-gray-200 rounded-lg p-3 text-sm">
<div className="font-bold text-blue-600">{d.code}</div>
<div className="font-medium">{d.name}</div>
<div className="text-gray-500 text-xs">{d.desc}</div>
</div>
))}
</div>
</div>
<h3>6.2 Wie Controls mit Gesetzen verknuepft sind</h3>
<CodeBlock language="text" filename="Beispiel: Control-Mapping">
{`Control: AC-01 (Zugriffskontrolle)
├── DSGVO Art. 32 → "Sicherheit der Verarbeitung"
├── NIS2 Art. 21 → "Massnahmen zum Management von Cyberrisiken"
└── ISO 27001 A.9 → "Zugangskontrolle"
Control: DP-03 (Datenverschluesselung)
├── DSGVO Art. 32 → "Verschluesselung personenbezogener Daten"
└── NIS2 Art. 21 → "Einsatz von Kryptographie"`}
</CodeBlock>
<h3>6.3 Evidence (Nachweise)</h3>
<p>Nachweis-Typen, die das System verwaltet:</p>
<ul>
<li><strong>Zertifikate:</strong> ISO 27001-Zertifikat, SOC2-Report</li>
<li><strong>Richtlinien:</strong> Interne Datenschutzrichtlinie, Passwort-Policy</li>
<li><strong>Audit-Berichte:</strong> Ergebnisse interner oder externer Pruefungen</li>
<li><strong>Screenshots / Konfigurationen:</strong> Nachweis technischer Umsetzung</li>
</ul>
<p>Jeder Nachweis hat ein <strong>Ablaufdatum</strong>. Das System warnt automatisch, wenn Nachweise bald ablaufen.</p>
<h3>6.4 Risikobewertung</h3>
<p>
Risiken werden in einer <strong>5x5-Risikomatrix</strong> dargestellt. Die beiden Achsen sind
Eintrittswahrscheinlichkeit und Auswirkung. Aus der Kombination ergibt sich die Risikostufe:
<em> Minimal</em>, <em>Low</em>, <em>Medium</em>, <em>High</em> oder <em>Critical</em>.
</p>
</>
)
}

View File

@@ -0,0 +1,97 @@
import { CodeBlock, InfoBox } from '@/components/DevPortalLayout'
export function IntroArchitectureSection() {
return (
<>
<h2 id="einfuehrung">1. Was ist der Compliance Hub?</h2>
<p>
Der <strong>BreakPilot Compliance Hub</strong> ist ein System, das Organisationen dabei
unterstuetzt, gesetzliche Vorschriften einzuhalten. Er beantwortet die zentrale Frage:
</p>
<blockquote>
<em>&ldquo;Duerfen wir das, was wir vorhaben, ueberhaupt so machen -- und wenn ja, welche
Auflagen muessen wir dafuer erfuellen?&rdquo;</em>
</blockquote>
<p>
Konkret geht es um EU- und deutsche Gesetze, die fuer den Umgang mit Daten und
kuenstlicher Intelligenz relevant sind: die <strong>DSGVO</strong>, den <strong>AI Act</strong>,
die <strong>NIS2-Richtlinie</strong> und viele weitere Regelwerke. Das System hat vier
Hauptaufgaben:
</p>
<ol>
<li><strong>Wissen bereitstellen:</strong> Hunderte Rechtstexte sind eingelesen und durchsuchbar -- nicht nur per Stichwort, sondern nach Bedeutung (semantische Suche).</li>
<li><strong>Bewerten:</strong> Wenn ein Nutzer einen geplanten KI-Anwendungsfall beschreibt, bewertet das System automatisch, ob er zulaessig ist, welches Risiko besteht und welche Massnahmen noetig sind.</li>
<li><strong>Dokumentieren:</strong> Das System erzeugt die Dokumente, die Aufsichtsbehoerden verlangen: Datenschutz-Folgenabschaetzungen (DSFA), technisch-organisatorische Massnahmen (TOM), Verarbeitungsverzeichnisse (VVT) und mehr.</li>
<li><strong>Nachweisen:</strong> Jede Bewertung, jede Entscheidung und jeder Zugriff wird revisionssicher protokolliert -- als Nachweis gegenueber Pruefer und Behoerden.</li>
</ol>
<InfoBox type="info" title="Kern-Designprinzip">
<strong>Die KI ist nicht die Entscheidungsinstanz.</strong> Alle
Compliance-Entscheidungen (zulaessig / bedingt zulaessig / nicht zulaessig) trifft ein
deterministisches Regelwerk. Das LLM (Sprachmodell) wird ausschliesslich dafuer verwendet,
Ergebnisse verstaendlich zu <em>erklaeren</em> -- niemals um sie zu <em>treffen</em>.
</InfoBox>
<h2 id="architektur">2. Architektur im Ueberblick</h2>
<p>
Das System besteht aus mehreren Bausteinen, die jeweils eine klar abgegrenzte Aufgabe haben.
Man kann es sich wie ein Buero vorstellen:
</p>
<div className="not-prose my-6 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Baustein</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Analogie</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Technologie</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Aufgabe</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">API-Gateway</td><td className="px-4 py-3">Empfang / Rezeption</td><td className="px-4 py-3">Go (Gin)</td><td className="px-4 py-3">Nimmt alle Anfragen entgegen, prueft Identitaet und leitet weiter</td></tr>
<tr><td className="px-4 py-3 font-medium">Compliance Engine (UCCA)</td><td className="px-4 py-3">Sachbearbeiter</td><td className="px-4 py-3">Go</td><td className="px-4 py-3">Bewertet Anwendungsfaelle gegen 45+ Regeln und berechnet Risikoscore</td></tr>
<tr><td className="px-4 py-3 font-medium">RAG Service</td><td className="px-4 py-3">Rechtsbibliothek</td><td className="px-4 py-3">Python (FastAPI)</td><td className="px-4 py-3">Durchsucht Gesetze semantisch und beantwortet Rechtsfragen</td></tr>
<tr><td className="px-4 py-3 font-medium">Legal Corpus</td><td className="px-4 py-3">Gesetzesbuecher im Regal</td><td className="px-4 py-3">YAML/JSON + Qdrant</td><td className="px-4 py-3">Enthaelt alle Rechtstexte als durchsuchbare Wissensbasis</td></tr>
<tr><td className="px-4 py-3 font-medium">Policy Engine</td><td className="px-4 py-3">Regelbuch des Sachbearbeiters</td><td className="px-4 py-3">YAML-Dateien</td><td className="px-4 py-3">45+ auditierbare Pruefregeln in maschinenlesbarer Form</td></tr>
<tr><td className="px-4 py-3 font-medium">Eskalations-System</td><td className="px-4 py-3">Chef-Unterschrift</td><td className="px-4 py-3">Go + PostgreSQL</td><td className="px-4 py-3">Leitet kritische Faelle an menschliche Pruefer weiter</td></tr>
<tr><td className="px-4 py-3 font-medium">Admin Dashboard</td><td className="px-4 py-3">Schreibtisch</td><td className="px-4 py-3">Next.js</td><td className="px-4 py-3">Benutzeroberflaeche fuer alle Funktionen</td></tr>
<tr><td className="px-4 py-3 font-medium">PostgreSQL</td><td className="px-4 py-3">Aktenschrank</td><td className="px-4 py-3">SQL-Datenbank</td><td className="px-4 py-3">Speichert Assessments, Eskalationen, Controls, Audit-Trail</td></tr>
<tr><td className="px-4 py-3 font-medium">Qdrant</td><td className="px-4 py-3">Suchindex der Bibliothek</td><td className="px-4 py-3">Vektordatenbank</td><td className="px-4 py-3">Ermoeglicht semantische Suche ueber Rechtstexte</td></tr>
</tbody>
</table>
</div>
<h3>Wie die Bausteine zusammenspielen</h3>
<CodeBlock language="text" filename="Datenfluss: Vom Benutzer zur Compliance-Bewertung">
{`Benutzer (Browser)
|
v
┌─────────────────────────────┐
│ API-Gateway (Port 8080) │ ← Authentifizierung, Rate-Limiting, Tenant-Isolation
│ "Wer bist du? Darfst du?" │
└──────────┬──────────────────┘
|
┌─────┼──────────────────────────────┐
v v v
┌─────────────┐ ┌──────────────┐ ┌──────────────┐
│ Compliance │ │ RAG Service │ │ Security │
│ Engine │ │ (Bibliothek)│ │ Scanner │
│ (Bewertung) │ │ │ │ │
└──────┬───┬──┘ └──────┬───────┘ └──────────────┘
| | |
| | ┌──────┴───────┐
| | │ Qdrant │ ← Vektordatenbank mit allen Rechtstexten
| | │ (Suchindex) │
| | └──────────────┘
| |
| └──────────────────────┐
v v
┌──────────────┐ ┌──────────────┐
│ PostgreSQL │ │ Eskalation │
│ (Speicher) │ │ (E0-E3) │
└──────────────┘ └──────────────┘`}
</CodeBlock>
</>
)
}

View File

@@ -0,0 +1,145 @@
import { CodeBlock, InfoBox } from '@/components/DevPortalLayout'
export function LegalCorpusSection() {
return (
<>
<h2 id="katalogmanager">3. Der Katalogmanager: Die Wissensbasis</h2>
<p>
Das Herzstueck des Systems ist seine <strong>Wissensbasis</strong> -- eine Sammlung aller
relevanten Rechtstexte, die das System kennt und durchsuchen kann. Wir nennen das den
<strong> Legal Corpus</strong> (wörtlich: &ldquo;Rechtlicher Koerper&rdquo;).
</p>
<h3>3.1 Welche Dokumente sind enthalten?</h3>
<p>Der Legal Corpus ist in zwei Hauptbereiche gegliedert: <strong>EU-Recht</strong> und <strong> deutsches Recht</strong>.</p>
<h4>EU-Verordnungen und -Richtlinien</h4>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-blue-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-700">Regelwerk</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Abkuerzung</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Artikel</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Gueltig seit</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Thema</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">Datenschutz-Grundverordnung</td><td className="px-4 py-3">DSGVO</td><td className="px-4 py-3">99</td><td className="px-4 py-3">25.05.2018</td><td className="px-4 py-3">Schutz personenbezogener Daten</td></tr>
<tr><td className="px-4 py-3 font-medium">KI-Verordnung</td><td className="px-4 py-3">AI Act</td><td className="px-4 py-3">113</td><td className="px-4 py-3">01.08.2024</td><td className="px-4 py-3">Regulierung kuenstlicher Intelligenz</td></tr>
<tr><td className="px-4 py-3 font-medium">Netz- und Informationssicherheit</td><td className="px-4 py-3">NIS2</td><td className="px-4 py-3">46</td><td className="px-4 py-3">18.10.2024</td><td className="px-4 py-3">Cybersicherheit kritischer Infrastrukturen</td></tr>
<tr><td className="px-4 py-3 font-medium">ePrivacy-Verordnung</td><td className="px-4 py-3">ePrivacy</td><td className="px-4 py-3">--</td><td className="px-4 py-3">in Arbeit</td><td className="px-4 py-3">Vertraulichkeit elektronischer Kommunikation</td></tr>
<tr><td className="px-4 py-3 font-medium">Cyber Resilience Act</td><td className="px-4 py-3">CRA</td><td className="px-4 py-3">--</td><td className="px-4 py-3">2024</td><td className="px-4 py-3">Cybersicherheit von Produkten mit digitalen Elementen</td></tr>
<tr><td className="px-4 py-3 font-medium">Data Act</td><td className="px-4 py-3">DA</td><td className="px-4 py-3">--</td><td className="px-4 py-3">2024</td><td className="px-4 py-3">Zugang und Nutzung von Daten</td></tr>
<tr><td className="px-4 py-3 font-medium">Digital Markets Act</td><td className="px-4 py-3">DMA</td><td className="px-4 py-3">--</td><td className="px-4 py-3">2023</td><td className="px-4 py-3">Regulierung digitaler Gatekeeper</td></tr>
</tbody>
</table>
</div>
<h4>Deutsches Recht</h4>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-green-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-700">Gesetz</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Abkuerzung</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Thema</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">Telekommunikation-Digitale-Dienste-Datenschutz-Gesetz</td><td className="px-4 py-3">TDDDG</td><td className="px-4 py-3">Datenschutz bei Telekommunikation und digitalen Diensten</td></tr>
<tr><td className="px-4 py-3 font-medium">Bundesdatenschutzgesetz</td><td className="px-4 py-3">BDSG</td><td className="px-4 py-3">Nationale Ergaenzung zur DSGVO</td></tr>
<tr><td className="px-4 py-3 font-medium">IT-Sicherheitsgesetz</td><td className="px-4 py-3">IT-SiG</td><td className="px-4 py-3">IT-Sicherheit kritischer Infrastrukturen</td></tr>
<tr><td className="px-4 py-3 font-medium">BSI-KritisV</td><td className="px-4 py-3">KritisV</td><td className="px-4 py-3">BSI-Verordnung fuer kritische Infrastrukturen</td></tr>
</tbody>
</table>
</div>
<h4>Standards und Normen</h4>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-purple-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-700">Standard</th>
<th className="px-4 py-3 text-left font-medium text-gray-700">Thema</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">ISO 27001</td><td className="px-4 py-3">Informationssicherheits-Managementsystem (ISMS)</td></tr>
<tr><td className="px-4 py-3 font-medium">SOC2</td><td className="px-4 py-3">Trust Service Criteria (Sicherheit, Verfuegbarkeit, Vertraulichkeit)</td></tr>
<tr><td className="px-4 py-3 font-medium">BSI Grundschutz</td><td className="px-4 py-3">IT-Grundschutz des BSI</td></tr>
<tr><td className="px-4 py-3 font-medium">BSI TR-03161</td><td className="px-4 py-3">Technische Richtlinie fuer Anforderungen an Anwendungen im Gesundheitswesen</td></tr>
<tr><td className="px-4 py-3 font-medium">SCC (Standard Contractual Clauses)</td><td className="px-4 py-3">Standardvertragsklauseln fuer Drittlandtransfers</td></tr>
</tbody>
</table>
</div>
<h3>3.2 Wie werden Rechtstexte gespeichert?</h3>
<p>
Jeder Rechtstext durchlaeuft eine <strong>Verarbeitungspipeline</strong>, bevor er im
System durchsuchbar ist. Der Vorgang laesst sich mit dem Erstellen eines
Bibliothekskatalogs vergleichen:
</p>
<ol>
<li><strong>Erfassung (Ingestion):</strong> Der Rechtstext wird als Dokument (PDF, Markdown oder Klartext) in das System geladen. Fuer jede Verordnung gibt es eine <code>metadata.json</code>-Datei.</li>
<li><strong>Zerkleinerung (Chunking):</strong> Lange Gesetzestexte werden in kleinere Abschnitte von ca. 512 Zeichen zerlegt. Dabei ueberlappen sich die Abschnitte um 50 Zeichen.</li>
<li><strong>Vektorisierung (Embedding):</strong> Jeder Textabschnitt wird vom Embedding-Modell <strong>BGE-M3</strong> in einen <em>Vektor</em> umgewandelt -- eine Liste von 1.024 Zahlen.</li>
<li><strong>Indexierung:</strong> Die Vektoren werden in der Vektordatenbank <strong>Qdrant</strong> gespeichert. Zusammen mit jedem Vektor werden Metadaten hinterlegt.</li>
</ol>
<CodeBlock language="text" filename="Verarbeitungspipeline: Vom Gesetzestext zur Suche">
{`Rechtstext (z.B. DSGVO Art. 32)
|
v
┌────────────────────────┐
│ 1. Einlesen │ ← PDF/Markdown/Klartext + metadata.json
└──────────┬─────────────┘
v
┌────────────────────────┐
│ 2. Chunking │ ← Text in 512-Zeichen-Abschnitte zerlegen
└──────────┬─────────────┘
v
┌────────────────────────┐
│ 3. Embedding │ ← BGE-M3 wandelt Text in 1024 Zahlen um
└──────────┬─────────────┘
v
┌────────────────────────┐
│ 4. Qdrant speichern │ ← Vektor + Metadaten werden indexiert
└────────────────────────┘`}
</CodeBlock>
<InfoBox type="success" title="Aktueller Bestand">
Der Legal Corpus enthaelt derzeit ca. <strong>2.274 Textabschnitte</strong> aus ueber
400 Gesetzesartikeln. Darunter 99 DSGVO-Artikel, 85 AI-Act-Artikel, 46 NIS2-Artikel,
86 BDSG-Paragraphen sowie zahlreiche Artikel aus TDDDG, CRA, Data Act und weiteren Regelwerken.
</InfoBox>
<h3>3.3 Wie funktioniert die semantische Suche?</h3>
<p>
Klassische Suchmaschinen suchen nach <em>Woertern</em>. Unsere semantische Suche
funktioniert anders: Sie sucht nach <em>Bedeutung</em>.
</p>
<p>
<strong>Beispiel:</strong> Wenn Sie fragen &ldquo;Wann muss ich den Nutzer um Erlaubnis
bitten?&rdquo;, findet das System Art. 7 DSGVO (Bedingungen fuer die Einwilligung), obwohl
Ihre Frage das Wort &ldquo;Einwilligung&rdquo; gar nicht enthaelt.
</p>
<h3>3.4 Der KI-Rechtsassistent (Legal Q&amp;A)</h3>
<p>Ueber die reine Suche hinaus kann das System auch <strong>Fragen beantworten</strong>:</p>
<ol>
<li><strong>Suche:</strong> Das System findet die 5 relevantesten Gesetzesabschnitte zur Frage.</li>
<li><strong>Kontext-Erstellung:</strong> Diese Abschnitte werden mit der Frage an das Sprachmodell (Qwen 2.5 32B) uebergeben.</li>
<li><strong>Antwort-Generierung:</strong> Das Modell formuliert eine verstaendliche Antwort auf Deutsch und zitiert die verwendeten Rechtsquellen.</li>
<li><strong>Quellenangabe:</strong> Jede Antwort enthaelt exakte Zitate mit Artikelangaben.</li>
</ol>
<InfoBox type="warning" title="Wichtige Einschraenkung">
Der Rechtsassistent gibt <strong>keine Rechtsberatung</strong>. Er hilft, relevante
Gesetzespassagen zu finden und verstaendlich zusammenzufassen. Die Antworten enthalten
immer einen Confidence-Score (0-1).
</InfoBox>
</>
)
}

View File

@@ -0,0 +1,129 @@
import { CodeBlock, InfoBox } from '@/components/DevPortalLayout'
export function MultiTenancyLlmAuditSection() {
return (
<>
<h2 id="multi-tenancy">9. Multi-Tenancy und Zugriffskontrolle</h2>
<p>
Das System ist <strong>mandantenfaehig</strong> (Multi-Tenant): Mehrere Organisationen
koennen es gleichzeitig nutzen, ohne dass sie gegenseitig auf ihre Daten zugreifen koennen.
</p>
<h3>9.1 Rollenbasierte Zugriffskontrolle (RBAC)</h3>
<div className="not-prose my-4 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Rolle</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Darf</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3 font-medium">Mitarbeiter</td><td className="px-4 py-3">Anwendungsfaelle einreichen, eigene Bewertungen einsehen</td></tr>
<tr><td className="px-4 py-3 font-medium">Teamleiter</td><td className="px-4 py-3">E1-Eskalationen pruefen, Team-Assessments einsehen</td></tr>
<tr><td className="px-4 py-3 font-medium">DSB (Datenschutzbeauftragter)</td><td className="px-4 py-3">E2/E3-Eskalationen pruefen, alle Assessments einsehen, Policies aendern</td></tr>
<tr><td className="px-4 py-3 font-medium">Rechtsabteilung</td><td className="px-4 py-3">E3-Eskalationen pruefen, Grundsatzentscheidungen</td></tr>
<tr><td className="px-4 py-3 font-medium">Administrator</td><td className="px-4 py-3">System konfigurieren, Nutzer verwalten, LLM-Policies festlegen</td></tr>
</tbody>
</table>
</div>
<h3>9.2 PII-Erkennung und -Schutz</h3>
<p>
Bevor Texte an ein Sprachmodell gesendet werden, durchlaufen sie eine automatische
<strong> PII-Erkennung</strong>. Das System erkennt ueber 20 Arten personenbezogener Daten
(E-Mail-Adressen, Telefonnummern, Namen, IP-Adressen, etc.).
Je nach Konfiguration werden erkannte PII-Daten <strong>geschwuerzt</strong>, <strong>maskiert</strong>
oder nur im Audit-Log <strong>markiert</strong>.
</p>
<h2 id="llm-nutzung">10. Wie das System KI nutzt (und wie nicht)</h2>
<div className="not-prose my-6 overflow-x-auto">
<table className="min-w-full divide-y divide-gray-200 text-sm">
<thead className="bg-gray-50">
<tr>
<th className="px-4 py-3 text-left font-medium text-gray-500">Aufgabe</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Entschieden von</th>
<th className="px-4 py-3 text-left font-medium text-gray-500">Rolle der KI</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200">
<tr><td className="px-4 py-3">Machbarkeit (YES/CONDITIONAL/NO)</td><td className="px-4 py-3 font-medium">Deterministische Regeln</td><td className="px-4 py-3 text-gray-400">Keine</td></tr>
<tr><td className="px-4 py-3">Risikoscore berechnen</td><td className="px-4 py-3 font-medium">Regelbasierte Berechnung</td><td className="px-4 py-3 text-gray-400">Keine</td></tr>
<tr><td className="px-4 py-3">Eskalation ausloesen</td><td className="px-4 py-3 font-medium">Schwellenwerte + Regellogik</td><td className="px-4 py-3 text-gray-400">Keine</td></tr>
<tr className="bg-blue-50"><td className="px-4 py-3">Ergebnis erklaeren</td><td className="px-4 py-3 text-gray-400">--</td><td className="px-4 py-3 font-medium text-blue-800">LLM + RAG-Kontext</td></tr>
<tr className="bg-blue-50"><td className="px-4 py-3">Rechtsfragen beantworten</td><td className="px-4 py-3 text-gray-400">--</td><td className="px-4 py-3 font-medium text-blue-800">LLM + RAG (Rechtskorpus)</td></tr>
<tr className="bg-blue-50"><td className="px-4 py-3">Dokumente generieren (DSFA, TOM, VVT)</td><td className="px-4 py-3 text-gray-400">--</td><td className="px-4 py-3 font-medium text-blue-800">LLM + Vorlagen</td></tr>
</tbody>
</table>
</div>
<h3>LLM-Provider und Fallback</h3>
<ol>
<li><strong>Primaer: Ollama (lokal)</strong> -- Qwen 2.5 32B bzw. Mistral, laeuft direkt auf dem Server. Keine Daten verlassen das lokale Netzwerk.</li>
<li><strong>Fallback: Anthropic Claude</strong> -- Wird nur aktiviert, wenn das lokale Modell nicht verfuegbar ist.</li>
</ol>
<h2 id="audit-trail">11. Audit-Trail: Alles wird protokolliert</h2>
<p>Saemtliche Aktionen im System werden revisionssicher protokolliert:</p>
<ul>
<li>Jede Compliance-Bewertung mit allen Ein- und Ausgaben</li>
<li>Jede Eskalationsentscheidung mit Begruendung</li>
<li>Jeder LLM-Aufruf (wer hat was wann gefragt, welches Modell wurde verwendet)</li>
<li>Jede Aenderung an Controls, Evidence und Policies</li>
<li>Jeder Login und Daten-Export</li>
</ul>
<InfoBox type="info" title="Datenschutz des Audit-Trails">
Der Use-Case-Text wird <strong>nur mit Einwilligung des Nutzers</strong> gespeichert.
Standardmaessig wird nur ein SHA-256-Hash des Textes gespeichert.
</InfoBox>
<h2 id="security">12. Security Scanner: Technische Sicherheitspruefung</h2>
<ul>
<li><strong>Container-Scanning (Trivy):</strong> Prueft Docker-Images auf bekannte Schwachstellen (CVEs)</li>
<li><strong>Statische Code-Analyse (Semgrep):</strong> Sucht im Quellcode nach Sicherheitsluecken</li>
<li><strong>Secret Detection (Gitleaks):</strong> Findet versehentlich eingecheckte Passwoerter, API-Keys und Tokens</li>
<li><strong>SBOM-Generierung:</strong> Erstellt eine vollstaendige Liste aller verwendeten Bibliotheken und deren Lizenzen</li>
</ul>
<h2 id="zusammenfassung">13. Zusammenfassung: Der komplette Datenfluss</h2>
<CodeBlock language="text" filename="Der komplette Compliance-Workflow">
{`SCHRITT 1: FAKTEN SAMMELN
Nutzer fuellt Fragebogen aus: Welche Daten? Welcher Zweck? Welche Branche? Wo gehostet?
SCHRITT 2: ANWENDBARKEIT PRUEFEN
Obligations Framework: DSGVO? AI Act? NIS2?
SCHRITT 3: REGELN PRUEFEN (45+ Regeln)
R-001 (WARN): Personenbezogene Daten +10 Risiko
R-060 (WARN): KI-Transparenz fehlt +15 Risiko
→ Gesamt-Risikoscore: 35/100 (LOW), Machbarkeit: CONDITIONAL
SCHRITT 4: CONTROLS ZUORDNEN
C_EXPLICIT_CONSENT, C_TRANSPARENCY, C_DATA_MINIMIZATION
SCHRITT 5: ESKALATION (bei Bedarf)
Score 35 → Stufe E1 → Teamleiter, SLA 24h
SCHRITT 6: ERKLAERUNG GENERIEREN
LLM + RAG: Gesetzesartikel suchen, Erklaerungstext generieren
SCHRITT 7: DOKUMENTATION
DSFA, TOM, VVT, Compliance-Report (PDF/ZIP/JSON)
SCHRITT 8: MONITORING
Controls regelmaessig pruefen, Nachweise auf Ablauf ueberwachen`}
</CodeBlock>
<InfoBox type="success" title="Das Wichtigste in einem Satz">
Der Compliance Hub nimmt die Beschreibung eines KI-Vorhabens entgegen, prueft es gegen
ueber 45 deterministische Regeln und 400+ Gesetzesartikel, berechnet ein Risiko, ordnet
Massnahmen zu, eskaliert bei Bedarf an menschliche Pruefer und dokumentiert alles
revisionssicher -- wobei die KI nur fuer Erklaerungen und Zusammenfassungen eingesetzt wird,
niemals fuer die eigentliche Compliance-Entscheidung.
</InfoBox>
</>
)
}

View File

@@ -0,0 +1,81 @@
import { CodeBlock } from '@/components/DevPortalLayout'
export function ObligationsDsgvoSection() {
return (
<>
<h2 id="obligations">7. Pflichten-Ableitung: Welche Gesetze gelten fuer mich?</h2>
<p>
Nicht jedes Gesetz gilt fuer jede Organisation. Das <strong>Obligations Framework</strong>
ermittelt automatisch, welche konkreten Pflichten sich aus der Situation einer Organisation
ergeben.
</p>
<h3>Beispiel: NIS2-Anwendbarkeit</h3>
<CodeBlock language="text" filename="Entscheidungsbaum: Gilt NIS2 fuer mein Unternehmen?">
{`Ist Ihr Unternehmen in einem der NIS2-Sektoren taetig?
(Energie, Transport, Banken, Gesundheit, Wasser, Digitale Infrastruktur, ...)
├── Nein → NIS2 gilt NICHT fuer Sie
└── Ja → Wie gross ist Ihr Unternehmen?
├── >= 250 Mitarbeiter ODER >= 50 Mio. EUR Umsatz
│ → ESSENTIAL ENTITY (wesentliche Einrichtung)
│ → Volle NIS2-Pflichten, strenge Aufsicht
│ → Bussgelder bis 10 Mio. EUR oder 2% Jahresumsatz
├── >= 50 Mitarbeiter ODER >= 10 Mio. EUR Umsatz
│ → IMPORTANT ENTITY (wichtige Einrichtung)
│ → NIS2-Pflichten, reaktive Aufsicht
│ → Bussgelder bis 7 Mio. EUR oder 1,4% Jahresumsatz
└── Kleiner → NIS2 gilt grundsaetzlich NICHT`}
</CodeBlock>
<h2 id="dsgvo-module">8. DSGVO-Compliance-Module im Detail</h2>
<p>Fuer die Einhaltung der DSGVO bietet der Compliance Hub spezialisierte Module:</p>
<h3>8.1 Consent Management (Einwilligungsverwaltung)</h3>
<p>
Verwaltet die Einwilligung von Nutzern gemaess Art. 6/7 DSGVO. Jede Einwilligung wird
protokolliert: wer hat wann, auf welchem Kanal, fuer welchen Zweck zugestimmt (oder abgelehnt)?
</p>
<p>
<strong>Zwecke:</strong> Essential (funktionsnotwendig), Functional, Analytics, Marketing,
Personalization, Third-Party.
</p>
<h3>8.2 DSR Management (Betroffenenrechte)</h3>
<p>
Verwaltet Antraege betroffener Personen nach Art. 15-21 DSGVO: Auskunft, Berichtigung,
Loeschung, Datenportabilitaet, Einschraenkung und Widerspruch. Das System ueberwacht die
<strong> 30-Tage-Frist</strong> (Art. 12) und eskaliert automatisch bei drohenden Fristverstossen.
</p>
<h3>8.3 VVT (Verzeichnis von Verarbeitungstaetigkeiten)</h3>
<p>
Dokumentiert alle Datenverarbeitungen gemaess Art. 30 DSGVO: Welche Daten werden fuer
welchen Zweck, auf welcher Rechtsgrundlage, wie lange und von wem verarbeitet?
</p>
<h3>8.4 DSFA (Datenschutz-Folgenabschaetzung)</h3>
<p>
Wenn eine Datenverarbeitung voraussichtlich ein hohes Risiko fuer die Rechte natuerlicher
Personen mit sich bringt, ist eine DSFA nach Art. 35 DSGVO Pflicht.
</p>
<h3>8.5 TOM (Technisch-Organisatorische Massnahmen)</h3>
<p>
Dokumentiert die Schutzmassnahmen nach Art. 32 DSGVO. Fuer jede Massnahme wird erfasst:
Kategorie (z.B. Verschluesselung, Zugriffskontrolle), Status, Verantwortlicher und Nachweise.
</p>
<h3>8.6 Loeschkonzept</h3>
<p>
Verwaltet Aufbewahrungsfristen und automatische Loeschung gemaess Art. 5/17 DSGVO.
Fuer jede Datenkategorie wird definiert: wie lange darf sie gespeichert werden, wann muss
sie geloescht werden und wie (z.B. Ueberschreiben, Schluesselloeschung).
</p>
</>
)
}