improvement(lock): lock icon next to entity (#4401)

Author: icecrasher321

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 { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { getNextWorkflowColor } from '@/lib/workflows/colors'
 import { useUserPermissionsContext } from '@/app/workspace/[workspaceId]/providers/workspace-permissions-provider'
@@ -550,6 +551,12 @@ export function FolderItem({
             >
               {folder.name}
             </span>
+            {folder.locked && (
+              <Lock
+                className='h-[12px] w-[12px] flex-shrink-0 pointer-events-none text-[var(--text-icon)]'
+                aria-label='Folder is locked'
+              />
+            )}
             <button
               type='button'
               aria-label='Folder options'

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 { Lock } from '@/components/emcn/icons'
 import { SIM_RESOURCES_DRAG_TYPE } from '@/lib/copilot/resource-types'
 import { workflowBorderColor } from '@/lib/workspaces/colors'
 import { useUserPermissionsContext } from '@/app/workspace/[workspaceId]/providers/workspace-permissions-provider'
@@ -467,6 +468,12 @@ export function WorkflowItem({
                 {workflow.name}
               </div>
             )}
+            {!isEditing && workflow.locked && (
+              <Lock
+                className='h-[12px] w-[12px] flex-shrink-0 pointer-events-none text-[var(--text-icon)]'
+                aria-label='Workflow is locked'
+              />
+            )}
             {!isEditing && <Avatars workflowId={workflow.id} />}
           </div>
         </div>