ATTUNE-HEART-THERAPY/website
6
0
Fork 0
Code Issues 7 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

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. #55

Merged
Hammond merged 1 commits from feat/booking-panel into master 2025-12-04 19:37:58 +00:00
Conversation 0 Commits 1 Files Changed 1 +39 -20
1 changed files with 39 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 460901ab5c - Show all commits

59
components/Navbar.tsx
View File

@ -2,7 +2,7 @@
import { motion, AnimatePresence } from "framer-motion"; import { motion, AnimatePresence } from "framer-motion";
import { Button } from "@/components/ui/button"; 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 { ThemeToggle } from "@/components/ThemeToggle";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { LoginDialog } from "@/components/LoginDialog"; import { LoginDialog } from "@/components/LoginDialog";
@ -139,15 +139,24 @@ export function Navbar() {
</Link> </Link>
)} )}
{isAuthenticated && ( {isAuthenticated && (
<Button <>
size="sm" <Link
variant="outline" href={isAdmin ? "/admin/dashboard" : "/user/dashboard"}
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" 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'}`}
onClick={handleLogout} >
> <LayoutGrid className="w-4 h-4 inline mr-1.5" />
<LogOut className="w-4 h-4 mr-2" /> Dashboard
Logout </Link>
</Button> <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> </div>
@ -244,16 +253,26 @@ export function Navbar() {
</Link> </Link>
)} )}
{isAuthenticated && ( {isAuthenticated && (
<Button <>
variant="outline" <Link
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" href={isAdmin ? "/admin/dashboard" : "/user/dashboard"}
onClick={() => { onClick={() => setMobileMenuOpen(false)}
handleLogout(); 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" />
<LogOut className="w-4 h-4 mr-2" /> Dashboard
Logout </Link>
</Button> <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>
</div> </div>