From d17b22ccba02f689be762a85aa2f9be629c0064f Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 2 May 2026 17:13:12 -0700
Subject: [PATCH 1/5] improvement(sidebar): overlay lock indicator on leading
 icon

---
 .../components/folder-item/folder-item.tsx    | 40 +++++++++++--------
 .../workflow-item/workflow-item.tsx           | 40 ++++++++++++-------
 2 files changed, 49 insertions(+), 31 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
index bff9ebd4d60..3e8448c53d8 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
@@ -6,6 +6,7 @@ import { generateId } from '@sim/utils/id'
 import clsx from 'clsx'
 import { ChevronRight, Folder, FolderOpen, MoreHorizontal } from 'lucide-react'
 import { useParams, useRouter } from 'next/navigation'
+import { Tooltip } from '@/components/emcn'
 import { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { getNextWorkflowColor } from '@/lib/workflows/colors'
@@ -513,17 +514,28 @@ export function FolderItem({
           )}
           aria-hidden='true'
         />
-        {isExpanded ? (
-          <FolderOpen
-            className='h-[16px] w-[16px] flex-shrink-0 text-[var(--text-icon)]'
-            aria-hidden='true'
-          />
-        ) : (
-          <Folder
-            className='h-[16px] w-[16px] flex-shrink-0 text-[var(--text-icon)]'
-            aria-hidden='true'
-          />
-        )}
+        <span className='relative flex-shrink-0'>
+          {isExpanded ? (
+            <FolderOpen className='h-[16px] w-[16px] text-[var(--text-icon)]' aria-hidden='true' />
+          ) : (
+            <Folder className='h-[16px] w-[16px] text-[var(--text-icon)]' aria-hidden='true' />
+          )}
+          {folder.locked && (
+            <Tooltip.Root>
+              <Tooltip.Trigger asChild>
+                <span className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)]'>
+                  <Lock
+                    className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
+                    aria-hidden='true'
+                  />
+                </span>
+              </Tooltip.Trigger>
+              <Tooltip.Content side='bottom'>
+                <span>Locked</span>
+              </Tooltip.Content>
+            </Tooltip.Root>
+          )}
+        </span>
         {isEditing ? (
           <input
             ref={inputRef}
@@ -552,12 +564,6 @@ export function FolderItem({
               >
                 {folder.name}
               </span>
-              {folder.locked && (
-                <Lock
-                  className='pointer-events-none h-[12px] w-[12px] flex-shrink-0 text-[var(--text-icon)]'
-                  aria-label='Folder is locked'
-                />
-              )}
             </div>
             <button
               type='button'
diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
index 280da1edf0e..960739a31f5 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
@@ -5,6 +5,7 @@ import clsx from 'clsx'
 import { MoreHorizontal } from 'lucide-react'
 import Link from 'next/link'
 import { useParams } from 'next/navigation'
+import { Tooltip } from '@/components/emcn'
 import { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { workflowBorderColor } from '@/lib/workspaces/colors'
@@ -431,14 +432,31 @@ export function WorkflowItem({
         onClick={handleClick}
         onContextMenu={handleContextMenu}
       >
-        <div
-          className='h-[16px] w-[16px] flex-shrink-0 rounded-sm border-[2.5px]'
-          style={{
-            backgroundColor: workflow.color,
-            borderColor: workflowBorderColor(workflow.color),
-            backgroundClip: 'padding-box',
-          }}
-        />
+        <span className='relative flex-shrink-0'>
+          <div
+            className='h-[16px] w-[16px] rounded-sm border-[2.5px]'
+            style={{
+              backgroundColor: workflow.color,
+              borderColor: workflowBorderColor(workflow.color),
+              backgroundClip: 'padding-box',
+            }}
+          />
+          {workflow.locked && (
+            <Tooltip.Root>
+              <Tooltip.Trigger asChild>
+                <span className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)]'>
+                  <Lock
+                    className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
+                    aria-hidden='true'
+                  />
+                </span>
+              </Tooltip.Trigger>
+              <Tooltip.Content side='bottom'>
+                <span>Locked</span>
+              </Tooltip.Content>
+            </Tooltip.Root>
+          )}
+        </span>
         <div className='min-w-0 flex-1'>
           <div className='flex min-w-0 items-center gap-2'>
             {isEditing ? (
@@ -468,12 +486,6 @@ export function WorkflowItem({
                 {workflow.name}
               </div>
             )}
-            {!isEditing && workflow.locked && (
-              <Lock
-                className='pointer-events-none h-[12px] w-[12px] flex-shrink-0 text-[var(--text-icon)]'
-                aria-label='Workflow is locked'
-              />
-            )}
             {!isEditing && <Avatars workflowId={workflow.id} />}
           </div>
         </div>

From ef08edc151c8dc2717679646edd16a9226ad3321 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 2 May 2026 17:20:12 -0700
Subject: [PATCH 2/5] fix(sidebar): correct lock indicator HTML nesting and
 a11y

---
 .../components/folder-item/folder-item.tsx          |  9 +++++++--
 .../components/workflow-item/workflow-item.tsx      | 13 +++++++++----
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
index 3e8448c53d8..e48cc204bf6 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
@@ -523,12 +523,17 @@ export function FolderItem({
           {folder.locked && (
             <Tooltip.Root>
               <Tooltip.Trigger asChild>
-                <span className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)]'>
+                <button
+                  type='button'
+                  aria-label='Folder is locked'
+                  className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)] outline-none focus-visible:ring-1 focus-visible:ring-[var(--text-icon)]'
+                  onClick={(e) => e.preventDefault()}
+                >
                   <Lock
                     className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
                     aria-hidden='true'
                   />
-                </span>
+                </button>
               </Tooltip.Trigger>
               <Tooltip.Content side='bottom'>
                 <span>Locked</span>
diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
index 960739a31f5..ec24d2dd6f5 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
@@ -432,7 +432,7 @@ export function WorkflowItem({
         onClick={handleClick}
         onContextMenu={handleContextMenu}
       >
-        <span className='relative flex-shrink-0'>
+        <div className='relative flex-shrink-0'>
           <div
             className='h-[16px] w-[16px] rounded-sm border-[2.5px]'
             style={{
@@ -444,19 +444,24 @@ export function WorkflowItem({
           {workflow.locked && (
             <Tooltip.Root>
               <Tooltip.Trigger asChild>
-                <span className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)]'>
+                <button
+                  type='button'
+                  aria-label='Workflow is locked'
+                  className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)] outline-none focus-visible:ring-1 focus-visible:ring-[var(--text-icon)]'
+                  onClick={(e) => e.preventDefault()}
+                >
                   <Lock
                     className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
                     aria-hidden='true'
                   />
-                </span>
+                </button>
               </Tooltip.Trigger>
               <Tooltip.Content side='bottom'>
                 <span>Locked</span>
               </Tooltip.Content>
             </Tooltip.Root>
           )}
-        </span>
+        </div>
         <div className='min-w-0 flex-1'>
           <div className='flex min-w-0 items-center gap-2'>
             {isEditing ? (

From 802d013d3b1e67ab6c6c13e6b82ff44b5f3a7943 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 2 May 2026 17:34:28 -0700
Subject: [PATCH 3/5] improvement(sidebar): swap lock indicator with more
 button on hover

---
 .../components/folder-item/folder-item.tsx    | 86 ++++++++++---------
 .../workflow-item/workflow-item.tsx           | 66 +++++++-------
 2 files changed, 80 insertions(+), 72 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
index e48cc204bf6..e4a4db14571 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
@@ -514,33 +514,17 @@ export function FolderItem({
           )}
           aria-hidden='true'
         />
-        <span className='relative flex-shrink-0'>
-          {isExpanded ? (
-            <FolderOpen className='h-[16px] w-[16px] text-[var(--text-icon)]' aria-hidden='true' />
-          ) : (
-            <Folder className='h-[16px] w-[16px] text-[var(--text-icon)]' aria-hidden='true' />
-          )}
-          {folder.locked && (
-            <Tooltip.Root>
-              <Tooltip.Trigger asChild>
-                <button
-                  type='button'
-                  aria-label='Folder is locked'
-                  className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)] outline-none focus-visible:ring-1 focus-visible:ring-[var(--text-icon)]'
-                  onClick={(e) => e.preventDefault()}
-                >
-                  <Lock
-                    className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
-                    aria-hidden='true'
-                  />
-                </button>
-              </Tooltip.Trigger>
-              <Tooltip.Content side='bottom'>
-                <span>Locked</span>
-              </Tooltip.Content>
-            </Tooltip.Root>
-          )}
-        </span>
+        {isExpanded ? (
+          <FolderOpen
+            className='h-[16px] w-[16px] flex-shrink-0 text-[var(--text-icon)]'
+            aria-hidden='true'
+          />
+        ) : (
+          <Folder
+            className='h-[16px] w-[16px] flex-shrink-0 text-[var(--text-icon)]'
+            aria-hidden='true'
+          />
+        )}
         {isEditing ? (
           <input
             ref={inputRef}
@@ -570,19 +554,43 @@ export function FolderItem({
                 {folder.name}
               </span>
             </div>
-            <button
-              type='button'
-              aria-label='Folder options'
-              onPointerDown={handleMorePointerDown}
-              onClick={handleMoreClick}
-              className={clsx(
-                'flex h-[18px] w-[18px] flex-shrink-0 items-center justify-center rounded-sm opacity-0 transition-opacity',
-                !isAnyDragActive && 'group-hover:opacity-100',
-                isContextMenuOpen && 'opacity-100'
+            <div className='relative h-[18px] w-[18px] flex-shrink-0'>
+              {folder.locked && (
+                <Tooltip.Root>
+                  <Tooltip.Trigger asChild>
+                    <span
+                      aria-label='Folder is locked'
+                      className={clsx(
+                        'absolute inset-0 flex items-center justify-center transition-opacity',
+                        !isAnyDragActive && 'group-hover:opacity-0',
+                        isContextMenuOpen && 'opacity-0'
+                      )}
+                    >
+                      <Lock
+                        className='h-[14px] w-[14px] text-[var(--text-icon)]'
+                        aria-hidden='true'
+                      />
+                    </span>
+                  </Tooltip.Trigger>
+                  <Tooltip.Content side='bottom'>
+                    <span>Locked</span>
+                  </Tooltip.Content>
+                </Tooltip.Root>
               )}
-            >
-              <MoreHorizontal className='h-[16px] w-[16px] text-[var(--text-icon)]' />
-            </button>
+              <button
+                type='button'
+                aria-label='Folder options'
+                onPointerDown={handleMorePointerDown}
+                onClick={handleMoreClick}
+                className={clsx(
+                  'absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
+                  !isAnyDragActive && 'group-hover:opacity-100',
+                  isContextMenuOpen && 'opacity-100'
+                )}
+              >
+                <MoreHorizontal className='h-[16px] w-[16px] text-[var(--text-icon)]' />
+              </button>
+            </div>
           </div>
         )}
       </div>
diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
index ec24d2dd6f5..2dfa61c50f8 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
@@ -432,36 +432,14 @@ export function WorkflowItem({
         onClick={handleClick}
         onContextMenu={handleContextMenu}
       >
-        <div className='relative flex-shrink-0'>
-          <div
-            className='h-[16px] w-[16px] rounded-sm border-[2.5px]'
-            style={{
-              backgroundColor: workflow.color,
-              borderColor: workflowBorderColor(workflow.color),
-              backgroundClip: 'padding-box',
-            }}
-          />
-          {workflow.locked && (
-            <Tooltip.Root>
-              <Tooltip.Trigger asChild>
-                <button
-                  type='button'
-                  aria-label='Workflow is locked'
-                  className='-right-[4px] -bottom-[4px] absolute flex h-[12px] w-[12px] items-center justify-center rounded-full bg-[var(--surface-1)] outline-none focus-visible:ring-1 focus-visible:ring-[var(--text-icon)]'
-                  onClick={(e) => e.preventDefault()}
-                >
-                  <Lock
-                    className='pointer-events-none h-[10px] w-[10px] text-[var(--text-icon)]'
-                    aria-hidden='true'
-                  />
-                </button>
-              </Tooltip.Trigger>
-              <Tooltip.Content side='bottom'>
-                <span>Locked</span>
-              </Tooltip.Content>
-            </Tooltip.Root>
-          )}
-        </div>
+        <div
+          className='h-[16px] w-[16px] flex-shrink-0 rounded-sm border-[2.5px]'
+          style={{
+            backgroundColor: workflow.color,
+            borderColor: workflowBorderColor(workflow.color),
+            backgroundClip: 'padding-box',
+          }}
+        />
         <div className='min-w-0 flex-1'>
           <div className='flex min-w-0 items-center gap-2'>
             {isEditing ? (
@@ -495,21 +473,43 @@ export function WorkflowItem({
           </div>
         </div>
         {!isEditing && (
-          <>
+          <div className='relative h-[18px] w-[18px] flex-shrink-0'>
+            {workflow.locked && (
+              <Tooltip.Root>
+                <Tooltip.Trigger asChild>
+                  <span
+                    aria-label='Workflow is locked'
+                    className={clsx(
+                      'absolute inset-0 flex items-center justify-center transition-opacity',
+                      !isAnyDragActive && 'group-hover:opacity-0',
+                      isContextMenuOpen && 'opacity-0'
+                    )}
+                  >
+                    <Lock
+                      className='h-[14px] w-[14px] text-[var(--text-icon)]'
+                      aria-hidden='true'
+                    />
+                  </span>
+                </Tooltip.Trigger>
+                <Tooltip.Content side='bottom'>
+                  <span>Locked</span>
+                </Tooltip.Content>
+              </Tooltip.Root>
+            )}
             <button
               type='button'
               aria-label='Workflow options'
               onPointerDown={handleMorePointerDown}
               onClick={handleMoreClick}
               className={clsx(
-                'flex h-[18px] w-[18px] flex-shrink-0 items-center justify-center rounded-sm opacity-0 transition-opacity',
+                'absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
                 !isAnyDragActive && 'group-hover:opacity-100',
                 isContextMenuOpen && 'opacity-100'
               )}
             >
               <MoreHorizontal className='h-[16px] w-[16px] text-[var(--text-icon)]' />
             </button>
-          </>
+          </div>
         )}
       </Link>
 

From 989208960e9b132276d6c1e7e1ff93656ffc5fc7 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 2 May 2026 17:55:29 -0700
Subject: [PATCH 4/5] fix(sidebar): gate pointer-events on lock and more button
 visibility

---
 .../components/folder-item/folder-item.tsx    | 37 +++++++------------
 .../workflow-item/workflow-item.tsx           | 37 +++++++------------
 2 files changed, 26 insertions(+), 48 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
index e4a4db14571..5d1a12f0a58 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
@@ -6,7 +6,6 @@ import { generateId } from '@sim/utils/id'
 import clsx from 'clsx'
 import { ChevronRight, Folder, FolderOpen, MoreHorizontal } from 'lucide-react'
 import { useParams, useRouter } from 'next/navigation'
-import { Tooltip } from '@/components/emcn'
 import { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { getNextWorkflowColor } from '@/lib/workflows/colors'
@@ -556,26 +555,16 @@ export function FolderItem({
             </div>
             <div className='relative h-[18px] w-[18px] flex-shrink-0'>
               {folder.locked && (
-                <Tooltip.Root>
-                  <Tooltip.Trigger asChild>
-                    <span
-                      aria-label='Folder is locked'
-                      className={clsx(
-                        'absolute inset-0 flex items-center justify-center transition-opacity',
-                        !isAnyDragActive && 'group-hover:opacity-0',
-                        isContextMenuOpen && 'opacity-0'
-                      )}
-                    >
-                      <Lock
-                        className='h-[14px] w-[14px] text-[var(--text-icon)]'
-                        aria-hidden='true'
-                      />
-                    </span>
-                  </Tooltip.Trigger>
-                  <Tooltip.Content side='bottom'>
-                    <span>Locked</span>
-                  </Tooltip.Content>
-                </Tooltip.Root>
+                <span
+                  aria-label='Folder is locked'
+                  className={clsx(
+                    'pointer-events-none absolute inset-0 flex items-center justify-center transition-opacity',
+                    !isAnyDragActive && 'group-hover:opacity-0',
+                    isContextMenuOpen && 'opacity-0'
+                  )}
+                >
+                  <Lock className='h-[14px] w-[14px] text-[var(--text-icon)]' aria-hidden='true' />
+                </span>
               )}
               <button
                 type='button'
@@ -583,9 +572,9 @@ export function FolderItem({
                 onPointerDown={handleMorePointerDown}
                 onClick={handleMoreClick}
                 className={clsx(
-                  'absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
-                  !isAnyDragActive && 'group-hover:opacity-100',
-                  isContextMenuOpen && 'opacity-100'
+                  'pointer-events-none absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
+                  !isAnyDragActive && 'group-hover:pointer-events-auto group-hover:opacity-100',
+                  isContextMenuOpen && 'pointer-events-auto opacity-100'
                 )}
               >
                 <MoreHorizontal className='h-[16px] w-[16px] text-[var(--text-icon)]' />
diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
index 2dfa61c50f8..eb95d6345ac 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
@@ -5,7 +5,6 @@ import clsx from 'clsx'
 import { MoreHorizontal } from 'lucide-react'
 import Link from 'next/link'
 import { useParams } from 'next/navigation'
-import { Tooltip } from '@/components/emcn'
 import { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { workflowBorderColor } from '@/lib/workspaces/colors'
@@ -475,26 +474,16 @@ export function WorkflowItem({
         {!isEditing && (
           <div className='relative h-[18px] w-[18px] flex-shrink-0'>
             {workflow.locked && (
-              <Tooltip.Root>
-                <Tooltip.Trigger asChild>
-                  <span
-                    aria-label='Workflow is locked'
-                    className={clsx(
-                      'absolute inset-0 flex items-center justify-center transition-opacity',
-                      !isAnyDragActive && 'group-hover:opacity-0',
-                      isContextMenuOpen && 'opacity-0'
-                    )}
-                  >
-                    <Lock
-                      className='h-[14px] w-[14px] text-[var(--text-icon)]'
-                      aria-hidden='true'
-                    />
-                  </span>
-                </Tooltip.Trigger>
-                <Tooltip.Content side='bottom'>
-                  <span>Locked</span>
-                </Tooltip.Content>
-              </Tooltip.Root>
+              <span
+                aria-label='Workflow is locked'
+                className={clsx(
+                  'pointer-events-none absolute inset-0 flex items-center justify-center transition-opacity',
+                  !isAnyDragActive && 'group-hover:opacity-0',
+                  isContextMenuOpen && 'opacity-0'
+                )}
+              >
+                <Lock className='h-[14px] w-[14px] text-[var(--text-icon)]' aria-hidden='true' />
+              </span>
             )}
             <button
               type='button'
@@ -502,9 +491,9 @@ export function WorkflowItem({
               onPointerDown={handleMorePointerDown}
               onClick={handleMoreClick}
               className={clsx(
-                'absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
-                !isAnyDragActive && 'group-hover:opacity-100',
-                isContextMenuOpen && 'opacity-100'
+                'pointer-events-none absolute inset-0 flex items-center justify-center rounded-sm opacity-0 transition-opacity',
+                !isAnyDragActive && 'group-hover:pointer-events-auto group-hover:opacity-100',
+                isContextMenuOpen && 'pointer-events-auto opacity-100'
               )}
             >
               <MoreHorizontal className='h-[16px] w-[16px] text-[var(--text-icon)]' />

From 90abdb4e0b39e13584c25d1f62204423af1f8695 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 2 May 2026 18:04:03 -0700
Subject: [PATCH 5/5] fix(sidebar): add role=img so lock indicator is announced
 by AT

---
 .../workflow-list/components/folder-item/folder-item.tsx         | 1 +
 .../workflow-list/components/workflow-item/workflow-item.tsx     | 1 +
 2 files changed, 2 insertions(+)

diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
index 5d1a12f0a58..76abe9be072 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/folder-item/folder-item.tsx
@@ -556,6 +556,7 @@ export function FolderItem({
             <div className='relative h-[18px] w-[18px] flex-shrink-0'>
               {folder.locked && (
                 <span
+                  role='img'
                   aria-label='Folder is locked'
                   className={clsx(
                     'pointer-events-none absolute inset-0 flex items-center justify-center transition-opacity',
diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
index eb95d6345ac..27c0fdbc12b 100644
--- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/components/workflow-item/workflow-item.tsx
@@ -475,6 +475,7 @@ export function WorkflowItem({
           <div className='relative h-[18px] w-[18px] flex-shrink-0'>
             {workflow.locked && (
               <span
+                role='img'
                 aria-label='Workflow is locked'
                 className={clsx(
                   'pointer-events-none absolute inset-0 flex items-center justify-center transition-opacity',