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

Update Navbar component to conditionally render Dashboard links based on user roles and current route. This enhancement improves navigation clarity for authenticated users by preventing duplicate links in the Navbar.

Browse Source
This commit is contained in:
iamkiddy 2025-12-04 19:44:27 +00:00
parent 460901ab5c
commit c18275bf9b
1 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
components/Navbar.tsx
View File

@ -23,7 +23,9 @@ export function Navbar() {
const router = useRouter();
const pathname = usePathname();
const isUserDashboard = pathname?.startsWith("/user/dashboard");
const isAdminDashboard = pathname?.startsWith("/admin/dashboard");
const isUserSettings = pathname?.startsWith("/user/settings");
const isAdminSettings = pathname?.startsWith("/admin/settings");
const isUserRoute = pathname?.startsWith("/user/");
const { isAuthenticated, logout, user, isAdmin } = useAuth();
@ -140,13 +142,15 @@ export function Navbar() {
)}
{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>
{!(isUserDashboard || isAdminDashboard || isUserSettings || isAdminSettings) && (
<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"
@ -254,14 +258,16 @@ export function Navbar() {
)}
{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>
{!(isUserDashboard || isAdminDashboard || isUserSettings || isAdminSettings) && (
<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"