From fbf2cb487d39b2223c7f93dc23de70edd882222e Mon Sep 17 00:00:00 2001
From: styxpienestincendies
 <137850839+styxpienestincendies@users.noreply.github.com>
Date: Wed, 24 Jul 2024 18:03:58 +1200
Subject: [PATCH] Updated Navbar

Check to see if user is Authenticated, which shows a different display of the Navbar
---
 frontend/src/ui/NavBar.tsx | 37 ++++++++++++++++++++++++++++++++-----
 1 file changed, 32 insertions(+), 5 deletions(-)

diff --git a/frontend/src/ui/NavBar.tsx b/frontend/src/ui/NavBar.tsx
index c0f2938..3d8cffa 100644
--- a/frontend/src/ui/NavBar.tsx
+++ b/frontend/src/ui/NavBar.tsx
@@ -3,14 +3,26 @@
 import Link from 'next/link'
 import styles from './Navbar.module.css'
 import { usePathname } from 'next/navigation';
+import { useState } from 'react';
 
 export default function NavBar() {
     const pathname = usePathname();
+    const [isAuthentication, setIsAuthentication] = useState(true);
     console.log(pathname)
 
+    const handleLogin = () => {
+        setIsAuthentication(true)
+    }
+
+        const handleLogout = () => {
+        setIsAuthentication(false)
+    }
+
     return (
         <nav className={styles.nav}>
             <ul>
+    
+                    
                 <li className={styles.navitem}>
                     <Link className={`${styles.navlink} ${pathname === "/home" ? styles.currentpage : ""}`} href="/home">
                         Home
@@ -26,11 +38,26 @@ export default function NavBar() {
                         Events
                     </Link>
                 </li>
-                <li className={styles.navitem}>
-                    <Link className={`${styles.navlink} ${pathname === "/home/login" ? styles.currentpage : ""}`} href="/home/login">
-                        Register/Log In
-                    </Link>
-                </li>
+                {isAuthentication ? (
+                    <>
+                        <li className={styles.navitem}>
+                            <Link className={`${styles.navlink} ${pathname === "/profile" ? styles.currentpage : ""}`} href="/profile">
+                                Profile
+                            </Link>
+                        </li>
+                        <li className={styles.navitem}>
+                            <button className={styles.navlink} onClick={handleLogout}>
+                                Logout
+                            </button>
+                        </li>
+                    </>
+                ) : (
+                    <li className={styles.navitem}>
+                        <Link className={`${styles.navlink} ${pathname === "/home/login" ? styles.currentpage : ""}`} href="/home/login">
+                            Register/Log In
+                        </Link>
+                    </li>
+                )}
             </ul>
         </nav>
     )