refactor(admin): split sdk-flow page.tsx into colocated components
Extract BetriebOverviewPanel, DetailPanel, FlowCanvas, FlowToolbar, StepTable, useFlowGraph hook and helpers into _components/ so page.tsx drops from 1019 to 156 LOC (under the 300 soft target). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
58
admin-compliance/app/sdk/sdk-flow/_components/helpers.ts
Normal file
58
admin-compliance/app/sdk/sdk-flow/_components/helpers.ts
Normal file
@@ -0,0 +1,58 @@
|
||||
import { SDK_FLOW_STEPS, type SDKFlowStep } from '../flow-data'
|
||||
|
||||
// =============================================================================
|
||||
// LAYOUT
|
||||
// =============================================================================
|
||||
|
||||
export const PACKAGE_ORDER: SDKFlowStep['package'][] = [
|
||||
'vorbereitung',
|
||||
'analyse',
|
||||
'dokumentation',
|
||||
'rechtliche-texte',
|
||||
'betrieb',
|
||||
]
|
||||
|
||||
export const PACKAGE_X_OFFSET: Record<string, number> = {
|
||||
vorbereitung: 0,
|
||||
analyse: 320,
|
||||
dokumentation: 640,
|
||||
'rechtliche-texte': 960,
|
||||
betrieb: 1280,
|
||||
}
|
||||
|
||||
export const NODE_WIDTH = 200
|
||||
export const NODE_HEIGHT = 70
|
||||
export const STEP_Y_SPACING = 100
|
||||
export const STEP_Y_START = 100
|
||||
|
||||
export function getStepPosition(step: SDKFlowStep): { x: number; y: number } {
|
||||
const packageSteps = SDK_FLOW_STEPS
|
||||
.filter(s => s.package === step.package)
|
||||
.sort((a, b) => a.seq - b.seq)
|
||||
const idx = packageSteps.findIndex(s => s.id === step.id)
|
||||
|
||||
return {
|
||||
x: PACKAGE_X_OFFSET[step.package] + 40,
|
||||
y: STEP_Y_START + idx * STEP_Y_SPACING,
|
||||
}
|
||||
}
|
||||
|
||||
// =============================================================================
|
||||
// HELPERS - FERTIGSTELLUNGSGRAD
|
||||
// =============================================================================
|
||||
|
||||
export function completionColor(pct: number): string {
|
||||
if (pct >= 70) return '#22c55e' // green
|
||||
if (pct >= 50) return '#84cc16' // lime
|
||||
if (pct >= 35) return '#f59e0b' // amber
|
||||
return '#ef4444' // red
|
||||
}
|
||||
|
||||
export function completionLabel(pct: number): string {
|
||||
if (pct >= 70) return 'Fortgeschritten'
|
||||
if (pct >= 50) return 'In Entwicklung'
|
||||
if (pct >= 35) return 'Begonnen'
|
||||
return 'Frühe Phase'
|
||||
}
|
||||
|
||||
export type PackageFilter = 'alle' | SDKFlowStep['package']
|
||||
Reference in New Issue
Block a user