From 8600826afa0180de96b422981fe565562895ae79 Mon Sep 17 00:00:00 2001
From: Jagraj Aulakh <aulakhjagraj@gmail.com>
Date: Sun, 19 Mar 2023 15:10:10 -0400
Subject: [PATCH] #21 Made logout page

---
 frontend/src/App.js               |  2 ++
 frontend/src/pages/LogoutPage.jsx | 24 ++++++++++++++++++++++++
 2 files changed, 26 insertions(+)
 create mode 100644 frontend/src/pages/LogoutPage.jsx

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 7a5767a..4b2861f 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -3,6 +3,7 @@ import { Route } from "wouter";
 import HomePage from "./pages/HomePage";
 import LoginPage from "./pages/LoginPage";
 import { UserContextProvider } from "./contexts/UserContext";
+import LogoutPage from "./pages/LogoutPage";
 
 function App() {
   return (
@@ -10,6 +11,7 @@ function App() {
       <UserContextProvider>
         <Route path="/" component={HomePage} />
         <Route path="/login" component={LoginPage} />
+        <Route path="/logout" component={LogoutPage} />
       </UserContextProvider>
     </div>
   );
diff --git a/frontend/src/pages/LogoutPage.jsx b/frontend/src/pages/LogoutPage.jsx
new file mode 100644
index 0000000..617ec5c
--- /dev/null
+++ b/frontend/src/pages/LogoutPage.jsx
@@ -0,0 +1,24 @@
+import { useContext, useEffect } from "react";
+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 <div></div>;
+};
+
+export default LogoutPage;