From 0059fdc1f5158fc41642b8982928c5abc25e4a4f Mon Sep 17 00:00:00 2001
From: Nolan Darilek <nolan@thewordnerd.info>
Date: Wed, 21 Jan 2026 09:57:50 -0600
Subject: fix(app): add aria-labels to titlebar and sidebar buttons (#9843)

---
 packages/app/src/pages/layout.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

(limited to 'packages/app/src/pages')

diff --git a/packages/app/src/pages/layout.tsx b/packages/app/src/pages/layout.tsx
index d8e0d55f3..9d7cc9c71 100644
--- a/packages/app/src/pages/layout.tsx
+++ b/packages/app/src/pages/layout.tsx
@@ -1573,7 +1573,7 @@ export default function Layout(props: ParentProps) {
             keybind={command.keybind("session.archive")}
             gutter={8}
           >
-            <IconButton icon="archive" variant="ghost" onClick={() => archiveSession(props.session)} />
+            <IconButton icon="archive" variant="ghost" onClick={() => archiveSession(props.session)} aria-label="Archive session" />
           </TooltipKeybind>
         </div>
       </div>
@@ -1749,7 +1749,7 @@ export default function Layout(props: ParentProps) {
                 >
                   <DropdownMenu open={menuOpen()} onOpenChange={setMenuOpen}>
                     <Tooltip value={language.t("common.moreOptions")} placement="top">
-                      <DropdownMenu.Trigger as={IconButton} icon="dot-grid" variant="ghost" class="size-6 rounded-md" />
+                      <DropdownMenu.Trigger as={IconButton} icon="dot-grid" variant="ghost" class="size-6 rounded-md" aria-label="More options" />
                     </Tooltip>
                     <DropdownMenu.Portal>
                       <DropdownMenu.Content
@@ -1797,6 +1797,7 @@ export default function Layout(props: ParentProps) {
                       variant="ghost"
                       class="size-6 rounded-md"
                       onClick={() => navigate(`/${slug()}/session`)}
+                      aria-label="New session"
                     />
                   </TooltipKeybind>
                 </div>
@@ -1881,9 +1882,11 @@ export default function Layout(props: ParentProps) {
         .slice(0, 2)
     }
 
+    const projectName = () => props.project.name || getFilename(props.project.worktree)
     const trigger = (
       <button
         type="button"
+        aria-label={projectName()}
         classList={{
           "flex items-center justify-center size-10 p-1 rounded-lg overflow-hidden transition-colors cursor-default": true,
           "bg-transparent border-2 border-icon-strong-base hover:bg-surface-base-hover": selected(),
@@ -2103,7 +2106,7 @@ export default function Layout(props: ParentProps) {
                     </div>
                   }
                 >
-                  <IconButton icon="plus" variant="ghost" size="large" onClick={chooseProject} />
+                  <IconButton icon="plus" variant="ghost" size="large" onClick={chooseProject} aria-label="Open project" />
                 </Tooltip>
               </div>
               <DragOverlay>
@@ -2117,7 +2120,7 @@ export default function Layout(props: ParentProps) {
               title={language.t("sidebar.settings")}
               keybind={command.keybind("settings.open")}
             >
-              <IconButton icon="settings-gear" variant="ghost" size="large" onClick={openSettings} />
+              <IconButton icon="settings-gear" variant="ghost" size="large" onClick={openSettings} aria-label="Settings" />
             </TooltipKeybind>
             <Tooltip placement={sidebarProps.mobile ? "bottom" : "right"} value={language.t("sidebar.help")}>
               <IconButton
@@ -2125,6 +2128,7 @@ export default function Layout(props: ParentProps) {
                 variant="ghost"
                 size="large"
                 onClick={() => platform.openLink("https://opencode.ai/desktop-feedback")}
+                aria-label="Help"
               />
             </Tooltip>
           </div>
@@ -2175,6 +2179,7 @@ export default function Layout(props: ParentProps) {
                           icon="dot-grid"
                           variant="ghost"
                           class="shrink-0 size-6 rounded-md opacity-0 group-hover/project:opacity-100 data-[expanded]:opacity-100 data-[expanded]:bg-surface-base-active"
+                          aria-label="Project options"
                         />
                         <DropdownMenu.Portal>
                           <DropdownMenu.Content class="mt-1">
-- 
cgit v1.2.3