'use client';
import '@/app/globals.css'
import { usePathname } from 'next/navigation'
import Links from '@/public/routes.json'; // move to api again but use this for inital hydration
import Link from 'next/link';

export const PageNavbar = () => {
  const path = usePathname();

  let navbar: JSX.Element 
    navbar = (
      <nav className='navbar'>
        {Links.links.map((item) => (
          <Link className={(path === item.href ? "active" : "")} key={item.name} href={item.href}>
            {item.name}
          </Link>
        ))}
      </nav>
    );
  return navbar;
}