Fix server-side aria-current

Author: Rikthepixel

src/components/navigation/Header.tsx

@@ -15,7 +15,6 @@ const NavLink = ({ href, currentHref, children }: {
   children: ReactNode;
 }) => {
   const active = currentHref === href;
-
   return (
     <Link
       className="text-lg font-bold py-2 border-y border-primary hover:border-primary-light aria-[current='page']:text-primary-dark aria-[current='page']:border-primary first-of-type:border-t-2 last-of-type:border-b-2 md:border-0 md:first-of-type:border-t-0 md:last-of-type:border-b-0"
@@ -42,10 +41,10 @@ const Header = ({ }: HeaderProps) => {
         <Bars3Icon className="w-6 h-6" />
       </Button>
       <div aria-expanded={open} className="absolute flex flex-col bg-fill gap-0 p-4 top-full inset-x-4 rounded-md shadow shadow-primary z-10 aria-[expanded='false']:hidden md:aria-[expanded='false']:flex md:flex-row md:items-center md:p-0 md:shadow-none md:static md:bg-transparent md:gap-12">
-        <NavLink href="/" currentHref={router.asPath}>
+        <NavLink href="/" currentHref={router.pathname}>
           Home
         </NavLink>
-        <NavLink href="/about" currentHref={router.asPath}>
+        <NavLink href="/about" currentHref={router.pathname}>
           About
         </NavLink>
       </div>