Alert Dialog

import { Button } from "@/components/button";import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from "@/components/alert-dialog";
export function AlertDialogUsage({ deleteProject }: { deleteProject: () => void }) {  return (    <AlertDialog>      <AlertDialogTrigger render={<Button variant="destructive" />}>Delete project</AlertDialogTrigger>      <AlertDialogContent>        <AlertDialogHeader>          <AlertDialogTitle>Delete “Atlas”?</AlertDialogTitle>          <AlertDialogDescription>Its 12 briefs are deleted too. This can’t be undone.</AlertDialogDescription>        </AlertDialogHeader>        <AlertDialogFooter>          <AlertDialogCancel>Cancel</AlertDialogCancel>          <AlertDialogAction variant="destructive" onClick={deleteProject}>            Delete project          </AlertDialogAction>        </AlertDialogFooter>      </AlertDialogContent>    </AlertDialog>  );}