kayela/membership-fe
1
0
Fork 0
forked from andika/membership-fe
Code Pull Requests Activity

Initial Commit

Browse Source
This commit is contained in:
Koncept Kit
2025-12-05 16:40:33 +07:00
parent 0834f12410
commit 94c7d5aec0
91 changed files with 20446 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
src/components/Navbar.js Normal file
View File

@@ -0,0 +1,95 @@
import React from 'react';
import { Link, useNavigate } from 'react-router-dom';
import { useAuth } from '../context/AuthContext';
import { Button } from './ui/button';
import { Users, LogOut, LayoutDashboard } from 'lucide-react';
const Navbar = () => {
const { user, logout } = useAuth();
const navigate = useNavigate();
const handleLogout = () => {
logout();
navigate('/login');
};
return (
<nav className="bg-white border-b border-[#EAE0D5] sticky top-0 z-50 backdrop-blur-sm bg-white/90">
<div className="max-w-7xl mx-auto px-6 py-4">
<div className="flex justify-between items-center">
<Link to={user ? "/dashboard" : "/"} className="flex items-center gap-2">
<Users className="h-8 w-8 text-[#E07A5F]" strokeWidth={1.5} />
<span className="text-2xl font-semibold fraunces text-[#3D405B]">Membership</span>
</Link>
<div className="flex items-center gap-4">
{user ? (
<>
{user.role === 'admin' && (
<Link to="/admin">
<Button
variant="ghost"
className="text-[#3D405B] hover:text-[#E07A5F] hover:bg-[#F2CC8F]/10"
data-testid="admin-nav-button"
>
<LayoutDashboard className="h-4 w-4 mr-2" />
Admin
</Button>
</Link>
)}
<Link to="/events">
<Button
variant="ghost"
className="text-[#3D405B] hover:text-[#E07A5F] hover:bg-[#F2CC8F]/10"
data-testid="events-nav-button"
>
Events
</Button>
</Link>
<Link to="/profile">
<Button
variant="ghost"
className="text-[#3D405B] hover:text-[#E07A5F] hover:bg-[#F2CC8F]/10"
data-testid="profile-nav-button"
>
Profile
</Button>
</Link>
<Button
onClick={handleLogout}
className="bg-[#E07A5F] text-white hover:bg-[#D0694E] rounded-full px-6"
data-testid="logout-button"
>
<LogOut className="h-4 w-4 mr-2" />
Logout
</Button>
</>
) : (
<>
<Link to="/login">
<Button
variant="ghost"
className="text-[#3D405B] hover:text-[#E07A5F] hover:bg-[#F2CC8F]/10"
data-testid="login-nav-button"
>
Login
</Button>
</Link>
<Link to="/register">
<Button
className="bg-[#E07A5F] text-white hover:bg-[#D0694E] rounded-full px-6"
data-testid="register-nav-button"
>
Join Us
</Button>
</Link>
</>
)}
</div>
</div>
</div>
</nav>
);
};
export default Navbar;