ConfirmDialog

"use client";

import { ConfirmDialog } from "@dashboardpack/core/components/shared/confirm-dialog";
import { Button } from "@dashboardpack/core/components/ui/button";
import { useState } from "react";

export default function ConfirmDialogExample() {
  const [open, setOpen] = useState(false);
  const [destructive, setDestructive] = useState(false);
  const [result, setResult] = useState(
    "Choose an action to open a confirmation.",
  );
  return (
    <div className="space-y-4">
      <div className="flex flex-wrap gap-3">
        <Button
          variant="outline"
          onClick={() => {
            setDestructive(false);
            setOpen(true);
          }}
        >
          Publish report
        </Button>
        <Button
          variant="destructive"
          onClick={() => {
            setDestructive(true);
            setOpen(true);
          }}
        >
          Delete project
        </Button>
      </div>
      <ConfirmDialog
        open={open}
        onOpenChange={setOpen}
        title={destructive ? "Delete this project?" : "Publish this report?"}
        description={
          destructive
            ? "This is a local preview. No real project will be deleted."
            : "This is a local preview. No report will be published."
        }
        confirmLabel={destructive ? "Delete project" : "Publish report"}
        variant={destructive ? "destructive" : "default"}
        onConfirm={() =>
          setResult(
            destructive
              ? "Project deleted in preview."
              : "Report published in preview.",
          )
        }
      />
      <p role="status" className="text-sm text-muted-foreground">
        {result}
      </p>
    </div>
  );
}