1
import { Trash2, TriangleAlert } from "lucide-react";
2
import { Button } from "@/client/components/ui/button";
3
 
4
export type DangerZoneCardProps = {
5
  defaultBranch: string;
6
  packList: string[];
7
  pending: Record<string, boolean>;
8
  purgeRepo: () => Promise<void>;
9
};
10
 
11
export function DangerZoneCard({
12
  defaultBranch,
13
  packList,
14
  pending,
15
  purgeRepo,
16
}: DangerZoneCardProps) {
17
  return (
18
    <details className="rounded-2xl border-2 border-red-500 bg-white dark:bg-zinc-900/50 p-5 sm:p-6 dark:border-red-600">
19
      <summary className="cursor-pointer font-bold text-red-600 dark:text-red-500">
20
        <TriangleAlert className="mr-2 inline h-4 w-4 align-[-2px]" aria-hidden="true" />
21
        Danger Zone - Irreversible Actions
22
      </summary>
23
      <div className="mt-6 space-y-4">
24
        <div className="rounded-xl border border-red-500/20 bg-red-500/10 p-4 text-sm text-red-400">
25
          <strong>Warning:</strong> These actions cannot be undone. All repository data will be
26
          permanently deleted.
27
        </div>
28
        <p className="text-sm text-zinc-600 dark:text-zinc-400">
29
          This will delete all objects, packs, references, and metadata associated with this
30
          repository. The repository will be removed from the owner registry.
31
        </p>
32
        <Button
33
          variant="danger"
34
          type="button"
35
          onClick={() => void purgeRepo()}
36
          disabled={pending["purge-repo"]}
37
        >
38
          <Trash2 className="mr-2 inline h-4 w-4 align-[-2px]" aria-hidden="true" />
39
          <span className="label">
40
            {pending["purge-repo"] ? "Deleting..." : "Permanently Delete Repository"}
41
          </span>
42
        </Button>
43
        <p className="text-zinc-500 dark:text-zinc-400 text-xs">
44
          Default branch: <code>{defaultBranch}</code>
45
        </p>
46
        {packList.length ? (
47
          <p className="text-zinc-500 dark:text-zinc-400 text-xs">
48
            Visible pack keys: {packList.length}
49
          </p>
50
        ) : null}
51
      </div>
52
    </details>
53
  );
54
}