"use client";

import AppContext from "@ctx/AppContext";
import { useRouter } from "next/navigation";
import { useContext } from "react";
import { BottomSheet } from "react-spring-bottom-sheet";

const BottomSheetLogOut = ({ id }) => {
  const CTX = useContext(AppContext);
  const cart = CTX.state.cart;
  const router = useRouter();

  const handleLogOut = async () => {
    localStorage.removeItem("token");
    CTX.setProfile([]);
    CTX.setBottomSheetLogOutOpen(false);
    router.push("/");
  };

  return (
    <BottomSheet
      open={CTX.state.bottomSheetLogOutOpen}
      onDismiss={() => CTX.setBottomSheetLogOutOpen(false)}
      className={"z-50 relative"}
    >
      <div className="text-center p-3">
        <p className="mb-0 text-sm  pb-3">
          آیا از خروج حساب کاربری اطمینان دارید ؟{" "}
        </p>
      </div>

      <div className="xs:w-full lg:w-3/12 mx-auto p-3 ">
        <button
          className="btn bg-red-500 text-white text-sm w-full py-3 rounded-3xl"
          onClick={() => handleLogOut()}
        >
          خروج{" "}
        </button>
      </div>
    </BottomSheet>
  );
};

export default BottomSheetLogOut;