24 lines
816 B
TypeScript
24 lines
816 B
TypeScript
import { Link } from 'react-router-dom';
|
|
import { useAuth } from './AuthContext';
|
|
|
|
export default function Header() {
|
|
const { isAuthenticated, logout } = useAuth();
|
|
|
|
return (
|
|
<header className="bg-white shadow-sm p-4 flex justify-between items-center">
|
|
<h1 className="text-xl font-bold">
|
|
<Link to="/">MyApp</Link>
|
|
</h1>
|
|
<nav>
|
|
<Link to="/" className="text-gray-600 hover:text-gray-900 mx-2">Products</Link>
|
|
<Link to="/cart" className="text-gray-600 hover:text-gray-900 mx-2">Cart</Link>
|
|
{isAuthenticated ? (
|
|
<button onClick={logout} className="text-red-500 hover:text-red-700 mx-2">Logout</button>
|
|
) : (
|
|
<Link to="/login" className="text-blue-500 hover:text-blue-700 mx-2">Login</Link>
|
|
)}
|
|
</nav>
|
|
</header>
|
|
);
|
|
}
|