From 83074519c0f7988b11237ef0925a6b95bc054c49 Mon Sep 17 00:00:00 2001
From: chimpdev <skyhancloud@gmail.com>
Date: Fri, 1 Nov 2024 11:45:36 +0300
Subject: [PATCH] fix(Authentication): delete token cookie on logout

---
 client/app/(account)/account/components/Content/index.jsx | 4 +++-
 client/app/(dashboard)/components/Sidebar/index.jsx       | 4 +++-
 client/app/components/Header/UserSide.jsx                 | 7 ++++++-
 server/src/server.js                                      | 1 +
 4 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/client/app/(account)/account/components/Content/index.jsx b/client/app/(account)/account/components/Content/index.jsx
index aa0dbffc..bba368a8 100644
--- a/client/app/(account)/account/components/Content/index.jsx
+++ b/client/app/(account)/account/components/Content/index.jsx
@@ -23,7 +23,7 @@ import { FaCompass, FaBell, FaShieldAlt, FaDiscord } from 'react-icons/fa';
 import { RiBrush2Fill, RiRobot2Fill } from 'react-icons/ri';
 import useAuthStore from '@/stores/auth';
 import { HiTemplate } from 'react-icons/hi';
-import { useLocalStorage, useMedia } from 'react-use';
+import { useCookie, useLocalStorage, useMedia } from 'react-use';
 import { PiWaveformBold } from 'react-icons/pi';
 import { FiLink } from 'react-icons/fi';
 import { useShallow } from 'zustand/react/shallow';
@@ -54,6 +54,7 @@ export default function Content() {
   const router = useRouter();
 
   const [themesPageVisited, setThemesPageVisited] = useLocalStorage('themes-page-visited', false);
+  const [,, deleteToken] = useCookie('token');
 
   function logOut() {
     toast.promise(logout(), {
@@ -61,6 +62,7 @@ export default function Content() {
       success: () => {
         setLoggedIn(false);
         setUser(null);
+        deleteToken(null);
 
         return 'Logged out successfully.';
       },
diff --git a/client/app/(dashboard)/components/Sidebar/index.jsx b/client/app/(dashboard)/components/Sidebar/index.jsx
index 62cd5aa1..dc1d6161 100644
--- a/client/app/(dashboard)/components/Sidebar/index.jsx
+++ b/client/app/(dashboard)/components/Sidebar/index.jsx
@@ -29,7 +29,7 @@ import CollapseIcon from '@/app/(dashboard)/components/Sidebar/Icons/Collapse';
 import { BiSolidChevronRight } from 'react-icons/bi';
 import Tooltip from '@/app/components/Tooltip';
 import Link from 'next/link';
-import { useMedia } from 'react-use';
+import { useCookie, useMedia } from 'react-use';
 import { useEffect } from 'react';
 import syncLemonSqueezyPlans from '@/lib/request/auth/syncLemonSqueezyPlans';
 
@@ -162,6 +162,7 @@ export default function Sidebar() {
   const user = useAuthStore(state => state.user);
   const setUser = useAuthStore(state => state.setUser);
   const setLoggedIn = useAuthStore(state => state.setLoggedIn);
+  const [,, deleteToken] = useCookie('token');
 
   function logOut() {
     toast.promise(logout(), {
@@ -169,6 +170,7 @@ export default function Sidebar() {
       success: () => {
         setLoggedIn(false);
         setUser(null);
+        deleteToken();
 
         return 'Logged out successfully.';
       },
diff --git a/client/app/components/Header/UserSide.jsx b/client/app/components/Header/UserSide.jsx
index ef8eaadc..c87516a2 100644
--- a/client/app/components/Header/UserSide.jsx
+++ b/client/app/components/Header/UserSide.jsx
@@ -1,10 +1,12 @@
+'use client';
+
 import useAuthStore from '@/stores/auth';
 import Link from 'next/link';
 import config from '@/config';
 import { usePathname } from 'next/navigation';
 import cn from '@/lib/cn';
 import { useEffect, useState } from 'react';
-import { useWindowScroll } from 'react-use';
+import { useCookie, useWindowScroll } from 'react-use';
 import { BiLogOut } from 'react-icons/bi';
 import logout from '@/lib/request/auth/logout';
 import { toast } from 'sonner';
@@ -17,6 +19,8 @@ export default function UserSide({ className }) {
   const user = useAuthStore(state => state.user);
   const setUser = useAuthStore(state => state.setUser);
   const setLoggedIn = useAuthStore(state => state.setLoggedIn);
+  const [,, deleteToken] = useCookie('token');
+
   const pathname = usePathname();
 
   const [open, setOpen] = useState(false);
@@ -32,6 +36,7 @@ export default function UserSide({ className }) {
       success: () => {
         setUser(null);
         setLoggedIn(false);
+        deleteToken();
 
         return 'Logged out successfully';
       },
diff --git a/server/src/server.js b/server/src/server.js
index 0e28f043..e4e06972 100644
--- a/server/src/server.js
+++ b/server/src/server.js
@@ -123,6 +123,7 @@ module.exports = class Server {
           next();
         } catch (error) {
           logger.error('There was an error verifying the token:', error);
+
           response.clearCookie('token');
 
           return response.sendError('Unauthorized', 401);