68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
'use client';
|
|
|
|
import { Button } from './ui/button';
|
|
import { AlertTriangle } from 'lucide-react';
|
|
import { useRegisterModal } from './modal/ModalStackProvider';
|
|
|
|
interface BackupWarningModalProps {
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
onProceed: () => void;
|
|
}
|
|
|
|
export function BackupWarningModal({
|
|
isOpen,
|
|
onClose,
|
|
onProceed
|
|
}: BackupWarningModalProps) {
|
|
useRegisterModal(isOpen, { id: 'backup-warning-modal', allowEscape: true, onClose });
|
|
|
|
if (!isOpen) return null;
|
|
|
|
return (
|
|
<div className="fixed inset-0 backdrop-blur-sm bg-black/50 flex items-center justify-center z-50 p-4">
|
|
<div className="bg-card rounded-lg shadow-xl max-w-md w-full border border-border">
|
|
{/* Header */}
|
|
<div className="flex items-center justify-center p-6 border-b border-border">
|
|
<div className="flex items-center gap-3">
|
|
<AlertTriangle className="h-8 w-8 text-warning" />
|
|
<h2 className="text-2xl font-bold text-card-foreground">Backup Failed</h2>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Content */}
|
|
<div className="p-6">
|
|
<p className="text-sm text-muted-foreground mb-6">
|
|
The backup failed, but you can still proceed with the update if you wish.
|
|
<br /><br />
|
|
<strong className="text-foreground">Warning:</strong> Proceeding without a backup means you won't be able to restore the container if something goes wrong during the update.
|
|
</p>
|
|
|
|
{/* Action Buttons */}
|
|
<div className="flex flex-col sm:flex-row justify-end gap-3">
|
|
<Button
|
|
onClick={onClose}
|
|
variant="outline"
|
|
size="default"
|
|
className="w-full sm:w-auto"
|
|
>
|
|
Cancel
|
|
</Button>
|
|
<Button
|
|
onClick={onProceed}
|
|
variant="default"
|
|
size="default"
|
|
className="w-full sm:w-auto bg-warning hover:bg-warning/90"
|
|
>
|
|
Proceed Anyway
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
|
|
|