Benjamin_Boenisch/breakpilot-compliance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(admin): split evidence, process-tasks, iace/hazards pages

Browse Source 
Extract components and hooks into _components/ and _hooks/ subdirectories
to reduce each page.tsx to under 500 LOC (was 1545/1383/1316).

Final line counts: evidence=213, process-tasks=304, hazards=157.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sharang Parnerkar
2026-04-16 17:12:15 +02:00
parent e0c1d21879
commit 1fcd8244b1
27 changed files with 2621 additions and 4083 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
admin-compliance/app/sdk/evidence/_components/EvidenceCard.tsx
View File

@@ -1,5 +1,12 @@
'use client'
import React from 'react'
import {
ConfidenceLevelBadge,
TruthStatusBadge,
GenerationModeBadge,
ApprovalStatusBadge,
} from '../components/anti-fake-badges'
import type { DisplayEvidence, DisplayEvidenceType } from './EvidenceTypes'
const typeIcons: Record<DisplayEvidenceType, React.ReactNode> = {
@@ -50,16 +57,14 @@ const typeIconBg: Record<DisplayEvidenceType, string> = {
document: 'bg-gray-100 text-gray-600',
}
export function EvidenceCard({
evidence,
onDelete,
onView,
onDownload,
}: {
export function EvidenceCard({ evidence, onDelete, onView, onDownload, onReview, onReject, onShowHistory }: {
evidence: DisplayEvidence
onDelete: () => void
onView: () => void
onDownload: () => void
onReview: () => void
onReject: () => void
onShowHistory: () => void
}) {
return (
<div className={`bg-white rounded-xl border-2 p-6 ${
@@ -73,9 +78,15 @@ export function EvidenceCard({
<div className="flex-1">
<div className="flex items-center justify-between">
<h3 className="text-lg font-semibold text-gray-900">{evidence.name}</h3>
<span className={`px-3 py-1 text-xs rounded-full ${statusColors[evidence.status]}`}>
{statusLabels[evidence.status]}
</span>
<div className="flex items-center gap-1.5 flex-wrap">
<span className={`px-3 py-1 text-xs rounded-full ${statusColors[evidence.status]}`}>
{statusLabels[evidence.status]}
</span>
<ConfidenceLevelBadge level={evidence.confidenceLevel} />
<TruthStatusBadge status={evidence.truthStatus} />
<GenerationModeBadge mode={evidence.generationMode} />
<ApprovalStatusBadge status={evidence.approvalStatus} requiresFourEyes={evidence.requiresFourEyes} />
</div>
</div>
<p className="text-sm text-gray-500 mt-1">{evidence.description}</p>
@@ -91,14 +102,10 @@ export function EvidenceCard({
<div className="mt-3 flex items-center gap-2 flex-wrap">
{evidence.linkedRequirements.map(req => (
<span key={req} className="px-2 py-0.5 text-xs bg-blue-50 text-blue-600 rounded">
{req}
</span>
<span key={req} className="px-2 py-0.5 text-xs bg-blue-50 text-blue-600 rounded">{req}</span>
))}
{evidence.linkedControls.map(ctrl => (
<span key={ctrl} className="px-2 py-0.5 text-xs bg-green-50 text-green-600 rounded">
{ctrl}
</span>
<span key={ctrl} className="px-2 py-0.5 text-xs bg-green-50 text-green-600 rounded">{ctrl}</span>
))}
</div>
</div>
@@ -107,26 +114,34 @@ export function EvidenceCard({
<div className="mt-4 pt-4 border-t border-gray-100 flex items-center justify-between">
<span className="text-sm text-gray-500">Hochgeladen von: {evidence.uploadedBy}</span>
<div className="flex items-center gap-2">
<button
onClick={onView}
disabled={!evidence.fileUrl}
className="px-3 py-1 text-sm text-gray-600 hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
>
<button onClick={onView} disabled={!evidence.fileUrl}
className="px-3 py-1 text-sm text-gray-600 hover:bg-gray-100 rounded-lg transition-colors disabled:opacity-40 disabled:cursor-not-allowed">
Anzeigen
</button>
<button
onClick={onDownload}
disabled={!evidence.fileUrl}
className="px-3 py-1 text-sm text-purple-600 hover:bg-purple-50 rounded-lg transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
>
<button onClick={onDownload} disabled={!evidence.fileUrl}
className="px-3 py-1 text-sm text-purple-600 hover:bg-purple-50 rounded-lg transition-colors disabled:opacity-40 disabled:cursor-not-allowed">
Herunterladen
</button>
<button
onClick={onDelete}
className="px-3 py-1 text-sm text-red-600 hover:bg-red-50 rounded-lg transition-colors"
>
<button onClick={onDelete}
className="px-3 py-1 text-sm text-red-600 hover:bg-red-50 rounded-lg transition-colors">
Loeschen
</button>
{(evidence.approvalStatus === 'none' || evidence.approvalStatus === 'pending_first' || evidence.approvalStatus === 'first_approved' || !evidence.approvalStatus) && evidence.approvalStatus !== 'approved' && evidence.approvalStatus !== 'rejected' && (
<button onClick={onReview}
className="px-3 py-1 text-sm text-green-600 hover:bg-green-50 rounded-lg transition-colors font-medium">
Reviewen
</button>
)}
{evidence.requiresFourEyes && evidence.approvalStatus !== 'rejected' && evidence.approvalStatus !== 'approved' && (
<button onClick={onReject}
className="px-3 py-1 text-sm text-orange-600 hover:bg-orange-50 rounded-lg transition-colors">
Ablehnen
</button>
)}
<button onClick={onShowHistory}
className="px-3 py-1 text-sm text-gray-500 hover:bg-gray-100 rounded-lg transition-colors">
Historie
</button>
</div>
</div>
</div>