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
186
admin-v2/app/(admin)/developers/sdk/installation/page.tsx
Normal file
186
admin-v2/app/(admin)/developers/sdk/installation/page.tsx
Normal file
@@ -0,0 +1,186 @@
|
||||
import { DevPortalLayout, CodeBlock, InfoBox, ParameterTable } from '@/components/developers/DevPortalLayout'
|
||||
|
||||
export default function SDKInstallationPage() {
|
||||
return (
|
||||
<DevPortalLayout
|
||||
title="SDK Installation"
|
||||
description="Installationsanleitung fuer das AI Compliance SDK"
|
||||
>
|
||||
<h2>Voraussetzungen</h2>
|
||||
<ul>
|
||||
<li>Node.js 18 oder hoeher</li>
|
||||
<li>React 18+ / Next.js 14+</li>
|
||||
<li>TypeScript 5.0+ (empfohlen)</li>
|
||||
</ul>
|
||||
|
||||
<h2>Installation</h2>
|
||||
<p>
|
||||
Installieren Sie das SDK ueber Ihren bevorzugten Paketmanager:
|
||||
</p>
|
||||
<CodeBlock language="bash" filename="npm">
|
||||
{`npm install @breakpilot/compliance-sdk`}
|
||||
</CodeBlock>
|
||||
<CodeBlock language="bash" filename="yarn">
|
||||
{`yarn add @breakpilot/compliance-sdk`}
|
||||
</CodeBlock>
|
||||
<CodeBlock language="bash" filename="pnpm">
|
||||
{`pnpm add @breakpilot/compliance-sdk`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Peer Dependencies</h2>
|
||||
<p>
|
||||
Das SDK hat folgende Peer Dependencies, die automatisch installiert werden sollten:
|
||||
</p>
|
||||
<CodeBlock language="json" filename="package.json">
|
||||
{`{
|
||||
"peerDependencies": {
|
||||
"react": ">=18.0.0",
|
||||
"react-dom": ">=18.0.0"
|
||||
}
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Zusaetzliche Pakete (optional)</h2>
|
||||
<p>
|
||||
Fuer erweiterte Funktionen koennen Sie folgende Pakete installieren:
|
||||
</p>
|
||||
<ParameterTable
|
||||
parameters={[
|
||||
{
|
||||
name: 'jspdf',
|
||||
type: 'npm package',
|
||||
required: false,
|
||||
description: 'Fuer PDF-Export (wird automatisch geladen wenn verfuegbar)',
|
||||
},
|
||||
{
|
||||
name: 'jszip',
|
||||
type: 'npm package',
|
||||
required: false,
|
||||
description: 'Fuer ZIP-Export aller Dokumente',
|
||||
},
|
||||
]}
|
||||
/>
|
||||
|
||||
<h2>TypeScript Konfiguration</h2>
|
||||
<p>
|
||||
Das SDK ist vollstaendig in TypeScript geschrieben. Stellen Sie sicher,
|
||||
dass Ihre tsconfig.json folgende Optionen enthaelt:
|
||||
</p>
|
||||
<CodeBlock language="json" filename="tsconfig.json">
|
||||
{`{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"strict": true,
|
||||
"esModuleInterop": true,
|
||||
"skipLibCheck": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
}
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Next.js Integration</h2>
|
||||
<p>
|
||||
Fuer Next.js 14+ mit App Router, fuegen Sie den Provider in Ihr Root-Layout ein:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="app/layout.tsx">
|
||||
{`import { SDKProvider } from '@breakpilot/compliance-sdk'
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: {
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
return (
|
||||
<html lang="de">
|
||||
<body>
|
||||
<SDKProvider
|
||||
tenantId={process.env.NEXT_PUBLIC_TENANT_ID!}
|
||||
apiKey={process.env.BREAKPILOT_API_KEY}
|
||||
enableBackendSync={true}
|
||||
>
|
||||
{children}
|
||||
</SDKProvider>
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<InfoBox type="warning" title="Wichtig fuer Server Components">
|
||||
Der SDKProvider ist ein Client-Component. Wenn Sie Server Components
|
||||
verwenden, wrappen Sie nur die Teile der App, die das SDK benoetigen.
|
||||
</InfoBox>
|
||||
|
||||
<h2>Umgebungsvariablen</h2>
|
||||
<p>
|
||||
Erstellen Sie eine .env.local Datei mit folgenden Variablen:
|
||||
</p>
|
||||
<CodeBlock language="bash" filename=".env.local">
|
||||
{`# Pflicht
|
||||
NEXT_PUBLIC_TENANT_ID=your-tenant-id
|
||||
|
||||
# Optional (fuer Backend-Sync)
|
||||
BREAKPILOT_API_KEY=sk_live_...
|
||||
|
||||
# Optional (fuer Self-Hosted)
|
||||
NEXT_PUBLIC_SDK_API_URL=https://your-server.com/sdk/v1`}
|
||||
</CodeBlock>
|
||||
|
||||
<InfoBox type="info" title="API Key Sicherheit">
|
||||
Der API Key sollte niemals im Frontend-Code oder in NEXT_PUBLIC_ Variablen
|
||||
erscheinen. Verwenden Sie Server-Side API Routes fuer authentifizierte Anfragen.
|
||||
</InfoBox>
|
||||
|
||||
<h2>Verifizierung</h2>
|
||||
<p>
|
||||
Testen Sie die Installation mit einer einfachen Komponente:
|
||||
</p>
|
||||
<CodeBlock language="typescript" filename="app/test/page.tsx">
|
||||
{`'use client'
|
||||
|
||||
import { useSDK } from '@breakpilot/compliance-sdk'
|
||||
|
||||
export default function TestPage() {
|
||||
const { state, completionPercentage } = useSDK()
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>SDK Test</h1>
|
||||
<p>Fortschritt: {completionPercentage}%</p>
|
||||
<p>Aktuelle Phase: {state.currentPhase}</p>
|
||||
<p>Use Cases: {state.useCases.length}</p>
|
||||
</div>
|
||||
)
|
||||
}`}
|
||||
</CodeBlock>
|
||||
|
||||
<h2>Fehlerbehebung</h2>
|
||||
|
||||
<h3>Error: useSDK must be used within SDKProvider</h3>
|
||||
<p>
|
||||
Stellen Sie sicher, dass der SDKProvider das gesamte Layout umschliesst
|
||||
und dass Sie {'\'use client\''} in Client-Komponenten verwenden.
|
||||
</p>
|
||||
|
||||
<h3>Error: Module not found</h3>
|
||||
<p>
|
||||
Loeschen Sie node_modules und package-lock.json, dann reinstallieren:
|
||||
</p>
|
||||
<CodeBlock language="bash" filename="Terminal">
|
||||
{`rm -rf node_modules package-lock.json
|
||||
npm install`}
|
||||
</CodeBlock>
|
||||
|
||||
<h3>TypeScript Errors</h3>
|
||||
<p>
|
||||
Stellen Sie sicher, dass TypeScript 5.0+ installiert ist:
|
||||
</p>
|
||||
<CodeBlock language="bash" filename="Terminal">
|
||||
{`npm install typescript@latest`}
|
||||
</CodeBlock>
|
||||
</DevPortalLayout>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user