2fb6b98bc5
Extract types, constants, helpers, and UI pieces (shared LoadingSkeleton/ EmptyState/StatusBadge/CopyButton, SSOConfigFormModal, DeleteConfirmModal, ConnectionTestPanel, SSOConfigCard, SSOUsersTable, SSOInfoSection) into _components/ and _types.ts to bring page.tsx from 1482 LOC to 339 LOC (under the 500 hard cap). Behavior preserved. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
66 lines
2.1 KiB
TypeScript
66 lines
2.1 KiB
TypeScript
'use client'
|
|
|
|
import { useState } from 'react'
|
|
import { AlertTriangle, Loader2 } from 'lucide-react'
|
|
import type { SSOConfig } from '../_types'
|
|
|
|
export function DeleteConfirmModal({
|
|
config,
|
|
onClose,
|
|
onConfirm,
|
|
}: {
|
|
config: SSOConfig | null
|
|
onClose: () => void
|
|
onConfirm: () => Promise<void>
|
|
}) {
|
|
const [deleting, setDeleting] = useState(false)
|
|
|
|
if (!config) return null
|
|
|
|
const handleDelete = async () => {
|
|
setDeleting(true)
|
|
try {
|
|
await onConfirm()
|
|
onClose()
|
|
} finally {
|
|
setDeleting(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
|
|
<div className="bg-white rounded-xl shadow-xl max-w-md w-full mx-4 p-6">
|
|
<div className="flex items-center gap-3 mb-4">
|
|
<div className="w-10 h-10 bg-red-100 rounded-full flex items-center justify-center">
|
|
<AlertTriangle className="w-5 h-5 text-red-600" />
|
|
</div>
|
|
<div>
|
|
<h3 className="text-lg font-semibold text-slate-900">Konfiguration loeschen?</h3>
|
|
<p className="text-sm text-slate-500">Diese Aktion kann nicht rueckgaengig gemacht werden.</p>
|
|
</div>
|
|
</div>
|
|
<p className="text-sm text-slate-600 mb-6">
|
|
Die SSO-Konfiguration <strong>"{config.name}"</strong> wird unwiderruflich geloescht.
|
|
Alle ueber diese Konfiguration provisionierten Benutzer verlieren den SSO-Zugang.
|
|
</p>
|
|
<div className="flex justify-end gap-3">
|
|
<button
|
|
onClick={onClose}
|
|
className="px-4 py-2 text-sm text-slate-600 hover:bg-slate-100 rounded-lg transition-colors"
|
|
>
|
|
Abbrechen
|
|
</button>
|
|
<button
|
|
onClick={handleDelete}
|
|
disabled={deleting}
|
|
className="px-4 py-2 text-sm text-white bg-red-600 hover:bg-red-700 rounded-lg font-medium transition-colors disabled:opacity-50 flex items-center gap-2"
|
|
>
|
|
{deleting && <Loader2 className="w-4 h-4 animate-spin" />}
|
|
Endgueltig loeschen
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|