"use client";

import Button from "@mui/material/Button";
import Dialog from "@mui/material/Dialog";
import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";

import type { Stakeholder } from "@/features/stakeholder/stakeholder-data";

type DeleteStakeholderDialogProps = {
  stakeholder: Stakeholder | null;
  isDeleting: boolean;
  onClose: () => void;
  onConfirm: () => Promise<void>;
};

export function DeleteStakeholderDialog({
  stakeholder,
  isDeleting,
  onClose,
  onConfirm,
}: DeleteStakeholderDialogProps) {
  return (
    <Dialog
      open={Boolean(stakeholder)}
      onClose={isDeleting ? undefined : onClose}
      fullWidth
      maxWidth="xs"
      slotProps={{
        paper: {
          sx: { borderRadius: "14px" },
        },
      }}
    >
      <DialogTitle sx={{ fontSize: 20, fontWeight: 700 }}>
        Delete Stakeholder
      </DialogTitle>

      <DialogContent>
        <DialogContentText>
          Are you sure you want to delete{" "}
          <strong>{stakeholder?.name ?? "this stakeholder"}</strong>? This will
          remove it from the active stakeholder list.
        </DialogContentText>
      </DialogContent>

      <DialogActions sx={{ px: 3, pb: 3 }}>
        <Button
          onClick={onClose}
          disabled={isDeleting}
          sx={{ textTransform: "none", fontWeight: 700 }}
        >
          Cancel
        </Button>

        <Button
          onClick={onConfirm}
          variant="contained"
          color="error"
          disabled={isDeleting}
          sx={{ textTransform: "none", fontWeight: 700 }}
        >
          {isDeleting ? "Deleting..." : "Delete"}
        </Button>
      </DialogActions>
    </Dialog>
  );
}