From 0d92da9446f40d505bf92103b786a4cffdf98e99 Mon Sep 17 00:00:00 2001
From: sushant dhimal <sushant07.dhimal@gmail.com>
Date: Thu, 16 Mar 2023 14:25:52 +0545
Subject: [PATCH] add: logout functionality in larger devices - add logout
 functionality in devices with width > 1024px

---
 client/src/components/NavLink.jsx | 21 ++++++++++++++++++---
 client/src/context/AuthReducer.js |  5 +++++
 client/src/pages/Home.jsx         | 22 ++++++++++++++++++++++
 3 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/client/src/components/NavLink.jsx b/client/src/components/NavLink.jsx
index 6ec55d5..c53eaf1 100644
--- a/client/src/components/NavLink.jsx
+++ b/client/src/components/NavLink.jsx
@@ -1,13 +1,28 @@
-import React from "react";
+import React, { useContext } from "react";
+import { signOut } from "firebase/auth";
+import { auth } from "../firebase.config";
+import { AuthContext } from "../context/AuthContext";
 
 const NavLinks = ({ svg, link, text, setChatLog }) => {
-  const handleClick = (text) => {
+  const { dispatch } = useContext(AuthContext);
+
+  const handleClick = async (text) => {
     if (text === "Clear Conversations") setChatLog([]);
+    if (text === "Log out") {
+      try {
+        let logOut = await signOut(auth);
+        console.log("logOut", logOut);
+        dispatch({ type: "LOGOUT" });
+      } catch (error) {
+        console.log("error happen during sign out", error);
+      }
+    }
   };
+
   return (
     <a
       href={link}
-      target="_blank"
+      target={link && "_blank"}
       rel="noreferrer"
       style={{ textDecoration: "none" }}
       onClick={() => handleClick(text)}
diff --git a/client/src/context/AuthReducer.js b/client/src/context/AuthReducer.js
index 2ef33d5..fa51796 100644
--- a/client/src/context/AuthReducer.js
+++ b/client/src/context/AuthReducer.js
@@ -12,6 +12,11 @@ function AuthReducer(state, action) {
         currentUser: action.payload,
       };
     }
+    case "LOGOUT": {
+      return {
+        currentUser: "",
+      };
+    }
     default: {
       return state;
     }
diff --git a/client/src/pages/Home.jsx b/client/src/pages/Home.jsx
index e4640df..c666ddc 100644
--- a/client/src/pages/Home.jsx
+++ b/client/src/pages/Home.jsx
@@ -91,6 +91,7 @@ const Home = () => {
         </div>
         <h1>TalkBot</h1>
       </header>
+
       {showMenu && (
         <nav>
           <div className="navItems">
@@ -225,6 +226,27 @@ const Home = () => {
           text="Updates & FAQ"
           link="https://help.openai.com/en/collections/3742473-chatgpt"
         />
+        <NavLinks
+          svg={
+            <svg
+              viewBox="0 0 24 24"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+              width={25}
+              height={25}
+            >
+              <path
+                d="m16 17 5-5m0 0-5-5m5 5H9m0-9H7.8c-1.68 0-2.52 0-3.162.327a3 3 0 0 0-1.311 1.311C3 5.28 3 6.12 3 7.8v8.4c0 1.68 0 2.52.327 3.162a3 3 0 0 0 1.311 1.311C5.28 21 6.12 21 7.8 21H9"
+                stroke="#fff"
+                strokeWidth={2}
+                strokeLinecap="round"
+                strokeLinejoin="round"
+              />
+            </svg>
+          }
+          text="Log out"
+          link=""
+        />
       </aside>
 
       <section className="chatBox">