import React from 'react';
import { Link, useNavigate } from 'react-router-dom';
import './header.css';

const Header = ({ isLoggedIn }) => {
  const navigate = useNavigate();

  const handleLogout = () => {
    localStorage.removeItem('token');
    navigate('/login');
    window.location.reload();
  };

  return (
    <header className="header">
      <nav className="nav">
        <ul className="navList">
          <li className="navItem">
            <Link to="/" className="navLink">Home</Link>
          </li>
          {!isLoggedIn && (
            <>
              <li className="navItem">
                <Link to="/login" className="navLink">Login</Link>
              </li>
              <li className="navItem">
                <Link to="/register" className="navLink">Register</Link>
              </li>
            </>
          )}
          {isLoggedIn && (
            <li className="navItem">
              <Link to="/profile" className="navLink">Profile</Link>
            </li>
          )}
        </ul>
      </nav>
    </header>
  );
};

export default Header;