From 46582315a3f13167d9d55886dea18d8344139daf Mon Sep 17 00:00:00 2001
From: seonghobae <8172694+seonghobae@users.noreply.github.com>
Date: Sun, 21 Jun 2026 13:51:18 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Add=20aria-hidden=20t?=
 =?UTF-8?q?o=20decorative=20icons=20in=20workspace?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds `aria-hidden="true"` to strictly decorative icons within `RoleSwitcher`, `SectionRoadmap`, and `Workspace` features. This prevents screen readers from redundantly announcing these icons since descriptive text equivalents are immediately adjacent to them.
---
 apps/desktop/src/features/workspace/RoleSwitcher.tsx   | 2 +-
 apps/desktop/src/features/workspace/SectionRoadmap.tsx | 6 +++---
 apps/desktop/src/features/workspace/Workspace.tsx      | 6 +++---
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/apps/desktop/src/features/workspace/RoleSwitcher.tsx b/apps/desktop/src/features/workspace/RoleSwitcher.tsx
index d5a222b5..f5275964 100644
--- a/apps/desktop/src/features/workspace/RoleSwitcher.tsx
+++ b/apps/desktop/src/features/workspace/RoleSwitcher.tsx
@@ -43,7 +43,7 @@ export function RoleSwitcher({ roles, activeRole, onRoleChange }: RoleSwitcherPr
   return (
     <div className="flex flex-col gap-4 py-2 sm:flex-row sm:items-center">
       <div className="flex whitespace-nowrap text-sm font-semibold text-slate-200">
-        <Users className="mr-2 size-4 text-cyan-300" />
+        <Users className="mr-2 size-4 text-cyan-300" aria-hidden="true" />
         {t("roleSwitcherTitle")}
       </div>
       <Tabs
diff --git a/apps/desktop/src/features/workspace/SectionRoadmap.tsx b/apps/desktop/src/features/workspace/SectionRoadmap.tsx
index 8f9ad0c1..3ba06033 100644
--- a/apps/desktop/src/features/workspace/SectionRoadmap.tsx
+++ b/apps/desktop/src/features/workspace/SectionRoadmap.tsx
@@ -165,14 +165,14 @@ export function SectionRoadmap({ song, activeRole, onSongUpdate }: SectionRoadma
 
                         {role.setupNote && (
                           <div className="flex items-start gap-2 rounded-md border border-amber-300/20 bg-amber-300/[0.08] p-2 text-xs font-medium text-amber-100">
-                            <Lightbulb className="mt-0.5 size-3.5 shrink-0" />
+                            <Lightbulb className="mt-0.5 size-3.5 shrink-0" aria-hidden="true" />
                             <span className="leading-snug">{role.setupNote}</span>
                           </div>
                         )}
 
                         {role.simplification && (
                           <div className="flex items-start gap-2 rounded-md border border-indigo-300/20 bg-indigo-300/[0.08] p-2 text-xs font-medium text-indigo-100">
-                            <Wand2 className="mt-0.5 size-3.5 shrink-0" />
+                            <Wand2 className="mt-0.5 size-3.5 shrink-0" aria-hidden="true" />
                             <span className="leading-snug">{role.simplification}</span>
                           </div>
                         )}
@@ -181,7 +181,7 @@ export function SectionRoadmap({ song, activeRole, onSongUpdate }: SectionRoadma
                           <div className="mt-2 space-y-1.5">
                             {role.overlapWarnings.map((warning, wIdx) => (
                               <div key={wIdx} className="flex items-start gap-2 rounded-md border border-rose-300/20 bg-rose-300/[0.08] p-2 text-xs font-medium text-rose-100">
-                                <AlertCircle className="mt-0.5 size-3.5 shrink-0" />
+                                <AlertCircle className="mt-0.5 size-3.5 shrink-0" aria-hidden="true" />
                                 <span className="leading-snug">{warning}</span>
                               </div>
                             ))}
diff --git a/apps/desktop/src/features/workspace/Workspace.tsx b/apps/desktop/src/features/workspace/Workspace.tsx
index b4a98a06..0dbb306c 100644
--- a/apps/desktop/src/features/workspace/Workspace.tsx
+++ b/apps/desktop/src/features/workspace/Workspace.tsx
@@ -222,7 +222,7 @@ export function Workspace({ song, sourceBootstrap = null, onSongUpdate }: Worksp
               onClick={handleExportCueSheet}
                 className="min-h-10 border-cyan-300/30 bg-cyan-300/10 font-semibold text-cyan-50 shadow-[0_10px_30px_rgba(34,211,238,0.16)] hover:bg-cyan-300/20 hover:text-white"
             >
-                <Download className="mr-2 size-4 text-cyan-200" />
+                <Download className="mr-2 size-4 text-cyan-200" aria-hidden="true" />
               Export Cue Sheet (CSV)
             </Button>
             <Button
@@ -231,7 +231,7 @@ export function Workspace({ song, sourceBootstrap = null, onSongUpdate }: Worksp
               onClick={handleExportChart}
                 className="min-h-10 border-white/10 bg-white/5 font-semibold text-slate-100 shadow-sm hover:bg-white/10 hover:text-white"
             >
-                <Download className="mr-2 size-4 text-slate-300" />
+                <Download className="mr-2 size-4 text-slate-300" aria-hidden="true" />
               Export Chart (JSON)
             </Button>
             <Button
@@ -240,7 +240,7 @@ export function Workspace({ song, sourceBootstrap = null, onSongUpdate }: Worksp
               onClick={handleExportHandoff}
               className="min-h-10 border-teal-300/25 bg-teal-300/10 font-semibold text-teal-50 shadow-sm hover:bg-teal-300/20 hover:text-white"
             >
-              <Download className="mr-2 size-4 text-teal-200" />
+              <Download className="mr-2 size-4 text-teal-200" aria-hidden="true" />
               Export Handoff (JSON)
             </Button>
           </div>