[split-required] Split 500-850 LOC files (batch 2)

backend-lehrer (10 files):
- game/database.py (785 → 5), correction_api.py (683 → 4)
- classroom_engine/antizipation.py (676 → 5)
- llm_gateway schools/edu_search already done in prior batch

klausur-service (12 files):
- orientation_crop_api.py (694 → 5), pdf_export.py (677 → 4)
- zeugnis_crawler.py (676 → 5), grid_editor_api.py (671 → 5)
- eh_templates.py (658 → 5), mail/api.py (651 → 5)
- qdrant_service.py (638 → 5), training_api.py (625 → 4)

website (6 pages):
- middleware (696 → 8), mail (733 → 6), consent (628 → 8)
- compliance/risks (622 → 5), export (502 → 5), brandbook (629 → 7)

studio-v2 (3 components):
- B2BMigrationWizard (848 → 3), CleanupPanel (765 → 2)
- dashboard-experimental (739 → 2)

admin-lehrer (4 files):
- uebersetzungen (769 → 4), manager (670 → 2)
- ChunkBrowserQA (675 → 6), dsfa/page (674 → 5)

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

website/app/admin/consent/_components/DocumentsTab.tsx

@@ -0,0 +1,83 @@
+'use client'
+
+import type { Document, Tab } from './types'
+
+interface DocumentsTabProps {
+  documents: Document[]
+  loading: boolean
+  setSelectedDocument: (id: string) => void
+  setActiveTab: (tab: Tab) => void
+}
+
+export default function DocumentsTab({ documents, loading, setSelectedDocument, setActiveTab }: DocumentsTabProps) {
+  return (
+    <div className="p-6">
+      <div className="flex items-center justify-between mb-6">
+        <h2 className="text-lg font-semibold text-slate-900">Dokumente verwalten</h2>
+        <button className="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors text-sm font-medium">
+          + Neues Dokument
+        </button>
+      </div>
+
+      {loading ? (
+        <div className="text-center py-12 text-slate-500">Lade Dokumente...</div>
+      ) : documents.length === 0 ? (
+        <div className="text-center py-12 text-slate-500">
+          Keine Dokumente vorhanden
+        </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-sm font-medium text-slate-500">Typ</th>
+                <th className="text-left py-3 px-4 text-sm font-medium text-slate-500">Name</th>
+                <th className="text-left py-3 px-4 text-sm font-medium text-slate-500">Beschreibung</th>
+                <th className="text-left py-3 px-4 text-sm font-medium text-slate-500">Pflicht</th>
+                <th className="text-left py-3 px-4 text-sm font-medium text-slate-500">Erstellt</th>
+                <th className="text-right py-3 px-4 text-sm font-medium text-slate-500">Aktionen</th>
+              </tr>
+            </thead>
+            <tbody>
+              {documents.map((doc) => (
+                <tr key={doc.id} className="border-b border-slate-100 hover:bg-slate-50">
+                  <td className="py-3 px-4">
+                    <span className="px-2 py-1 bg-slate-100 text-slate-700 rounded text-xs font-medium">
+                      {doc.type}
+                    </span>
+                  </td>
+                  <td className="py-3 px-4 font-medium text-slate-900">{doc.name}</td>
+                  <td className="py-3 px-4 text-slate-600 text-sm">{doc.description}</td>
+                  <td className="py-3 px-4">
+                    {doc.mandatory ? (
+                      <span className="text-green-600">Ja</span>
+                    ) : (
+                      <span className="text-slate-400">Nein</span>
+                    )}
+                  </td>
+                  <td className="py-3 px-4 text-sm text-slate-500">
+                    {new Date(doc.created_at).toLocaleDateString('de-DE')}
+                  </td>
+                  <td className="py-3 px-4 text-right">
+                    <button
+                      onClick={() => {
+                        setSelectedDocument(doc.id)
+                        setActiveTab('versions')
+                      }}
+                      className="text-primary-600 hover:text-primary-700 text-sm font-medium mr-3"
+                    >
+                      Versionen
+                    </button>
+                    <button className="text-slate-500 hover:text-slate-700 text-sm">
+                      Bearbeiten
+                    </button>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}

website/app/admin/consent/_components/EmailsTab.tsx

@@ -0,0 +1,68 @@
+'use client'
+
+import { EMAIL_TEMPLATES, EMAIL_CATEGORIES, CATEGORY_ICONS } from './types'
+
+export default function EmailsTab() {
+  return (
+    <div className="p-6">
+      <div className="flex items-center justify-between mb-6">
+        <div>
+          <h2 className="text-lg font-semibold text-slate-900">E-Mail Vorlagen</h2>
+          <p className="text-sm text-slate-500 mt-1">16 Lifecycle-Vorlagen für automatisierte Kommunikation</p>
+        </div>
+        <button className="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors text-sm font-medium">
+          + Neue Vorlage
+        </button>
+      </div>
+
+      {/* Category Filter */}
+      <div className="flex flex-wrap gap-2 mb-6">
+        <span className="text-sm text-slate-500 py-1">Filter:</span>
+        {EMAIL_CATEGORIES.map((cat) => (
+          <span key={cat.key} className={`px-3 py-1 rounded-full text-xs font-medium ${cat.color}`}>
+            {cat.label}
+          </span>
+        ))}
+      </div>
+
+      {/* Templates grouped by category */}
+      {EMAIL_CATEGORIES.map((category) => (
+        <div key={category.key} className="mb-8">
+          <h3 className="text-sm font-semibold text-slate-700 uppercase tracking-wider mb-3 flex items-center gap-2">
+            <span className={`w-2 h-2 rounded-full ${category.color.split(' ')[0]}`}></span>
+            {category.label}
+          </h3>
+          <div className="grid gap-3">
+            {EMAIL_TEMPLATES
+              .filter((t) => t.category === category.key)
+              .map((template) => (
+                <div
+                  key={template.key}
+                  className="border border-slate-200 rounded-lg p-4 flex items-center justify-between hover:border-primary-300 transition-colors bg-white"
+                >
+                  <div className="flex items-center gap-4">
+                    <div className={`w-10 h-10 rounded-lg ${category.color} flex items-center justify-center text-lg`}>
+                      {CATEGORY_ICONS[category.key]}
+                    </div>
+                    <div>
+                      <h4 className="font-medium text-slate-900">{template.name}</h4>
+                      <p className="text-sm text-slate-500">{template.description}</p>
+                    </div>
+                  </div>
+                  <div className="flex items-center gap-2">
+                    <span className="px-2 py-1 bg-green-100 text-green-700 rounded text-xs">Aktiv</span>
+                    <button className="px-3 py-1.5 text-sm text-slate-600 hover:text-slate-900 border border-slate-300 rounded-lg hover:border-slate-400">
+                      Bearbeiten
+                    </button>
+                    <button className="px-3 py-1.5 text-sm text-slate-600 hover:text-slate-900 border border-slate-300 rounded-lg hover:border-slate-400">
+                      Vorschau
+                    </button>
+                  </div>
+                </div>
+              ))}
+          </div>
+        </div>
+      ))}
+    </div>
+  )
+}

website/app/admin/consent/_components/GdprTab.tsx

@@ -0,0 +1,109 @@
+'use client'
+
+import { GDPR_PROCESSES } from './types'
+
+export default function GdprTab() {
+  return (
+    <div className="p-6">
+      <div className="flex items-center justify-between mb-6">
+        <div>
+          <h2 className="text-lg font-semibold text-slate-900">DSGVO Betroffenenrechte</h2>
+          <p className="text-sm text-slate-500 mt-1">Artikel 15-21 Prozesse und Vorlagen</p>
+        </div>
+        <button className="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors text-sm font-medium">
+          + DSR Anfrage erstellen
+        </button>
+      </div>
+
+      {/* Info Banner */}
+      <div className="bg-purple-50 border border-purple-200 rounded-lg p-4 mb-6">
+        <div className="flex items-start gap-3">
+          <span className="text-2xl">⚖️</span>
+          <div>
+            <h4 className="font-medium text-purple-900">Data Subject Rights (DSR)</h4>
+            <p className="text-sm text-purple-700 mt-1">
+              Hier verwalten Sie alle DSGVO-Anfragen. Jeder Artikel hat definierte Prozesse, SLAs und automatisierte Workflows.
+            </p>
+          </div>
+        </div>
+      </div>
+
+      {/* GDPR Process Cards */}
+      <div className="space-y-4">
+        {GDPR_PROCESSES.map((process) => (
+          <div
+            key={process.article}
+            className="border border-slate-200 rounded-xl p-5 hover:border-purple-300 transition-colors bg-white"
+          >
+            <div className="flex items-start justify-between">
+              <div className="flex items-start gap-4">
+                <div className="w-12 h-12 bg-purple-100 text-purple-700 rounded-lg flex items-center justify-center font-bold text-lg">
+                  {process.article}
+                </div>
+                <div className="flex-1">
+                  <div className="flex items-center gap-2 mb-1">
+                    <h3 className="font-semibold text-slate-900">{process.title}</h3>
+                    <span className="px-2 py-0.5 bg-green-100 text-green-700 rounded text-xs">Aktiv</span>
+                  </div>
+                  <p className="text-sm text-slate-600 mb-3">{process.description}</p>
+
+                  {/* Actions */}
+                  <div className="flex flex-wrap gap-2 mb-3">
+                    {process.actions.map((action, idx) => (
+                      <span key={idx} className="px-2 py-1 bg-slate-100 text-slate-600 rounded text-xs">
+                        {action}
+                      </span>
+                    ))}
+                  </div>
+
+                  {/* SLA */}
+                  <div className="flex items-center gap-4 text-sm">
+                    <span className="text-slate-500">
+                      SLA: <span className="font-medium text-slate-700">{process.sla}</span>
+                    </span>
+                    <span className="text-slate-300">|</span>
+                    <span className="text-slate-500">
+                      Offene Anfragen: <span className="font-medium text-slate-700">0</span>
+                    </span>
+                  </div>
+                </div>
+              </div>
+
+              <div className="flex flex-col gap-2">
+                <button className="px-3 py-1.5 text-sm text-white bg-purple-600 hover:bg-purple-700 rounded-lg">
+                  Anfragen
+                </button>
+                <button className="px-3 py-1.5 text-sm text-slate-600 hover:text-slate-900 border border-slate-300 rounded-lg hover:border-slate-400">
+                  Vorlage
+                </button>
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+
+      {/* DSR Request Statistics */}
+      <div className="mt-8 pt-6 border-t border-slate-200">
+        <h3 className="text-sm font-semibold text-slate-700 uppercase tracking-wider mb-4">DSR Übersicht</h3>
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+          <div className="bg-slate-50 rounded-lg p-4 text-center">
+            <div className="text-2xl font-bold text-slate-900">0</div>
+            <div className="text-xs text-slate-500 mt-1">Offen</div>
+          </div>
+          <div className="bg-green-50 rounded-lg p-4 text-center">
+            <div className="text-2xl font-bold text-green-700">0</div>
+            <div className="text-xs text-slate-500 mt-1">Erledigt</div>
+          </div>
+          <div className="bg-yellow-50 rounded-lg p-4 text-center">
+            <div className="text-2xl font-bold text-yellow-700">0</div>
+            <div className="text-xs text-slate-500 mt-1">In Bearbeitung</div>
+          </div>
+          <div className="bg-red-50 rounded-lg p-4 text-center">
+            <div className="text-2xl font-bold text-red-700">0</div>
+            <div className="text-xs text-slate-500 mt-1">Überfällig</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}

website/app/admin/consent/_components/StatsTab.tsx

@@ -0,0 +1,31 @@
+'use client'
+
+export default function StatsTab() {
+  return (
+    <div className="p-6">
+      <h2 className="text-lg font-semibold text-slate-900 mb-6">Statistiken</h2>
+
+      <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
+        <div className="bg-slate-50 rounded-xl p-6">
+          <div className="text-3xl font-bold text-slate-900">0</div>
+          <div className="text-sm text-slate-500 mt-1">Aktive Zustimmungen</div>
+        </div>
+        <div className="bg-slate-50 rounded-xl p-6">
+          <div className="text-3xl font-bold text-slate-900">0</div>
+          <div className="text-sm text-slate-500 mt-1">Dokumente</div>
+        </div>
+        <div className="bg-slate-50 rounded-xl p-6">
+          <div className="text-3xl font-bold text-slate-900">0</div>
+          <div className="text-sm text-slate-500 mt-1">Offene DSR-Anfragen</div>
+        </div>
+      </div>
+
+      <div className="border border-slate-200 rounded-lg p-6">
+        <h3 className="font-semibold text-slate-900 mb-4">Zustimmungsrate nach Dokument</h3>
+        <div className="text-center py-8 text-slate-500">
+          Noch keine Daten verfügbar
+        </div>
+      </div>
+    </div>
+  )
+}

website/app/admin/consent/_components/VersionsTab.tsx

@@ -0,0 +1,97 @@
+'use client'
+
+import type { Document, Version } from './types'
+
+interface VersionsTabProps {
+  documents: Document[]
+  versions: Version[]
+  selectedDocument: string
+  setSelectedDocument: (id: string) => void
+  loading: boolean
+}
+
+export default function VersionsTab({ documents, versions, selectedDocument, setSelectedDocument, loading }: VersionsTabProps) {
+  return (
+    <div className="p-6">
+      <div className="flex items-center justify-between mb-6">
+        <div className="flex items-center gap-4">
+          <h2 className="text-lg font-semibold text-slate-900">Versionen</h2>
+          <select
+            value={selectedDocument}
+            onChange={(e) => setSelectedDocument(e.target.value)}
+            className="px-3 py-2 border border-slate-300 rounded-lg text-sm"
+          >
+            <option value="">Dokument auswählen...</option>
+            {documents.map((doc) => (
+              <option key={doc.id} value={doc.id}>
+                {doc.name}
+              </option>
+            ))}
+          </select>
+        </div>
+        {selectedDocument && (
+          <button className="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700 transition-colors text-sm font-medium">
+            + Neue Version
+          </button>
+        )}
+      </div>
+
+      {!selectedDocument ? (
+        <div className="text-center py-12 text-slate-500">
+          Bitte wählen Sie ein Dokument aus
+        </div>
+      ) : loading ? (
+        <div className="text-center py-12 text-slate-500">Lade Versionen...</div>
+      ) : versions.length === 0 ? (
+        <div className="text-center py-12 text-slate-500">
+          Keine Versionen vorhanden
+        </div>
+      ) : (
+        <div className="space-y-4">
+          {versions.map((version) => (
+            <div
+              key={version.id}
+              className="border border-slate-200 rounded-lg p-4 hover:border-primary-300 transition-colors"
+            >
+              <div className="flex items-start justify-between">
+                <div>
+                  <div className="flex items-center gap-2 mb-1">
+                    <span className="font-semibold text-slate-900">v{version.version}</span>
+                    <span className="px-2 py-0.5 bg-slate-100 text-slate-600 rounded text-xs">
+                      {version.language.toUpperCase()}
+                    </span>
+                    <span
+                      className={`px-2 py-0.5 rounded text-xs ${
+                        version.status === 'published'
+                          ? 'bg-green-100 text-green-700'
+                          : version.status === 'draft'
+                          ? 'bg-yellow-100 text-yellow-700'
+                          : 'bg-slate-100 text-slate-600'
+                      }`}
+                    >
+                      {version.status}
+                    </span>
+                  </div>
+                  <h3 className="text-slate-700">{version.title}</h3>
+                  <p className="text-sm text-slate-500 mt-1">
+                    Erstellt: {new Date(version.created_at).toLocaleDateString('de-DE')}
+                  </p>
+                </div>
+                <div className="flex gap-2">
+                  <button className="px-3 py-1.5 text-sm text-slate-600 hover:text-slate-900 border border-slate-300 rounded-lg hover:border-slate-400">
+                    Bearbeiten
+                  </button>
+                  {version.status === 'draft' && (
+                    <button className="px-3 py-1.5 text-sm text-white bg-green-600 hover:bg-green-700 rounded-lg">
+                      Veröffentlichen
+                    </button>
+                  )}
+                </div>
+              </div>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  )
+}

website/app/admin/consent/_components/types.ts

@@ -0,0 +1,77 @@
+export const API_BASE = '/api/admin/consent'
+
+export type Tab = 'documents' | 'versions' | 'emails' | 'gdpr' | 'stats'
+
+export interface Document {
+  id: string
+  type: string
+  name: string
+  description: string
+  mandatory: boolean
+  created_at: string
+  updated_at: string
+}
+
+export interface Version {
+  id: string
+  document_id: string
+  version: string
+  language: string
+  title: string
+  content: string
+  status: string
+  created_at: string
+}
+
+export const TABS: { id: Tab; label: string }[] = [
+  { id: 'documents', label: 'Dokumente' },
+  { id: 'versions', label: 'Versionen' },
+  { id: 'emails', label: 'E-Mail Vorlagen' },
+  { id: 'gdpr', label: 'DSGVO Prozesse' },
+  { id: 'stats', label: 'Statistiken' },
+]
+
+export const EMAIL_TEMPLATES = [
+  { name: 'Willkommens-E-Mail', key: 'welcome', category: 'onboarding', description: 'Wird bei Registrierung versendet' },
+  { name: 'E-Mail Bestätigung', key: 'email_verification', category: 'onboarding', description: 'Bestätigungslink für E-Mail-Adresse' },
+  { name: 'Konto aktiviert', key: 'account_activated', category: 'onboarding', description: 'Bestätigung der Kontoaktivierung' },
+  { name: 'Passwort zurücksetzen', key: 'password_reset', category: 'security', description: 'Link zum Zurücksetzen des Passworts' },
+  { name: 'Passwort geändert', key: 'password_changed', category: 'security', description: 'Bestätigung der Passwortänderung' },
+  { name: 'Neue Anmeldung', key: 'new_login', category: 'security', description: 'Benachrichtigung über Anmeldung von neuem Gerät' },
+  { name: '2FA aktiviert', key: '2fa_enabled', category: 'security', description: 'Bestätigung der 2FA-Aktivierung' },
+  { name: 'Neue Dokumentversion', key: 'new_document_version', category: 'consent', description: 'Info über neue Dokumentversion zur Zustimmung' },
+  { name: 'Zustimmung erteilt', key: 'consent_given', category: 'consent', description: 'Bestätigung der erteilten Zustimmung' },
+  { name: 'Zustimmung widerrufen', key: 'consent_withdrawn', category: 'consent', description: 'Bestätigung des Widerrufs' },
+  { name: 'DSR Anfrage erhalten', key: 'dsr_received', category: 'gdpr', description: 'Bestätigung des Eingangs einer DSGVO-Anfrage' },
+  { name: 'Datenexport bereit', key: 'export_ready', category: 'gdpr', description: 'Benachrichtigung über fertigen Datenexport' },
+  { name: 'Daten gelöscht', key: 'data_deleted', category: 'gdpr', description: 'Bestätigung der Datenlöschung' },
+  { name: 'Daten berichtigt', key: 'data_rectified', category: 'gdpr', description: 'Bestätigung der Datenberichtigung' },
+  { name: 'Konto deaktiviert', key: 'account_deactivated', category: 'lifecycle', description: 'Konto wurde deaktiviert' },
+  { name: 'Konto gelöscht', key: 'account_deleted', category: 'lifecycle', description: 'Bestätigung der Kontolöschung' },
+]
+
+export const GDPR_PROCESSES = [
+  { article: '15', title: 'Auskunftsrecht', description: 'Recht auf Bestätigung und Auskunft über verarbeitete personenbezogene Daten', actions: ['Datenexport generieren', 'Verarbeitungszwecke auflisten', 'Empfänger auflisten'], sla: '30 Tage', status: 'active' },
+  { article: '16', title: 'Recht auf Berichtigung', description: 'Recht auf Berichtigung unrichtiger personenbezogener Daten', actions: ['Daten bearbeiten', 'Änderungshistorie führen', 'Benachrichtigung senden'], sla: '30 Tage', status: 'active' },
+  { article: '17', title: 'Recht auf Löschung ("Vergessenwerden")', description: 'Recht auf Löschung personenbezogener Daten unter bestimmten Voraussetzungen', actions: ['Löschantrag prüfen', 'Daten löschen', 'Aufbewahrungsfristen prüfen', 'Löschbestätigung senden'], sla: '30 Tage', status: 'active' },
+  { article: '18', title: 'Recht auf Einschränkung der Verarbeitung', description: 'Recht auf Markierung von Daten zur eingeschränkten Verarbeitung', actions: ['Daten markieren', 'Verarbeitung einschränken', 'Benachrichtigung bei Aufhebung'], sla: '30 Tage', status: 'active' },
+  { article: '19', title: 'Mitteilungspflicht', description: 'Pflicht zur Mitteilung von Berichtigung, Löschung oder Einschränkung an Empfänger', actions: ['Empfänger ermitteln', 'Mitteilungen versenden', 'Protokollierung'], sla: 'Unverzüglich', status: 'active' },
+  { article: '20', title: 'Recht auf Datenübertragbarkeit', description: 'Recht auf Erhalt der Daten in strukturiertem, maschinenlesbarem Format', actions: ['JSON/CSV Export', 'API-Schnittstelle', 'Direkte Übertragung'], sla: '30 Tage', status: 'active' },
+  { article: '21', title: 'Widerspruchsrecht', description: 'Recht auf Widerspruch gegen Verarbeitung aus berechtigtem Interesse oder Direktwerbung', actions: ['Widerspruch erfassen', 'Verarbeitung stoppen', 'Marketing-Opt-out'], sla: 'Unverzüglich', status: 'active' },
+]
+
+export const EMAIL_CATEGORIES = [
+  { key: 'onboarding', label: 'Onboarding', color: 'bg-blue-100 text-blue-700' },
+  { key: 'security', label: 'Sicherheit', color: 'bg-red-100 text-red-700' },
+  { key: 'consent', label: 'Zustimmung', color: 'bg-green-100 text-green-700' },
+  { key: 'gdpr', label: 'DSGVO', color: 'bg-purple-100 text-purple-700' },
+  { key: 'lifecycle', label: 'Lifecycle', color: 'bg-orange-100 text-orange-700' },
+]
+
+export const CATEGORY_ICONS: Record<string, string> = {
+  onboarding: '👋',
+  security: '🔒',
+  consent: '✓',
+  gdpr: '📋',
+  lifecycle: '🔄',
+}

website/app/admin/consent/_components/useConsent.ts

@@ -0,0 +1,80 @@
+'use client'
+
+import { useState, useEffect } from 'react'
+import type { Tab, Document, Version } from './types'
+import { API_BASE } from './types'
+
+export function useConsent() {
+  const [activeTab, setActiveTab] = useState<Tab>('documents')
+  const [documents, setDocuments] = useState<Document[]>([])
+  const [versions, setVersions] = useState<Version[]>([])
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+  const [selectedDocument, setSelectedDocument] = useState<string>('')
+  const [authToken, setAuthToken] = useState<string>('')
+
+  useEffect(() => {
+    const token = localStorage.getItem('bp_admin_token')
+    if (token) {
+      setAuthToken(token)
+    }
+  }, [])
+
+  useEffect(() => {
+    if (activeTab === 'documents') {
+      loadDocuments()
+    } else if (activeTab === 'versions' && selectedDocument) {
+      loadVersions(selectedDocument)
+    }
+  }, [activeTab, selectedDocument, authToken])
+
+  async function loadDocuments() {
+    setLoading(true)
+    setError(null)
+    try {
+      const res = await fetch(`${API_BASE}/documents`, {
+        headers: authToken ? { 'Authorization': `Bearer ${authToken}` } : {}
+      })
+      if (res.ok) {
+        const data = await res.json()
+        setDocuments(data.documents || [])
+      } else {
+        const errorData = await res.json().catch(() => ({}))
+        setError(errorData.error || 'Fehler beim Laden der Dokumente')
+      }
+    } catch (err) {
+      setError('Verbindungsfehler zum Server')
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  async function loadVersions(docId: string) {
+    setLoading(true)
+    setError(null)
+    try {
+      const res = await fetch(`${API_BASE}/documents/${docId}/versions`, {
+        headers: authToken ? { 'Authorization': `Bearer ${authToken}` } : {}
+      })
+      if (res.ok) {
+        const data = await res.json()
+        setVersions(data.versions || [])
+      } else {
+        const errorData = await res.json().catch(() => ({}))
+        setError(errorData.error || 'Fehler beim Laden der Versionen')
+      }
+    } catch (err) {
+      setError('Verbindungsfehler zum Server')
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  return {
+    activeTab, setActiveTab,
+    documents, versions,
+    loading, error, setError,
+    selectedDocument, setSelectedDocument,
+    authToken, setAuthToken,
+  }
+}