added to remote repo

2026-05-21 08:18:29 +02:00
parent 8697c9f405
commit cc599b6e18
8049 changed files with 1096323 additions and 0 deletions
@@ -0,0 +1,49 @@
+import { AlertTriangle, X } from 'lucide-react';
+
+export function RestoreModal({ snapshot, vmName, confirmText, onCancel, onConfirm, onTextChange, busy }) {
+  if (!snapshot) return null;
+  const canConfirm = confirmText === vmName && !busy;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/70 p-4">
+      <div className="w-full max-w-lg rounded-md border border-red-900 bg-zinc-950 shadow-2xl">
+        <div className="flex items-center justify-between border-b border-red-950 px-4 py-3">
+          <div className="flex items-center gap-2 text-red-300">
+            <AlertTriangle className="h-5 w-5" />
+            <h2 className="text-sm font-semibold">Destructive Restore</h2>
+          </div>
+          <button className="rounded-md p-1 text-zinc-400 hover:text-zinc-100" onClick={onCancel} type="button">
+            <X className="h-5 w-5" />
+          </button>
+        </div>
+        <div className="space-y-4 p-4">
+          <p className="text-sm leading-6 text-zinc-300">
+            Warning: The VM will be stopped and the current disk will be irreversibly overwritten with
+            snapshot <span className="font-mono text-red-200">{snapshot.id.slice(0, 8)}</span>.
+          </p>
+          <label className="block text-sm text-zinc-300">
+            Type <span className="font-mono text-zinc-100">{vmName}</span> to confirm.
+            <input
+              className="mt-2 h-10 w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 text-zinc-100 outline-none focus:border-red-500"
+              onChange={(event) => onTextChange(event.target.value)}
+              value={confirmText}
+            />
+          </label>
+          <div className="flex justify-end gap-2">
+            <button className="h-9 rounded-md border border-zinc-700 px-3 text-sm text-zinc-200" onClick={onCancel} type="button">
+              Cancel
+            </button>
+            <button
+              className="h-9 rounded-md border border-red-700 bg-red-950 px-3 text-sm text-red-100 hover:bg-red-900 disabled:hover:bg-red-950"
+              disabled={!canConfirm}
+              onClick={onConfirm}
+              type="button"
+            >
+              Confirm Restore
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}