import React from "react";
import { useContext, useEffect } from "react";
import { Container } from "react-bootstrap";
import MyNavbar from "../components/MyNavbar";
import UserContext from "../contexts/UserContext";
import { makeRequest } from "../utils.ts";

const LogoutPage = () => {
  const { setCurrentUser } = useContext(UserContext);
  useEffect(() => {
    const cleanup = async () => {
      await makeRequest({
        url: "http://localhost:5000/logout",
        method: "POST",
      });

      await setCurrentUser({});
      localStorage.removeItem("currentUser");
      window.location.href = "/login";
    };
    cleanup();
  }, []);

  return (
    <React.Fragment>
      <MyNavbar />
      <Container>Logging you out...</Container>
    </React.Fragment>
  );
};

export default LogoutPage;
