import React from "react";
import Link from "next/link";
import Image from "next/image";
import Jefes from "../../../public/jefes_logo.jpg";

const NavBar = () => {
  // Create an array to hold the list items
  const links = [
    { label: "Dashboard", href: "/" },
    { label: "Issues", href: "/" },
  ];

  return (
    <nav className="flex gap-4 border-b mb-5 px-5 h-14 items-center">
      <Link href="/">
        <Image src={Jefes} width={50} height="auto" alt="Logo" />
      </Link>
      <ul className="flex gap-4 hover:cursor-pointer">
        {links.map((link) => (
          <Link
            key={link.href}
            className="text-zinc-500 hover:text-zinc-800"
            href={link.href}
          >
            {link.label}
          </Link>
        ))}
      </ul>
    </nav>
  );
};

export default NavBar;