import React, { useContext } from "react";
import { Grid } from "../../../../components/grid/Grid";
import { Button, Typography } from "@mui/material";
import {
  CLOSE_MODAL,
  LOADING_END,
  LOADING_START,
} from "../../../../lib/redux/slices/appSlice";
import { useDispatch } from "react-redux";
import { SPACING } from "../../../../data/spacing";
import { vetFarmDeleteBarService } from "../../services/vet-farm-delete-bar";
import { AppContext } from "../../../../contexts/AppContext";

export const VetFarmDeleteBar = ({ updateTable, item }) => {
  const dispatch = useDispatch();
  const [openNotif] = useContext(AppContext);
  return (
    <Grid container xs={12} justifyContent="center">
      <Typography variant="body2" color="error">
        پس از حذف امکان بازگشت تغییرات مقدور نیست!
      </Typography>
      <Grid
        container
        gap={SPACING.SMALL}
        xs={12}
        mt={2}
        justifyContent="center"
      >
        <Button
          color="error"
          variant="contained"
          onClick={() => {
            if (!item?.barCode) {
              openNotif({
                vertical: "top",
                horizontal: "center",
                msg: "کد بار یافت نشد!",
                severity: "error",
              });
              return;
            }

            dispatch(LOADING_START());
            dispatch(vetFarmDeleteBarService({ bar_code: item.barCode }))
              .then((r) => {
                if (r?.error || r?.payload?.error) {
                  const errorMsg = r.payload?.error || r.error?.message || "";
                  const is500Error =
                    errorMsg.includes("500") ||
                    r.error?.status === 500 ||
                    r.error?.statusCode === 500;

                  if (is500Error) {
                    openNotif({
                      vertical: "top",
                      horizontal: "center",
                      msg: "مشکلی در دریافت اطلاعات پیش آمده است!",
                      severity: "error",
                    });
                  } else {
                    openNotif({
                      vertical: "top",
                      horizontal: "center",
                      msg: errorMsg || "مشکلی در حذف بار پیش آمده است!",
                      severity: "error",
                    });
                  }
                } else {
                  if (updateTable && typeof updateTable === "function") {
                    updateTable();
                  }
                  dispatch(CLOSE_MODAL());
                  openNotif({
                    vertical: "top",
                    horizontal: "center",
                    msg: "عملیات با موفقیت انجام شد.",
                    severity: "success",
                  });
                }
              })
              .catch((error) => {
                console.error("Error deleting bar:", error);
                const errorMessage = error?.message || "";
                const status = error?.response?.status;
                const is500Error =
                  errorMessage.includes("500") || status === 500;

                openNotif({
                  vertical: "top",
                  horizontal: "center",
                  msg: is500Error
                    ? "مشکلی در دریافت اطلاعات پیش آمده است!"
                    : "مشکلی در حذف بار پیش آمده است!",
                  severity: "error",
                });
              })
              .finally(() => {
                dispatch(LOADING_END());
              });
          }}
        >
          بله
        </Button>
        <Button
          variant="outlined"
          onClick={() => {
            dispatch(CLOSE_MODAL());
          }}
        >
          خیر
        </Button>
      </Grid>
    </Grid>
  );
};
