import {
    Button,
    Dialog,
    DialogActions,
    DialogContent,
    DialogContentText,
    DialogTitle,
    IconButton,
    Tooltip
} from "@mui/material";
import DeleteIcon from '@mui/icons-material/Delete';
import {useState} from "react";
import {DELETE_EXPERT_MANAGEMENT} from "@/core/data/apiRoutes";
import useRequest from "@/lib/app/hooks/useRequest";
import {useTranslations} from "next-intl";

const Delete = ({rowId, mutate}) => {
    const t = useTranslations();
    const requestServer = useRequest({auth: true});
    const [openDeleteDialog, setOpenDeleteDialog] = useState(false);
    const [isSubmitting, setIsSubmitting] = useState(false);

    const handleDelete = () => {
        setIsSubmitting(true)
        requestServer(`${DELETE_EXPERT_MANAGEMENT}/${rowId}`, 'post')
            .then((response) => {
                mutate()
            })
            .catch(() => {
            })
            .finally(() => {
                setIsSubmitting(false)
                setOpenDeleteDialog(false);
            });
    };

    return (
        <>
            <Tooltip title={t("ExpertMangement.delete_tooltip")}>
                <IconButton
                    color="primary"
                    onClick={() => {
                        setOpenDeleteDialog(true);
                    }}
                >
                    <DeleteIcon/>
                </IconButton>
            </Tooltip>
            <Dialog
                open={openDeleteDialog}
                PaperProps={{
                    sx: {
                        boxShadow: 'rgba(60, 64, 67, 0.3) 0px 1px 16px 0px, rgba(60, 64, 67, 0.15) 0px 1px 10px 0px'
                    }
                }}
            >
                <DialogTitle>{t("ExpertMangement.delete_expert")}</DialogTitle>
                <DialogContent>
                    <DialogContentText>{t("ExpertMangement.are_you_sure_text")}</DialogContentText>
                </DialogContent>
                <DialogActions>
                    <Button onClick={() => setOpenDeleteDialog(false)} color="secondary" autoFocus>
                        {t("ExpertMangement.button_close")}
                    </Button>
                    <Button onClick={handleDelete} variant="contained" color="primary" disabled={isSubmitting}>
                        {t("ExpertMangement.button_delete")}
                    </Button>
                </DialogActions>
            </Dialog>
        </>
    );
};
export default Delete;