From 219edc65fff4de1bf0f36eda0e35695672ad2553 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 26 Feb 2026 09:08:57 +0000
Subject: [PATCH] feat(a11y): add aria-labels to mobile navigation and header
 buttons

- Adds `aria-label` to icon-only links in `src/components/mobile-nav.tsx` using `item.title`.
- Adds `aria-label` to Settings and Logout buttons in `src/app/dashboard/layout.tsx` for improved accessibility.
- Ensures screen readers can announce the purpose of these navigation elements.

Co-authored-by: vireapp <260846454+vireapp@users.noreply.github.com>
---
 src/app/dashboard/layout.tsx  | 2 ++
 src/components/mobile-nav.tsx | 1 +
 2 files changed, 3 insertions(+)

diff --git a/src/app/dashboard/layout.tsx b/src/app/dashboard/layout.tsx
index 4384c4c..2ce0955 100644
--- a/src/app/dashboard/layout.tsx
+++ b/src/app/dashboard/layout.tsx
@@ -73,6 +73,7 @@ export default async function DashboardLayout({
                                     size="icon"
                                     asChild
                                     title="Settings"
+                                    aria-label="Settings"
                                     className="hover:bg-muted hover:text-foreground rounded-full w-9 h-9 md:w-10 md:h-10"
                                 >
                                     <Link href="/dashboard/settings">
@@ -92,6 +93,7 @@ export default async function DashboardLayout({
                                         size="icon"
                                         type="submit"
                                         title="Logout"
+                                        aria-label="Logout"
                                         className="hover:bg-red-500/20 hover:text-red-400 rounded-full transition-colors w-9 h-9 md:w-10 md:h-10"
                                     >
                                         <LogOut className="w-5 h-5 md:w-4 md:h-4" />
diff --git a/src/components/mobile-nav.tsx b/src/components/mobile-nav.tsx
index 3640418..adbd331 100644
--- a/src/components/mobile-nav.tsx
+++ b/src/components/mobile-nav.tsx
@@ -56,6 +56,7 @@ export function MobileNav() {
               <Link
                 key={item.href}
                 href={item.href}
+                aria-label={item.title}
                 className="relative flex flex-col items-center justify-center w-12 h-12 sm:w-14 sm:h-14 rounded-xl"
               >
                 {/* Active Background Pill */}