From 848322e458dc9bac2a5964fe326d233775969131 Mon Sep 17 00:00:00 2001
From: alex <nowaalex@gmail.com>
Date: Tue, 24 Oct 2023 03:12:57 +0200
Subject: [PATCH] removed duplicate h1 + added aria-current

---
 packages/website/components/Menu/index.tsx            |  1 +
 packages/website/components/NavLink/index.tsx         |  1 +
 .../components/layouts/Documentation/index.tsx        | 11 ++++++++---
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/packages/website/components/Menu/index.tsx b/packages/website/components/Menu/index.tsx
index a9dbcd98..a3728d03 100644
--- a/packages/website/components/Menu/index.tsx
+++ b/packages/website/components/Menu/index.tsx
@@ -50,6 +50,7 @@ type MenuProps = JSX.IntrinsicElements["nav"] & {
 const Menu = ({ className, items, prefix, ...props }: MenuProps) => (
     <nav
         {...props}
+        aria-label="Main navigation"
         className={cx(
             "prose prose-sm prose-ul:list-none prose-a:no-underline p-4",
             className
diff --git a/packages/website/components/NavLink/index.tsx b/packages/website/components/NavLink/index.tsx
index 37052ee1..50077191 100644
--- a/packages/website/components/NavLink/index.tsx
+++ b/packages/website/components/NavLink/index.tsx
@@ -27,6 +27,7 @@ const NavLink = ({
         <Link
             {...props}
             href={href}
+            aria-current={isActive ? "page" : undefined}
             className={cx(className, isActive ? activeClassName : "")}
         />
     );
diff --git a/packages/website/components/layouts/Documentation/index.tsx b/packages/website/components/layouts/Documentation/index.tsx
index 5c9c0e64..2d6d706e 100644
--- a/packages/website/components/layouts/Documentation/index.tsx
+++ b/packages/website/components/layouts/Documentation/index.tsx
@@ -6,12 +6,17 @@ import Link from "next/link";
 import cx from "utils/cx";
 
 const renderTopLink = (className: string, productName: string) => (
-    <h1 className={cx("flex gap-2 font-medium", className)}>
+    <nav aria-label="Breadcrumb" className={cx("font-medium", className)}>
         <Link href="/" className="underline">
             af-utils
         </Link>
-        /<span className="text-slate-500">{productName}</span>
-    </h1>
+        <span className="px-2" aria-hidden="true">
+            /
+        </span>
+        <span className="text-slate-500" aria-current="page">
+            {productName}
+        </span>
+    </nav>
 );
 
 const getDocumentationLayout =