import React, { useEffect, useState } from "react";
import "./Logout_Modal.css";
import Orange_Btn from "../../common_btn/orange_btn/Orange_Btn";
import Gray_Btn from "../../common_btn/gray_btn/Gray_Btn";
import { Modal } from "react-bootstrap";
import { useDispatch, useSelector } from "react-redux";
import { logout, setIsSignedOut } from "../../../../features/auth/authSlice";
import Cookies from "js-cookie";

import { getAllCart } from "../../../../features/cart/cartSlice";
import { getAllWishlist } from "../../../../features/wishlist/wishlistSlice";
import Success_Modal from "../success_modal/Success_Modal";
import Success_Modal_LogOut from "../success_modal/Success_Modal_logOut";
import Green_btn from "../../common_btn/green_btn/Green_btn";
import { appSetup } from "../../../../features/master/masterSlice";
import { useRouter } from "next/navigation";
import { myAccount } from "../../../../features/my_account/Slice";
const Logout_Modal = (props) => {
  const dispatch = useDispatch();
  const navigate = useRouter();
  const isSignin = useSelector((state) => state.auth.is_signin);

  const [showSuccess, setShowSuccess] = useState(false);

  const handleCloseLogout = async () => {
    props?.onHide();
    setShowSuccess(true);

    Cookies.remove("shreeram_agro_security");
    dispatch(setIsSignedOut());
    dispatch(getAllCart(false));
    dispatch(getAllWishlist());
    // dispatch(myAccount());

    setTimeout(() => {
      setShowSuccess(false);
      navigate.push("/");
    }, 2000);
  };

  const app_setup = useSelector((state) => state.master.app_setup);

  return (
    <>
      <Modal className="Logout_Modal" {...props} centered>
        <Modal.Body>
          <p className="modal_title">Are you sure you want to log out? </p>

          <div className="btn_holder">
            <Gray_Btn
              btnText={"No"}
              onClick={() => {
                props?.onHide();
              }}
            />
            <Green_btn
              btnText="Yes"
              onClick={() => {
                handleCloseLogout();
              }}
            />
          </div>
        </Modal.Body>
      </Modal>
      <Success_Modal_LogOut
        show={showSuccess}
        onHide={() => {
          setShowSuccess(false);
        }}
        successText="LogOut Successful!"
      />
    </>
  );
};

export default Logout_Modal;
