diff --git a/src/frontend/src/types/utils/reactflowUtils.ts b/src/frontend/src/types/utils/reactflowUtils.ts new file mode 100644 index 000000000..ecbbda4e4 --- /dev/null +++ b/src/frontend/src/types/utils/reactflowUtils.ts @@ -0,0 +1,10 @@ +import { Edge } from "reactflow"; +import { NodeType } from "../flow"; + +export type cleanEdgesType = { + flow: { + edges: Edge[]; + nodes: NodeType[]; + }; + updateEdge: (edge: Edge[]) => void; +}; diff --git a/src/frontend/src/util/reactflowUtils.ts b/src/frontend/src/util/reactflowUtils.ts new file mode 100644 index 000000000..c6059b39a --- /dev/null +++ b/src/frontend/src/util/reactflowUtils.ts @@ -0,0 +1,47 @@ +import _ from "lodash"; +import { cleanEdgesType } from "./../types/utils/reactflowUtils"; + +export function cleanEdges({ + flow: { edges, nodes }, + updateEdge, +}: cleanEdgesType) { + let newEdges = _.cloneDeep(edges); + console.log("cleanEdges", newEdges); + edges.forEach((edge) => { + // check if the source and target node still exists + const sourceNode = nodes.find((node) => node.id === edge.source); + const targetNode = nodes.find((node) => node.id === edge.target); + if (!sourceNode || !targetNode) { + newEdges = newEdges.filter((e) => e.id !== edge.id); + } + // check if the source and target handle still exists + if (sourceNode && targetNode) { + const sourceHandle = edge.sourceHandle; //right + const targetHandle = edge.targetHandle; //left + if (targetHandle) { + const field = targetHandle.split("|")[1]; + const id = + (targetNode.data.node.template[field].input_types?.join(";") ?? + targetNode.data.node.template[field].type) + + "|" + + field + + "|" + + targetNode.data.id; + if (id !== targetHandle) { + newEdges = newEdges.filter((e) => e.id !== edge.id); + } + } + if (sourceHandle) { + const id = [ + sourceNode.data.type, + sourceNode.data.id, + ...sourceNode.data.node.base_classes, + ].join("|"); + if (id !== sourceHandle) { + newEdges = newEdges.filter((e) => e.id !== edge.id); + } + } + } + }); + updateEdge(newEdges); +}