fix(admin-v2): Restore complete admin-v2 application
The admin-v2 application was incomplete in the repository. This commit restores all missing components: - Admin pages (76 pages): dashboard, ai, compliance, dsgvo, education, infrastructure, communication, development, onboarding, rbac - SDK pages (45 pages): tom, dsfa, vvt, loeschfristen, einwilligungen, vendor-compliance, tom-generator, dsr, and more - Developer portal (25 pages): API docs, SDK guides, frameworks - All components, lib files, hooks, and types - Updated package.json with all dependencies The issue was caused by incomplete initial repository state - the full admin-v2 codebase existed in backend/admin-v2 and docs-src/admin-v2 but was never fully synced to the main admin-v2 directory. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
BreakPilot Dev
281
admin-v2/app/(admin)/developers/sdk/page.tsx
Normal file
281
admin-v2/app/(admin)/developers/sdk/page.tsx
Normal file
@@ -0,0 +1,281 @@
|
||||
import Link from 'next/link'
|
||||
import { DevPortalLayout, CodeBlock, InfoBox } from '@/components/developers/DevPortalLayout'
|
||||
|
||||
export default function SDKOverviewPage() {
|
||||
return (
|
||||
<DevPortalLayout
|
||||
title="SDK Documentation"
|
||||
description="TypeScript SDK für React und Next.js Integration"
|
||||
>
|
||||
<h2>Übersicht</h2>
|
||||
<p>
|
||||
Das AI Compliance SDK ist ein TypeScript-Paket für die Integration des
|
||||
Compliance-Workflows in React und Next.js Anwendungen. Es bietet:
|
||||
</p>
|
||||
<ul>
|
||||
<li>React Context Provider für State Management</li>
|
||||
<li>Hooks für einfachen Zugriff auf Compliance-Daten</li>
|
||||
<li>Automatische Synchronisation mit dem Backend</li>
|
||||
<li>Offline-Support mit localStorage Fallback</li>
|
||||
<li>Export-Funktionen (PDF, JSON, ZIP)</li>
|
||||
</ul>
|
||||
|
||||
<h2>Kernkomponenten</h2>
|
||||
|
||||
<h3>SDKProvider</h3>
|
||||
<p>
|
||||
Der Provider wrappet Ihre App und stellt den SDK-Kontext bereit:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="app/layout.tsx">
|
||||
{`import { SDKProvider } from '@breakpilot/compliance-sdk'
|
||||
|
||||
export default function Layout({ children }) {
|
||||
return (
|
||||
<SDKProvider
|
||||
tenantId="your-tenant"
|
||||
enableBackendSync={true}
|
||||
>
|
||||
{children}
|
||||
</SDKProvider>
|
||||
)
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h3>useSDK Hook</h3>
|
||||
<p>
|
||||
Der Haupt-Hook für den Zugriff auf alle SDK-Funktionen:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="component.tsx">
|
||||
{`import { useSDK } from '@breakpilot/compliance-sdk'
|
||||
|
||||
function MyComponent() {
|
||||
const {
|
||||
// State
|
||||
state,
|
||||
dispatch,
|
||||
|
||||
// Navigation
|
||||
currentStep,
|
||||
goToStep,
|
||||
goToNextStep,
|
||||
goToPreviousStep,
|
||||
canGoNext,
|
||||
canGoPrevious,
|
||||
|
||||
// Progress
|
||||
completionPercentage,
|
||||
phase1Completion,
|
||||
phase2Completion,
|
||||
|
||||
// Checkpoints
|
||||
validateCheckpoint,
|
||||
overrideCheckpoint,
|
||||
getCheckpointStatus,
|
||||
|
||||
// Data Updates
|
||||
updateUseCase,
|
||||
addRisk,
|
||||
updateControl,
|
||||
|
||||
// Persistence
|
||||
saveState,
|
||||
loadState,
|
||||
|
||||
// Demo Data
|
||||
seedDemoData,
|
||||
clearDemoData,
|
||||
isDemoDataLoaded,
|
||||
|
||||
// Sync
|
||||
syncState,
|
||||
forceSyncToServer,
|
||||
isOnline,
|
||||
|
||||
// Export
|
||||
exportState,
|
||||
|
||||
// Command Bar
|
||||
isCommandBarOpen,
|
||||
setCommandBarOpen,
|
||||
} = useSDK()
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>Progress: {completionPercentage}%</h1>
|
||||
<button onClick={() => goToStep('risks')}>
|
||||
Zur Risikoanalyse
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Types</h2>
|
||||
<p>
|
||||
Das SDK exportiert alle TypeScript-Types für volle Typsicherheit:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="types.ts">
|
||||
{`import type {
|
||||
// Core Types
|
||||
SDKState,
|
||||
SDKAction,
|
||||
SDKStep,
|
||||
SDKPhase,
|
||||
|
||||
// Use Cases
|
||||
UseCaseAssessment,
|
||||
AssessmentResult,
|
||||
|
||||
// Risk Management
|
||||
Risk,
|
||||
RiskSeverity,
|
||||
RiskMitigation,
|
||||
|
||||
// Controls & Evidence
|
||||
Control,
|
||||
Evidence,
|
||||
Requirement,
|
||||
|
||||
// Checkpoints
|
||||
Checkpoint,
|
||||
CheckpointStatus,
|
||||
ValidationError,
|
||||
|
||||
// DSFA
|
||||
DSFA,
|
||||
DSFASection,
|
||||
DSFAApproval,
|
||||
|
||||
// TOMs & VVT
|
||||
TOM,
|
||||
ProcessingActivity,
|
||||
RetentionPolicy,
|
||||
|
||||
// AI Act
|
||||
AIActResult,
|
||||
AIActRiskCategory,
|
||||
} from '@breakpilot/compliance-sdk'`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Utility Functions</h2>
|
||||
<p>
|
||||
Hilfreiche Funktionen für die Arbeit mit dem SDK:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="utils.ts">
|
||||
{`import {
|
||||
// Step Navigation
|
||||
getStepById,
|
||||
getStepByUrl,
|
||||
getNextStep,
|
||||
getPreviousStep,
|
||||
getStepsForPhase,
|
||||
|
||||
// Risk Calculation
|
||||
calculateRiskScore,
|
||||
getRiskSeverityFromScore,
|
||||
calculateResidualRisk,
|
||||
|
||||
// Progress
|
||||
getCompletionPercentage,
|
||||
getPhaseCompletionPercentage,
|
||||
} from '@breakpilot/compliance-sdk'
|
||||
|
||||
// Beispiel: Risk Score berechnen
|
||||
const inherentRisk = calculateRiskScore(4, 5) // likelihood * impact = 20
|
||||
const severity = getRiskSeverityFromScore(20) // 'CRITICAL'`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>API Client</h2>
|
||||
<p>
|
||||
Für direkten API-Zugriff ohne React Context:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="api.ts">
|
||||
{`import {
|
||||
getSDKApiClient,
|
||||
SDKApiClient,
|
||||
} from '@breakpilot/compliance-sdk'
|
||||
|
||||
const client = getSDKApiClient('your-tenant-id')
|
||||
|
||||
// State laden
|
||||
const state = await client.getState()
|
||||
|
||||
// State speichern
|
||||
await client.saveState(updatedState)
|
||||
|
||||
// Checkpoint validieren
|
||||
const result = await client.validateCheckpoint('CP-UC', state)
|
||||
|
||||
// Export
|
||||
const blob = await client.exportState('pdf')`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>RAG & LLM Client</h2>
|
||||
<p>
|
||||
Zugriff auf die RAG-Suche und Dokumentengenerierung:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="rag.ts">
|
||||
{`import {
|
||||
getSDKBackendClient,
|
||||
isLegalQuery,
|
||||
} from '@breakpilot/compliance-sdk'
|
||||
|
||||
const client = getSDKBackendClient()
|
||||
|
||||
// RAG-Suche
|
||||
const results = await client.search('DSGVO Art. 5', 5)
|
||||
console.log(results) // SearchResult[]
|
||||
|
||||
// Dokumentengenerierung
|
||||
const dsfa = await client.generateDSFA(context)
|
||||
const toms = await client.generateTOM(context)
|
||||
const vvt = await client.generateVVT(context)
|
||||
|
||||
// Prüfen ob eine Query rechtliche Inhalte betrifft
|
||||
if (isLegalQuery('Einwilligung DSGVO')) {
|
||||
// RAG-Suche durchführen
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Export</h2>
|
||||
<p>
|
||||
Exportieren Sie Compliance-Daten in verschiedenen Formaten:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="export.ts">
|
||||
{`import { exportToPDF, exportToZIP, downloadExport } from '@breakpilot/compliance-sdk'
|
||||
|
||||
// PDF Export
|
||||
const pdfBlob = await exportToPDF(state)
|
||||
downloadExport(pdfBlob, 'compliance-report.pdf')
|
||||
|
||||
// ZIP Export (alle Dokumente)
|
||||
const zipBlob = await exportToZIP(state)
|
||||
downloadExport(zipBlob, 'compliance-export.zip')
|
||||
|
||||
// Über den Hook
|
||||
const { exportState } = useSDK()
|
||||
const blob = await exportState('pdf') // 'json' | 'pdf' | 'zip'`}
|
||||
</CodeBlock>
|
||||
|
||||
<InfoBox type="success" title="Weitere Dokumentation">
|
||||
<ul className="list-disc list-inside space-y-1">
|
||||
<li>
|
||||
<Link href="/developers/sdk/installation" className="text-blue-600 hover:underline">
|
||||
Installation Guide
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/developers/sdk/configuration" className="text-blue-600 hover:underline">
|
||||
Konfigurationsoptionen
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/developers/guides/phase1" className="text-blue-600 hover:underline">
|
||||
Phase 1 Workflow Guide
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</InfoBox>
|
||||
</DevPortalLayout>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user