637eb012f5
Extract ObligationModal, ObligationDetail, ObligationCard, ObligationsHeader, StatsGrid, FilterBar and InfoBanners into _components/, plus _types.ts for shared types/constants. page.tsx drops from 987 to 325 LOC, below the 300 soft target region and well under the 500 hard cap. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
63 lines
2.5 KiB
TypeScript
63 lines
2.5 KiB
TypeScript
'use client'
|
|
|
|
import React from 'react'
|
|
import { StepHeader, STEP_EXPLANATIONS } from '@/components/sdk/StepHeader'
|
|
|
|
export default function ObligationsHeader({
|
|
profiling,
|
|
showGapAnalysis,
|
|
onAutoProfiling,
|
|
onToggleGap,
|
|
onAdd,
|
|
}: {
|
|
profiling: boolean
|
|
showGapAnalysis: boolean
|
|
onAutoProfiling: () => void
|
|
onToggleGap: () => void
|
|
onAdd: () => void
|
|
}) {
|
|
const stepInfo = STEP_EXPLANATIONS['obligations']
|
|
return (
|
|
<StepHeader
|
|
stepId="obligations"
|
|
title={stepInfo?.title || 'Pflichten-Management'}
|
|
description={stepInfo?.description || 'DSGVO & AI-Act Compliance-Pflichten verwalten'}
|
|
explanation={stepInfo?.explanation || ''}
|
|
tips={stepInfo?.tips || []}
|
|
>
|
|
<div className="flex items-center gap-2">
|
|
<button
|
|
onClick={onAutoProfiling}
|
|
disabled={profiling}
|
|
className="flex items-center gap-2 px-4 py-2 bg-white border border-purple-300 text-purple-700 rounded-lg hover:bg-purple-50 transition-colors text-sm disabled:opacity-50"
|
|
>
|
|
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" />
|
|
</svg>
|
|
{profiling ? 'Profiling...' : 'Auto-Profiling'}
|
|
</button>
|
|
<button
|
|
onClick={onToggleGap}
|
|
className={`flex items-center gap-2 px-4 py-2 rounded-lg transition-colors text-sm ${
|
|
showGapAnalysis ? 'bg-purple-100 text-purple-700' : 'bg-white border border-gray-300 text-gray-700 hover:bg-gray-50'
|
|
}`}
|
|
>
|
|
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
|
|
</svg>
|
|
Gap-Analyse
|
|
</button>
|
|
<button
|
|
onClick={onAdd}
|
|
className="flex items-center gap-2 px-4 py-2 bg-purple-600 text-white rounded-lg hover:bg-purple-700 transition-colors text-sm"
|
|
>
|
|
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
|
|
</svg>
|
|
Pflicht hinzufuegen
|
|
</button>
|
|
</div>
|
|
</StepHeader>
|
|
)
|
|
}
|