| "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> | |
| ); | |
| } | |