From 99b23ccfdc08b92ffc267f0bce4c6da07ace2eca Mon Sep 17 00:00:00 2001
From: Ammar <ammar+ai@ammar.io>
Date: Fri, 7 Nov 2025 15:39:38 +0000
Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=A4=96=20feat:=20add=20aria-labels=20?=
 =?UTF-8?q?to=20ProjectSidebar=20and=20fix=20path=20text=20cutoff?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add aria-label to project items, workspace lists, and buttons
- Add role=region to workspace list containers
- Fix vertical text cutoff by changing leading-none to leading-tight
- Improves screen reader accessibility throughout the sidebar
---
 src/components/ProjectSidebar.tsx    | 9 ++++++---
 src/components/WorkspaceListItem.tsx | 1 +
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/ProjectSidebar.tsx b/src/components/ProjectSidebar.tsx
index 43a8b708b..1314f9eff 100644
--- a/src/components/ProjectSidebar.tsx
+++ b/src/components/ProjectSidebar.tsx
@@ -37,6 +37,7 @@ type DraggableProjectItemProps = React.PropsWithChildren<{
   tabIndex?: number;
   "aria-expanded"?: boolean;
   "aria-controls"?: string;
+  "aria-label"?: string;
   "data-project-path"?: string;
 }>;
 
@@ -140,7 +141,7 @@ const ProjectDragLayer: React.FC = () => {
           <span className="text-dim mr-1.5 text-xs">⠿</span>
           <span className="text-muted mr-2 text-xs">▶</span>
           <div className="min-w-0 flex-1">
-            <div className="text-muted-dark font-monospace truncate text-sm leading-none">
+            <div className="text-muted-dark font-monospace truncate text-sm leading-tight">
               <span>{dirPath}</span>
               <span className="text-foreground font-medium">{basename}</span>
             </div>
@@ -475,6 +476,7 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
                           tabIndex={0}
                           aria-expanded={isExpanded}
                           aria-controls={workspaceListId}
+                          aria-label={`${isExpanded ? "Collapse" : "Expand"} project ${projectName}`}
                           data-project-path={projectPath}
                         >
                           <span
@@ -494,7 +496,7 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
                           </span>
                           <div className="flex min-w-0 flex-1 items-center pr-2">
                             <TooltipWrapper inline>
-                              <div className="text-muted-dark font-monospace truncate text-sm leading-none">
+                              <div className="text-muted-dark font-monospace truncate text-sm leading-tight">
                                 {(() => {
                                   const abbrevPath = abbreviatePath(projectPath);
                                   const { dirPath, basename } = splitAbbreviatedPath(abbrevPath);
@@ -549,7 +551,7 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
                         </DraggableProjectItem>
 
                         {isExpanded && (
-                          <div id={workspaceListId}>
+                          <div id={workspaceListId} role="region" aria-label={`Workspaces for ${projectName}`}>
                             <div className="border-hover border-b px-3 py-2 pl-[22px]">
                               <button
                                 onClick={() => onAddWorkspace(projectPath)}
@@ -635,6 +637,7 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
           <TooltipWrapper inline>
             <button
               onClick={onToggleCollapsed}
+              aria-label={collapsed ? "Expand sidebar" : "Collapse sidebar"}
               className="text-muted border-dark hover:bg-hover hover:text-foreground mt-auto flex h-9 w-full cursor-pointer items-center justify-center border-t border-none bg-transparent p-0 text-sm transition-all duration-200"
             >
               {collapsed ? "»" : "«"}
diff --git a/src/components/WorkspaceListItem.tsx b/src/components/WorkspaceListItem.tsx
index 8c1a68f15..cfeba5589 100644
--- a/src/components/WorkspaceListItem.tsx
+++ b/src/components/WorkspaceListItem.tsx
@@ -124,6 +124,7 @@ const WorkspaceListItemInner: React.FC<WorkspaceListItemProps> = ({
         role="button"
         tabIndex={0}
         aria-current={isSelected ? "true" : undefined}
+        aria-label={`Select workspace ${displayName}`}
         data-workspace-path={namedWorkspacePath}
         data-workspace-id={workspaceId}
       >

From ab6c90e3f78a8a6aba7b6ecb162207746e3f0018 Mon Sep 17 00:00:00 2001
From: Ammar <ammar+ai@ammar.io>
Date: Fri, 7 Nov 2025 15:44:00 +0000
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=A4=96=20fmt:=20auto-format=20Project?=
 =?UTF-8?q?Sidebar.tsx?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ProjectSidebar.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/ProjectSidebar.tsx b/src/components/ProjectSidebar.tsx
index 1314f9eff..e2f4a22de 100644
--- a/src/components/ProjectSidebar.tsx
+++ b/src/components/ProjectSidebar.tsx
@@ -551,7 +551,11 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
                         </DraggableProjectItem>
 
                         {isExpanded && (
-                          <div id={workspaceListId} role="region" aria-label={`Workspaces for ${projectName}`}>
+                          <div
+                            id={workspaceListId}
+                            role="region"
+                            aria-label={`Workspaces for ${projectName}`}
+                          >
                             <div className="border-hover border-b px-3 py-2 pl-[22px]">
                               <button
                                 onClick={() => onAddWorkspace(projectPath)}