merge: phases 1–5 refactor, CI hardening, docs (coolify → main)

Phase 1: backend-compliance — partial service-layer extraction
Phase 2: ai-compliance-sdk — full hexagonal split; iace/ucca/training handlers
  and stores split into focused files; cmd/server/main.go → internal/app/
Phase 3: admin-compliance — types.ts, tom-generator loader, and major page
  components split; lib document generators extracted
Phase 4: dsms-gateway, consent-sdk, developer-portal, breakpilot-compliance-sdk
Phase 5 CI hardening:
  - loc-budget job now scans whole repo (blocking, no || true)
  - sbom-scan / grype blocking on high+ CVEs
  - ai-compliance-sdk/.golangci.yml: strict golangci-lint config
  - check-loc.sh: skip test_*.py and *.html; loc-exceptions.txt expanded
  - deleted stray routes.py.backup (2512 LOC)
Docs:
  - root README.md with CI badge, service table, quick start, CI pipeline table
  - CONTRIBUTING.md: setup, pre-commit checklist, guardrail marker reference
  - CLAUDE.md: First-Time Setup & Claude Code Onboarding section
  - all 7 service READMEs updated (stale phase refs, current architecture)
  - AGENTS.go/python/typescript.md enhanced with linting, DI, barrel re-export
  - .gitignore: dist/, .turbo/, pnpm-lock.yaml added

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

admin-compliance/app/sdk/controls/_components/AddControlForm.tsx

@@ -1,27 +1,19 @@
 'use client'
 
