From 460901ab5c8eb8d621695531abc5dfc015547e80 Mon Sep 17 00:00:00 2001
From: iamkiddy <francisyoungson@gmail.com>
Date: Thu, 4 Dec 2025 19:37:35 +0000
Subject: [PATCH] Enhance Navbar component by adding a Dashboard link for
 authenticated users, improving navigation based on user roles. Update styling
 and structure for better clarity and user experience while maintaining
 existing logout functionality.

---
 components/Navbar.tsx | 59 ++++++++++++++++++++++++++++---------------
 1 file changed, 39 insertions(+), 20 deletions(-)

diff --git a/components/Navbar.tsx b/components/Navbar.tsx
index 1e56789..671db62 100644
--- a/components/Navbar.tsx
+++ b/components/Navbar.tsx
@@ -2,7 +2,7 @@
 
 import { motion, AnimatePresence } from "framer-motion";
 import { Button } from "@/components/ui/button";
-import { Heart, Menu, X, LogOut } from "lucide-react";
+import { Heart, Menu, X, LogOut, LayoutGrid } from "lucide-react";
 import { ThemeToggle } from "@/components/ThemeToggle";
 import { useEffect, useState } from "react";
 import { LoginDialog } from "@/components/LoginDialog";
@@ -139,15 +139,24 @@ export function Navbar() {
               </Link>
             )}
             {isAuthenticated && (
-              <Button 
-                size="sm" 
-                variant="outline" 
-                className="bg-red-600 hover:bg-red-700 text-white border-red-600 hover:border-red-700 hover:opacity-90 hover:scale-105 transition-all text-xs sm:text-sm"
-                onClick={handleLogout}
-              >
-                <LogOut className="w-4 h-4 mr-2" />
-                Logout
-              </Button>
+              <>
+                <Link 
+                  href={isAdmin ? "/admin/dashboard" : "/user/dashboard"}
+                  className={`text-sm font-medium transition-colors cursor-pointer px-3 py-2 rounded-lg hover:opacity-90 ${isDark ? 'text-gray-300 hover:text-white' : 'text-gray-700 hover:text-rose-600'}`}
+                >
+                  <LayoutGrid className="w-4 h-4 inline mr-1.5" />
+                  Dashboard
+                </Link>
+                <Button 
+                  size="sm" 
+                  variant="outline" 
+                  className="bg-red-600 hover:bg-red-700 text-white border-red-600 hover:border-red-700 hover:opacity-90 hover:scale-105 transition-all text-xs sm:text-sm"
+                  onClick={handleLogout}
+                >
+                  <LogOut className="w-4 h-4 mr-2" />
+                  Logout
+                </Button>
+              </>
             )}
           </div>
 
@@ -244,16 +253,26 @@ export function Navbar() {
                     </Link>
                   )}
                   {isAuthenticated && (
-                    <Button
-                      variant="outline"
-                      className="w-full justify-start text-sm sm:text-base bg-red-600 hover:bg-red-700 text-white border-red-600 hover:border-red-700"
-                      onClick={() => {
-                        handleLogout();
-                      }}
-                    >
-                      <LogOut className="w-4 h-4 mr-2" />
-                      Logout
-                    </Button>
+                    <>
+                      <Link
+                        href={isAdmin ? "/admin/dashboard" : "/user/dashboard"}
+                        onClick={() => setMobileMenuOpen(false)}
+                        className={`text-left text-sm sm:text-base font-medium py-2.5 sm:py-3 px-3 sm:px-4 rounded-lg transition-colors flex items-center gap-2 ${isDark ? 'text-gray-300 hover:bg-gray-800' : 'text-gray-700 hover:bg-gray-100'}`}
+                      >
+                        <LayoutGrid className="w-4 h-4" />
+                        Dashboard
+                      </Link>
+                      <Button
+                        variant="outline"
+                        className="w-full justify-start text-sm sm:text-base bg-red-600 hover:bg-red-700 text-white border-red-600 hover:border-red-700"
+                        onClick={() => {
+                          handleLogout();
+                        }}
+                      >
+                        <LogOut className="w-4 h-4 mr-2" />
+                        Logout
+                      </Button>
+                    </>
                   )}
                 </div>
               </div>