From 1ebd16efe08e6ce70667df210f64dcdef29e4032 Mon Sep 17 00:00:00 2001
From: edwin6666 <edwinmendoza0620@gmail.com>
Date: Fri, 7 Jul 2023 11:15:29 -0400
Subject: [PATCH 1/2] Feat: logout option only if a user exists

---
 src/components/Navbar/Navbar.jsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/components/Navbar/Navbar.jsx b/src/components/Navbar/Navbar.jsx
index a4513fb..3fd1ef7 100644
--- a/src/components/Navbar/Navbar.jsx
+++ b/src/components/Navbar/Navbar.jsx
@@ -1,12 +1,14 @@
 import React, { useState } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faSignOutAlt } from '@fortawesome/free-solid-svg-icons';
-import { Link } from 'react-router-dom';
+import { Link, useLocation } from 'react-router-dom';
 
 const Navbar = () => {
+  const location = useLocation();
+  const isLoginPage = location.pathname === '/login';
+
   const handleLogout = () => {
-   
-    window.location= "/login";
+    window.location = "/login";
   };
 
   const [open, setOpen] = useState(true);
@@ -58,11 +60,13 @@ const Navbar = () => {
             >
               Contact
             </Link>
-            <div className="relative" onClick={() => setOpen(false)}>
-              <button className="flex flex-row text-gray-900 bg-gray-200 items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:focus:bg-gray-600 dark-mode:hover:bg-gray-600 md:w-auto md:inline md:mt-0 md:ml-4 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline" onClick={handleLogout}>
-                logout <FontAwesomeIcon icon={faSignOutAlt} />
-              </button>
-            </div>
+            {!isLoginPage && (
+              <div className="relative" onClick={() => setOpen(false)}>
+                <button className="flex flex-row text-gray-900 bg-gray-200 items-center w-full px-4 py-2 mt-2 text-sm font-semibold text-left bg-transparent rounded-lg dark-mode:bg-transparent dark-mode:focus:text-white dark-mode:hover:text-white dark-mode:focus:bg-gray-600 dark-mode:hover:bg-gray-600 md:w-auto md:inline md:mt-0 md:ml-4 hover:text-gray-900 focus:text-gray-900 hover:bg-gray-200 focus:bg-gray-200 focus:outline-none focus:shadow-outline" onClick={handleLogout}>
+                  logout <FontAwesomeIcon icon={faSignOutAlt} />
+                </button>
+              </div>
+            )}
           </nav>
         </div>
       </div>

From 89aeb1412abc472d8212737fede373ce8c34d0df Mon Sep 17 00:00:00 2001
From: edwin6666 <edwinmendoza0620@gmail.com>
Date: Sat, 8 Jul 2023 12:35:55 -0400
Subject: [PATCH 2/2] Feat: logout function

---
 src/components/Navbar/Navbar.jsx | 3 +++
 src/components/PostCard.jsx      | 4 ++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/Navbar/Navbar.jsx b/src/components/Navbar/Navbar.jsx
index 3fd1ef7..303d205 100644
--- a/src/components/Navbar/Navbar.jsx
+++ b/src/components/Navbar/Navbar.jsx
@@ -2,12 +2,15 @@ import React, { useState } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faSignOutAlt } from '@fortawesome/free-solid-svg-icons';
 import { Link, useLocation } from 'react-router-dom';
+import useAuth from "../../hooks/useAuth";
 
 const Navbar = () => {
   const location = useLocation();
   const isLoginPage = location.pathname === '/login';
+  const { setAuth } = useAuth();
 
   const handleLogout = () => {
+    setAuth({ roles: null, token: null });
     window.location = "/login";
   };
 
diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx
index 477e245..ea6a7bb 100644
--- a/src/components/PostCard.jsx
+++ b/src/components/PostCard.jsx
@@ -89,13 +89,13 @@ export function PostCard({ post }) {
         <div>
           {" "}
           <button
-            className="bg-sky-400 text-sm px-2 py-1 rounded-sm"
+            className="bg-gray-400   hover:bg-sky-400 text-sm px-2 py-1 rounded-sm"
             onClick={() => navigate(`/posts/${post._id}`)}
           >
             Edit
           </button>{" "}
           <button
-            className="bg-red-600 text-sm px-2 py-1 rounded-sm "
+            className="bg-gray-400  hover:bg-red-600 text-sm px-2 py-1 rounded-sm "
             onClick={() => handleDelete(post._id)}
           >
             Delete