import React from "react";
import OverlayBox from "./others/overlayBox";
import style from "./confirmBox.module.css";

const ConfirmBox = (props) => {
  const onSetResult = (result) => {
    console.log("result: ", result);
    if (result === true) if (props.onConfirm) props.onConfirm();

    props.onClose();
  };

  const Footer = () => {
    return (
      <div className={style.footer}>
        <button className="secondary-btn" onClick={() => onSetResult(false)}>
          Close
        </button>
        <button className="primary_btn" onClick={() => onSetResult(true)}>
          Confirm
        </button>
      </div>
    );
  };

  return (
    <OverlayBox
      open={true}
      close={onSetResult}
      footer={<Footer />}
      title="Confirmation"
      customClass={style.custom_confirm_class}
    >
      <p className={style.warnText}>
        {props.warn ? props.warn : "Are you sure you want to continue ?"}
      </p>
    </OverlayBox>
  );
};
export default ConfirmBox;
