b4613e26f3
backend-lehrer (10 files): - game/database.py (785 → 5), correction_api.py (683 → 4) - classroom_engine/antizipation.py (676 → 5) - llm_gateway schools/edu_search already done in prior batch klausur-service (12 files): - orientation_crop_api.py (694 → 5), pdf_export.py (677 → 4) - zeugnis_crawler.py (676 → 5), grid_editor_api.py (671 → 5) - eh_templates.py (658 → 5), mail/api.py (651 → 5) - qdrant_service.py (638 → 5), training_api.py (625 → 4) website (6 pages): - middleware (696 → 8), mail (733 → 6), consent (628 → 8) - compliance/risks (622 → 5), export (502 → 5), brandbook (629 → 7) studio-v2 (3 components): - B2BMigrationWizard (848 → 3), CleanupPanel (765 → 2) - dashboard-experimental (739 → 2) admin-lehrer (4 files): - uebersetzungen (769 → 4), manager (670 → 2) - ChunkBrowserQA (675 → 6), dsfa/page (674 → 5) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
69 lines
2.8 KiB
TypeScript
69 lines
2.8 KiB
TypeScript
'use client'
|
|
|
|
import { MIDDLEWARE_INFO } from './types'
|
|
import type { MiddlewareHookReturn } from './types'
|
|
|
|
interface OverviewTabProps {
|
|
hook: MiddlewareHookReturn
|
|
}
|
|
|
|
export default function OverviewTab({ hook }: OverviewTabProps) {
|
|
const { stats, saving } = hook
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<h3 className="text-lg font-medium">Middleware Status</h3>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
{Object.entries(MIDDLEWARE_INFO).map(([key, info]) => {
|
|
const config = hook.getConfig(key)
|
|
const mwStats = hook.getStats(key)
|
|
return (
|
|
<div key={key} className="bg-white rounded-lg shadow p-4">
|
|
<div className="flex items-center justify-between mb-2">
|
|
<div className="flex items-center">
|
|
<span className="text-2xl mr-2">{info.icon}</span>
|
|
<h4 className="font-medium">{info.name}</h4>
|
|
</div>
|
|
<button
|
|
onClick={() => config && hook.toggleMiddleware(key, !config.enabled)}
|
|
disabled={saving || !config}
|
|
className={`relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none ${
|
|
config?.enabled ? 'bg-green-500' : 'bg-gray-200'
|
|
}`}
|
|
>
|
|
<span
|
|
className={`pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${
|
|
config?.enabled ? 'translate-x-5' : 'translate-x-0'
|
|
}`}
|
|
/>
|
|
</button>
|
|
</div>
|
|
<p className="text-sm text-gray-500 mb-3">{info.description}</p>
|
|
{mwStats && (
|
|
<div className="text-xs text-gray-400">
|
|
<span className="mr-3">Last hour: {mwStats.events_last_hour} events</span>
|
|
<span>24h: {mwStats.events_last_24h} events</span>
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
|
|
{/* Quick Stats */}
|
|
<div className="mt-8">
|
|
<h3 className="text-lg font-medium mb-4">Activity Summary (24h)</h3>
|
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
|
{stats.map((s) => (
|
|
<div key={s.middleware_name} className="bg-gray-50 rounded-lg p-4">
|
|
<p className="text-sm text-gray-500">{MIDDLEWARE_INFO[s.middleware_name]?.name || s.middleware_name}</p>
|
|
<p className="text-2xl font-bold">{s.events_last_24h}</p>
|
|
<p className="text-xs text-gray-400">{s.events_last_hour} in last hour</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|