fix(designer): Fix issue where scopes could drag/drop into themselves (…

…#4669)
Azure · Apr 22, 2024 · 419a9d9 · 419a9d9
1 parent 1d08e29
commit 419a9d9
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 5 deletions.
diff --git a/libs/designer/src/lib/ui/CustomNodes/ScopeCardNode.tsx b/libs/designer/src/lib/ui/CustomNodes/ScopeCardNode.tsx
@@ -3,7 +3,12 @@ import { getMonitoringError } from '../../common/utilities/error';
 import { moveOperation } from '../../core/actions/bjsworkflow/move';
 import { useMonitoringView, useReadOnly } from '../../core/state/designerOptions/designerOptionsSelectors';
 import { setShowDeleteModal } from '../../core/state/designerView/designerViewSlice';
-import { useBrandColor, useIconUri, useParameterValidationErrors } from '../../core/state/operation/operationSelector';
+import {
+  useBrandColor,
+  useIconUri,
+  useParameterValidationErrors,
+  useTokenDependencies,
+} from '../../core/state/operation/operationSelector';
 import { useIsNodeSelected } from '../../core/state/panel/panelSelectors';
 import { changePanelNode, setSelectedNodeId } from '../../core/state/panel/panelSlice';
 import { useAllOperations, useOperationQuery } from '../../core/state/selectors/actionMetadataSelector';
@@ -106,7 +111,7 @@ const ScopeCardNode = ({ data, targetPosition = Position.Top, sourcePosition = P
       refetch();
     }
   }, [dispatch, parentRunIndex, isMonitoringView, refetch, repetitionName, parenRunData?.status]);
-
+  const dependencies = useTokenDependencies(scopeId);
   const [{ isDragging }, drag, dragPreview] = useDrag(
     () => ({
       type: 'BOX',
@@ -128,7 +133,9 @@ const ScopeCardNode = ({ data, targetPosition = Position.Top, sourcePosition = P
         }
       },
       item: {
-        id: scopeId,
+        id: id,
+        dependencies,
+        isScope: true,
       },
       canDrag: !readOnly,
       collect: (monitor) => ({

diff --git a/libs/designer/src/lib/ui/connections/dropzone.tsx b/libs/designer/src/lib/ui/connections/dropzone.tsx
@@ -2,7 +2,12 @@ import type { AppDispatch } from '../../core';
 import { pasteOperation } from '../../core/actions/bjsworkflow/copypaste';
 import { expandDiscoveryPanel } from '../../core/state/panel/panelSlice';
 import { useUpstreamNodes } from '../../core/state/tokens/tokenSelectors';
-import { useGetAllOperationNodesWithin, useNodeDisplayName, useNodeMetadata } from '../../core/state/workflow/workflowSelectors';
+import {
+  useAllGraphParents,
+  useGetAllOperationNodesWithin,
+  useNodeDisplayName,
+  useNodeMetadata,
+} from '../../core/state/workflow/workflowSelectors';
 import { AllowDropTarget } from './dynamicsvgs/allowdroptarget';
 import { BlockDropTarget } from './dynamicsvgs/blockdroptarget';
 import { MenuDivider, MenuItem, MenuList, Popover, PopoverSurface, PopoverTrigger } from '@fluentui/react-components';
@@ -140,7 +145,8 @@ export const DropZone: React.FC<DropZoneProps> = ({ graphId, parentId, childId,
   const upstreamNodesOfChild = useUpstreamNodes(removeIdTag(childId ?? newParentId ?? graphId));
   const immediateAncestor = useGetAllOperationNodesWithin(parentId && !containsIdTag(parentId) ? parentId : '');
   const upstreamNodes = useMemo(() => new Set([...upstreamNodesOfChild, ...immediateAncestor]), [immediateAncestor, upstreamNodesOfChild]);
-
+  const upstreamScopeArr = useAllGraphParents(graphId);
+  const upstreamScopes = useMemo(() => new Set(upstreamScopeArr), [upstreamScopeArr]);
   const [{ isOver, canDrop }, drop] = useDrop(
     () => ({
       accept: 'BOX',
@@ -149,13 +155,20 @@ export const DropZone: React.FC<DropZoneProps> = ({ graphId, parentId, childId,
         id: string;
         dependencies?: string[];
         graphId?: string;
+        isScope?: boolean;
       }) => {
         // This supports preventing moving a node with a dependency above its upstream node
         for (const dec of item.dependencies ?? []) {
           if (!upstreamNodes.has(dec)) {
             return false;
           }
         }
+        if (item.isScope) {
+          const scopeNodeId = removeIdTag(item.id);
+          if (upstreamScopes.has(scopeNodeId)) {
+            return false;
+          }
+        }
         // TODO: Support preventing moving a node below downstream output
         // TODO: Support calculating dependencies when dragging of scopes
         return item.id !== childId && item.id !== parentId;