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

feat(sdk): Auto-Save bei Schrittwechsel + Session-Header
Some checks failed
CI / go-lint (push) Has been skipped
Details
CI / python-lint (push) Has been skipped
Details
CI / nodejs-lint (push) Has been skipped
Details
CI / test-go-ai-compliance (push) Failing after 34s
Details
CI / test-python-backend-compliance (push) Successful in 34s
Details
CI / test-python-document-crawler (push) Successful in 23s
Details
CI / test-python-dsms-gateway (push) Successful in 19s
Details

Browse Source 
Company Profile Wizard speichert jetzt bei jedem Schrittwechsel (Weiter/Zurueck)
als Draft (is_complete: false). Shared buildProfilePayload() vermeidet Duplikation.
SDKHeader zeigt Version, letzten Schritt, Sync-Status und Bearbeiter.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-03-08 22:16:44 +01:00
parent 504b1a1207
commit fd45545fbe
2 changed files with 165 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
admin-compliance/app/sdk/company-profile/page.tsx
View File

@@ -1544,6 +1544,94 @@ export default function CompanyProfilePage() {
setFormData(prev => ({ ...prev, ...updates }))
}
// Shared payload builder for draft saves and final save (DRY)
const buildProfilePayload = (isComplete: boolean) => ({
company_name: formData.companyName || '',
legal_form: formData.legalForm || 'GmbH',
industry: formData.industry || '',
founded_year: formData.foundedYear || null,
business_model: formData.businessModel || 'B2B',
offerings: formData.offerings || [],
company_size: formData.companySize || 'small',
employee_count: formData.employeeCount || '',
annual_revenue: formData.annualRevenue || '',
headquarters_country: formData.headquartersCountry || 'DE',
headquarters_city: formData.headquartersCity || '',
has_international_locations: formData.hasInternationalLocations || false,
international_countries: formData.internationalCountries || [],
target_markets: formData.targetMarkets || [],
primary_jurisdiction: formData.primaryJurisdiction || 'DE',
is_data_controller: formData.isDataController ?? true,
is_data_processor: formData.isDataProcessor ?? false,
uses_ai: formData.usesAI ?? false,
ai_use_cases: formData.aiUseCases || [],
dpo_name: formData.dpoName || '',
dpo_email: formData.dpoEmail || '',
is_complete: isComplete,
// Phase 2 extended fields
processing_systems: (formData as any).processingSystems || [],
ai_systems: (formData as any).aiSystems || [],
technical_contacts: (formData as any).technicalContacts || [],
subject_to_nis2: (formData as any).subjectToNis2 || false,
subject_to_ai_act: (formData as any).subjectToAiAct || false,
subject_to_iso27001: (formData as any).subjectToIso27001 || false,
supervisory_authority: (formData as any).supervisoryAuthority || '',
review_cycle_months: (formData as any).reviewCycleMonths || 12,
repos: (formData as any).repos || [],
document_sources: (formData as any).documentSources || [],
// Machine builder fields (if applicable)
...(formData.machineBuilder ? {
machine_builder: {
product_types: formData.machineBuilder.productTypes || [],
product_description: formData.machineBuilder.productDescription || '',
product_pride: formData.machineBuilder.productPride || '',
contains_software: formData.machineBuilder.containsSoftware || false,
contains_firmware: formData.machineBuilder.containsFirmware || false,
contains_ai: formData.machineBuilder.containsAI || false,
ai_integration_type: formData.machineBuilder.aiIntegrationType || [],
has_safety_function: formData.machineBuilder.hasSafetyFunction || false,
safety_function_description: formData.machineBuilder.safetyFunctionDescription || '',
autonomous_behavior: formData.machineBuilder.autonomousBehavior || false,
human_oversight_level: formData.machineBuilder.humanOversightLevel || 'full',
is_networked: formData.machineBuilder.isNetworked || false,
has_remote_access: formData.machineBuilder.hasRemoteAccess || false,
has_ota_updates: formData.machineBuilder.hasOTAUpdates || false,
update_mechanism: formData.machineBuilder.updateMechanism || '',
export_markets: formData.machineBuilder.exportMarkets || [],
critical_sector_clients: formData.machineBuilder.criticalSectorClients || false,
critical_sectors: formData.machineBuilder.criticalSectors || [],
oem_clients: formData.machineBuilder.oemClients || false,
ce_marking_required: formData.machineBuilder.ceMarkingRequired || false,
existing_ce_process: formData.machineBuilder.existingCEProcess || false,
has_risk_assessment: formData.machineBuilder.hasRiskAssessment || false,
},
} : {}),
})
// Auto-save draft to backend (fire-and-forget, non-blocking)
const [draftSaveStatus, setDraftSaveStatus] = useState<'idle' | 'saving' | 'saved' | 'error'>('idle')
const draftSaveTimerRef = React.useRef<ReturnType<typeof setTimeout> | null>(null)
const saveProfileDraft = async () => {
setDraftSaveStatus('saving')
try {
await fetch('/api/sdk/v1/company-profile', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(buildProfilePayload(false)),
})
setDraftSaveStatus('saved')
// Reset status after 3 seconds
if (draftSaveTimerRef.current) clearTimeout(draftSaveTimerRef.current)
draftSaveTimerRef.current = setTimeout(() => setDraftSaveStatus('idle'), 3000)
} catch (err) {
console.error('Draft save failed:', err)
setDraftSaveStatus('error')
if (draftSaveTimerRef.current) clearTimeout(draftSaveTimerRef.current)
draftSaveTimerRef.current = setTimeout(() => setDraftSaveStatus('idle'), 5000)
}
}
const handleNext = () => {
if (currentStep < lastStep) {
// Skip step 8 if not a machine builder
@@ -1553,6 +1641,7 @@ export default function CompanyProfilePage() {
completeAndSaveProfile()
return
}
saveProfileDraft()
setCurrentStep(nextStep)
} else {
// Complete profile
@@ -1575,68 +1664,7 @@ export default function CompanyProfilePage() {
await fetch('/api/sdk/v1/company-profile', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
company_name: formData.companyName || '',
legal_form: formData.legalForm || 'GmbH',
industry: formData.industry || '',
founded_year: formData.foundedYear || null,
business_model: formData.businessModel || 'B2B',
offerings: formData.offerings || [],
company_size: formData.companySize || 'small',
employee_count: formData.employeeCount || '',
annual_revenue: formData.annualRevenue || '',
headquarters_country: formData.headquartersCountry || 'DE',
headquarters_city: formData.headquartersCity || '',
has_international_locations: formData.hasInternationalLocations || false,
international_countries: formData.internationalCountries || [],
target_markets: formData.targetMarkets || [],
primary_jurisdiction: formData.primaryJurisdiction || 'DE',
is_data_controller: formData.isDataController ?? true,
is_data_processor: formData.isDataProcessor ?? false,
uses_ai: formData.usesAI ?? false,
ai_use_cases: formData.aiUseCases || [],
dpo_name: formData.dpoName || '',
dpo_email: formData.dpoEmail || '',
is_complete: true,
// Phase 2 extended fields
processing_systems: (formData as any).processingSystems || [],
ai_systems: (formData as any).aiSystems || [],
technical_contacts: (formData as any).technicalContacts || [],
subject_to_nis2: (formData as any).subjectToNis2 || false,
subject_to_ai_act: (formData as any).subjectToAiAct || false,
subject_to_iso27001: (formData as any).subjectToIso27001 || false,
supervisory_authority: (formData as any).supervisoryAuthority || '',
review_cycle_months: (formData as any).reviewCycleMonths || 12,
repos: (formData as any).repos || [],
document_sources: (formData as any).documentSources || [],
// Machine builder fields (if applicable)
...(formData.machineBuilder ? {
machine_builder: {
product_types: formData.machineBuilder.productTypes || [],
product_description: formData.machineBuilder.productDescription || '',
product_pride: formData.machineBuilder.productPride || '',
contains_software: formData.machineBuilder.containsSoftware || false,
contains_firmware: formData.machineBuilder.containsFirmware || false,
contains_ai: formData.machineBuilder.containsAI || false,
ai_integration_type: formData.machineBuilder.aiIntegrationType || [],
has_safety_function: formData.machineBuilder.hasSafetyFunction || false,
safety_function_description: formData.machineBuilder.safetyFunctionDescription || '',
autonomous_behavior: formData.machineBuilder.autonomousBehavior || false,
human_oversight_level: formData.machineBuilder.humanOversightLevel || 'full',
is_networked: formData.machineBuilder.isNetworked || false,
has_remote_access: formData.machineBuilder.hasRemoteAccess || false,
has_ota_updates: formData.machineBuilder.hasOTAUpdates || false,
update_mechanism: formData.machineBuilder.updateMechanism || '',
export_markets: formData.machineBuilder.exportMarkets || [],
critical_sector_clients: formData.machineBuilder.criticalSectorClients || false,
critical_sectors: formData.machineBuilder.criticalSectors || [],
oem_clients: formData.machineBuilder.oemClients || false,
ce_marking_required: formData.machineBuilder.ceMarkingRequired || false,
existing_ce_process: formData.machineBuilder.existingCEProcess || false,
has_risk_assessment: formData.machineBuilder.hasRiskAssessment || false,
},
} : {}),
}),
body: JSON.stringify(buildProfilePayload(true)),
})
} catch (err) {
console.error('Failed to save company profile to backend:', err)
@@ -1647,6 +1675,7 @@ export default function CompanyProfilePage() {
const handleBack = () => {
if (currentStep > 1) {
saveProfileDraft()
setCurrentStep(prev => prev - 1)
}
}
@@ -1806,7 +1835,7 @@ export default function CompanyProfilePage() {
{currentStep === 8 && showMachineBuilderStep && <StepMachineBuilder data={formData} onChange={updateFormData} />}
{/* Navigation */}
<div className="flex justify-between mt-8 pt-6 border-t border-gray-200">
<div className="flex justify-between items-center mt-8 pt-6 border-t border-gray-200">
<button
onClick={handleBack}
disabled={currentStep === 1}
@@ -1814,6 +1843,18 @@ export default function CompanyProfilePage() {
>
Zurück
</button>
{/* Draft save status */}
{draftSaveStatus !== 'idle' && (
<span className={`text-xs px-3 py-1 rounded-full ${
draftSaveStatus === 'saving' ? 'text-gray-500 bg-gray-100' :
draftSaveStatus === 'saved' ? 'text-green-600 bg-green-50' :
'text-red-600 bg-red-50'
}`}>
{draftSaveStatus === 'saving' && 'Speichern...'}
{draftSaveStatus === 'saved' && '✓ Gespeichert'}
{draftSaveStatus === 'error' && 'Speichern fehlgeschlagen'}
</span>
)}
<button
onClick={handleNext}
disabled={!canProceed()}

62
admin-compliance/app/sdk/layout.tsx
View File

@@ -13,8 +13,32 @@ import { useSDK } from '@/lib/sdk'
// SDK HEADER
// =============================================================================
function formatTimeAgo(date: Date | null): string {
if (!date) return 'Nie'
const now = Date.now()
const diff = now - date.getTime()
const seconds = Math.floor(diff / 1000)
if (seconds < 60) return 'Gerade eben'
const minutes = Math.floor(seconds / 60)
if (minutes < 60) return `vor ${minutes} Min`
const hours = Math.floor(minutes / 60)
if (hours < 24) return `vor ${hours} Std`
const days = Math.floor(hours / 24)
return `vor ${days} Tag${days > 1 ? 'en' : ''}`
}
const SYNC_STATUS_CONFIG = {
idle: { color: 'bg-green-400', label: 'Sync OK' },
syncing: { color: 'bg-yellow-400 animate-pulse', label: 'Synchronisiere...' },
error: { color: 'bg-red-400', label: 'Sync-Fehler' },
conflict: { color: 'bg-orange-400', label: 'Konflikt' },
offline: { color: 'bg-gray-400', label: 'Offline' },
} as const
function SDKHeader({ sidebarCollapsed }: { sidebarCollapsed: boolean }) {
const { currentStep, setCommandBarOpen, completionPercentage } = useSDK()
const { state, currentStep, setCommandBarOpen, completionPercentage, syncState } = useSDK()
const syncConfig = SYNC_STATUS_CONFIG[syncState.status] || SYNC_STATUS_CONFIG.idle
return (
<header className="sticky top-0 z-30 bg-white border-b border-gray-200">
@@ -75,6 +99,42 @@ function SDKHeader({ sidebarCollapsed }: { sidebarCollapsed: boolean }) {
</button>
</div>
</div>
{/* Session Info Bar */}
<div className="flex items-center gap-4 px-6 py-1.5 bg-gray-50 border-t border-gray-100 text-xs text-gray-500">
{/* Version */}
<span className="font-mono text-gray-400">v{state.version}</span>
<span className="text-gray-300">|</span>
{/* Current step / last activity */}
<span>
Zuletzt: <span className="text-gray-700">{currentStep?.name || 'Dashboard'}</span>
</span>
<span className="text-gray-300">|</span>
{/* Last saved time */}
<span>
{formatTimeAgo(syncState.lastSyncedAt ? new Date(syncState.lastSyncedAt) : state.lastModified ? new Date(state.lastModified) : null)}
</span>
<span className="text-gray-300">|</span>
{/* Sync status dot */}
<span className="flex items-center gap-1.5">
<span className={`inline-block w-2 h-2 rounded-full ${syncConfig.color}`} />
{syncConfig.label}
</span>
{/* User (only if not default) */}
{state.userId && state.userId !== 'default' && (
<>
<span className="text-gray-300">|</span>
<span>Bearbeiter: <span className="text-gray-700">{state.userId}</span></span>
</>
)}
</div>
</header>
)
}