import { Tab } from "../../../types/tab";
import NavbarTabDesktop from "./NavbarTabDesktop";

interface NavbarProps {
  selectedTab: Tab | null;
  onTabClick: (tab: Tab) => void;
  tabs: Tab[];
}

const NavbarDesktop = ({ selectedTab, onTabClick, tabs }: NavbarProps) => (
  <nav className={`text-[#73787C] self-center col-span-2 justify-center flex`}>
    {tabs.map((tab) => (
      <NavbarTabDesktop
        key={tab.id}
        tab={tab}
        isSelected={selectedTab?.id === tab.id}
        onClick={onTabClick}
      />
    ))}
  </nav>
);

export default NavbarDesktop;
