Spaces:
Sleeping
Sleeping
File size: 1,504 Bytes
1c8e50c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 |
import React from 'react';
import { Link, useLocation, useNavigate } from 'react-router-dom';
import { useAuth } from '../../context/AuthContext';
const Navbar = () => {
const { user, logout, isAuthenticated } = useAuth();
const navigate = useNavigate();
const { pathname } = useLocation();
if (!isAuthenticated) {
return null;
}
const handleLogout = () => {
logout();
navigate('/login', { replace: true });
};
return (
<header className="navbar" role="banner">
<div className="navbar__inner" role="navigation" aria-label="Primary">
<h1 className="navbar__brand">Task Management System</h1>
<div className="navbar__actions">
<span className="navbar__user">{user?.fullName || user?.email}</span>
<Link
to="/dashboard"
className={`button button--ghost${pathname === '/dashboard' ? ' is-active' : ''}`}
aria-current={pathname === '/dashboard' ? 'page' : undefined}
>
Dashboard
</Link>
<Link
to="/submissions"
className={`button button--ghost${pathname === '/submissions' ? ' is-active' : ''}`}
aria-current={pathname === '/submissions' ? 'page' : undefined}
>
Submissions
</Link>
<button type="button" className="button button--danger" onClick={handleLogout}>
Logout
</button>
</div>
</div>
</header>
);
};
export default Navbar;
|