Alert dialog

import { AlertDialog, AlertDialogClose, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from '@/ui/alert-dialog';
import { Button } from '@/ui/button';

<AlertDialog>
    <AlertDialogTrigger render={<Button variant="destructive" size="md">Delete</Button>} />
    <AlertDialogContent>
        <AlertDialogHeader icon="trash" tone="danger">
            <AlertDialogTitle>Delete this chat?</AlertDialogTitle>
            <AlertDialogDescription>The chat and its attestations are removed from every device.</AlertDialogDescription>
        </AlertDialogHeader>
        <AlertDialogFooter>
            <AlertDialogClose render={<Button variant="secondary" size="md">Cancel</Button>} />
            <AlertDialogClose render={<Button variant="destructive" size="md">Delete</Button>} />
        </AlertDialogFooter>
    </AlertDialogContent>
</AlertDialog>