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.

Browse Source
This commit is contained in:
iamkiddy 2025-12-04 19:37:35 +00:00
parent 479b8943ae
commit 460901ab5c
1 changed files with 39 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
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,6 +139,14 @@ export function Navbar() {
</Link> </Link>
)} )}
{isAuthenticated && ( {isAuthenticated && (
<>
<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 <Button
size="sm" size="sm"
variant="outline" variant="outline"
@ -148,6 +156,7 @@ export function Navbar() {
<LogOut className="w-4 h-4 mr-2" /> <LogOut className="w-4 h-4 mr-2" />
Logout Logout
</Button> </Button>
</>
)} )}
</div> </div>
@ -244,6 +253,15 @@ export function Navbar() {
</Link> </Link>
)} )}
{isAuthenticated && ( {isAuthenticated && (
<>
<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 <Button
variant="outline" 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" 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"
@ -254,6 +272,7 @@ export function Navbar() {
<LogOut className="w-4 h-4 mr-2" /> <LogOut className="w-4 h-4 mr-2" />
Logout Logout
</Button> </Button>
</>
)} )}
</div> </div>
</div> </div>