Agent Zero
25b2581653
C-ERR-BOUNDARY: ErrorBoundary erweitert (trace_id, Fallback-UI, PluginErrorBoundary) C-NOTIF: NotificationDropdown mit System-Channel-Link C-DOCS: ApiDocs.tsx Seite (Swagger UI iframe) C-A11Y: aria-label, min-h-touch, focus-visible ergänzt C-FE-TEST: 29 neue Tests (ErrorBoundary, ApiDocs, PrintButton, themeStore, NotificationDropdown) C-DOC: ui-design-guidelines.md aktualisiert Verifiziert (keine Änderungen nötig): - C-TAGS, C-CF, C-FILTER, C-DEDUP, C-ONBOARD, C-THEME, C-PWA, C-PRINT TSC: 0 errors, Build: erfolgreich, Vitest: 29/29 passed
51 lines
1.9 KiB
TypeScript
51 lines
1.9 KiB
TypeScript
/**
|
|
* ApiDocs page — embeds the FastAPI Swagger UI at /docs in an iframe.
|
|
* Provides in-app access to API documentation without leaving LeoCRM.
|
|
*/
|
|
|
|
import React from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { BookOpen, ExternalLink } from 'lucide-react';
|
|
|
|
export function ApiDocsPage() {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<div className="flex flex-col h-full" data-testid="api-docs-page">
|
|
<div className="flex items-center justify-between px-6 py-4 border-b border-secondary-200 bg-white">
|
|
<div className="flex items-center gap-3">
|
|
<BookOpen className="w-5 h-5 text-primary-600" aria-hidden="true" />
|
|
<div>
|
|
<h1 className="text-lg font-semibold text-secondary-900">
|
|
{t('apiDocs.title', 'API-Dokumentation')}
|
|
</h1>
|
|
<p className="text-sm text-secondary-500">
|
|
{t('apiDocs.description', 'Swagger UI — Interaktive API-Referenz')}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<a
|
|
href="/docs"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="inline-flex items-center gap-1.5 px-3 py-1.5 text-sm font-medium text-primary-600 hover:text-primary-700 hover:bg-primary-50 rounded-md transition-colors min-h-touch focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500"
|
|
aria-label={t('apiDocs.openInNewTab', 'In neuem Tab öffnen')}
|
|
>
|
|
<ExternalLink className="w-4 h-4" aria-hidden="true" />
|
|
{t('apiDocs.openInNewTab', 'In neuem Tab öffnen')}
|
|
</a>
|
|
</div>
|
|
<div className="flex-1 overflow-hidden">
|
|
<iframe
|
|
src="/docs"
|
|
title={t('apiDocs.title', 'API-Dokumentation')}
|
|
className="w-full h-full border-0"
|
|
aria-label={t('apiDocs.title', 'API-Dokumentation')}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ApiDocsPage;
|