f7b77fd504
Extract the monolithic company-profile wizard into _components/ and _hooks/ following Next.js 15 conventions from AGENTS.typescript.md: - _components/constants.ts: wizard steps, legal forms, industries, certifications - _components/types.ts: local interfaces (ProcessingActivity, AISystem, etc.) - _components/activity-data.ts: DSGVO data categories, department/activity templates - _components/ai-system-data.ts: AI system template catalog - _components/StepBasicInfo.tsx: step 1 (company name, legal form, industry) - _components/StepBusinessModel.tsx: step 2 (B2B/B2C, offerings) - _components/StepCompanySize.tsx: step 3 (size, revenue) - _components/StepLocations.tsx: step 4 (headquarters, target markets) - _components/StepDataProtection.tsx: step 5 (DSGVO roles, DPO) - _components/StepProcessing.tsx: processing activities with category checkboxes - _components/StepAISystems.tsx: AI system inventory - _components/StepLegalFramework.tsx: certifications and contacts - _components/StepMachineBuilder.tsx: machine builder profile (step 7) - _components/ProfileSummary.tsx: completion summary view - _hooks/useCompanyProfileForm.ts: form state, auto-save, navigation logic - page.tsx: thin orchestrator (160 LOC), imports and composes sections All 16 files are under 500 LOC (largest: StepProcessing at 343). Build verified: npx next build passes cleanly. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
78 lines
2.9 KiB
TypeScript
78 lines
2.9 KiB
TypeScript
'use client'
|
|
|
|
import { CompanyProfile } from '@/lib/sdk/types'
|
|
|
|
export function StepDataProtection({
|
|
data,
|
|
onChange,
|
|
}: {
|
|
data: Partial<CompanyProfile>
|
|
onChange: (updates: Partial<CompanyProfile>) => void
|
|
}) {
|
|
return (
|
|
<div className="space-y-8">
|
|
<div>
|
|
<label className="block text-sm font-medium text-gray-700 mb-4">
|
|
Datenschutz-Rolle nach DSGVO
|
|
</label>
|
|
<div className="space-y-3">
|
|
<label className="flex items-start gap-4 p-4 rounded-xl border-2 border-gray-200 hover:border-purple-300 cursor-pointer">
|
|
<input
|
|
type="checkbox"
|
|
checked={data.isDataController ?? true}
|
|
onChange={e => onChange({ isDataController: e.target.checked })}
|
|
className="mt-1 w-5 h-5 text-purple-600 rounded focus:ring-purple-500"
|
|
/>
|
|
<div>
|
|
<div className="font-medium text-gray-900">Verantwortlicher (Art. 4 Nr. 7 DSGVO)</div>
|
|
<div className="text-sm text-gray-500">
|
|
Wir entscheiden selbst über Zwecke und Mittel der Datenverarbeitung
|
|
</div>
|
|
</div>
|
|
</label>
|
|
|
|
<label className="flex items-start gap-4 p-4 rounded-xl border-2 border-gray-200 hover:border-purple-300 cursor-pointer">
|
|
<input
|
|
type="checkbox"
|
|
checked={data.isDataProcessor ?? false}
|
|
onChange={e => onChange({ isDataProcessor: e.target.checked })}
|
|
className="mt-1 w-5 h-5 text-purple-600 rounded focus:ring-purple-500"
|
|
/>
|
|
<div>
|
|
<div className="font-medium text-gray-900">Auftragsverarbeiter (Art. 4 Nr. 8 DSGVO)</div>
|
|
<div className="text-sm text-gray-500">
|
|
Wir verarbeiten personenbezogene Daten im Auftrag anderer Unternehmen
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-2 gap-6">
|
|
<div>
|
|
<label className="block text-sm font-medium text-gray-700 mb-2">
|
|
Datenschutzbeauftragter (Name)
|
|
</label>
|
|
<input
|
|
type="text"
|
|
value={data.dpoName || ''}
|
|
onChange={e => onChange({ dpoName: e.target.value || null })}
|
|
placeholder="Optional"
|
|
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label className="block text-sm font-medium text-gray-700 mb-2">DSB E-Mail</label>
|
|
<input
|
|
type="email"
|
|
value={data.dpoEmail || ''}
|
|
onChange={e => onChange({ dpoEmail: e.target.value || null })}
|
|
placeholder="dsb@firma.de"
|
|
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|