51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import { type ReactNode, useState } from "react";
|
|
import { Checkbox } from "../ui/checkbox";
|
|
import { Label } from "../ui/label";
|
|
import { ConfirmAlert } from "./confirm-alert";
|
|
|
|
export function ConfirmDeleteAlert({
|
|
children,
|
|
title = "Confirm Delete",
|
|
data,
|
|
onConfirm,
|
|
}: {
|
|
children: ReactNode;
|
|
title?: string;
|
|
data: IProduct;
|
|
onConfirm: (unlist: boolean) => void | Promise<void>;
|
|
}) {
|
|
const [unlist, setUnlist] = useState(false);
|
|
|
|
return (
|
|
<ConfirmAlert
|
|
title={title}
|
|
description={
|
|
<div className="space-y-2">
|
|
<p className="text-sm text-muted-foreground">
|
|
This action will permanently delete the item. You can also choose to
|
|
unlist it before deleting.
|
|
</p>
|
|
|
|
{data.status && (
|
|
<div className="flex items-start gap-3">
|
|
<Checkbox
|
|
id="unlist-option"
|
|
checked={unlist}
|
|
onCheckedChange={(checked) => setUnlist(!!checked)}
|
|
/>
|
|
<div className="grid gap-1">
|
|
<Label htmlFor="unlist-option" className="font-medium">
|
|
Also unlist this item before deletion
|
|
</Label>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
}
|
|
onConfirm={() => onConfirm(unlist)}
|
|
>
|
|
{children}
|
|
</ConfirmAlert>
|
|
);
|
|
}
|