File size: 2,000 Bytes
65d68f5 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | "use client";
export function MaterialDeletePrompt({
title,
deleting,
error,
onConfirm,
onCancel,
}: {
title: string;
deleting: boolean;
error: string | null;
onConfirm: () => void;
onCancel: () => void;
}) {
const titleId = `delete-source-title-${title.replace(/[^a-z0-9]+/gi, "-").toLowerCase()}`;
const descriptionId = `${titleId}-description`;
return (
<div
role="alertdialog"
aria-labelledby={titleId}
aria-describedby={descriptionId}
className="rounded-xl border border-red-200 bg-red-50 px-3 py-3 dark:border-red-400/25 dark:bg-red-400/[0.06]"
>
<p
id={titleId}
className="text-[11px] font-bold leading-4 text-red-800 dark:text-red-200"
>
Delete “{title}”?
</p>
<p
id={descriptionId}
role={error ? "alert" : undefined}
className="mt-1 text-[10px] leading-4 text-red-700 dark:text-red-300"
>
{error ??
"This permanently removes the source, extracted text, linked chats, PYQ evidence, quizzes, flashcards, and generated notes. Finished videos remain saved."}
</p>
<div className="mt-2 flex items-center justify-end gap-1.5">
<button
type="button"
onClick={onConfirm}
disabled={deleting}
className="h-11 shrink-0 rounded-lg bg-red-600 px-3.5 text-[11px] font-semibold text-white hover:bg-red-700 disabled:cursor-wait disabled:opacity-60"
>
{deleting
? error
? "Retrying…"
: "Deleting…"
: error
? "Retry"
: "Delete"}
</button>
<button
type="button"
onClick={onCancel}
disabled={deleting}
className="h-11 shrink-0 rounded-lg px-3 text-[11px] font-semibold text-neutral-500 hover:text-neutral-950 disabled:opacity-60 dark:hover:text-white"
>
Keep source
</button>
</div>
</div>
);
}
|