refactor(admin): split dsfa/[id] and notfallplan page.tsx into colocated components
dsfa/[id]/page.tsx (1893 LOC -> 350 LOC) split into 9 components: Section1-5Editor, SDMCoverageOverview, RAGSearchPanel, AddRiskModal, AddMitigationModal. Page is now a thin orchestrator. notfallplan/page.tsx (1890 LOC -> 435 LOC) split into 8 modules: types.ts, ConfigTab, IncidentsTab, TemplatesTab, ExercisesTab, Modals, ApiSections. All under the 500-line hard cap. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Sharang Parnerkar
@@ -0,0 +1,205 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { DSFARisk } from '@/lib/sdk/dsfa/types'
|
||||
import type { SDMGoal } from '@/lib/sdk/dsfa/types'
|
||||
import {
|
||||
MITIGATION_LIBRARY,
|
||||
MITIGATION_TYPE_LABELS,
|
||||
SDM_GOAL_LABELS,
|
||||
EFFECTIVENESS_LABELS,
|
||||
} from '@/lib/sdk/dsfa/mitigation-library'
|
||||
import type { CatalogMitigation } from '@/lib/sdk/dsfa/mitigation-library'
|
||||
|
||||
export function AddMitigationModal({
|
||||
risks,
|
||||
onClose,
|
||||
onAdd,
|
||||
}: {
|
||||
risks: DSFARisk[]
|
||||
onClose: () => void
|
||||
onAdd: (data: { risk_id: string; description: string; type: string; responsible_party: string }) => void
|
||||
}) {
|
||||
const [mode, setMode] = useState<'library' | 'manual'>('library')
|
||||
const [riskId, setRiskId] = useState(risks[0]?.id || '')
|
||||
const [type, setType] = useState('technical')
|
||||
const [description, setDescription] = useState('')
|
||||
const [responsibleParty, setResponsibleParty] = useState('')
|
||||
const [typeFilter, setTypeFilter] = useState<'all' | 'technical' | 'organizational' | 'legal'>('all')
|
||||
const [sdmFilter, setSdmFilter] = useState<SDMGoal | 'all'>('all')
|
||||
|
||||
const filteredLibrary = MITIGATION_LIBRARY.filter(m => {
|
||||
if (typeFilter !== 'all' && m.type !== typeFilter) return false
|
||||
if (sdmFilter !== 'all' && !m.sdmGoals.includes(sdmFilter)) return false
|
||||
return true
|
||||
})
|
||||
|
||||
function selectCatalogMitigation(m: CatalogMitigation) {
|
||||
setType(m.type)
|
||||
setDescription(`${m.title}\n\n${m.description}\n\nRechtsgrundlage: ${m.legalBasis}`)
|
||||
setMode('manual')
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-xl p-6 max-w-2xl w-full mx-4 max-h-[85vh] overflow-y-auto">
|
||||
<h3 className="text-lg font-semibold text-gray-900 mb-4">Massnahme hinzufuegen</h3>
|
||||
|
||||
{/* Tab Toggle */}
|
||||
<div className="flex border-b mb-4">
|
||||
<button
|
||||
onClick={() => setMode('library')}
|
||||
className={`px-4 py-2 text-sm font-medium border-b-2 -mb-px ${
|
||||
mode === 'library' ? 'border-purple-500 text-purple-600' : 'border-transparent text-gray-500 hover:text-gray-700'
|
||||
}`}
|
||||
>
|
||||
Aus Bibliothek waehlen ({MITIGATION_LIBRARY.length})
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setMode('manual')}
|
||||
className={`px-4 py-2 text-sm font-medium border-b-2 -mb-px ${
|
||||
mode === 'manual' ? 'border-purple-500 text-purple-600' : 'border-transparent text-gray-500 hover:text-gray-700'
|
||||
}`}
|
||||
>
|
||||
Manuell eingeben
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{mode === 'library' ? (
|
||||
<div className="space-y-3">
|
||||
{/* Filters */}
|
||||
<div className="flex gap-2">
|
||||
<select
|
||||
value={typeFilter}
|
||||
onChange={e => setTypeFilter(e.target.value as typeof typeFilter)}
|
||||
className="text-sm border rounded px-2 py-1"
|
||||
>
|
||||
<option value="all">Alle Typen</option>
|
||||
{Object.entries(MITIGATION_TYPE_LABELS).map(([key, label]) => (
|
||||
<option key={key} value={key}>{label}</option>
|
||||
))}
|
||||
</select>
|
||||
<select
|
||||
value={sdmFilter}
|
||||
onChange={e => setSdmFilter(e.target.value as SDMGoal | 'all')}
|
||||
className="text-sm border rounded px-2 py-1"
|
||||
>
|
||||
<option value="all">Alle SDM-Ziele</option>
|
||||
{Object.entries(SDM_GOAL_LABELS).map(([key, label]) => (
|
||||
<option key={key} value={key}>{label}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Library List */}
|
||||
<div className="max-h-[40vh] overflow-y-auto space-y-2">
|
||||
{filteredLibrary.map(m => (
|
||||
<button
|
||||
key={m.id}
|
||||
onClick={() => selectCatalogMitigation(m)}
|
||||
className="w-full text-left p-3 rounded-lg border hover:border-purple-300 hover:bg-purple-50 transition-colors"
|
||||
>
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<span className="text-xs font-mono text-gray-400">{m.id}</span>
|
||||
<span className={`text-xs px-2 py-0.5 rounded-full ${
|
||||
m.type === 'technical' ? 'bg-blue-50 text-blue-600' :
|
||||
m.type === 'organizational' ? 'bg-green-50 text-green-600' :
|
||||
'bg-purple-50 text-purple-600'
|
||||
}`}>
|
||||
{MITIGATION_TYPE_LABELS[m.type]}
|
||||
</span>
|
||||
{m.sdmGoals.map(g => (
|
||||
<span key={g} className="text-xs px-2 py-0.5 rounded-full bg-gray-100 text-gray-600">
|
||||
{SDM_GOAL_LABELS[g]}
|
||||
</span>
|
||||
))}
|
||||
<span className={`text-xs px-2 py-0.5 rounded-full ${
|
||||
m.effectiveness === 'high' ? 'bg-green-50 text-green-700' :
|
||||
m.effectiveness === 'medium' ? 'bg-yellow-50 text-yellow-700' :
|
||||
'bg-gray-50 text-gray-500'
|
||||
}`}>
|
||||
{EFFECTIVENESS_LABELS[m.effectiveness]}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-sm font-medium text-gray-900">{m.title}</div>
|
||||
<div className="text-xs text-gray-500 mt-1 line-clamp-2">{m.description}</div>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{filteredLibrary.length === 0 && (
|
||||
<p className="text-sm text-gray-500 text-center py-4">Keine Massnahmen fuer die gewaehlten Filter.</p>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Zugehoeriges Risiko</label>
|
||||
<select
|
||||
value={riskId}
|
||||
onChange={(e) => setRiskId(e.target.value)}
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
>
|
||||
{risks.map(risk => (
|
||||
<option key={risk.id} value={risk.id}>
|
||||
{risk.description.substring(0, 50)}...
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Typ</label>
|
||||
<select
|
||||
value={type}
|
||||
onChange={(e) => setType(e.target.value)}
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
>
|
||||
<option value="technical">Technisch</option>
|
||||
<option value="organizational">Organisatorisch</option>
|
||||
<option value="legal">Rechtlich</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Beschreibung</label>
|
||||
<textarea
|
||||
value={description}
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
rows={3}
|
||||
placeholder="Beschreiben Sie die Massnahme..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Verantwortlich</label>
|
||||
<input
|
||||
type="text"
|
||||
value={responsibleParty}
|
||||
onChange={(e) => setResponsibleParty(e.target.value)}
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
placeholder="Name oder Rolle..."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex gap-3 mt-6">
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50"
|
||||
>
|
||||
Abbrechen
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onAdd({ risk_id: riskId, description, type, responsible_party: responsibleParty })}
|
||||
disabled={!description.trim() || mode === 'library'}
|
||||
className="flex-1 py-2 px-4 bg-purple-600 text-white rounded-lg font-medium hover:bg-purple-700 disabled:opacity-50"
|
||||
>
|
||||
Hinzufuegen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
182
admin-compliance/app/sdk/dsfa/[id]/_components/AddRiskModal.tsx
Normal file
182
admin-compliance/app/sdk/dsfa/[id]/_components/AddRiskModal.tsx
Normal file
@@ -0,0 +1,182 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import {
|
||||
DSFA_RISK_LEVEL_LABELS,
|
||||
calculateRiskLevel,
|
||||
} from '@/lib/sdk/dsfa/types'
|
||||
import type { DSFARiskCategory } from '@/lib/sdk/dsfa/types'
|
||||
import type { SDMGoal } from '@/lib/sdk/dsfa/types'
|
||||
import {
|
||||
RISK_CATALOG,
|
||||
RISK_CATEGORY_LABELS,
|
||||
} from '@/lib/sdk/dsfa/risk-catalog'
|
||||
import type { CatalogRisk } from '@/lib/sdk/dsfa/risk-catalog'
|
||||
import { SDM_GOAL_LABELS } from '@/lib/sdk/dsfa/mitigation-library'
|
||||
|
||||
export function AddRiskModal({
|
||||
likelihood,
|
||||
impact,
|
||||
onClose,
|
||||
onAdd,
|
||||
}: {
|
||||
likelihood: 'low' | 'medium' | 'high'
|
||||
impact: 'low' | 'medium' | 'high'
|
||||
onClose: () => void
|
||||
onAdd: (data: { category: string; description: string }) => void
|
||||
}) {
|
||||
const [mode, setMode] = useState<'catalog' | 'manual'>('catalog')
|
||||
const [category, setCategory] = useState('confidentiality')
|
||||
const [description, setDescription] = useState('')
|
||||
const [catalogFilter, setCatalogFilter] = useState<DSFARiskCategory | 'all'>('all')
|
||||
const [sdmFilter, setSdmFilter] = useState<SDMGoal | 'all'>('all')
|
||||
|
||||
const { level } = calculateRiskLevel(likelihood, impact)
|
||||
|
||||
const filteredCatalog = RISK_CATALOG.filter(r => {
|
||||
if (catalogFilter !== 'all' && r.category !== catalogFilter) return false
|
||||
if (sdmFilter !== 'all' && r.sdmGoal !== sdmFilter) return false
|
||||
return true
|
||||
})
|
||||
|
||||
function selectCatalogRisk(risk: CatalogRisk) {
|
||||
setCategory(risk.category)
|
||||
setDescription(`${risk.title}\n\n${risk.description}`)
|
||||
setMode('manual')
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-xl p-6 max-w-2xl w-full mx-4 max-h-[85vh] overflow-y-auto">
|
||||
<h3 className="text-lg font-semibold text-gray-900 mb-4">Risiko hinzufuegen</h3>
|
||||
|
||||
<div className="mb-4 p-3 rounded-lg bg-gray-50">
|
||||
<div className="text-sm text-gray-500">
|
||||
Eintrittswahrscheinlichkeit: <span className="font-medium text-gray-700">{likelihood === 'low' ? 'Niedrig' : likelihood === 'medium' ? 'Mittel' : 'Hoch'}</span>
|
||||
{' | '}
|
||||
Auswirkung: <span className="font-medium text-gray-700">{impact === 'low' ? 'Niedrig' : impact === 'medium' ? 'Mittel' : 'Hoch'}</span>
|
||||
{' | '}
|
||||
Risikostufe: <span className="font-medium">{DSFA_RISK_LEVEL_LABELS[level]}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tab Toggle */}
|
||||
<div className="flex border-b mb-4">
|
||||
<button
|
||||
onClick={() => setMode('catalog')}
|
||||
className={`px-4 py-2 text-sm font-medium border-b-2 -mb-px ${
|
||||
mode === 'catalog' ? 'border-purple-500 text-purple-600' : 'border-transparent text-gray-500 hover:text-gray-700'
|
||||
}`}
|
||||
>
|
||||
Aus Katalog waehlen ({RISK_CATALOG.length})
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setMode('manual')}
|
||||
className={`px-4 py-2 text-sm font-medium border-b-2 -mb-px ${
|
||||
mode === 'manual' ? 'border-purple-500 text-purple-600' : 'border-transparent text-gray-500 hover:text-gray-700'
|
||||
}`}
|
||||
>
|
||||
Manuell eingeben
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{mode === 'catalog' ? (
|
||||
<div className="space-y-3">
|
||||
{/* Filters */}
|
||||
<div className="flex gap-2">
|
||||
<select
|
||||
value={catalogFilter}
|
||||
onChange={e => setCatalogFilter(e.target.value as DSFARiskCategory | 'all')}
|
||||
className="text-sm border rounded px-2 py-1"
|
||||
>
|
||||
<option value="all">Alle Kategorien</option>
|
||||
{Object.entries(RISK_CATEGORY_LABELS).map(([key, label]) => (
|
||||
<option key={key} value={key}>{label}</option>
|
||||
))}
|
||||
</select>
|
||||
<select
|
||||
value={sdmFilter}
|
||||
onChange={e => setSdmFilter(e.target.value as SDMGoal | 'all')}
|
||||
className="text-sm border rounded px-2 py-1"
|
||||
>
|
||||
<option value="all">Alle SDM-Ziele</option>
|
||||
{Object.entries(SDM_GOAL_LABELS).map(([key, label]) => (
|
||||
<option key={key} value={key}>{label}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Catalog List */}
|
||||
<div className="max-h-[40vh] overflow-y-auto space-y-2">
|
||||
{filteredCatalog.map(risk => (
|
||||
<button
|
||||
key={risk.id}
|
||||
onClick={() => selectCatalogRisk(risk)}
|
||||
className="w-full text-left p-3 rounded-lg border hover:border-purple-300 hover:bg-purple-50 transition-colors"
|
||||
>
|
||||
<div className="flex items-center gap-2 mb-1">
|
||||
<span className="text-xs font-mono text-gray-400">{risk.id}</span>
|
||||
<span className="text-xs px-2 py-0.5 rounded-full bg-gray-100 text-gray-600">
|
||||
{RISK_CATEGORY_LABELS[risk.category]}
|
||||
</span>
|
||||
<span className="text-xs px-2 py-0.5 rounded-full bg-blue-50 text-blue-600">
|
||||
{SDM_GOAL_LABELS[risk.sdmGoal]}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-sm font-medium text-gray-900">{risk.title}</div>
|
||||
<div className="text-xs text-gray-500 mt-1 line-clamp-2">{risk.description}</div>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{filteredCatalog.length === 0 && (
|
||||
<p className="text-sm text-gray-500 text-center py-4">Keine Risiken fuer die gewaehlten Filter.</p>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Kategorie</label>
|
||||
<select
|
||||
value={category}
|
||||
onChange={(e) => setCategory(e.target.value)}
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
>
|
||||
<option value="confidentiality">Vertraulichkeit</option>
|
||||
<option value="integrity">Integritaet</option>
|
||||
<option value="availability">Verfuegbarkeit</option>
|
||||
<option value="rights_freedoms">Rechte & Freiheiten</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">Beschreibung</label>
|
||||
<textarea
|
||||
value={description}
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
rows={4}
|
||||
placeholder="Beschreiben Sie das Risiko..."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex gap-3 mt-6">
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="flex-1 py-2 px-4 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50"
|
||||
>
|
||||
Abbrechen
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onAdd({ category, description })}
|
||||
disabled={!description.trim() || mode === 'catalog'}
|
||||
className="flex-1 py-2 px-4 bg-purple-600 text-white rounded-lg font-medium hover:bg-purple-700 disabled:opacity-50"
|
||||
>
|
||||
Hinzufuegen
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,194 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
|
||||
interface RAGSearchResult {
|
||||
text: string
|
||||
regulation_code: string
|
||||
regulation_name: string
|
||||
regulation_short: string
|
||||
category: string
|
||||
article?: string
|
||||
source_url?: string
|
||||
score: number
|
||||
}
|
||||
|
||||
interface RAGSearchResponse {
|
||||
query: string
|
||||
results: RAGSearchResult[]
|
||||
count: number
|
||||
}
|
||||
|
||||
export function RAGSearchPanel({
|
||||
context,
|
||||
categories,
|
||||
onInsertText,
|
||||
}: {
|
||||
context: string
|
||||
categories?: string[]
|
||||
onInsertText?: (text: string) => void
|
||||
}) {
|
||||
const [isOpen, setIsOpen] = useState(false)
|
||||
const [query, setQuery] = useState('')
|
||||
const [isSearching, setIsSearching] = useState(false)
|
||||
const [results, setResults] = useState<RAGSearchResponse | null>(null)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [copiedId, setCopiedId] = useState<string | null>(null)
|
||||
|
||||
const buildQuery = () => {
|
||||
if (query.trim()) return query.trim()
|
||||
return context.substring(0, 200)
|
||||
}
|
||||
|
||||
const handleSearch = async () => {
|
||||
const searchQuery = buildQuery()
|
||||
if (!searchQuery || searchQuery.length < 3) return
|
||||
|
||||
setIsSearching(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/sdk/v1/rag/search', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
query: searchQuery,
|
||||
collection: 'bp_dsfa_corpus',
|
||||
top_k: 5,
|
||||
}),
|
||||
})
|
||||
if (!response.ok) throw new Error(`Suche fehlgeschlagen (${response.status})`)
|
||||
const data: RAGSearchResponse = await response.json()
|
||||
setResults(data)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Suche fehlgeschlagen')
|
||||
setResults(null)
|
||||
} finally {
|
||||
setIsSearching(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleInsert = (text: string, resultId: string) => {
|
||||
if (onInsertText) {
|
||||
onInsertText(text)
|
||||
} else {
|
||||
navigator.clipboard.writeText(text)
|
||||
}
|
||||
setCopiedId(resultId)
|
||||
setTimeout(() => setCopiedId(null), 2000)
|
||||
}
|
||||
|
||||
if (!isOpen) {
|
||||
return (
|
||||
<button
|
||||
onClick={() => setIsOpen(true)}
|
||||
className="flex items-center gap-2 px-4 py-2 text-sm bg-indigo-50 text-indigo-700 rounded-lg border border-indigo-200 hover:bg-indigo-100 transition-colors"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
|
||||
</svg>
|
||||
Empfehlung suchen (RAG)
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="bg-indigo-50 border border-indigo-200 rounded-xl p-4 space-y-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<h4 className="text-sm font-medium text-indigo-800 flex items-center gap-2">
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
|
||||
</svg>
|
||||
DSFA-Wissenssuche (RAG)
|
||||
</h4>
|
||||
<button
|
||||
onClick={() => { setIsOpen(false); setResults(null); setError(null) }}
|
||||
className="text-indigo-400 hover:text-indigo-600"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Search Input */}
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="text"
|
||||
value={query}
|
||||
onChange={e => setQuery(e.target.value)}
|
||||
onKeyDown={e => e.key === 'Enter' && handleSearch()}
|
||||
placeholder={`Suchbegriff (oder leer fuer automatische Kontextsuche)...`}
|
||||
className="flex-1 px-3 py-2 text-sm border border-indigo-300 rounded-lg bg-white focus:ring-2 focus:ring-indigo-500 focus:border-indigo-500"
|
||||
/>
|
||||
<button
|
||||
onClick={handleSearch}
|
||||
disabled={isSearching}
|
||||
className="px-4 py-2 text-sm bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{isSearching ? 'Suche...' : 'Suchen'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Error */}
|
||||
{error && (
|
||||
<div className="text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg p-3">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Results */}
|
||||
{results && results.results.length > 0 && (
|
||||
<div className="space-y-3">
|
||||
<p className="text-xs text-indigo-600">{results.count} Ergebnis(se) gefunden</p>
|
||||
|
||||
{results.results.map((r, idx) => {
|
||||
const resultId = `${r.regulation_code}-${idx}`
|
||||
return (
|
||||
<div key={resultId} className="bg-white rounded-lg border border-indigo-100 p-3">
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="text-xs font-medium text-indigo-600 mb-1">
|
||||
{r.regulation_name}{r.article ? ` — ${r.article}` : ''}
|
||||
</div>
|
||||
<p className="text-sm text-gray-700 leading-relaxed whitespace-pre-line">
|
||||
{r.text.length > 400 ? r.text.substring(0, 400) + '...' : r.text}
|
||||
</p>
|
||||
<div className="flex items-center gap-2 mt-2">
|
||||
<span className="text-xs text-gray-400 font-mono">
|
||||
{r.regulation_short || r.regulation_code} ({(r.score * 100).toFixed(0)}%)
|
||||
</span>
|
||||
{r.category && (
|
||||
<span className="text-xs px-1.5 py-0.5 rounded bg-gray-100 text-gray-500">{r.category}</span>
|
||||
)}
|
||||
{r.source_url && (
|
||||
<a href={r.source_url} target="_blank" rel="noopener noreferrer" className="text-xs text-blue-500 hover:underline">Quelle</a>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => handleInsert(r.text, resultId)}
|
||||
className={`flex-shrink-0 px-3 py-1.5 text-xs rounded-lg transition-colors ${
|
||||
copiedId === resultId
|
||||
? 'bg-green-100 text-green-700'
|
||||
: 'bg-indigo-100 text-indigo-700 hover:bg-indigo-200'
|
||||
}`}
|
||||
title="In Beschreibung uebernehmen"
|
||||
>
|
||||
{copiedId === resultId ? 'Kopiert!' : 'Uebernehmen'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{results && results.results.length === 0 && (
|
||||
<div className="text-sm text-indigo-600 text-center py-4">
|
||||
Keine Ergebnisse gefunden. Versuchen Sie einen anderen Suchbegriff.
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,83 @@
|
||||
'use client'
|
||||
|
||||
import React from 'react'
|
||||
import { DSFA, SDM_GOALS } from '@/lib/sdk/dsfa/types'
|
||||
import type { SDMGoal } from '@/lib/sdk/dsfa/types'
|
||||
import { RISK_CATALOG } from '@/lib/sdk/dsfa/risk-catalog'
|
||||
import { MITIGATION_LIBRARY } from '@/lib/sdk/dsfa/mitigation-library'
|
||||
|
||||
export function SDMCoverageOverview({ dsfa }: { dsfa: DSFA }) {
|
||||
const goals = Object.keys(SDM_GOALS) as SDMGoal[]
|
||||
|
||||
const goalCoverage = goals.map(goal => {
|
||||
const catalogRisks = RISK_CATALOG.filter(r => r.sdmGoal === goal)
|
||||
const catalogMitigations = MITIGATION_LIBRARY.filter(m => m.sdmGoals.includes(goal))
|
||||
|
||||
const matchedRisks = catalogRisks.filter(cr =>
|
||||
dsfa.risks?.some(r => r.description?.includes(cr.title))
|
||||
).length
|
||||
|
||||
const matchedMitigations = catalogMitigations.filter(cm =>
|
||||
dsfa.mitigations?.some(m => m.description?.includes(cm.title))
|
||||
).length
|
||||
|
||||
const hasRisks = matchedRisks > 0 || dsfa.risks?.some(r => {
|
||||
const cat = r.category
|
||||
if (goal === 'vertraulichkeit' && cat === 'confidentiality') return true
|
||||
if (goal === 'integritaet' && cat === 'integrity') return true
|
||||
if (goal === 'verfuegbarkeit' && cat === 'availability') return true
|
||||
if (goal === 'nichtverkettung' && cat === 'rights_freedoms') return true
|
||||
return false
|
||||
})
|
||||
|
||||
const coverage = matchedMitigations > 0 ? 'covered' :
|
||||
hasRisks ? 'gaps' : 'no_data'
|
||||
|
||||
return {
|
||||
goal,
|
||||
info: SDM_GOALS[goal],
|
||||
matchedRisks,
|
||||
matchedMitigations,
|
||||
coverage,
|
||||
}
|
||||
})
|
||||
|
||||
return (
|
||||
<div className="mt-6 bg-white rounded-xl border p-6">
|
||||
<h3 className="text-md font-semibold text-gray-900 mb-1">SDM-Abdeckung (Gewaehrleistungsziele)</h3>
|
||||
<p className="text-xs text-gray-500 mb-4">Uebersicht ueber die Abdeckung der 7 Gewaehrleistungsziele des Standard-Datenschutzmodells.</p>
|
||||
|
||||
<div className="grid grid-cols-7 gap-2">
|
||||
{goalCoverage.map(({ goal, info, matchedRisks, matchedMitigations, coverage }) => (
|
||||
<div
|
||||
key={goal}
|
||||
className={`p-3 rounded-lg text-center border ${
|
||||
coverage === 'covered' ? 'bg-green-50 border-green-200' :
|
||||
coverage === 'gaps' ? 'bg-yellow-50 border-yellow-200' :
|
||||
'bg-gray-50 border-gray-200'
|
||||
}`}
|
||||
>
|
||||
<div className={`text-lg mb-1 ${
|
||||
coverage === 'covered' ? 'text-green-600' :
|
||||
coverage === 'gaps' ? 'text-yellow-600' :
|
||||
'text-gray-400'
|
||||
}`}>
|
||||
{coverage === 'covered' ? '\u2713' : coverage === 'gaps' ? '!' : '\u2013'}
|
||||
</div>
|
||||
<div className="text-xs font-medium text-gray-900 leading-tight">{info.name}</div>
|
||||
<div className="text-[10px] text-gray-500 mt-1">
|
||||
{matchedRisks}R / {matchedMitigations}M
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4 mt-3 text-xs text-gray-500">
|
||||
<span className="flex items-center gap-1"><span className="w-2 h-2 rounded-full bg-green-500"></span> Abgedeckt</span>
|
||||
<span className="flex items-center gap-1"><span className="w-2 h-2 rounded-full bg-yellow-500"></span> Luecken</span>
|
||||
<span className="flex items-center gap-1"><span className="w-2 h-2 rounded-full bg-gray-300"></span> Keine Daten</span>
|
||||
<span className="ml-auto">R = Risiken, M = Massnahmen</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,216 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { DSFA, DSFA_LEGAL_BASES } from '@/lib/sdk/dsfa/types'
|
||||
|
||||
interface SectionProps {
|
||||
dsfa: DSFA
|
||||
onUpdate: (data: Record<string, unknown>) => Promise<void>
|
||||
isSubmitting: boolean
|
||||
}
|
||||
|
||||
export function Section1Editor({ dsfa, onUpdate, isSubmitting }: SectionProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
processing_description: dsfa.processing_description || '',
|
||||
processing_purpose: dsfa.processing_purpose || '',
|
||||
data_categories: dsfa.data_categories || [],
|
||||
data_subjects: dsfa.data_subjects || [],
|
||||
recipients: dsfa.recipients || [],
|
||||
legal_basis: dsfa.legal_basis || '',
|
||||
legal_basis_details: dsfa.legal_basis_details || '',
|
||||
})
|
||||
const [newCategory, setNewCategory] = useState('')
|
||||
const [newSubject, setNewSubject] = useState('')
|
||||
const [newRecipient, setNewRecipient] = useState('')
|
||||
|
||||
const handleSave = () => {
|
||||
onUpdate(formData)
|
||||
}
|
||||
|
||||
const addItem = (field: 'data_categories' | 'data_subjects' | 'recipients', value: string, setter: (v: string) => void) => {
|
||||
if (value.trim()) {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
[field]: [...prev[field], value.trim()]
|
||||
}))
|
||||
setter('')
|
||||
}
|
||||
}
|
||||
|
||||
const removeItem = (field: 'data_categories' | 'data_subjects' | 'recipients', index: number) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
[field]: prev[field].filter((_, i) => i !== index)
|
||||
}))
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Processing Purpose */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Verarbeitungszweck *
|
||||
</label>
|
||||
<textarea
|
||||
value={formData.processing_purpose}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, processing_purpose: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
rows={3}
|
||||
placeholder="Beschreiben Sie den Zweck der Datenverarbeitung..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Processing Description */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Beschreibung der Verarbeitung *
|
||||
</label>
|
||||
<textarea
|
||||
value={formData.processing_description}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, processing_description: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
rows={4}
|
||||
placeholder="Detaillierte Beschreibung der Verarbeitungsvorgaenge..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Data Categories */}
|
||||
<TagListField
|
||||
label="Datenkategorien *"
|
||||
items={formData.data_categories}
|
||||
newValue={newCategory}
|
||||
onNewValueChange={setNewCategory}
|
||||
onAdd={() => addItem('data_categories', newCategory, setNewCategory)}
|
||||
onRemove={(idx) => removeItem('data_categories', idx)}
|
||||
placeholder="Kategorie hinzufuegen..."
|
||||
colorClass="bg-blue-100 text-blue-700"
|
||||
hoverClass="hover:text-blue-900"
|
||||
/>
|
||||
|
||||
{/* Data Subjects */}
|
||||
<TagListField
|
||||
label="Betroffene Personen *"
|
||||
items={formData.data_subjects}
|
||||
newValue={newSubject}
|
||||
onNewValueChange={setNewSubject}
|
||||
onAdd={() => addItem('data_subjects', newSubject, setNewSubject)}
|
||||
onRemove={(idx) => removeItem('data_subjects', idx)}
|
||||
placeholder="z.B. Kunden, Mitarbeiter..."
|
||||
colorClass="bg-green-100 text-green-700"
|
||||
hoverClass="hover:text-green-900"
|
||||
/>
|
||||
|
||||
{/* Recipients */}
|
||||
<TagListField
|
||||
label="Empfaenger"
|
||||
items={formData.recipients}
|
||||
newValue={newRecipient}
|
||||
onNewValueChange={setNewRecipient}
|
||||
onAdd={() => addItem('recipients', newRecipient, setNewRecipient)}
|
||||
onRemove={(idx) => removeItem('recipients', idx)}
|
||||
placeholder="Empfaenger hinzufuegen..."
|
||||
colorClass="bg-orange-100 text-orange-700"
|
||||
hoverClass="hover:text-orange-900"
|
||||
/>
|
||||
|
||||
{/* Legal Basis */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Rechtsgrundlage *
|
||||
</label>
|
||||
<select
|
||||
value={formData.legal_basis}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, legal_basis: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
>
|
||||
<option value="">Bitte waehlen...</option>
|
||||
{Object.entries(DSFA_LEGAL_BASES).map(([key, label]) => (
|
||||
<option key={key} value={key}>{label}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{/* Legal Basis Details */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Begruendung der Rechtsgrundlage
|
||||
</label>
|
||||
<textarea
|
||||
value={formData.legal_basis_details}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, legal_basis_details: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
rows={3}
|
||||
placeholder="Erlaeutern Sie, warum diese Rechtsgrundlage anwendbar ist..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Save Button */}
|
||||
<div className="flex justify-end pt-4 border-t border-gray-200">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{isSubmitting ? 'Speichern...' : 'Abschnitt speichern'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/** Reusable tag-list input used for data_categories, data_subjects, recipients */
|
||||
function TagListField({
|
||||
label,
|
||||
items,
|
||||
newValue,
|
||||
onNewValueChange,
|
||||
onAdd,
|
||||
onRemove,
|
||||
placeholder,
|
||||
colorClass,
|
||||
hoverClass,
|
||||
}: {
|
||||
label: string
|
||||
items: string[]
|
||||
newValue: string
|
||||
onNewValueChange: (v: string) => void
|
||||
onAdd: () => void
|
||||
onRemove: (idx: number) => void
|
||||
placeholder: string
|
||||
colorClass: string
|
||||
hoverClass: string
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">{label}</label>
|
||||
<div className="flex flex-wrap gap-2 mb-2">
|
||||
{items.map((item, idx) => (
|
||||
<span key={idx} className={`px-3 py-1 ${colorClass} rounded-full text-sm flex items-center gap-2`}>
|
||||
{item}
|
||||
<button onClick={() => onRemove(idx)} className={hoverClass}>
|
||||
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="text"
|
||||
value={newValue}
|
||||
onChange={(e) => onNewValueChange(e.target.value)}
|
||||
onKeyPress={(e) => e.key === 'Enter' && onAdd()}
|
||||
className="flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500"
|
||||
placeholder={placeholder}
|
||||
/>
|
||||
<button
|
||||
onClick={onAdd}
|
||||
className="px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700"
|
||||
>
|
||||
+
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,91 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { DSFA } from '@/lib/sdk/dsfa/types'
|
||||
|
||||
interface SectionProps {
|
||||
dsfa: DSFA
|
||||
onUpdate: (data: Record<string, unknown>) => Promise<void>
|
||||
isSubmitting: boolean
|
||||
}
|
||||
|
||||
export function Section2Editor({ dsfa, onUpdate, isSubmitting }: SectionProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
necessity_assessment: dsfa.necessity_assessment || '',
|
||||
proportionality_assessment: dsfa.proportionality_assessment || '',
|
||||
data_minimization: dsfa.data_minimization || '',
|
||||
alternatives_considered: dsfa.alternatives_considered || '',
|
||||
retention_justification: dsfa.retention_justification || '',
|
||||
})
|
||||
|
||||
const handleSave = () => {
|
||||
onUpdate(formData)
|
||||
}
|
||||
|
||||
const fields = [
|
||||
{
|
||||
key: 'necessity_assessment',
|
||||
label: 'Notwendigkeit der Verarbeitung *',
|
||||
hint: 'Erklaeren Sie, warum die Verarbeitung fuer den angegebenen Zweck notwendig ist.',
|
||||
placeholder: 'Beschreiben Sie die Notwendigkeit...',
|
||||
rows: 4,
|
||||
},
|
||||
{
|
||||
key: 'proportionality_assessment',
|
||||
label: 'Verhaeltnismaessigkeit *',
|
||||
hint: 'Begruenden Sie, warum der Eingriff in die Rechte der Betroffenen verhaeltnismaessig ist.',
|
||||
placeholder: 'Beschreiben Sie die Verhaeltnismaessigkeit...',
|
||||
rows: 4,
|
||||
},
|
||||
{
|
||||
key: 'data_minimization',
|
||||
label: 'Datenminimierung',
|
||||
hint: 'Welche Massnahmen wurden ergriffen, um nur die notwendigen Daten zu erheben?',
|
||||
placeholder: 'Beschreiben Sie die Datenminimierungsmassnahmen...',
|
||||
rows: 3,
|
||||
},
|
||||
{
|
||||
key: 'alternatives_considered',
|
||||
label: 'Gepruefe Alternativen',
|
||||
hint: 'Welche weniger eingriffsintensiven Alternativen wurden geprueft?',
|
||||
placeholder: 'Beschreiben Sie gepruefe Alternativen...',
|
||||
rows: 3,
|
||||
},
|
||||
{
|
||||
key: 'retention_justification',
|
||||
label: 'Speicherdauer / Loeschfristen',
|
||||
hint: undefined,
|
||||
placeholder: 'Begruenden Sie die geplante Speicherdauer...',
|
||||
rows: 3,
|
||||
},
|
||||
] as const
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{fields.map(({ key, label, hint, placeholder, rows }) => (
|
||||
<div key={key}>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">{label}</label>
|
||||
{hint && <p className="text-xs text-gray-500 mb-2">{hint}</p>}
|
||||
<textarea
|
||||
value={formData[key]}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, [key]: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
||||
rows={rows}
|
||||
placeholder={placeholder}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
|
||||
{/* Save Button */}
|
||||
<div className="flex justify-end pt-4 border-t border-gray-200">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{isSubmitting ? 'Speichern...' : 'Abschnitt speichern'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,189 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import {
|
||||
DSFA,
|
||||
DSFARisk,
|
||||
DSFA_RISK_LEVEL_LABELS,
|
||||
DSFA_AFFECTED_RIGHTS,
|
||||
calculateRiskLevel,
|
||||
} from '@/lib/sdk/dsfa/types'
|
||||
import { RiskMatrix } from '@/components/sdk/dsfa'
|
||||
import { RAGSearchPanel } from './RAGSearchPanel'
|
||||
import { AddRiskModal } from './AddRiskModal'
|
||||
|
||||
interface SectionProps {
|
||||
dsfa: DSFA
|
||||
onUpdate: (data: Record<string, unknown>) => Promise<void>
|
||||
isSubmitting: boolean
|
||||
}
|
||||
|
||||
export function Section3Editor({ dsfa, onUpdate, isSubmitting }: SectionProps) {
|
||||
const [selectedRisk, setSelectedRisk] = useState<DSFARisk | null>(null)
|
||||
const [showAddRiskModal, setShowAddRiskModal] = useState(false)
|
||||
const [newRiskLikelihood, setNewRiskLikelihood] = useState<'low' | 'medium' | 'high'>('medium')
|
||||
const [newRiskImpact, setNewRiskImpact] = useState<'low' | 'medium' | 'high'>('medium')
|
||||
const [affectedRights, setAffectedRights] = useState<string[]>(dsfa.affected_rights || [])
|
||||
|
||||
const handleAddRisk = (likelihood: 'low' | 'medium' | 'high', impact: 'low' | 'medium' | 'high') => {
|
||||
setNewRiskLikelihood(likelihood)
|
||||
setNewRiskImpact(impact)
|
||||
setShowAddRiskModal(true)
|
||||
}
|
||||
|
||||
const toggleAffectedRight = (rightId: string) => {
|
||||
setAffectedRights(prev =>
|
||||
prev.includes(rightId)
|
||||
? prev.filter(r => r !== rightId)
|
||||
: [...prev, rightId]
|
||||
)
|
||||
}
|
||||
|
||||
const handleSaveSection = () => {
|
||||
onUpdate({
|
||||
affected_rights: affectedRights,
|
||||
overall_risk_level: dsfa.overall_risk_level,
|
||||
})
|
||||
}
|
||||
|
||||
const levelColors = {
|
||||
low: 'bg-green-100 text-green-700 border-green-200',
|
||||
medium: 'bg-yellow-100 text-yellow-700 border-yellow-200',
|
||||
high: 'bg-orange-100 text-orange-700 border-orange-200',
|
||||
very_high: 'bg-red-100 text-red-700 border-red-200',
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Risk Matrix */}
|
||||
<div className="bg-gray-50 rounded-xl p-6">
|
||||
<RiskMatrix
|
||||
risks={dsfa.risks || []}
|
||||
onRiskSelect={(risk) => setSelectedRisk(risk)}
|
||||
onAddRisk={handleAddRisk}
|
||||
selectedRiskId={selectedRisk?.id}
|
||||
readOnly={dsfa.status !== 'draft' && dsfa.status !== 'needs_update'}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Triggered Rules from UCCA */}
|
||||
{dsfa.triggered_rule_codes && dsfa.triggered_rule_codes.length > 0 && (
|
||||
<div className="bg-red-50 border border-red-200 rounded-xl p-4">
|
||||
<h4 className="text-sm font-medium text-red-800 mb-2">
|
||||
DSFA-ausloesende Regeln (aus UCCA)
|
||||
</h4>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{dsfa.triggered_rule_codes.map(code => (
|
||||
<span key={code} className="px-2 py-1 bg-red-100 text-red-700 rounded text-xs">
|
||||
{code}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Risk List */}
|
||||
<div>
|
||||
<h4 className="text-sm font-medium text-gray-700 mb-3">Identifizierte Risiken ({(dsfa.risks || []).length})</h4>
|
||||
{(dsfa.risks || []).length === 0 ? (
|
||||
<div className="text-center py-8 text-gray-500">
|
||||
<svg className="w-12 h-12 mx-auto text-gray-300 mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
|
||||
</svg>
|
||||
<p>Noch keine Risiken erfasst</p>
|
||||
<p className="text-sm mt-1">Klicken Sie in der Matrix auf eine Zelle, um ein Risiko hinzuzufuegen.</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-3">
|
||||
{(dsfa.risks || []).map(risk => {
|
||||
const { level } = calculateRiskLevel(risk.likelihood, risk.impact)
|
||||
return (
|
||||
<div
|
||||
key={risk.id}
|
||||
className={`p-4 rounded-xl border cursor-pointer transition-all ${
|
||||
selectedRisk?.id === risk.id ? 'ring-2 ring-purple-500' : ''
|
||||
} ${levelColors[level]}`}
|
||||
onClick={() => setSelectedRisk(risk)}
|
||||
>
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="font-medium">{risk.description}</div>
|
||||
<div className="text-sm mt-1 opacity-75">
|
||||
Kategorie: {risk.category === 'confidentiality' ? 'Vertraulichkeit' :
|
||||
risk.category === 'integrity' ? 'Integritaet' :
|
||||
risk.category === 'availability' ? 'Verfuegbarkeit' :
|
||||
'Rechte & Freiheiten'}
|
||||
</div>
|
||||
<div className="text-sm opacity-75">
|
||||
Eintrittswahrscheinlichkeit: {risk.likelihood === 'low' ? 'Niedrig' : risk.likelihood === 'medium' ? 'Mittel' : 'Hoch'} |
|
||||
Auswirkung: {risk.impact === 'low' ? 'Niedrig' : risk.impact === 'medium' ? 'Mittel' : 'Hoch'}
|
||||
</div>
|
||||
</div>
|
||||
<span className={`px-2 py-1 rounded text-xs font-medium ${levelColors[level]}`}>
|
||||
{DSFA_RISK_LEVEL_LABELS[level]}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* RAG Search for Risks */}
|
||||
<RAGSearchPanel
|
||||
context={`Risiken Datenschutz-Folgenabschaetzung ${dsfa.processing_description || ''} ${dsfa.processing_purpose || ''}`}
|
||||
categories={['risk_assessment', 'threshold_analysis']}
|
||||
/>
|
||||
|
||||
{/* Affected Rights */}
|
||||
<div>
|
||||
<h4 className="text-sm font-medium text-gray-700 mb-3">Betroffene Rechte & Freiheiten</h4>
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
{DSFA_AFFECTED_RIGHTS.map(right => (
|
||||
<label
|
||||
key={right.id}
|
||||
className={`flex items-center gap-2 p-3 rounded-lg border cursor-pointer transition-colors ${
|
||||
affectedRights.includes(right.id)
|
||||
? 'bg-purple-50 border-purple-300'
|
||||
: 'bg-white border-gray-200 hover:bg-gray-50'
|
||||
}`}
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={affectedRights.includes(right.id)}
|
||||
onChange={() => toggleAffectedRight(right.id)}
|
||||
className="rounded border-gray-300 text-purple-600 focus:ring-purple-500"
|
||||
/>
|
||||
<span className="text-sm">{right.label}</span>
|
||||
</label>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Save Button */}
|
||||
<div className="flex justify-end pt-4 border-t border-gray-200">
|
||||
<button
|
||||
onClick={handleSaveSection}
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{isSubmitting ? 'Speichern...' : 'Abschnitt speichern'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Add Risk Modal */}
|
||||
{showAddRiskModal && (
|
||||
<AddRiskModal
|
||||
likelihood={newRiskLikelihood}
|
||||
impact={newRiskImpact}
|
||||
onClose={() => setShowAddRiskModal(false)}
|
||||
onAdd={async (riskData) => {
|
||||
// This would call the API
|
||||
setShowAddRiskModal(false)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,159 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { DSFA, DSFAMitigation } from '@/lib/sdk/dsfa/types'
|
||||
import { RAGSearchPanel } from './RAGSearchPanel'
|
||||
import { AddMitigationModal } from './AddMitigationModal'
|
||||
|
||||
interface SectionProps {
|
||||
dsfa: DSFA
|
||||
onUpdate: (data: Record<string, unknown>) => Promise<void>
|
||||
isSubmitting: boolean
|
||||
}
|
||||
|
||||
export function Section4Editor({ dsfa, onUpdate, isSubmitting }: SectionProps) {
|
||||
const [showAddMitigation, setShowAddMitigation] = useState(false)
|
||||
|
||||
const mitigationsByType = {
|
||||
technical: (dsfa.mitigations || []).filter(m => m.type === 'technical'),
|
||||
organizational: (dsfa.mitigations || []).filter(m => m.type === 'organizational'),
|
||||
legal: (dsfa.mitigations || []).filter(m => m.type === 'legal'),
|
||||
}
|
||||
|
||||
const getStatusBadge = (status: string) => {
|
||||
const styles = {
|
||||
planned: 'bg-gray-100 text-gray-600',
|
||||
in_progress: 'bg-yellow-100 text-yellow-700',
|
||||
implemented: 'bg-blue-100 text-blue-700',
|
||||
verified: 'bg-green-100 text-green-700',
|
||||
}
|
||||
const labels = {
|
||||
planned: 'Geplant',
|
||||
in_progress: 'In Umsetzung',
|
||||
implemented: 'Umgesetzt',
|
||||
verified: 'Verifiziert',
|
||||
}
|
||||
return (
|
||||
<span className={`px-2 py-1 rounded text-xs font-medium ${styles[status as keyof typeof styles] || styles.planned}`}>
|
||||
{labels[status as keyof typeof labels] || status}
|
||||
</span>
|
||||
)
|
||||
}
|
||||
|
||||
const renderMitigationSection = (
|
||||
title: string,
|
||||
icon: React.ReactNode,
|
||||
mitigations: DSFAMitigation[],
|
||||
bgColor: string
|
||||
) => (
|
||||
<div>
|
||||
<div className="flex items-center gap-2 mb-3">
|
||||
{icon}
|
||||
<h4 className="text-sm font-medium text-gray-700">{title} ({mitigations.length})</h4>
|
||||
</div>
|
||||
{mitigations.length === 0 ? (
|
||||
<div className={`p-4 rounded-lg ${bgColor} text-center text-sm text-gray-500`}>
|
||||
Keine Massnahmen definiert
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-2">
|
||||
{mitigations.map(m => (
|
||||
<div key={m.id} className={`p-4 rounded-lg ${bgColor} border border-gray-200`}>
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="font-medium text-gray-900">{m.description}</div>
|
||||
<div className="text-sm text-gray-500 mt-1">
|
||||
Verantwortlich: {m.responsible_party || '-'}
|
||||
{m.tom_reference && ` | TOM: ${m.tom_reference}`}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{getStatusBadge(m.status)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Add Mitigation Button */}
|
||||
<div className="flex justify-end">
|
||||
<button
|
||||
onClick={() => setShowAddMitigation(true)}
|
||||
className="flex items-center gap-2 px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors"
|
||||
>
|
||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
|
||||
</svg>
|
||||
Massnahme hinzufuegen
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Technical Measures */}
|
||||
{renderMitigationSection(
|
||||
'Technische Massnahmen',
|
||||
<svg className="w-5 h-5 text-blue-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
|
||||
</svg>,
|
||||
mitigationsByType.technical,
|
||||
'bg-blue-50'
|
||||
)}
|
||||
|
||||
{/* Organizational Measures */}
|
||||
{renderMitigationSection(
|
||||
'Organisatorische Massnahmen',
|
||||
<svg className="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
|
||||
</svg>,
|
||||
mitigationsByType.organizational,
|
||||
'bg-green-50'
|
||||
)}
|
||||
|
||||
{/* Legal Measures */}
|
||||
{renderMitigationSection(
|
||||
'Rechtliche Massnahmen',
|
||||
<svg className="w-5 h-5 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3" />
|
||||
</svg>,
|
||||
mitigationsByType.legal,
|
||||
'bg-purple-50'
|
||||
)}
|
||||
|
||||
{/* RAG Search for Mitigations */}
|
||||
<RAGSearchPanel
|
||||
context={`Massnahmen Datenschutz-Folgenabschaetzung ${dsfa.processing_description || ''} ${dsfa.processing_purpose || ''}`}
|
||||
categories={['mitigation', 'risk_assessment']}
|
||||
/>
|
||||
|
||||
{/* TOM References */}
|
||||
{dsfa.tom_references && dsfa.tom_references.length > 0 && (
|
||||
<div className="bg-gray-50 rounded-xl p-4">
|
||||
<h4 className="text-sm font-medium text-gray-700 mb-2">Verknuepfte TOM-Eintraege</h4>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{dsfa.tom_references.map((ref, idx) => (
|
||||
<span key={idx} className="px-3 py-1 bg-white border border-gray-200 rounded-full text-sm text-gray-600">
|
||||
{ref}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Add Mitigation Modal */}
|
||||
{showAddMitigation && (
|
||||
<AddMitigationModal
|
||||
risks={dsfa.risks || []}
|
||||
onClose={() => setShowAddMitigation(false)}
|
||||
onAdd={async (mitigationData) => {
|
||||
// This would call the API
|
||||
setShowAddMitigation(false)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,161 @@
|
||||
'use client'
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { DSFA } from '@/lib/sdk/dsfa/types'
|
||||
|
||||
interface SectionProps {
|
||||
dsfa: DSFA
|
||||
onUpdate: (data: Record<string, unknown>) => Promise<void>
|
||||
isSubmitting: boolean
|
||||
}
|
||||
|
||||
export function Section5Editor({ dsfa, onUpdate, isSubmitting }: SectionProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
dpo_consulted: dsfa.dpo_consulted || false,
|
||||
dpo_name: dsfa.dpo_name || '',
|
||||
dpo_opinion: dsfa.dpo_opinion || '',
|
||||
authority_consulted: dsfa.authority_consulted || false,
|
||||
authority_reference: dsfa.authority_reference || '',
|
||||
authority_decision: dsfa.authority_decision || '',
|
||||
})
|
||||
|
||||
const handleSave = () => {
|
||||
onUpdate(formData)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* DPO Consultation */}
|
||||
<div className="bg-blue-50 border border-blue-200 rounded-xl p-6">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center flex-shrink-0">
|
||||
<svg className="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<label className="flex items-center gap-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={formData.dpo_consulted}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, dpo_consulted: e.target.checked }))}
|
||||
className="w-5 h-5 rounded border-gray-300 text-blue-600 focus:ring-blue-500"
|
||||
/>
|
||||
<span className="font-medium text-blue-800">
|
||||
Datenschutzbeauftragter wurde konsultiert
|
||||
</span>
|
||||
</label>
|
||||
<p className="text-sm text-blue-600 mt-2">
|
||||
Gemaess Art. 35 Abs. 2 DSGVO muss bei einer DSFA der Rat des DSB eingeholt werden.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{formData.dpo_consulted && (
|
||||
<div className="mt-4 space-y-4 pt-4 border-t border-blue-200">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-blue-800 mb-2">Name des DSB</label>
|
||||
<input
|
||||
type="text"
|
||||
value={formData.dpo_name}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, dpo_name: e.target.value }))}
|
||||
className="w-full px-4 py-2 border border-blue-300 rounded-lg focus:ring-2 focus:ring-blue-500 bg-white"
|
||||
placeholder="Name des Datenschutzbeauftragten"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-blue-800 mb-2">Stellungnahme des DSB</label>
|
||||
<textarea
|
||||
value={formData.dpo_opinion}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, dpo_opinion: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-blue-300 rounded-lg focus:ring-2 focus:ring-blue-500 bg-white"
|
||||
rows={4}
|
||||
placeholder="Stellungnahme und Empfehlungen des DSB..."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Authority Consultation */}
|
||||
<div className="bg-orange-50 border border-orange-200 rounded-xl p-6">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="w-12 h-12 bg-orange-100 rounded-full flex items-center justify-center flex-shrink-0">
|
||||
<svg className="w-6 h-6 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4" />
|
||||
</svg>
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<label className="flex items-center gap-3">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={formData.authority_consulted}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, authority_consulted: e.target.checked }))}
|
||||
className="w-5 h-5 rounded border-gray-300 text-orange-600 focus:ring-orange-500"
|
||||
/>
|
||||
<span className="font-medium text-orange-800">
|
||||
Aufsichtsbehoerde wurde konsultiert (Art. 36)
|
||||
</span>
|
||||
</label>
|
||||
<p className="text-sm text-orange-600 mt-2">
|
||||
Falls nach Durchfuehrung der Massnahmen weiterhin ein hohes Risiko besteht, ist die Aufsichtsbehoerde zu konsultieren.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{formData.authority_consulted && (
|
||||
<div className="mt-4 space-y-4 pt-4 border-t border-orange-200">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-orange-800 mb-2">Aktenzeichen / Referenz</label>
|
||||
<input
|
||||
type="text"
|
||||
value={formData.authority_reference}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, authority_reference: e.target.value }))}
|
||||
className="w-full px-4 py-2 border border-orange-300 rounded-lg focus:ring-2 focus:ring-orange-500 bg-white"
|
||||
placeholder="Aktenzeichen der Behoerde"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-orange-800 mb-2">Entscheidung der Behoerde</label>
|
||||
<textarea
|
||||
value={formData.authority_decision}
|
||||
onChange={(e) => setFormData(prev => ({ ...prev, authority_decision: e.target.value }))}
|
||||
className="w-full px-4 py-3 border border-orange-300 rounded-lg focus:ring-2 focus:ring-orange-500 bg-white"
|
||||
rows={4}
|
||||
placeholder="Entscheidung und Auflagen der Aufsichtsbehoerde..."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Info Box */}
|
||||
<div className="bg-gray-50 border border-gray-200 rounded-xl p-4">
|
||||
<div className="flex items-start gap-3">
|
||||
<svg className="w-5 h-5 text-gray-400 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<div className="text-sm text-gray-600">
|
||||
<p className="font-medium text-gray-700 mb-1">Hinweis zur Konsultation</p>
|
||||
<p>
|
||||
Die Konsultation der Aufsichtsbehoerde ist nur erforderlich, wenn nach Umsetzung der
|
||||
geplanten Massnahmen weiterhin ein hohes Risiko fuer die Rechte und Freiheiten der
|
||||
betroffenen Personen besteht.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Save Button */}
|
||||
<div className="flex justify-end pt-4 border-t border-gray-200">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
disabled={isSubmitting}
|
||||
className="px-6 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 disabled:opacity-50 transition-colors"
|
||||
>
|
||||
{isSubmitting ? 'Speichern...' : 'Abschnitt speichern'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
9
admin-compliance/app/sdk/dsfa/[id]/_components/index.ts
Normal file
9
admin-compliance/app/sdk/dsfa/[id]/_components/index.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
export { Section1Editor } from './Section1Editor'
|
||||
export { Section2Editor } from './Section2Editor'
|
||||
export { Section3Editor } from './Section3Editor'
|
||||
export { Section4Editor } from './Section4Editor'
|
||||
export { Section5Editor } from './Section5Editor'
|
||||
export { SDMCoverageOverview } from './SDMCoverageOverview'
|
||||
export { RAGSearchPanel } from './RAGSearchPanel'
|
||||
export { AddRiskModal } from './AddRiskModal'
|
||||
export { AddMitigationModal } from './AddMitigationModal'
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user