From daff197012fa784303a21e7548228b4ddd950601 Mon Sep 17 00:00:00 2001
From: haraseessingh <harasees1202@gmail.com>
Date: Sat, 4 Nov 2023 18:17:05 +0530
Subject: [PATCH] added logout confirmation

---
 components/common/DialogPopup/DialogPopup.tsx | 5 +++--
 components/dashboard/SidebarItem.tsx          | 8 +++++++-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/components/common/DialogPopup/DialogPopup.tsx b/components/common/DialogPopup/DialogPopup.tsx
index 95d2388f9..aed90f34e 100644
--- a/components/common/DialogPopup/DialogPopup.tsx
+++ b/components/common/DialogPopup/DialogPopup.tsx
@@ -8,13 +8,14 @@ type Props = {
     errorTitle: string;
     errorDescription: string;
     handleClose: any;
+    handleAction: any;
 }
 
 const font = Josefin_Sans({
     preload: false
 });
 
-function DialogPopup({ icon, errorTitle, errorDescription, handleClose }: Props) {
+function DialogPopup({ icon, errorTitle, errorDescription, handleClose, handleAction }: Props) {
 
     return (
         <Dialog
@@ -31,7 +32,7 @@ function DialogPopup({ icon, errorTitle, errorDescription, handleClose }: Props)
                     <div className={`${styles.text} ${font.className}`}> {errorDescription} </div>
                 </div>
                 
-                <button onClick={handleClose}> OK </button>
+                <button onClick={handleAction ?? handleClose}> OK </button>
             </div>
         </Dialog>
     )
diff --git a/components/dashboard/SidebarItem.tsx b/components/dashboard/SidebarItem.tsx
index 80224bed7..ed88ac243 100644
--- a/components/dashboard/SidebarItem.tsx
+++ b/components/dashboard/SidebarItem.tsx
@@ -6,7 +6,9 @@ import { useRouter } from "next/router";
 import { Common } from "../../constants/common";
 import { useLocalStorage } from "usehooks-ts";
 import logout from "../../lib/logout";
+import { useState } from "react"
 import { useSession } from "next-auth/react";
+import DialogPopup from "../common/DialogPopup/DialogPopup";
 
 type Item = {
     title: string;
@@ -21,6 +23,8 @@ export const SidebarItem = (item: Item) => {
 
     const selected = router.pathname === item.path ? "true" : "false";
 
+    const [showLogoutDialog, setShowLogoutDialog] = useState(false);
+
     // const logout = () => {
     //     setAuthorization(null);
     //     destroyCookie(null, Common.AUTHORIZATION, {
@@ -34,10 +38,12 @@ export const SidebarItem = (item: Item) => {
 
     if (item.logout) {
         return (
+            showLogoutDialog ? 
+            <DialogPopup errorDescription="are you sure you want to logout ?" handleAction={() => logout(router, session)} handleClose={ () => setShowLogoutDialog(false)} /> :
             <button
                 className={styles.sidebarItem}
                 aria-label={item.title}
-                onClick={() => logout(router, session)}
+                onClick={() => setShowLogoutDialog(true)}
             >
                 {item.icon}
                 <h3>{item.title}</h3>