fix: Restore all files lost during destructive rebase
A previous `git pull --rebase origin main` dropped 177 local commits,
losing 3400+ files across admin-v2, backend, studio-v2, website,
klausur-service, and many other services. The partial restore attempt
(660295e2) only recovered some files.
This commit restores all missing files from pre-rebase ref 98933f5e
while preserving post-rebase additions (night-scheduler, night-mode UI,
NightModeWidget dashboard integration).
Restored features include:
- AI Module Sidebar (FAB), OCR Labeling, OCR Compare
- GPU Dashboard, RAG Pipeline, Magic Help
- Klausur-Korrektur (8 files), Abitur-Archiv (5+ files)
- Companion, Zeugnisse-Crawler, Screen Flow
- Full backend, studio-v2, website, klausur-service
- All compliance SDKs, agent-core, voice-service
- CI/CD configs, documentation, scripts
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
403
website/app/admin/dsr/page.tsx
Normal file
403
website/app/admin/dsr/page.tsx
Normal file
@@ -0,0 +1,403 @@
|
||||
'use client'
|
||||
|
||||
/**
|
||||
* DSR (Data Subject Requests) Admin Page
|
||||
*
|
||||
* GDPR Article 15-21 Request Management
|
||||
*/
|
||||
|
||||
import AdminLayout from '@/components/admin/AdminLayout'
|
||||
import { useEffect, useState, useCallback } from 'react'
|
||||
|
||||
interface DSRRequest {
|
||||
id: string
|
||||
request_number: string
|
||||
requester_email: string
|
||||
requester_name: string
|
||||
request_type: string
|
||||
status: string
|
||||
priority: string
|
||||
created_at: string
|
||||
deadline: string
|
||||
assigned_to?: string
|
||||
notes?: string
|
||||
}
|
||||
|
||||
interface DSRStats {
|
||||
total: number
|
||||
pending: number
|
||||
in_progress: number
|
||||
completed: number
|
||||
overdue: number
|
||||
}
|
||||
|
||||
export default function DSRManagementPage() {
|
||||
const [adminToken, setAdminToken] = useState('')
|
||||
const [requests, setRequests] = useState<DSRRequest[]>([])
|
||||
const [stats, setStats] = useState<DSRStats | null>(null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [selectedRequest, setSelectedRequest] = useState<DSRRequest | null>(null)
|
||||
const [filter, setFilter] = useState<string>('all')
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
const API_BASE = 'http://localhost:8081/api/v1'
|
||||
|
||||
// Load saved token
|
||||
useEffect(() => {
|
||||
const savedToken = localStorage.getItem('adminToken')
|
||||
if (savedToken) {
|
||||
setAdminToken(savedToken)
|
||||
}
|
||||
}, [])
|
||||
|
||||
// Save token
|
||||
const saveToken = (token: string) => {
|
||||
setAdminToken(token)
|
||||
localStorage.setItem('adminToken', token)
|
||||
}
|
||||
|
||||
// Fetch DSR requests
|
||||
const fetchRequests = useCallback(async () => {
|
||||
if (!adminToken) return
|
||||
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const response = await fetch(`${API_BASE}/dsr/requests`, {
|
||||
headers: {
|
||||
'Authorization': `Bearer ${adminToken}`,
|
||||
},
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
if (response.status === 401) {
|
||||
throw new Error('Nicht autorisiert - Token ungültig')
|
||||
}
|
||||
throw new Error(`HTTP ${response.status}`)
|
||||
}
|
||||
|
||||
const data = await response.json()
|
||||
setRequests(data.requests || [])
|
||||
|
||||
// Calculate stats
|
||||
const allRequests = data.requests || []
|
||||
const now = new Date()
|
||||
setStats({
|
||||
total: allRequests.length,
|
||||
pending: allRequests.filter((r: DSRRequest) => r.status === 'pending').length,
|
||||
in_progress: allRequests.filter((r: DSRRequest) => r.status === 'in_progress').length,
|
||||
completed: allRequests.filter((r: DSRRequest) => r.status === 'completed').length,
|
||||
overdue: allRequests.filter((r: DSRRequest) => new Date(r.deadline) < now && r.status !== 'completed').length,
|
||||
})
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Fehler beim Laden')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}, [adminToken])
|
||||
|
||||
useEffect(() => {
|
||||
if (adminToken) {
|
||||
fetchRequests()
|
||||
}
|
||||
}, [adminToken, fetchRequests])
|
||||
|
||||
// Get status badge color
|
||||
const getStatusColor = (status: string) => {
|
||||
switch (status) {
|
||||
case 'pending':
|
||||
return 'bg-yellow-100 text-yellow-800'
|
||||
case 'in_progress':
|
||||
return 'bg-blue-100 text-blue-800'
|
||||
case 'completed':
|
||||
return 'bg-green-100 text-green-800'
|
||||
case 'rejected':
|
||||
return 'bg-red-100 text-red-800'
|
||||
default:
|
||||
return 'bg-slate-100 text-slate-800'
|
||||
}
|
||||
}
|
||||
|
||||
// Get priority badge color
|
||||
const getPriorityColor = (priority: string) => {
|
||||
switch (priority) {
|
||||
case 'urgent':
|
||||
return 'bg-red-100 text-red-800'
|
||||
case 'high':
|
||||
return 'bg-orange-100 text-orange-800'
|
||||
case 'normal':
|
||||
return 'bg-slate-100 text-slate-800'
|
||||
case 'low':
|
||||
return 'bg-slate-50 text-slate-600'
|
||||
default:
|
||||
return 'bg-slate-100 text-slate-800'
|
||||
}
|
||||
}
|
||||
|
||||
// Get request type label
|
||||
const getTypeLabel = (type: string) => {
|
||||
const labels: Record<string, string> = {
|
||||
'access': 'Auskunft (Art. 15)',
|
||||
'rectification': 'Berichtigung (Art. 16)',
|
||||
'erasure': 'Löschung (Art. 17)',
|
||||
'restriction': 'Einschränkung (Art. 18)',
|
||||
'portability': 'Datenübertragbarkeit (Art. 20)',
|
||||
'objection': 'Widerspruch (Art. 21)',
|
||||
}
|
||||
return labels[type] || type
|
||||
}
|
||||
|
||||
// Filter requests
|
||||
const filteredRequests = requests.filter(r => {
|
||||
if (filter === 'all') return true
|
||||
if (filter === 'overdue') {
|
||||
return new Date(r.deadline) < new Date() && r.status !== 'completed'
|
||||
}
|
||||
return r.status === filter
|
||||
})
|
||||
|
||||
// Format date
|
||||
const formatDate = (dateStr: string) => {
|
||||
return new Date(dateStr).toLocaleDateString('de-DE', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric',
|
||||
})
|
||||
}
|
||||
|
||||
// Check if overdue
|
||||
const isOverdue = (deadline: string, status: string) => {
|
||||
return new Date(deadline) < new Date() && status !== 'completed'
|
||||
}
|
||||
|
||||
return (
|
||||
<AdminLayout title="Datenschutzanfragen" description="DSGVO Art. 15-21 Anfragen verwalten">
|
||||
{/* Token Input */}
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4 mb-6">
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
Admin Token
|
||||
</label>
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="password"
|
||||
value={adminToken}
|
||||
onChange={(e) => saveToken(e.target.value)}
|
||||
placeholder="JWT Token eingeben..."
|
||||
className="flex-1 px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary-500"
|
||||
/>
|
||||
<button
|
||||
onClick={fetchRequests}
|
||||
disabled={!adminToken || loading}
|
||||
className="px-4 py-2 bg-slate-900 text-white rounded-lg text-sm hover:bg-slate-800 disabled:opacity-50"
|
||||
>
|
||||
{loading ? 'Laden...' : 'Laden'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Error Message */}
|
||||
{error && (
|
||||
<div className="bg-red-50 border border-red-200 text-red-700 px-4 py-3 rounded-lg mb-6">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Stats */}
|
||||
{stats && (
|
||||
<div className="grid grid-cols-2 md:grid-cols-5 gap-4 mb-6">
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4">
|
||||
<div className="text-2xl font-bold text-slate-900">{stats.total}</div>
|
||||
<div className="text-sm text-slate-500">Gesamt</div>
|
||||
</div>
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4">
|
||||
<div className="text-2xl font-bold text-yellow-600">{stats.pending}</div>
|
||||
<div className="text-sm text-slate-500">Offen</div>
|
||||
</div>
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4">
|
||||
<div className="text-2xl font-bold text-blue-600">{stats.in_progress}</div>
|
||||
<div className="text-sm text-slate-500">In Bearbeitung</div>
|
||||
</div>
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4">
|
||||
<div className="text-2xl font-bold text-green-600">{stats.completed}</div>
|
||||
<div className="text-sm text-slate-500">Abgeschlossen</div>
|
||||
</div>
|
||||
<div className="bg-white rounded-xl border border-slate-200 p-4">
|
||||
<div className={`text-2xl font-bold ${stats.overdue > 0 ? 'text-red-600' : 'text-slate-400'}`}>
|
||||
{stats.overdue}
|
||||
</div>
|
||||
<div className="text-sm text-slate-500">Überfällig</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Filter Tabs */}
|
||||
<div className="flex gap-2 mb-4 overflow-x-auto">
|
||||
{[
|
||||
{ value: 'all', label: 'Alle' },
|
||||
{ value: 'pending', label: 'Offen' },
|
||||
{ value: 'in_progress', label: 'In Bearbeitung' },
|
||||
{ value: 'completed', label: 'Abgeschlossen' },
|
||||
{ value: 'overdue', label: 'Überfällig' },
|
||||
].map((tab) => (
|
||||
<button
|
||||
key={tab.value}
|
||||
onClick={() => setFilter(tab.value)}
|
||||
className={`px-4 py-2 rounded-lg text-sm font-medium whitespace-nowrap transition-colors ${
|
||||
filter === tab.value
|
||||
? 'bg-slate-900 text-white'
|
||||
: 'bg-white text-slate-700 border border-slate-200 hover:bg-slate-50'
|
||||
}`}
|
||||
>
|
||||
{tab.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Requests Table */}
|
||||
<div className="bg-white rounded-xl border border-slate-200 overflow-hidden">
|
||||
<table className="w-full">
|
||||
<thead className="bg-slate-50 border-b border-slate-200">
|
||||
<tr>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Nr.</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Typ</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Anfragesteller</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Status</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Priorität</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Frist</th>
|
||||
<th className="px-4 py-3 text-left text-xs font-medium text-slate-500 uppercase">Aktionen</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-slate-100">
|
||||
{filteredRequests.length === 0 ? (
|
||||
<tr>
|
||||
<td colSpan={7} className="px-4 py-8 text-center text-slate-500">
|
||||
Keine Anfragen gefunden
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
filteredRequests.map((request) => (
|
||||
<tr key={request.id} className={isOverdue(request.deadline, request.status) ? 'bg-red-50' : ''}>
|
||||
<td className="px-4 py-3 text-sm font-mono text-slate-900">{request.request_number}</td>
|
||||
<td className="px-4 py-3 text-sm text-slate-700">{getTypeLabel(request.request_type)}</td>
|
||||
<td className="px-4 py-3">
|
||||
<div className="text-sm text-slate-900">{request.requester_name}</div>
|
||||
<div className="text-xs text-slate-500">{request.requester_email}</div>
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<span className={`px-2 py-1 rounded-full text-xs font-medium ${getStatusColor(request.status)}`}>
|
||||
{request.status}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<span className={`px-2 py-1 rounded-full text-xs font-medium ${getPriorityColor(request.priority)}`}>
|
||||
{request.priority}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<span className={`text-sm ${isOverdue(request.deadline, request.status) ? 'text-red-600 font-medium' : 'text-slate-700'}`}>
|
||||
{formatDate(request.deadline)}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<button
|
||||
onClick={() => setSelectedRequest(request)}
|
||||
className="text-primary-600 hover:text-primary-700 text-sm font-medium"
|
||||
>
|
||||
Details
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{/* Detail Modal */}
|
||||
{selectedRequest && (
|
||||
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-xl shadow-xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-y-auto">
|
||||
<div className="px-6 py-4 border-b border-slate-200 flex items-center justify-between">
|
||||
<h3 className="font-semibold text-slate-900">
|
||||
Anfrage {selectedRequest.request_number}
|
||||
</h3>
|
||||
<button
|
||||
onClick={() => setSelectedRequest(null)}
|
||||
className="text-slate-400 hover:text-slate-600"
|
||||
>
|
||||
<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>
|
||||
</button>
|
||||
</div>
|
||||
<div className="p-6 space-y-4">
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Typ</div>
|
||||
<div className="font-medium text-slate-900">{getTypeLabel(selectedRequest.request_type)}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Status</div>
|
||||
<span className={`px-2 py-1 rounded-full text-xs font-medium ${getStatusColor(selectedRequest.status)}`}>
|
||||
{selectedRequest.status}
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Anfragesteller</div>
|
||||
<div className="font-medium text-slate-900">{selectedRequest.requester_name}</div>
|
||||
<div className="text-sm text-slate-500">{selectedRequest.requester_email}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Frist</div>
|
||||
<div className={`font-medium ${isOverdue(selectedRequest.deadline, selectedRequest.status) ? 'text-red-600' : 'text-slate-900'}`}>
|
||||
{formatDate(selectedRequest.deadline)}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Eingegangen</div>
|
||||
<div className="font-medium text-slate-900">{formatDate(selectedRequest.created_at)}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-sm text-slate-500">Zugewiesen an</div>
|
||||
<div className="font-medium text-slate-900">{selectedRequest.assigned_to || '-'}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{selectedRequest.notes && (
|
||||
<div>
|
||||
<div className="text-sm text-slate-500 mb-1">Notizen</div>
|
||||
<div className="bg-slate-50 rounded-lg p-3 text-sm text-slate-700">
|
||||
{selectedRequest.notes}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex gap-2 pt-4">
|
||||
<button className="flex-1 px-4 py-2 bg-primary-600 text-white rounded-lg text-sm font-medium hover:bg-primary-700">
|
||||
Bearbeiten
|
||||
</button>
|
||||
<button className="px-4 py-2 border border-slate-300 text-slate-700 rounded-lg text-sm font-medium hover:bg-slate-50">
|
||||
Abschließen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Info Box */}
|
||||
<div className="mt-6 bg-blue-50 border border-blue-200 rounded-xl p-4">
|
||||
<h4 className="font-semibold text-blue-900 mb-2">DSGVO-Fristen</h4>
|
||||
<ul className="text-sm text-blue-800 space-y-1">
|
||||
<li>Art. 15 (Auskunft): 1 Monat, verlängerbar auf 3 Monate</li>
|
||||
<li>Art. 16 (Berichtigung): Unverzüglich</li>
|
||||
<li>Art. 17 (Löschung): Unverzüglich</li>
|
||||
<li>Art. 18 (Einschränkung): Unverzüglich</li>
|
||||
<li>Art. 20 (Datenübertragbarkeit): 1 Monat</li>
|
||||
<li>Art. 21 (Widerspruch): Unverzüglich</li>
|
||||
</ul>
|
||||
</div>
|
||||
</AdminLayout>
|
||||
)
|
||||
}
|
||||
407
website/app/admin/dsr/wizard/page.tsx
Normal file
407
website/app/admin/dsr/wizard/page.tsx
Normal file
@@ -0,0 +1,407 @@
|
||||
'use client'
|
||||
|
||||
import { useState } from 'react'
|
||||
import AdminLayout from '@/components/admin/AdminLayout'
|
||||
import {
|
||||
WizardStepper,
|
||||
WizardNavigation,
|
||||
EducationCard,
|
||||
ArchitectureContext,
|
||||
TestRunner,
|
||||
TestSummary,
|
||||
type WizardStep,
|
||||
type TestCategoryResult,
|
||||
type FullTestResults,
|
||||
type EducationContent,
|
||||
type ArchitectureContextType,
|
||||
} from '@/components/wizard'
|
||||
|
||||
// ==============================================
|
||||
// Constants
|
||||
// ==============================================
|
||||
|
||||
const BACKEND_URL = process.env.NEXT_PUBLIC_BACKEND_URL || 'http://localhost:8000'
|
||||
|
||||
const STEPS: WizardStep[] = [
|
||||
{ id: 'welcome', name: 'Willkommen', icon: '👋', status: 'pending' },
|
||||
{ id: 'api-health', name: 'API Status', icon: '💚', status: 'pending', category: 'api-health' },
|
||||
{ id: 'request-types', name: 'Anfragetypen', icon: '📝', status: 'pending', category: 'request-types' },
|
||||
{ id: 'workflow', name: 'Workflow', icon: '🔄', status: 'pending', category: 'workflow' },
|
||||
{ id: 'export', name: 'Datenexport', icon: '📦', status: 'pending', category: 'export' },
|
||||
{ id: 'audit', name: 'Audit Trail', icon: '📋', status: 'pending', category: 'audit' },
|
||||
{ id: 'summary', name: 'Zusammenfassung', icon: '📊', status: 'pending' },
|
||||
]
|
||||
|
||||
const EDUCATION_CONTENT: Record<string, EducationContent> = {
|
||||
'welcome': {
|
||||
title: 'Willkommen zum DSR-Wizard',
|
||||
content: [
|
||||
'DSR steht fuer "Data Subject Request" - Betroffenenanfragen nach DSGVO.',
|
||||
'',
|
||||
'Die DSGVO gibt Betroffenen umfangreiche Rechte:',
|
||||
'• Art. 15: Auskunftsrecht - Was wissen Sie ueber mich?',
|
||||
'• Art. 16: Berichtigung - Korrigieren Sie falsche Daten',
|
||||
'• Art. 17: Loeschung - Loeschen Sie alle meine Daten',
|
||||
'• Art. 18: Einschraenkung - Stoppen Sie die Verarbeitung',
|
||||
'• Art. 20: Portabilitaet - Geben Sie mir meine Daten',
|
||||
'• Art. 21: Widerspruch - Ich widerspreche der Verarbeitung',
|
||||
'',
|
||||
'Jede Anfrage muss innerhalb von 30 Tagen bearbeitet werden.',
|
||||
],
|
||||
},
|
||||
'api-health': {
|
||||
title: 'DSR API - Kritische Infrastruktur',
|
||||
content: [
|
||||
'Die DSR-API verarbeitet rechtlich bindende Anfragen.',
|
||||
'',
|
||||
'Verfuegbarkeit ist kritisch:',
|
||||
'• Fristversaeumnis = Bussgeld bis 20 Mio. EUR',
|
||||
'• Behoerden erwarten lueckenlose Dokumentation',
|
||||
'• Betroffene haben Anspruch auf zeitnahe Bearbeitung',
|
||||
'',
|
||||
'Wir pruefen:',
|
||||
'• DSR Admin Endpoints erreichbar',
|
||||
'• Statistik-Endpunkte funktional',
|
||||
'• Template-System verfuegbar',
|
||||
],
|
||||
},
|
||||
'request-types': {
|
||||
title: 'DSGVO Anfragetypen',
|
||||
content: [
|
||||
'Jeder Anfragetyp hat spezifische Anforderungen:',
|
||||
'',
|
||||
'ACCESS (Art. 15):',
|
||||
'• Vollstaendige Kopie aller personenbezogenen Daten',
|
||||
'• Verarbeitungszwecke, Kategorien, Empfaenger',
|
||||
'',
|
||||
'ERASURE (Art. 17) - "Recht auf Vergessenwerden":',
|
||||
'• Loeschung aller Daten, auch in Backups',
|
||||
'• Benachrichtigung Dritter ueber Loeschung',
|
||||
'',
|
||||
'PORTABILITY (Art. 20):',
|
||||
'• Daten in strukturiertem Format (JSON/CSV)',
|
||||
'• Uebertragung an anderen Anbieter moeglich',
|
||||
],
|
||||
},
|
||||
'workflow': {
|
||||
title: 'Bearbeitungs-Workflow',
|
||||
content: [
|
||||
'Jede Anfrage durchlaeuft definierte Status:',
|
||||
'',
|
||||
'pending → identity_verification → processing → completed',
|
||||
'',
|
||||
'• pending: Anfrage eingegangen',
|
||||
'• identity_verification: Identitaet wird geprueft',
|
||||
'• processing: Aktive Bearbeitung',
|
||||
'• on_hold: Warten auf Informationen',
|
||||
'• completed: Erfolgreich abgeschlossen',
|
||||
'• rejected: Mit Begruendung abgelehnt',
|
||||
'',
|
||||
'Fristen: 30 Tage Standard, max. 60 Tage mit Begruendung',
|
||||
],
|
||||
},
|
||||
'export': {
|
||||
title: 'GDPR-konformer Datenexport',
|
||||
content: [
|
||||
'Der Export muss alle Anforderungen erfuellen:',
|
||||
'',
|
||||
'Format-Optionen:',
|
||||
'• PDF: Menschenlesbar, fuer Endnutzer',
|
||||
'• JSON: Maschinenlesbar fuer Portabilitaet',
|
||||
'• CSV: Tabellarisch fuer einfache Analyse',
|
||||
'',
|
||||
'Inhalt:',
|
||||
'• Alle personenbezogenen Daten',
|
||||
'• Verarbeitungszwecke und Rechtsgrundlage',
|
||||
'• Empfaenger und Speicherdauer',
|
||||
'',
|
||||
'Sicherheit: Verschluesselt und zugriffskontrolliert',
|
||||
],
|
||||
},
|
||||
'audit': {
|
||||
title: 'Audit Trail - Rechtlicher Nachweis',
|
||||
content: [
|
||||
'Der Audit Trail ist rechtlich erforderlich:',
|
||||
'',
|
||||
'Dokumentiert wird:',
|
||||
'• Wer hat wann was getan',
|
||||
'• Jede Statusaenderung mit Zeitstempel',
|
||||
'• Alle Kommunikation mit dem Betroffenen',
|
||||
'• Identitaetspruefung und Methode',
|
||||
'• Fristverlaengerungen mit Begruendung',
|
||||
'',
|
||||
'Aufbewahrung: Mindestens 3 Jahre, unveraenderbar',
|
||||
'Bei Behoerdenanfragen ist dies der entscheidende Nachweis.',
|
||||
],
|
||||
},
|
||||
'summary': {
|
||||
title: 'Test-Zusammenfassung',
|
||||
content: [
|
||||
'Hier sehen Sie eine Uebersicht aller durchgefuehrten Tests:',
|
||||
'• Anzahl bestandener Tests',
|
||||
'• Fehlgeschlagene Tests mit Details',
|
||||
'• Empfehlungen zur Behebung',
|
||||
],
|
||||
},
|
||||
}
|
||||
|
||||
const ARCHITECTURE_CONTEXTS: Record<string, ArchitectureContextType> = {
|
||||
'api-health': {
|
||||
layer: 'api',
|
||||
services: ['backend', 'consent-service'],
|
||||
dependencies: ['JWT Auth', 'PostgreSQL'],
|
||||
dataFlow: ['Browser', 'FastAPI', 'Go Consent Service', 'dsr_requests'],
|
||||
},
|
||||
'request-types': {
|
||||
layer: 'service',
|
||||
services: ['consent-service', 'postgres'],
|
||||
dependencies: ['Request Types Enum', 'Workflow Engine'],
|
||||
dataFlow: ['Request Type', 'Validation', 'Workflow Assignment'],
|
||||
},
|
||||
'workflow': {
|
||||
layer: 'service',
|
||||
services: ['consent-service'],
|
||||
dependencies: ['State Machine', 'Audit Log', 'Deadline Tracker'],
|
||||
dataFlow: ['Status Change', 'Validation', 'Audit Log', 'Notification'],
|
||||
},
|
||||
'export': {
|
||||
layer: 'service',
|
||||
services: ['backend', 'consent-service', 'postgres'],
|
||||
dependencies: ['Export Service', 'PDF Generator', 'Encryption'],
|
||||
dataFlow: ['Data Collection', 'Formatting', 'Encryption', 'Delivery'],
|
||||
},
|
||||
'audit': {
|
||||
layer: 'database',
|
||||
services: ['postgres'],
|
||||
dependencies: ['Immutable Logs', 'Timestamps', 'User Tracking'],
|
||||
dataFlow: ['Action', 'Log Entry', 'Persistent Storage'],
|
||||
},
|
||||
}
|
||||
|
||||
// ==============================================
|
||||
// Main Component
|
||||
// ==============================================
|
||||
|
||||
export default function DSRWizardPage() {
|
||||
const [currentStep, setCurrentStep] = useState(0)
|
||||
const [steps, setSteps] = useState<WizardStep[]>(STEPS)
|
||||
const [categoryResults, setCategoryResults] = useState<Record<string, TestCategoryResult>>({})
|
||||
const [fullResults, setFullResults] = useState<FullTestResults | null>(null)
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
const currentStepData = steps[currentStep]
|
||||
const isTestStep = currentStepData?.category !== undefined
|
||||
const isWelcome = currentStepData?.id === 'welcome'
|
||||
const isSummary = currentStepData?.id === 'summary'
|
||||
|
||||
const runCategoryTest = async (category: string) => {
|
||||
setIsLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const response = await fetch(`${BACKEND_URL}/api/admin/dsr-tests/${category}`, {
|
||||
method: 'POST',
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}: ${response.statusText}`)
|
||||
}
|
||||
|
||||
const result: TestCategoryResult = await response.json()
|
||||
setCategoryResults((prev) => ({ ...prev, [category]: result }))
|
||||
|
||||
setSteps((prev) =>
|
||||
prev.map((step) =>
|
||||
step.category === category
|
||||
? { ...step, status: result.failed === 0 ? 'completed' : 'failed' }
|
||||
: step
|
||||
)
|
||||
)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
} finally {
|
||||
setIsLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const runAllTests = async () => {
|
||||
setIsLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const response = await fetch(`${BACKEND_URL}/api/admin/dsr-tests/run-all`, {
|
||||
method: 'POST',
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}: ${response.statusText}`)
|
||||
}
|
||||
|
||||
const results: FullTestResults = await response.json()
|
||||
setFullResults(results)
|
||||
|
||||
setSteps((prev) =>
|
||||
prev.map((step) => {
|
||||
if (step.category) {
|
||||
const catResult = results.categories.find((c) => c.category === step.category)
|
||||
if (catResult) {
|
||||
return { ...step, status: catResult.failed === 0 ? 'completed' : 'failed' }
|
||||
}
|
||||
}
|
||||
return step
|
||||
})
|
||||
)
|
||||
|
||||
const newCategoryResults: Record<string, TestCategoryResult> = {}
|
||||
results.categories.forEach((cat) => {
|
||||
newCategoryResults[cat.category] = cat
|
||||
})
|
||||
setCategoryResults(newCategoryResults)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
} finally {
|
||||
setIsLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const goToNext = () => {
|
||||
if (currentStep < steps.length - 1) {
|
||||
setSteps((prev) =>
|
||||
prev.map((step, idx) =>
|
||||
idx === currentStep && step.status === 'pending'
|
||||
? { ...step, status: 'completed' }
|
||||
: step
|
||||
)
|
||||
)
|
||||
setCurrentStep((prev) => prev + 1)
|
||||
}
|
||||
}
|
||||
|
||||
const goToPrev = () => {
|
||||
if (currentStep > 0) {
|
||||
setCurrentStep((prev) => prev - 1)
|
||||
}
|
||||
}
|
||||
|
||||
const handleStepClick = (index: number) => {
|
||||
if (index <= currentStep || steps[index - 1]?.status !== 'pending') {
|
||||
setCurrentStep(index)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<AdminLayout
|
||||
title="DSR Wizard"
|
||||
description="Interaktives Lernen und Testen der Betroffenenanfragen-Verwaltung"
|
||||
>
|
||||
{/* Header */}
|
||||
<div className="bg-white rounded-lg shadow p-4 mb-6 flex items-center justify-between">
|
||||
<div className="flex items-center">
|
||||
<span className="text-3xl mr-3">🔒</span>
|
||||
<div>
|
||||
<h2 className="text-lg font-bold text-gray-800">Datenschutzanfragen Test Wizard</h2>
|
||||
<p className="text-sm text-gray-600">DSGVO Art. 15-21 Betroffenenrechte</p>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/admin/dsr" className="text-blue-600 hover:text-blue-800 text-sm">
|
||||
← Zurueck zu Datenschutzanfragen
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Stepper */}
|
||||
<div className="bg-white rounded-lg shadow p-6 mb-6">
|
||||
<WizardStepper steps={steps} currentStep={currentStep} onStepClick={handleStepClick} />
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className="bg-white rounded-lg shadow p-6">
|
||||
<div className="flex items-center mb-6">
|
||||
<span className="text-3xl mr-3">{currentStepData?.icon}</span>
|
||||
<div>
|
||||
<h2 className="text-xl font-bold text-gray-800">
|
||||
Schritt {currentStep + 1}: {currentStepData?.name}
|
||||
</h2>
|
||||
<p className="text-gray-500 text-sm">
|
||||
{currentStep + 1} von {steps.length}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<EducationCard content={EDUCATION_CONTENT[currentStepData?.id || '']} />
|
||||
|
||||
{isTestStep && currentStepData?.category && ARCHITECTURE_CONTEXTS[currentStepData.category] && (
|
||||
<ArchitectureContext
|
||||
context={ARCHITECTURE_CONTEXTS[currentStepData.category]}
|
||||
currentStep={currentStepData.name}
|
||||
/>
|
||||
)}
|
||||
|
||||
{error && (
|
||||
<div className="bg-red-50 border border-red-200 text-red-700 rounded-lg p-4 mb-6">
|
||||
<strong>Fehler:</strong> {error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isWelcome && (
|
||||
<div className="text-center py-8">
|
||||
<button
|
||||
onClick={goToNext}
|
||||
className="bg-blue-600 text-white px-8 py-3 rounded-lg font-medium hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
Wizard starten
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isTestStep && currentStepData?.category && (
|
||||
<TestRunner
|
||||
category={currentStepData.category}
|
||||
categoryResult={categoryResults[currentStepData.category]}
|
||||
isLoading={isLoading}
|
||||
onRunTests={() => runCategoryTest(currentStepData.category!)}
|
||||
/>
|
||||
)}
|
||||
|
||||
{isSummary && (
|
||||
<div>
|
||||
{!fullResults ? (
|
||||
<div className="text-center py-8">
|
||||
<p className="text-gray-600 mb-4">
|
||||
Fuehren Sie alle Tests aus um eine Zusammenfassung zu sehen.
|
||||
</p>
|
||||
<button
|
||||
onClick={runAllTests}
|
||||
disabled={isLoading}
|
||||
className={`px-6 py-3 rounded-lg font-medium transition-colors ${
|
||||
isLoading
|
||||
? 'bg-gray-400 cursor-not-allowed'
|
||||
: 'bg-blue-600 text-white hover:bg-blue-700'
|
||||
}`}
|
||||
>
|
||||
{isLoading ? 'Alle Tests laufen...' : 'Alle Tests ausfuehren'}
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<TestSummary results={fullResults} />
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<WizardNavigation
|
||||
currentStep={currentStep}
|
||||
totalSteps={steps.length}
|
||||
onPrev={goToPrev}
|
||||
onNext={goToNext}
|
||||
showNext={!isSummary}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="text-center text-gray-500 text-sm mt-6">
|
||||
Diese Tests pruefen die DSGVO-konforme Bearbeitung von Betroffenenanfragen.
|
||||
Bei Fragen wenden Sie sich an den Datenschutzbeauftragten.
|
||||
</div>
|
||||
</AdminLayout>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user