From 8769bb55dc641d716110f3ebf7192dd5aafa3fe9 Mon Sep 17 00:00:00 2001
From: Bahugunajii <amanbahuguna009@gmail.com>
Date: Fri, 22 Dec 2023 14:29:14 +0530
Subject: [PATCH 1/3] Added logout button

---
 assets/profile.png    | Bin 0 -> 524 bytes
 components/TopBar.tsx |  29 ++++++++++++++++++++++++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)
 create mode 100644 assets/profile.png

diff --git a/assets/profile.png b/assets/profile.png
new file mode 100644
index 0000000000000000000000000000000000000000..1613774e3fb1af7c72b1df70ab605fbe186418bb
GIT binary patch
literal 524
zcmV+n0`vWeP)<h;3K|Lk000e1NJLTq000>P000>X1^@s6#OZ}&00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0ij7mK~#7Ft(MO#
z1YsP;zsb$PIw%)4R~K>?wxpDhv&czKTDhPt*3E&<UqCJ{4sLtI#npuq+oUBTtQ19g
zJ+FPHeN8*FGxP4Jp5B@FeZJ54ZJJ*q5l~8{p(E%;Rd|H<p&@Am2+FJfy!p=aVgmwl
z40?uEpcLm*&@AL~eN&Qv!fpoKKu&<ifnMoLOI%R2$Kv@qzIFO`BtesN7CUu(?etwq
zf+i(h8PTgL1+6!Q)Rr0GNO*%T9^NKtQs6iz;Vg2zkhoxn9nc5#1C0lGMvdpiktCon
zV}$HNgS>6~plxF<D>fkDK!tNGNkQ=dbm<E$aqiwX??SzC8)S`u6KG2Dm121Gt7S%2
zUoD!os0~()qD;h^CFna+4GcXr>Vh$efvS8CJo>|oE=|jl09Cyk&w>n-G!(@G)SohE
z*qbw-_z8|1V#guJX{oV;B6rX!7VxgqJk(m$JV^sU&K>jqu2d5zTe)7A#_-9p#oyig
zjE;x}x}G_%H`i>e=OF#(QGnqc<CnxoUzs)@Z%M!|^dHEzvcrWI%-mlDQ-zbaTE1ie
O0000<MNUMnLSTX!<ly!I

literal 0
HcmV?d00001

diff --git a/components/TopBar.tsx b/components/TopBar.tsx
index 8adc286..e9e6a6d 100644
--- a/components/TopBar.tsx
+++ b/components/TopBar.tsx
@@ -1,11 +1,16 @@
 "use client";
 
+import { useState } from "react";
 import { usePathname } from "next/navigation";
 import CurrentTime from "./CurrentTime";
 import { useAuth } from "@/services/AuthContext";
+import ProfileIcon from '../assets/profile.png';
+import Image from "next/image";
+import { deleteCookie } from "cookies-next";
 
 const TopBar = () => {
   const { userName } = useAuth();
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
   const routeNames: { [key: string]: string } = {
     '/reports': 'Report',
     '/library': 'Library',
@@ -15,11 +20,33 @@ const TopBar = () => {
   const pathname = usePathname();
   const routeName = routeNames[pathname] || <p>Welcome, <br /> Shagun Panday <br /> </p>;
 
+  const toggleDropdown = () => {
+    setIsDropdownOpen(!isDropdownOpen);
+  };
+
+  const handleLogout = () => {
+    deleteCookie("access_token");
+    deleteCookie("refresh_token");
+  };
+
   return (
     <div className="max-w-xl mx-auto text-white p-4 h-32 justify-between items-center bg-primary">
       <CurrentTime className="text-sm mb-4" />
-      <div className="mt-6 text-lg font-semibold">
+      <div className="mt-6 text-lg font-semibold justify-between flex mr-4 items-center">
         {routeName}
+        <div className="relative">
+          <Image
+            src={ProfileIcon}
+            alt="Profile"
+            className="w-6 h-6 cursor-pointer"
+            onClick={toggleDropdown}
+          />
+          {isDropdownOpen && (
+            <div className="absolute top-full right-1 bg-white p-2 shadow-md text-black rounded-lg text-base">
+              <button onClick={handleLogout}>Logout</button>
+            </div>
+          )}
+        </div>
       </div>
       <div className="flex items-center space-x-4"></div>
     </div>

From 16620176f5901ae1e4ef9328d077f96416ba0c34 Mon Sep 17 00:00:00 2001
From: Bahugunajii <amanbahuguna009@gmail.com>
Date: Fri, 22 Dec 2023 15:17:53 +0530
Subject: [PATCH 2/3] fixed alignment

---
 components/TopBar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/TopBar.tsx b/components/TopBar.tsx
index a72c5b5..05c75ef 100644
--- a/components/TopBar.tsx
+++ b/components/TopBar.tsx
@@ -42,7 +42,7 @@ const TopBar = () => {
             onClick={toggleDropdown}
           />
           {isDropdownOpen && (
-            <div className="absolute top-full right-1 bg-white p-2 shadow-md text-black rounded-lg text-base">
+            <div className="absolute top-full right-1 bg-white p-2 shadow-md text-black rounded-lg text-base w-32 grid grid-cols-1 gap-2">
               <button onClick={handleLogout}>Logout</button>
             </div>
           )}

From cfb8735256f0322d238cab9f83b217dab0f267d6 Mon Sep 17 00:00:00 2001
From: Bahugunajii <amanbahuguna009@gmail.com>
Date: Fri, 22 Dec 2023 15:41:10 +0530
Subject: [PATCH 3/3] made page to reload once token gets deleted

---
 components/TopBar.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/TopBar.tsx b/components/TopBar.tsx
index 05c75ef..a20eaa9 100644
--- a/components/TopBar.tsx
+++ b/components/TopBar.tsx
@@ -27,6 +27,7 @@ const TopBar = () => {
   const handleLogout = () => {
     deleteCookie("access_token");
     deleteCookie("refresh_token");
+    window.location.reload();
   };
 
   return (