-import { useState } from 'react'
-import type { ControlType } from '@/lib/sdk'
-
-interface FormData {
-  name: string
-  description: string
-  type: ControlType
-  category: string
-  owner: string
-}
+import React, { useState } from 'react'
+import { ControlType } from '@/lib/sdk'
 
 export function AddControlForm({
   onSubmit,
   onCancel,
 }: {
-  onSubmit: (data: FormData) => void
+  onSubmit: (data: { name: string; description: string; type: ControlType; category: string; owner: string }) => void
   onCancel: () => void
 }) {
-  const [formData, setFormData] = useState<FormData>({
+  const [formData, setFormData] = useState({
     name: '',
     description: '',
-    type: 'TECHNICAL',
+    type: 'TECHNICAL' as ControlType,
     category: '',
     owner: '',
   })

admin-compliance/app/sdk/controls/_components/ControlCard.tsx

@@ -1,34 +1,8 @@
 'use client'
 
-import { useState } from 'react'
-import type { DisplayControl, DisplayControlType, DisplayCategory, DisplayStatus } from '../_types'
-import type { ImplementationStatus } from '@/lib/sdk'
-
-const TYPE_COLORS: Record<DisplayControlType, string> = {
-  preventive: 'bg-blue-100 text-blue-700',
-  detective: 'bg-purple-100 text-purple-700',
-  corrective: 'bg-orange-100 text-orange-700',
-}
-
-const CATEGORY_COLORS: Record<DisplayCategory, string> = {
-  technical: 'bg-green-100 text-green-700',
-  organizational: 'bg-yellow-100 text-yellow-700',
-  physical: 'bg-gray-100 text-gray-700',
-}
-
-const STATUS_COLORS: Record<DisplayStatus, string> = {
-  implemented: 'border-green-200 bg-green-50',
-  partial: 'border-yellow-200 bg-yellow-50',
-  planned: 'border-blue-200 bg-blue-50',
-  'not-implemented': 'border-red-200 bg-red-50',
-}
-
-const STATUS_LABELS: Record<DisplayStatus, string> = {
-  implemented: 'Implementiert',
-  partial: 'Teilweise',
-  planned: 'Geplant',
-  'not-implemented': 'Nicht implementiert',
-}
+import React, { useState } from 'react'
+import { ImplementationStatus } from '@/lib/sdk'
+import { DisplayControl } from '../_types'
 
 export function ControlCard({
   control,
@@ -43,17 +17,45 @@ export function ControlCard({
 }) {
   const [showEffectivenessSlider, setShowEffectivenessSlider] = useState(false)
 
+  const typeColors = {
+    preventive: 'bg-blue-100 text-blue-700',
+    detective: 'bg-purple-100 text-purple-700',
+    corrective: 'bg-orange-100 text-orange-700',
+  }
+
+  const categoryColors = {
+    technical: 'bg-green-100 text-green-700',
+    organizational: 'bg-yellow-100 text-yellow-700',
+    physical: 'bg-gray-100 text-gray-700',
+  }
+
+  const statusColors = {
+    implemented: 'border-green-200 bg-green-50',
+    partial: 'border-yellow-200 bg-yellow-50',
+    planned: 'border-blue-200 bg-blue-50',
+    'not-implemented': 'border-red-200 bg-red-50',
+  }
+
+  const statusLabels = {
+    implemented: 'Implementiert',
+    partial: 'Teilweise',
+    planned: 'Geplant',
+    'not-implemented': 'Nicht implementiert',
+  }
+
   return (
-    <div className={`bg-white rounded-xl border-2 p-6 ${STATUS_COLORS[control.displayStatus]}`}>
+    <div className={`bg-white rounded-xl border-2 p-6 ${statusColors[control.displayStatus]}`}>
       <div className="flex items-start justify-between">
         <div className="flex-1">
           <div className="flex items-center gap-2 mb-2">
-            <span className="px-2 py-1 text-xs bg-gray-100 text-gray-700 rounded font-mono">{control.code}</span>
-            <span className={`px-2 py-1 text-xs rounded-full ${TYPE_COLORS[control.displayType]}`}>
+            <span className="px-2 py-1 text-xs bg-gray-100 text-gray-700 rounded font-mono">
+              {control.code}
+            </span>
+            <span className={`px-2 py-1 text-xs rounded-full ${typeColors[control.displayType]}`}>
               {control.displayType === 'preventive' ? 'Praeventiv' :
                control.displayType === 'detective' ? 'Detektiv' : 'Korrektiv'}
             </span>
-            <span className={`px-2 py-1 text-xs rounded-full ${CATEGORY_COLORS[control.displayCategory]}`}>
+            <span className={`px-2 py-1 text-xs rounded-full ${categoryColors[control.displayCategory]}`}>
               {control.displayCategory === 'technical' ? 'Technisch' :
                control.displayCategory === 'organizational' ? 'Organisatorisch' : 'Physisch'}
             </span>
@@ -64,7 +66,7 @@ export function ControlCard({
         <select
           value={control.implementationStatus}
           onChange={(e) => onStatusChange(e.target.value as ImplementationStatus)}
-          className={`px-3 py-1 text-sm rounded-full border ${STATUS_COLORS[control.displayStatus]}`}
+          className={`px-3 py-1 text-sm rounded-full border ${statusColors[control.displayStatus]}`}
         >
           <option value="NOT_IMPLEMENTED">Nicht implementiert</option>
           <option value="PARTIAL">Teilweise</option>
@@ -92,7 +94,10 @@ export function ControlCard({
         {showEffectivenessSlider && (
           <div className="mt-2">
             <input
-              type="range" min={0} max={100} value={control.effectivenessPercent}
+              type="range"
+              min={0}
+              max={100}
+              value={control.effectivenessPercent}
               onChange={(e) => onEffectivenessChange(Number(e.target.value))}
               className="w-full"
             />
@@ -105,16 +110,22 @@ export function ControlCard({
           <span>Verantwortlich: </span>
           <span className="font-medium text-gray-700">{control.owner || 'Nicht zugewiesen'}</span>
         </div>
-        <div className="text-gray-500">Letzte Pruefung: {control.lastReview.toLocaleDateString('de-DE')}</div>
+        <div className="text-gray-500">
+          Letzte Pruefung: {control.lastReview.toLocaleDateString('de-DE')}
+        </div>
       </div>
 
       <div className="mt-3 flex items-center justify-between">
         <div className="flex items-center gap-1 flex-wrap">
           {control.linkedRequirements.slice(0, 3).map(req => (
-            <span key={req} className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">{req}</span>
+            <span key={req} className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">
+              {req}
+            </span>
           ))}
           {control.linkedRequirements.length > 3 && (
-            <span className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">+{control.linkedRequirements.length - 3}</span>
+            <span className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">
+              +{control.linkedRequirements.length - 3}
+            </span>
           )}
         </div>
         <span className={`px-3 py-1 text-xs rounded-full ${
@@ -122,31 +133,22 @@ export function ControlCard({
           control.displayStatus === 'partial' ? 'bg-yellow-100 text-yellow-700' :
           control.displayStatus === 'planned' ? 'bg-blue-100 text-blue-700' : 'bg-red-100 text-red-700'
         }`}>
-          {STATUS_LABELS[control.displayStatus]}
+          {statusLabels[control.displayStatus]}
         </span>
       </div>
 
+      {/* Linked Evidence */}
       {control.linkedEvidence.length > 0 && (
         <div className="mt-3 pt-3 border-t border-gray-100">
-          <span className="text-xs text-gray-500 mb-1 block">
-            Nachweise: {control.linkedEvidence.length}
-            {(() => {
-              const e2plus = control.linkedEvidence.filter((ev: { confidenceLevel?: string }) =>
-                ev.confidenceLevel && ['E2', 'E3', 'E4'].includes(ev.confidenceLevel)
-              ).length
-              return e2plus > 0 ? ` (${e2plus} E2+)` : ''
-            })()}
-          </span>
+          <span className="text-xs text-gray-500 mb-1 block">Nachweise:</span>
           <div className="flex items-center gap-1 flex-wrap">
             {control.linkedEvidence.map(ev => (
               <span key={ev.id} className={`px-2 py-0.5 text-xs rounded ${
                 ev.status === 'valid' ? 'bg-green-50 text-green-700' :
-                ev.status === 'expired' ? 'bg-red-50 text-red-700' : 'bg-yellow-50 text-yellow-700'
+                ev.status === 'expired' ? 'bg-red-50 text-red-700' :
+                'bg-yellow-50 text-yellow-700'
               }`}>
                 {ev.title}
-                {(ev as { confidenceLevel?: string }).confidenceLevel && (
-                  <span className="ml-1 opacity-70">({(ev as { confidenceLevel?: string }).confidenceLevel})</span>
-                )}
               </span>
             ))}
           </div>
@@ -154,7 +156,10 @@ export function ControlCard({
       )}
 
       <div className="mt-3 pt-3 border-t border-gray-100">
-        <button onClick={onLinkEvidence} className="text-sm text-purple-600 hover:text-purple-700 font-medium">
+        <button
+          onClick={onLinkEvidence}
+          className="text-sm text-purple-600 hover:text-purple-700 font-medium"
+        >
           Evidence verknuepfen
         </button>
       </div>

admin-compliance/app/sdk/controls/_components/FilterBar.tsx

@@ -1,14 +1,20 @@
-const FILTERS = ['all', 'implemented', 'partial', 'not-implemented', 'technical', 'organizational', 'preventive', 'detective']
+'use client'
 
-const FILTER_LABELS: Record<string, string> = {
-  all: 'Alle',
-  implemented: 'Implementiert',
-  partial: 'Teilweise',
-  'not-implemented': 'Offen',
-  technical: 'Technisch',
-  organizational: 'Organisatorisch',
-  preventive: 'Praeventiv',
-  detective: 'Detektiv',
+import React from 'react'
+
+const FILTER_OPTIONS = [
+  'all', 'implemented', 'partial', 'not-implemented',
+  'technical', 'organizational', 'preventive', 'detective',
+]
+
+function filterLabel(f: string): string {
+  return f === 'all' ? 'Alle' :
+    f === 'implemented' ? 'Implementiert' :
+    f === 'partial' ? 'Teilweise' :
+    f === 'not-implemented' ? 'Offen' :
+    f === 'technical' ? 'Technisch' :
+    f === 'organizational' ? 'Organisatorisch' :
+    f === 'preventive' ? 'Praeventiv' : 'Detektiv'
 }
 
 export function FilterBar({
@@ -21,15 +27,17 @@ export function FilterBar({
   return (
     <div className="flex items-center gap-2 flex-wrap">
       <span className="text-sm text-gray-500">Filter:</span>
-      {FILTERS.map(f => (
+      {FILTER_OPTIONS.map(f => (
         <button
           key={f}
           onClick={() => onFilterChange(f)}
           className={`px-3 py-1 text-sm rounded-full transition-colors ${
-            filter === f ? 'bg-purple-600 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
+            filter === f
+              ? 'bg-purple-600 text-white'
+              : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
           }`}
         >
-          {FILTER_LABELS[f]}
+          {filterLabel(f)}
         </button>
       ))}
     </div>

admin-compliance/app/sdk/controls/_components/LoadingSkeleton.tsx

@@ -1,3 +1,7 @@
+'use client'
+
+import React from 'react'
+
 export function LoadingSkeleton() {
   return (
     <div className="space-y-4">

admin-compliance/app/sdk/controls/_components/RAGPanel.tsx

@@ -1,6 +1,7 @@
 'use client'
 
-import type { RAGControlSuggestion } from '../_types'
+import React from 'react'
+import { RAGControlSuggestion } from '../_types'
 
 export function RAGPanel({
   selectedRequirementId,
@@ -13,7 +14,7 @@ export function RAGPanel({
   onClose,
 }: {
   selectedRequirementId: string
-  onSelectedRequirementIdChange: (id: string) => void
+  onSelectedRequirementIdChange: (v: string) => void
   requirements: { id: string; title?: string }[]
   onSuggestControls: () => void
   ragLoading: boolean
@@ -28,7 +29,7 @@ export function RAGPanel({
           <h3 className="text-lg font-semibold text-purple-900">KI-Controls aus RAG vorschlagen</h3>
           <p className="text-sm text-purple-700 mt-1">
             Geben Sie eine Anforderungs-ID ein. Das KI-System analysiert die Anforderung mit Hilfe des RAG-Corpus
-            und schlaegt passende Controls vor.
+            und schlägt passende Controls vor.
           </p>
         </div>
         <button onClick={onClose} className="text-purple-400 hover:text-purple-600 ml-4">
@@ -52,7 +53,7 @@ export function RAGPanel({
             onChange={e => onSelectedRequirementIdChange(e.target.value)}
             className="px-3 py-2 border border-purple-300 rounded-lg bg-white text-sm focus:ring-2 focus:ring-purple-500"
           >
-            <option value="">Aus Liste waehlen...</option>
+            <option value="">Aus Liste wählen...</option>
             {requirements.slice(0, 20).map(r => (
               <option key={r.id} value={r.id}>{r.id.substring(0, 8)}... — {r.title?.substring(0, 40)}</option>
             ))}
@@ -77,15 +78,16 @@ export function RAGPanel({
               <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>
-              Vorschlaege generieren
+              Vorschläge generieren
             </>
           )}
         </button>
       </div>
 
+      {/* Suggestions */}
       {ragSuggestions.length > 0 && (
         <div className="space-y-3">
-          <h4 className="text-sm font-semibold text-purple-800">{ragSuggestions.length} Vorschlaege gefunden:</h4>
+          <h4 className="text-sm font-semibold text-purple-800">{ragSuggestions.length} Vorschläge gefunden:</h4>
           {ragSuggestions.map((suggestion) => (
             <div key={suggestion.control_id} className="bg-white border border-purple-200 rounded-lg p-4">
               <div className="flex items-start justify-between gap-3">
@@ -94,8 +96,12 @@ export function RAGPanel({
                     <span className="px-2 py-0.5 text-xs bg-purple-100 text-purple-700 rounded font-mono">
                       {suggestion.control_id}
                     </span>
-                    <span className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">{suggestion.domain}</span>
-                    <span className="text-xs text-gray-500">Konfidenz: {Math.round(suggestion.confidence_score * 100)}%</span>
+                    <span className="px-2 py-0.5 text-xs bg-gray-100 text-gray-600 rounded">
+                      {suggestion.domain}
+                    </span>
+                    <span className="text-xs text-gray-500">
+                      Konfidenz: {Math.round(suggestion.confidence_score * 100)}%
+                    </span>
                   </div>
                   <h5 className="font-semibold text-gray-900">{suggestion.title}</h5>
                   <p className="text-sm text-gray-600 mt-1">{suggestion.description}</p>
@@ -117,7 +123,7 @@ export function RAGPanel({
                   <svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                     <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
                   </svg>
-                  Hinzufuegen
+                  Hinzufügen
                 </button>
               </div>
             </div>
@@ -127,7 +133,7 @@ export function RAGPanel({
 
       {!ragLoading && ragSuggestions.length === 0 && selectedRequirementId && (
         <p className="text-sm text-purple-600 italic">
-          Klicken Sie auf &quot;Vorschlaege generieren&quot;, um KI-Controls abzurufen.
+          Klicken Sie auf &quot;Vorschläge generieren&quot;, um KI-Controls abzurufen.
         </p>
       )}
     </div>

admin-compliance/app/sdk/controls/_components/StatsCards.tsx

@@ -1,3 +1,7 @@
+'use client'
+
+import React from 'react'
+
 export function StatsCards({
   total,
   implementedCount,