node selected

web/app/components/workflow/custom-edge.tsx

@@ -76,15 +76,16 @@ const CustomEdge = ({
         id={id}
         path={edgePath}
         style={{
-          stroke: (selected || data?._connectedNodeIsHovering || data?._runned) ? '#2970FF' : '#D0D5DD',
+          stroke: (selected || data?._connectedNodeIsHovering || data?._runned || data?._connectedNodeIsSelected) ? '#2970FF' : '#D0D5DD',
           strokeWidth: 2,
         }}
       />
       <EdgeLabelRenderer>
         <div
           className={`
-            nopan nodrag hover:scale-150 transition-all
+            nopan nodrag hover:scale-150
             ${data?._hovering ? 'block' : 'hidden'}
+            ${data?._connectedNodeIsSelected && '!block'}
             ${open && '!block'}
           `}
           style={{

web/app/components/workflow/hooks/use-nodes-interactions.ts

@@ -246,6 +246,8 @@ export const useNodesInteractions = () => {
     const {
       getNodes,
       setNodes,
+      edges,
+      setEdges,
     } = store.getState()
 
     const nodes = getNodes()
@@ -263,6 +265,26 @@ export const useNodesInteractions = () => {
       })
     })
     setNodes(newNodes)
+
+    const connectedEdges = getConnectedEdges([{ id: nodeId } as Node], edges).map(edge => edge.id)
+    const newEdges = produce(edges, (draft) => {
+      draft.forEach((edge) => {
+        if (connectedEdges.includes(edge.id)) {
+          edge.data = {
+            ...edge.data,
+            _connectedNodeIsSelected: !cancelSelection,
+          }
+        }
+        else {
+          edge.data = {
+            ...edge.data,
+            _connectedNodeIsSelected: false,
+          }
+        }
+      })
+    })
+    setEdges(newEdges)
+
     handleSyncWorkflowDraft()
   }, [store, handleSyncWorkflowDraft, getNodesReadOnly, workflowStore])
 

web/app/components/workflow/types.ts

@@ -45,6 +45,7 @@ export type CommonNodeType<T = {}> = {
 export type CommonEdgeType = {
   _hovering?: boolean
   _connectedNodeIsHovering?: boolean
+  _connectedNodeIsSelected?: boolean
   _runned?: boolean
   sourceType: BlockEnum
   targetType: BlockEnum

web/app/components/workflow/utils.ts

@@ -57,20 +57,38 @@ export const initialNodes = (nodes: Node[], edges: Edge[]) => {
 }
 
 export const initialEdges = (edges: Edge[], nodes: Node[]) => {
+  let selectedNode: Node | null = null
   const nodesMap = nodes.reduce((acc, node) => {
     acc[node.id] = node
 
+    if (node.data?.selected)
+      selectedNode = node
+
     return acc
   }, {} as Record<string, Node>)
   return edges.map((edge) => {
     edge.type = 'custom'
 
-    if (!edge.data?.sourceType)
-      edge.data = { ...edge.data, sourceType: nodesMap[edge.source].data.type! } as any
+    if (!edge.data?.sourceType) {
+      edge.data = {
+        ...edge.data,
+        sourceType: nodesMap[edge.source].data.type!,
+      } as any
+    }
 
-    if (!edge.data?.targetType)
-      edge.data = { ...edge.data, targetType: nodesMap[edge.target].data.type! } as any
+    if (!edge.data?.targetType) {
+      edge.data = {
+        ...edge.data,
+        targetType: nodesMap[edge.target].data.type!,
+      } as any
+    }
 
+    if (selectedNode) {
+      edge.data = {
+        ...edge.data,
+        _connectedNodeIsSelected: edge.source === selectedNode.id || edge.target === selectedNode.id,
+      } as any
+    }
     return edge
   })
 }