fix: SDK-Module Frontend-Backend-Mismatches beheben + fehlende Proxy-Routes
- P0: enableBackendSync=true in SDKProvider aktiviert (PostgreSQL State-Persistenz) - P0: Source Policy 4 Tabs an Backend-Schema angepasst (is_active→active, data.logs→data.entries, is_allowed→allowed, rule_type→category, severity→action) - P0: OperationsMatrixTab holt jetzt Sources+Operations separat und joint client-side - P0: PIIRulesTab PII-Test auf client-side Regex umgestellt (kein Backend-Endpoint noetig) - P1: GET Proxy-Routes fuer Import, Screening und UCCA [id] (GET+DELETE) erstellt - P1: Compliance Scope ScopeOverviewTab/ScopeExportTab Prop-Interfaces erweitert - P2: Company Profile speichert jetzt auch zum dedizierten Backend-Endpoint - P2: UCCA Wizard von 5 auf 8 Steps erweitert (Rechtsgrundlage, Datentransfer, Vertraege) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
@@ -4,11 +4,16 @@ import type { ScopeDecision, ScopeProfilingAnswer } from '@/lib/sdk/compliance-s
|
||||
import { DEPTH_LEVEL_LABELS, DOCUMENT_TYPE_LABELS } from '@/lib/sdk/compliance-scope-types'
|
||||
|
||||
interface ScopeExportTabProps {
|
||||
decision: ScopeDecision | null
|
||||
answers: ScopeProfilingAnswer[]
|
||||
decision?: ScopeDecision | null
|
||||
answers?: ScopeProfilingAnswer[]
|
||||
scopeState?: { decision: ScopeDecision | null; answers: ScopeProfilingAnswer[] }
|
||||
onBackToDecision?: () => void
|
||||
}
|
||||
|
||||
export function ScopeExportTab({ decision, answers }: ScopeExportTabProps) {
|
||||
export function ScopeExportTab({ decision: decisionProp, answers: answersProp, scopeState, onBackToDecision }: ScopeExportTabProps) {
|
||||
const decision = decisionProp ?? scopeState?.decision ?? null
|
||||
const answers = answersProp ?? scopeState?.answers ?? []
|
||||
// onBackToDecision is accepted but not used in this component (navigation handled by parent)
|
||||
const [copiedMarkdown, setCopiedMarkdown] = useState(false)
|
||||
|
||||
const handleDownloadJSON = useCallback(() => {
|
||||
|
||||
@@ -5,11 +5,16 @@ import { DEPTH_LEVEL_LABELS, DEPTH_LEVEL_DESCRIPTIONS, DEPTH_LEVEL_COLORS, DOCUM
|
||||
|
||||
interface ScopeOverviewTabProps {
|
||||
scopeState: ComplianceScopeState
|
||||
completionStats?: { total: number; answered: number; percentage: number; isComplete: boolean }
|
||||
onStartProfiling: () => void
|
||||
onRefreshDecision: () => void
|
||||
onReset?: () => void
|
||||
onGoToWizard?: () => void
|
||||
onGoToDecision?: () => void
|
||||
onGoToExport?: () => void
|
||||
onRefreshDecision?: () => void
|
||||
}
|
||||
|
||||
export function ScopeOverviewTab({ scopeState, onStartProfiling, onRefreshDecision }: ScopeOverviewTabProps) {
|
||||
export function ScopeOverviewTab({ scopeState, completionStats, onStartProfiling, onReset, onGoToWizard, onGoToDecision, onGoToExport, onRefreshDecision }: ScopeOverviewTabProps) {
|
||||
const { decision, answers } = scopeState
|
||||
const hasAnswers = answers && answers.length > 0
|
||||
|
||||
@@ -254,12 +259,22 @@ export function ScopeOverviewTab({ scopeState, onStartProfiling, onRefreshDecisi
|
||||
: 'Haben sich Ihre Unternehmensparameter geändert? Aktualisieren Sie Ihre Bewertung.'}
|
||||
</p>
|
||||
</div>
|
||||
<button
|
||||
onClick={!hasAnswers ? onStartProfiling : onRefreshDecision}
|
||||
className="px-6 py-3 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors font-medium whitespace-nowrap"
|
||||
>
|
||||
{!hasAnswers ? 'Scope-Profiling starten' : 'Ergebnis aktualisieren'}
|
||||
</button>
|
||||
<div className="flex items-center gap-3">
|
||||
{hasAnswers && onReset && (
|
||||
<button
|
||||
onClick={onReset}
|
||||
className="px-4 py-2 text-sm font-medium text-gray-600 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors"
|
||||
>
|
||||
Zurücksetzen
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={!hasAnswers ? onStartProfiling : (onGoToWizard || onRefreshDecision || onStartProfiling)}
|
||||
className="px-6 py-3 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors font-medium whitespace-nowrap"
|
||||
>
|
||||
{!hasAnswers ? 'Scope-Profiling starten' : 'Ergebnis aktualisieren'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -7,9 +7,9 @@ interface AuditLogEntry {
|
||||
action: string
|
||||
entity_type: string
|
||||
entity_id?: string
|
||||
old_value?: any
|
||||
new_value?: any
|
||||
user_email?: string
|
||||
old_values?: any
|
||||
new_values?: any
|
||||
user_id?: string
|
||||
created_at: string
|
||||
}
|
||||
|
||||
@@ -91,7 +91,7 @@ export function AuditTab({ apiBase }: AuditTabProps) {
|
||||
if (!res.ok) throw new Error('Fehler beim Laden')
|
||||
|
||||
const data = await res.json()
|
||||
setAuditLogs(data.logs || [])
|
||||
setAuditLogs(data.entries || [])
|
||||
setAuditTotal(data.total || 0)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
@@ -109,13 +109,20 @@ export function AuditTab({ apiBase }: AuditTabProps) {
|
||||
params.append('limit', '100')
|
||||
|
||||
const res = await fetch(`${apiBase}/v1/admin/blocked-content?${params}`)
|
||||
if (!res.ok) throw new Error('Fehler beim Laden')
|
||||
if (!res.ok) {
|
||||
// Endpoint may not exist yet — show empty state
|
||||
setBlockedContent([])
|
||||
setBlockedTotal(0)
|
||||
return
|
||||
}
|
||||
|
||||
const data = await res.json()
|
||||
setBlockedContent(data.blocked || [])
|
||||
setBlockedTotal(data.total || 0)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
} catch {
|
||||
// Endpoint not available — show empty state gracefully
|
||||
setBlockedContent([])
|
||||
setBlockedTotal(0)
|
||||
} finally {
|
||||
setBlockedLoading(false)
|
||||
}
|
||||
@@ -284,26 +291,26 @@ export function AuditTab({ apiBase }: AuditTabProps) {
|
||||
{formatDate(log.created_at)}
|
||||
</div>
|
||||
</div>
|
||||
{log.user_email && (
|
||||
{log.user_id && (
|
||||
<div className="mt-2 text-xs text-slate-500">
|
||||
Benutzer: {log.user_email}
|
||||
Benutzer: {log.user_id}
|
||||
</div>
|
||||
)}
|
||||
{(log.old_value || log.new_value) && (
|
||||
{(log.old_values || log.new_values) && (
|
||||
<div className="mt-2 flex gap-4 text-xs">
|
||||
{log.old_value && (
|
||||
{log.old_values && (
|
||||
<div className="flex-1 p-2 bg-red-50 rounded">
|
||||
<div className="text-red-600 font-medium mb-1">Vorher:</div>
|
||||
<pre className="text-red-700 overflow-x-auto">
|
||||
{typeof log.old_value === 'string' ? log.old_value : JSON.stringify(log.old_value, null, 2)}
|
||||
{typeof log.old_values === 'string' ? log.old_values : JSON.stringify(log.old_values, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
{log.new_value && (
|
||||
{log.new_values && (
|
||||
<div className="flex-1 p-2 bg-green-50 rounded">
|
||||
<div className="text-green-600 font-medium mb-1">Nachher:</div>
|
||||
<pre className="text-green-700 overflow-x-auto">
|
||||
{typeof log.new_value === 'string' ? log.new_value : JSON.stringify(log.new_value, null, 2)}
|
||||
{typeof log.new_values === 'string' ? log.new_values : JSON.stringify(log.new_values, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -6,17 +6,16 @@ interface OperationPermission {
|
||||
id: string
|
||||
source_id: string
|
||||
operation: string
|
||||
is_allowed: boolean
|
||||
requires_citation: boolean
|
||||
notes?: string
|
||||
allowed: boolean
|
||||
conditions?: string
|
||||
}
|
||||
|
||||
interface SourceWithOperations {
|
||||
id: string
|
||||
domain: string
|
||||
name: string
|
||||
license: string
|
||||
is_active: boolean
|
||||
license?: string
|
||||
active: boolean
|
||||
operations: OperationPermission[]
|
||||
}
|
||||
|
||||
@@ -44,11 +43,33 @@ export function OperationsMatrixTab({ apiBase }: OperationsMatrixTabProps) {
|
||||
const fetchMatrix = async () => {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res = await fetch(`${apiBase}/v1/admin/operations-matrix`)
|
||||
if (!res.ok) throw new Error('Fehler beim Laden')
|
||||
const [sourcesRes, opsRes] = await Promise.all([
|
||||
fetch(`${apiBase}/v1/admin/sources`),
|
||||
fetch(`${apiBase}/v1/admin/operations-matrix`),
|
||||
])
|
||||
if (!sourcesRes.ok || !opsRes.ok) throw new Error('Fehler beim Laden')
|
||||
|
||||
const data = await res.json()
|
||||
setSources(data.sources || [])
|
||||
const sourcesData = await sourcesRes.json()
|
||||
const opsData = await opsRes.json()
|
||||
|
||||
// Join: group operations by source_id
|
||||
const opsBySource = new Map<string, OperationPermission[]>()
|
||||
for (const op of opsData.operations || []) {
|
||||
const list = opsBySource.get(op.source_id) || []
|
||||
list.push(op)
|
||||
opsBySource.set(op.source_id, list)
|
||||
}
|
||||
|
||||
const joined: SourceWithOperations[] = (sourcesData.sources || []).map((s: any) => ({
|
||||
id: s.id,
|
||||
domain: s.domain,
|
||||
name: s.name,
|
||||
license: s.license,
|
||||
active: s.active,
|
||||
operations: opsBySource.get(s.id) || [],
|
||||
}))
|
||||
|
||||
setSources(joined)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
} finally {
|
||||
@@ -58,28 +79,26 @@ export function OperationsMatrixTab({ apiBase }: OperationsMatrixTabProps) {
|
||||
|
||||
const togglePermission = async (
|
||||
source: SourceWithOperations,
|
||||
operationId: string,
|
||||
field: 'is_allowed' | 'requires_citation'
|
||||
operationId: string
|
||||
) => {
|
||||
// Find the permission
|
||||
const permission = source.operations.find((op) => op.operation === operationId)
|
||||
if (!permission) return
|
||||
|
||||
// Block enabling training
|
||||
if (operationId === 'training' && field === 'is_allowed' && !permission.is_allowed) {
|
||||
if (operationId === 'training' && !permission.allowed) {
|
||||
setError('Training mit externen Daten ist VERBOTEN und kann nicht aktiviert werden.')
|
||||
return
|
||||
}
|
||||
|
||||
const updateId = `${permission.id}-${field}`
|
||||
const updateId = `${permission.id}-allowed`
|
||||
setUpdating(updateId)
|
||||
|
||||
try {
|
||||
const newValue = !permission[field]
|
||||
const res = await fetch(`${apiBase}/v1/admin/operations/${permission.id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ [field]: newValue }),
|
||||
body: JSON.stringify({ allowed: !permission.allowed }),
|
||||
})
|
||||
|
||||
if (!res.ok) {
|
||||
@@ -174,7 +193,7 @@ export function OperationsMatrixTab({ apiBase }: OperationsMatrixTabProps) {
|
||||
</tr>
|
||||
) : (
|
||||
sources.map((source) => (
|
||||
<tr key={source.id} className={`hover:bg-slate-50 ${!source.is_active ? 'opacity-50' : ''}`}>
|
||||
<tr key={source.id} className={`hover:bg-slate-50 ${!source.active ? 'opacity-50' : ''}`}>
|
||||
<td className="px-4 py-3">
|
||||
<div>
|
||||
<div className="font-medium text-slate-800">{source.name}</div>
|
||||
@@ -184,17 +203,17 @@ export function OperationsMatrixTab({ apiBase }: OperationsMatrixTabProps) {
|
||||
{OPERATIONS.map((op) => {
|
||||
const permission = source.operations.find((p) => p.operation === op.id)
|
||||
const isTraining = op.id === 'training'
|
||||
const isAllowed = permission?.is_allowed ?? false
|
||||
const requiresCitation = permission?.requires_citation ?? false
|
||||
const isUpdating = updating === `${permission?.id}-is_allowed` || updating === `${permission?.id}-requires_citation`
|
||||
const isAllowed = permission?.allowed ?? false
|
||||
const hasConditions = !!permission?.conditions
|
||||
const isUpdating = updating === `${permission?.id}-allowed`
|
||||
|
||||
return (
|
||||
<td key={op.id} className="px-4 py-3 text-center">
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
{/* Is Allowed Toggle */}
|
||||
{/* Allowed Toggle */}
|
||||
<button
|
||||
onClick={() => togglePermission(source, op.id, 'is_allowed')}
|
||||
disabled={isTraining || isUpdating || !source.is_active}
|
||||
onClick={() => togglePermission(source, op.id)}
|
||||
disabled={isTraining || isUpdating || !source.active}
|
||||
className={`w-10 h-10 flex items-center justify-center rounded transition-colors ${
|
||||
isTraining
|
||||
? 'bg-slate-800 text-white cursor-not-allowed'
|
||||
@@ -219,20 +238,14 @@ export function OperationsMatrixTab({ apiBase }: OperationsMatrixTabProps) {
|
||||
)}
|
||||
</button>
|
||||
|
||||
{/* Citation Required Toggle (only for allowed non-training ops) */}
|
||||
{isAllowed && !isTraining && (
|
||||
<button
|
||||
onClick={() => togglePermission(source, op.id, 'requires_citation')}
|
||||
disabled={isUpdating || !source.is_active}
|
||||
className={`px-2 py-1 text-xs rounded transition-colors ${
|
||||
requiresCitation
|
||||
? 'bg-amber-100 text-amber-700 hover:bg-amber-200'
|
||||
: 'bg-slate-100 text-slate-500 hover:bg-slate-200'
|
||||
} ${isUpdating ? 'opacity-50' : ''}`}
|
||||
title={requiresCitation ? 'Zitation erforderlich - Klicken zum Aendern' : 'Klicken um Zitation zu erfordern'}
|
||||
{/* Conditions indicator (read-only) */}
|
||||
{isAllowed && !isTraining && hasConditions && (
|
||||
<span
|
||||
className="px-2 py-1 text-xs rounded bg-amber-100 text-amber-700"
|
||||
title={permission?.conditions || ''}
|
||||
>
|
||||
{requiresCitation ? 'Cite ✓' : 'Cite'}
|
||||
</button>
|
||||
Bedingung
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
|
||||
@@ -5,19 +5,19 @@ import { useState, useEffect } from 'react'
|
||||
interface PIIRule {
|
||||
id: string
|
||||
name: string
|
||||
rule_type: string
|
||||
pattern: string
|
||||
severity: string
|
||||
is_active: boolean
|
||||
description?: string
|
||||
pattern?: string
|
||||
category: string
|
||||
action: string
|
||||
active: boolean
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
interface PIIMatch {
|
||||
rule_id: string
|
||||
rule_name: string
|
||||
rule_type: string
|
||||
severity: string
|
||||
category: string
|
||||
action: string
|
||||
match: string
|
||||
start_index: number
|
||||
end_index: number
|
||||
@@ -27,7 +27,6 @@ interface PIITestResult {
|
||||
has_pii: boolean
|
||||
matches: PIIMatch[]
|
||||
should_block: boolean
|
||||
block_level: string
|
||||
}
|
||||
|
||||
interface PIIRulesTabProps {
|
||||
@@ -35,14 +34,20 @@ interface PIIRulesTabProps {
|
||||
onUpdate?: () => void
|
||||
}
|
||||
|
||||
const RULE_TYPES = [
|
||||
{ value: 'regex', label: 'Regex (Muster)' },
|
||||
{ value: 'keyword', label: 'Keyword (Stichwort)' },
|
||||
const CATEGORIES = [
|
||||
{ value: 'email', label: 'E-Mail-Adressen' },
|
||||
{ value: 'phone', label: 'Telefonnummern' },
|
||||
{ value: 'iban', label: 'IBAN/Bankdaten' },
|
||||
{ value: 'name', label: 'Personennamen' },
|
||||
{ value: 'address', label: 'Adressen' },
|
||||
{ value: 'id_number', label: 'Ausweisnummern' },
|
||||
{ value: 'health', label: 'Gesundheitsdaten' },
|
||||
{ value: 'other', label: 'Sonstige' },
|
||||
]
|
||||
|
||||
const SEVERITIES = [
|
||||
const ACTIONS = [
|
||||
{ value: 'warn', label: 'Warnung', color: 'bg-amber-100 text-amber-700' },
|
||||
{ value: 'redact', label: 'Schwärzen', color: 'bg-orange-100 text-orange-700' },
|
||||
{ value: 'mask', label: 'Maskieren', color: 'bg-orange-100 text-orange-700' },
|
||||
{ value: 'block', label: 'Blockieren', color: 'bg-red-100 text-red-700' },
|
||||
]
|
||||
|
||||
@@ -64,10 +69,10 @@ export function PIIRulesTab({ apiBase, onUpdate }: PIIRulesTabProps) {
|
||||
// New rule form
|
||||
const [newRule, setNewRule] = useState({
|
||||
name: '',
|
||||
rule_type: 'regex',
|
||||
pattern: '',
|
||||
severity: 'block',
|
||||
is_active: true,
|
||||
category: 'email',
|
||||
action: 'block',
|
||||
active: true,
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
@@ -102,10 +107,10 @@ export function PIIRulesTab({ apiBase, onUpdate }: PIIRulesTabProps) {
|
||||
|
||||
setNewRule({
|
||||
name: '',
|
||||
rule_type: 'regex',
|
||||
pattern: '',
|
||||
severity: 'block',
|
||||
is_active: true,
|
||||
category: 'email',
|
||||
action: 'block',
|
||||
active: true,
|
||||
})
|
||||
setIsNewRule(false)
|
||||
fetchRules()
|
||||
@@ -162,7 +167,7 @@ export function PIIRulesTab({ apiBase, onUpdate }: PIIRulesTabProps) {
|
||||
const res = await fetch(`${apiBase}/v1/admin/pii-rules/${rule.id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ is_active: !rule.is_active }),
|
||||
body: JSON.stringify({ active: !rule.active }),
|
||||
})
|
||||
|
||||
if (!res.ok) throw new Error('Fehler beim Aendern des Status')
|
||||
@@ -174,33 +179,47 @@ export function PIIRulesTab({ apiBase, onUpdate }: PIIRulesTabProps) {
|
||||
}
|
||||
}
|
||||
|
||||
const runTest = async () => {
|
||||
const runTest = () => {
|
||||
if (!testText) return
|
||||
|
||||
try {
|
||||
setTesting(true)
|
||||
const res = await fetch(`${apiBase}/v1/admin/pii-rules/test`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ text: testText }),
|
||||
})
|
||||
setTesting(true)
|
||||
const matches: PIIMatch[] = []
|
||||
const activeRules = rules.filter((r) => r.active && r.pattern)
|
||||
|
||||
if (!res.ok) throw new Error('Fehler beim Testen')
|
||||
|
||||
const data = await res.json()
|
||||
setTestResult(data)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Unbekannter Fehler')
|
||||
} finally {
|
||||
setTesting(false)
|
||||
for (const rule of activeRules) {
|
||||
try {
|
||||
const regex = new RegExp(rule.pattern!, 'gi')
|
||||
let m: RegExpExecArray | null
|
||||
while ((m = regex.exec(testText)) !== null) {
|
||||
matches.push({
|
||||
rule_id: rule.id,
|
||||
rule_name: rule.name,
|
||||
category: rule.category,
|
||||
action: rule.action,
|
||||
match: m[0],
|
||||
start_index: m.index,
|
||||
end_index: m.index + m[0].length,
|
||||
})
|
||||
}
|
||||
} catch {
|
||||
// Invalid regex — skip
|
||||
}
|
||||
}
|
||||
|
||||
const shouldBlock = matches.some((m) => m.action === 'block')
|
||||
setTestResult({
|
||||
has_pii: matches.length > 0,
|
||||
matches,
|
||||
should_block: shouldBlock,
|
||||
})
|
||||
setTesting(false)
|
||||
}
|
||||
|
||||
const getSeverityBadge = (severity: string) => {
|
||||
const config = SEVERITIES.find((s) => s.value === severity)
|
||||
const getActionBadge = (action: string) => {
|
||||
const config = ACTIONS.find((a) => a.value === action)
|
||||
return (
|
||||
<span className={`px-2 py-1 rounded text-xs font-medium ${config?.color || 'bg-slate-100 text-slate-700'}`}>
|
||||
{config?.label || severity}
|
||||
{config?.label || action}
|
||||
</span>
|
||||
)
|
||||
}
|
||||
@@ -288,7 +307,7 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
<div className="space-y-2">
|
||||
{testResult.matches.map((match, idx) => (
|
||||
<div key={idx} className="flex items-center gap-3 text-sm bg-white bg-opacity-50 rounded px-3 py-2">
|
||||
{getSeverityBadge(match.severity)}
|
||||
{getActionBadge(match.action)}
|
||||
<span className="text-slate-700 font-medium">{match.rule_name}</span>
|
||||
<code className="text-xs bg-slate-100 px-2 py-1 rounded">
|
||||
{match.match.length > 30 ? match.match.substring(0, 30) + '...' : match.match}
|
||||
@@ -334,9 +353,9 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
<thead className="bg-slate-50 border-b border-slate-200">
|
||||
<tr>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Name</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Typ</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Kategorie</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Muster</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Severity</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Aktion</th>
|
||||
<th className="text-left px-4 py-3 text-xs font-medium text-slate-500 uppercase">Status</th>
|
||||
<th className="text-right px-4 py-3 text-xs font-medium text-slate-500 uppercase">Aktionen</th>
|
||||
</tr>
|
||||
@@ -347,25 +366,25 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
<td className="px-4 py-3 text-sm font-medium text-slate-800">{rule.name}</td>
|
||||
<td className="px-4 py-3">
|
||||
<span className="text-xs bg-slate-100 text-slate-700 px-2 py-1 rounded">
|
||||
{rule.rule_type}
|
||||
{CATEGORIES.find((c) => c.value === rule.category)?.label || rule.category}
|
||||
</span>
|
||||
</td>
|
||||
<td className="px-4 py-3">
|
||||
<code className="text-xs bg-slate-100 px-2 py-1 rounded max-w-xs truncate block">
|
||||
{rule.pattern.length > 40 ? rule.pattern.substring(0, 40) + '...' : rule.pattern}
|
||||
{rule.pattern && rule.pattern.length > 40 ? rule.pattern.substring(0, 40) + '...' : rule.pattern || '-'}
|
||||
</code>
|
||||
</td>
|
||||
<td className="px-4 py-3">{getSeverityBadge(rule.severity)}</td>
|
||||
<td className="px-4 py-3">{getActionBadge(rule.action)}</td>
|
||||
<td className="px-4 py-3">
|
||||
<button
|
||||
onClick={() => toggleRuleStatus(rule)}
|
||||
className={`text-xs px-2 py-1 rounded ${
|
||||
rule.is_active
|
||||
rule.active
|
||||
? 'bg-green-100 text-green-700'
|
||||
: 'bg-red-100 text-red-700'
|
||||
}`}
|
||||
>
|
||||
{rule.is_active ? 'Aktiv' : 'Inaktiv'}
|
||||
{rule.active ? 'Aktiv' : 'Inaktiv'}
|
||||
</button>
|
||||
</td>
|
||||
<td className="px-4 py-3 text-right">
|
||||
@@ -408,41 +427,41 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Typ *</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Kategorie *</label>
|
||||
<select
|
||||
value={newRule.rule_type}
|
||||
onChange={(e) => setNewRule({ ...newRule, rule_type: e.target.value })}
|
||||
value={newRule.category}
|
||||
onChange={(e) => setNewRule({ ...newRule, category: e.target.value })}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
>
|
||||
{RULE_TYPES.map((t) => (
|
||||
<option key={t.value} value={t.value}>
|
||||
{t.label}
|
||||
{CATEGORIES.map((c) => (
|
||||
<option key={c.value} value={c.value}>
|
||||
{c.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Muster *</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Muster (Regex)</label>
|
||||
<textarea
|
||||
value={newRule.pattern}
|
||||
onChange={(e) => setNewRule({ ...newRule, pattern: e.target.value })}
|
||||
placeholder={newRule.rule_type === 'regex' ? 'Regex-Muster, z.B. (?:\\+49|0)[\\s.-]?\\d{2,4}...' : 'Keywords getrennt durch Komma, z.B. password,secret,api_key'}
|
||||
placeholder={'Regex-Muster, z.B. (?:\\+49|0)[\\s.-]?\\d{2,4}...'}
|
||||
rows={3}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent font-mono text-sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Severity *</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Aktion *</label>
|
||||
<select
|
||||
value={newRule.severity}
|
||||
onChange={(e) => setNewRule({ ...newRule, severity: e.target.value })}
|
||||
value={newRule.action}
|
||||
onChange={(e) => setNewRule({ ...newRule, action: e.target.value })}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
>
|
||||
{SEVERITIES.map((s) => (
|
||||
<option key={s.value} value={s.value}>
|
||||
{s.label}
|
||||
{ACTIONS.map((a) => (
|
||||
<option key={a.value} value={a.value}>
|
||||
{a.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
@@ -486,24 +505,24 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Typ</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Kategorie</label>
|
||||
<select
|
||||
value={editingRule.rule_type}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, rule_type: e.target.value })}
|
||||
value={editingRule.category}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, category: e.target.value })}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
>
|
||||
{RULE_TYPES.map((t) => (
|
||||
<option key={t.value} value={t.value}>
|
||||
{t.label}
|
||||
{CATEGORIES.map((c) => (
|
||||
<option key={c.value} value={c.value}>
|
||||
{c.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Muster *</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Muster (Regex)</label>
|
||||
<textarea
|
||||
value={editingRule.pattern}
|
||||
value={editingRule.pattern || ''}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, pattern: e.target.value })}
|
||||
rows={3}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent font-mono text-sm"
|
||||
@@ -511,15 +530,15 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Severity</label>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Aktion</label>
|
||||
<select
|
||||
value={editingRule.severity}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, severity: e.target.value })}
|
||||
value={editingRule.action}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, action: e.target.value })}
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
>
|
||||
{SEVERITIES.map((s) => (
|
||||
<option key={s.value} value={s.value}>
|
||||
{s.label}
|
||||
{ACTIONS.map((a) => (
|
||||
<option key={a.value} value={a.value}>
|
||||
{a.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
@@ -528,12 +547,12 @@ Meine IBAN ist DE89 3704 0044 0532 0130 00."
|
||||
<div className="flex items-center gap-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="edit_is_active"
|
||||
checked={editingRule.is_active}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, is_active: e.target.checked })}
|
||||
id="edit_active"
|
||||
checked={editingRule.active}
|
||||
onChange={(e) => setEditingRule({ ...editingRule, active: e.target.checked })}
|
||||
className="w-4 h-4 text-purple-600"
|
||||
/>
|
||||
<label htmlFor="edit_is_active" className="text-sm text-slate-700">
|
||||
<label htmlFor="edit_active" className="text-sm text-slate-700">
|
||||
Aktiv
|
||||
</label>
|
||||
</div>
|
||||
|
||||
@@ -4,16 +4,17 @@ import { useState, useEffect } from 'react'
|
||||
|
||||
interface AllowedSource {
|
||||
id: string
|
||||
policy_id: string
|
||||
domain: string
|
||||
name: string
|
||||
license: string
|
||||
description?: string
|
||||
license?: string
|
||||
legal_basis?: string
|
||||
citation_template?: string
|
||||
trust_boost: number
|
||||
is_active: boolean
|
||||
source_type: string
|
||||
active: boolean
|
||||
metadata?: Record<string, unknown>
|
||||
created_at: string
|
||||
updated_at: string
|
||||
updated_at?: string
|
||||
}
|
||||
|
||||
interface SourcesTabProps {
|
||||
@@ -62,10 +63,8 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
name: '',
|
||||
license: 'DL-DE-BY-2.0',
|
||||
legal_basis: '',
|
||||
citation_template: '',
|
||||
trust_boost: 0.5,
|
||||
is_active: true,
|
||||
policy_id: '', // Will be set from policies
|
||||
active: true,
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
@@ -107,10 +106,8 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
name: '',
|
||||
license: 'DL-DE-BY-2.0',
|
||||
legal_basis: '',
|
||||
citation_template: '',
|
||||
trust_boost: 0.5,
|
||||
is_active: true,
|
||||
policy_id: '',
|
||||
active: true,
|
||||
})
|
||||
setIsNewSource(false)
|
||||
fetchSources()
|
||||
@@ -167,7 +164,7 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
const res = await fetch(`${apiBase}/v1/admin/sources/${source.id}`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ is_active: !source.is_active }),
|
||||
body: JSON.stringify({ active: !source.active }),
|
||||
})
|
||||
|
||||
if (!res.ok) throw new Error('Fehler beim Aendern des Status')
|
||||
@@ -289,12 +286,12 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
<button
|
||||
onClick={() => toggleSourceStatus(source)}
|
||||
className={`text-xs px-2 py-1 rounded ${
|
||||
source.is_active
|
||||
source.active
|
||||
? 'bg-green-100 text-green-700'
|
||||
: 'bg-red-100 text-red-700'
|
||||
}`}
|
||||
>
|
||||
{source.is_active ? 'Aktiv' : 'Inaktiv'}
|
||||
{source.active ? 'Aktiv' : 'Inaktiv'}
|
||||
</button>
|
||||
</td>
|
||||
<td className="px-4 py-3 text-right">
|
||||
@@ -461,17 +458,6 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Zitiervorlage</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editingSource.citation_template || ''}
|
||||
onChange={(e) => setEditingSource({ ...editingSource, citation_template: e.target.value })}
|
||||
placeholder="Quelle: {source}, {title}, {date}"
|
||||
className="w-full px-4 py-2 border border-slate-200 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-slate-700 mb-1">Trust Boost</label>
|
||||
<input
|
||||
@@ -491,12 +477,12 @@ export function SourcesTab({ apiBase, onUpdate }: SourcesTabProps) {
|
||||
<div className="flex items-center gap-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="is_active"
|
||||
checked={editingSource.is_active}
|
||||
onChange={(e) => setEditingSource({ ...editingSource, is_active: e.target.checked })}
|
||||
id="active"
|
||||
checked={editingSource.active}
|
||||
onChange={(e) => setEditingSource({ ...editingSource, active: e.target.checked })}
|
||||
className="w-4 h-4 text-purple-600"
|
||||
/>
|
||||
<label htmlFor="is_active" className="text-sm text-slate-700">
|
||||
<label htmlFor="active" className="text-sm text-slate-700">
|
||||
Aktiv
|
||||
</label>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user