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 68719f8815..3c76650ac6 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 @@ -32,6 +32,7 @@ const logger = createLogger('FolderItem') interface FolderItemProps { folder: FolderTreeNode level: number + dragDisabled?: boolean hoverHandlers?: { onDragEnter?: (e: React.DragEvent) => void onDragLeave?: (e: React.DragEvent) => void @@ -51,6 +52,7 @@ interface FolderItemProps { export function FolderItem({ folder, level, + dragDisabled = false, hoverHandlers, onDragStart: onDragStartProp, onDragEnd: onDragEndProp, @@ -294,7 +296,7 @@ export function FolderItem({ onClick={handleClick} onKeyDown={handleKeyDown} onContextMenu={handleContextMenu} - draggable={!isEditing} + draggable={!isEditing && !dragDisabled} onDragStart={handleDragStart} onDragEnd={handleDragEnd} {...hoverHandlers} 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 52aac85189..ddea49b135 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 @@ -28,6 +28,7 @@ interface WorkflowItemProps { workflow: WorkflowMetadata active: boolean level: number + dragDisabled?: boolean onWorkflowClick: (workflowId: string, shiftKey: boolean, metaKey: boolean) => void onDragStart?: () => void onDragEnd?: () => void @@ -44,6 +45,7 @@ export function WorkflowItem({ workflow, active, level, + dragDisabled = false, onWorkflowClick, onDragStart: onDragStartProp, onDragEnd: onDragEndProp, @@ -307,7 +309,7 @@ export function WorkflowItem({ : '', isDragging ? 'opacity-50' : '' )} - draggable={!isEditing} + draggable={!isEditing && !dragDisabled} onDragStart={handleDragStart} onDragEnd={handleDragEnd} onClick={handleClick} diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/workflow-list.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/workflow-list.tsx index 363a6be072..501ec347b5 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/workflow-list.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workflow-list/workflow-list.tsx @@ -32,6 +32,7 @@ function compareByOrder) => void fileInputRef: React.RefObject scrollContainerRef: React.RefObject @@ -58,6 +59,7 @@ const DropIndicatorLine = memo(function DropIndicatorLine({ export function WorkflowList({ regularWorkflows, isLoading = false, + canReorder = true, handleFileChange, fileInputRef, scrollContainerRef, @@ -73,6 +75,7 @@ export function WorkflowList({ const { dropIndicator, isDragging, + disabled: dragDisabled, setScrollContainer, createWorkflowDragHandlers, createFolderDragHandlers, @@ -81,7 +84,7 @@ export function WorkflowList({ createRootDropZone, handleDragStart, handleDragEnd, - } = useDragDrop() + } = useDragDrop({ disabled: !canReorder }) useEffect(() => { if (scrollContainerRef.current) { @@ -180,6 +183,7 @@ export function WorkflowList({ workflow={workflow} active={isWorkflowActive(workflow.id)} level={level} + dragDisabled={dragDisabled} onWorkflowClick={handleWorkflowClick} onDragStart={() => handleDragStart('workflow', folderId)} onDragEnd={handleDragEnd} @@ -192,6 +196,7 @@ export function WorkflowList({ [ dropIndicator, isWorkflowActive, + dragDisabled, createWorkflowDragHandlers, handleWorkflowClick, handleDragStart, @@ -259,6 +264,7 @@ export function WorkflowList({ handleDragStart('folder', parentFolderId)} onDragEnd={handleDragEnd} /> @@ -291,6 +297,7 @@ export function WorkflowList({ expandedFolders, dropIndicator, isDragging, + dragDisabled, createFolderDragHandlers, createEmptyFolderDropZone, createFolderContentDropZone, diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts index e2613ff6a3..8d0b76b526 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts +++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/hooks/use-drag-drop.ts @@ -18,7 +18,12 @@ export interface DropIndicator { folderId: string | null } -export function useDragDrop() { +interface UseDragDropOptions { + disabled?: boolean +} + +export function useDragDrop(options: UseDragDropOptions = {}) { + const { disabled = false } = options const [dropIndicator, setDropIndicator] = useState(null) const [isDragging, setIsDragging] = useState(false) const [hoverFolderId, setHoverFolderId] = useState(null) @@ -587,9 +592,31 @@ export function useDragDrop() { scrollContainerRef.current = element }, []) + const noopDragHandlers = { + onDragOver: (e: React.DragEvent) => e.preventDefault(), + onDrop: (e: React.DragEvent) => e.preventDefault(), + } + + if (disabled) { + return { + dropIndicator: null, + isDragging: false, + disabled: true, + setScrollContainer, + createWorkflowDragHandlers: () => noopDragHandlers, + createFolderDragHandlers: () => ({ ...noopDragHandlers, onDragLeave: () => {} }), + createEmptyFolderDropZone: () => noopDragHandlers, + createFolderContentDropZone: () => noopDragHandlers, + createRootDropZone: () => ({ ...noopDragHandlers, onDragLeave: () => {} }), + handleDragStart: () => {}, + handleDragEnd: () => {}, + } + } + return { dropIndicator, isDragging, + disabled: false, setScrollContainer, createWorkflowDragHandlers, createFolderDragHandlers, diff --git a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx index cb4b7a5bf8..7566279404 100644 --- a/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx +++ b/apps/sim/app/workspace/[workspaceId]/w/components/sidebar/sidebar.tsx @@ -635,6 +635,7 @@ export function Sidebar() {