type Props = {
  handleCloseDropdown: () => void;
}

const HeaderNav = ({ handleCloseDropdown }: Props) => {
  return (
    <nav>
      <ul>
        <li>
          <a href="/#about" onClick={ handleCloseDropdown }>About Us</a>
        </li>
        <li>
          <a href="/#projects-and-campaigns" onClick={ handleCloseDropdown }>
            Project &amp; Campaigns
          </a>
        </li>
        <li>
          <a href="/#people" onClick={ handleCloseDropdown }>People</a>
        </li>
        <li>
          <a href="/shop" onClick={ handleCloseDropdown }>Shop</a>
        </li>
        <li>
          <a href="contact" onClick={ handleCloseDropdown }>Contact Us</a>
        </li>
      </ul>
    </nav>
  );
};

export default HeaderNav;
