fix(reactflowUtils.ts): fix nullability issues and improve variable names for better readability

refactor(reactflowUtils.ts): update targetHandle and sourceHandle to use JSON stringified values for better compatibility
This commit is contained in:
anovazzi1 2023-09-13 17:50:51 -03:00
commit 6d04f49443

View file

@ -702,66 +702,65 @@ export function ungroupNode(
groupNode: NodeDataType, groupNode: NodeDataType,
BaseFlow: ReactFlowJsonObject BaseFlow: ReactFlowJsonObject
) { ) {
const { template } = groupNode.node; const { template,flow } = groupNode.node!;
const { flow } = groupNode.node; const gNodes: NodeType[] = flow!.data!.nodes;
const gNodes: NodeType[] = flow.data.nodes; const gEdges = flow!.data!.edges;
const gEdges = flow.data.edges;
//redirect edges to correct proxy node //redirect edges to correct proxy node
let updatedEdges: Edge[] = []; let updatedEdges: Edge[] = [];
BaseFlow.edges.forEach((edge) => { BaseFlow.edges.forEach((edge) => {
let newEdge = _.cloneDeep(edge); let newEdge = _.cloneDeep(edge);
if (newEdge.target === groupNode.id) { if (newEdge.target === groupNode.id) {
if (newEdge.targetHandle.split("|").length > 3) { const targetHandle:targetHandleType = newEdge.data.targetHandle;
let type = newEdge.targetHandle.split("|")[0]; if (targetHandle.proxy) {
let field = newEdge.targetHandle.split("|")[4]; let type = targetHandle.type;
let proxy = newEdge.targetHandle.split("|")[3]; let field = targetHandle.proxy.field;
let node = gNodes.find((n) => n.id === proxy); let proxyId = targetHandle.proxy.id;
console.log(node); let inputTypes = targetHandle.inputTypes;
let node:NodeType = gNodes.find((n) => n.id === proxyId)!;
if (node) { if (node) {
newEdge.target = proxy; newEdge.target = proxyId;
if (node.type === "groupNode") { let newTargetHandle: targetHandleType = {
newEdge.targetHandle = fieldName: field,
type + type,
"|" + id: proxyId}
field + if (node.data.node?.flow) {
"|" + newTargetHandle.proxy =
proxy + {field:node.data.node.template[field].proxy?.field!,
"|" + id:node.data.node.template[field].proxy?.id!}
node.data.node.template[field].proxy.id + }
"|" + if(inputTypes){
node.data.node.template[field].proxy.field; newTargetHandle.inputTypes = inputTypes;
} else { }
newEdge.targetHandle = type + "|" + field + "|" + proxy; newEdge.targetHandle = scapedJSONStringfy(newTargetHandle);
} }
updatedEdges.push(newEdge);
} }
} }
}
if (newEdge.source === groupNode.id) { if (newEdge.source === groupNode.id) {
const lastNode = _.cloneDeep(findLastNode(flow.data)); const lastNode = _.cloneDeep(findLastNode(flow!.data!));
newEdge.source = lastNode.id; newEdge.source = lastNode!.id;
let sourceHandle = newEdge.sourceHandle.split("|"); let newSourceHandle: sourceHandleType = scapeJSONParse(newEdge.sourceHandle!);
sourceHandle[1] = lastNode.id; newSourceHandle.id = lastNode!.id;
newEdge.sourceHandle = sourceHandle.join("|"); newEdge.sourceHandle = scapedJSONStringfy(newSourceHandle);
updatedEdges.push(newEdge);
} }
}); updatedEdges.push(newEdge);
});
//update template values
Object.keys(template).forEach((key) => { Object.keys(template).forEach((key) => {
let { field, id } = template[key].proxy; let { field, id } = template[key].proxy!;
let nodeIndex = gNodes.findIndex((n) => n.id === id); let nodeIndex = gNodes.findIndex((n) => n.id === id);
if (nodeIndex !== -1) { if (nodeIndex !== -1) {
let display_name: string; let display_name: string;
let show = gNodes[nodeIndex].data.node.template[field].show; let show = gNodes[nodeIndex].data.node!.template[field].show;
let advanced = gNodes[nodeIndex].data.node.template[field].advanced; let advanced = gNodes[nodeIndex].data.node!.template[field].advanced;
if (gNodes[nodeIndex].data.node.template[field].display_name) { if (gNodes[nodeIndex].data.node!.template[field].display_name) {
display_name = gNodes[nodeIndex].data.node.template[field].display_name; display_name = gNodes[nodeIndex].data.node!.template[field].display_name;
} else { } else {
display_name = gNodes[nodeIndex].data.node.template[field].name; display_name = gNodes[nodeIndex].data.node!.template[field].name;
} }
gNodes[nodeIndex].data.node.template[field] = template[key]; gNodes[nodeIndex].data.node!.template[field] = template[key];
gNodes[nodeIndex].data.node.template[field].show = show; gNodes[nodeIndex].data.node!.template[field].show = show;
gNodes[nodeIndex].data.node.template[field].advanced = advanced; gNodes[nodeIndex].data.node!.template[field].advanced = advanced;
gNodes[nodeIndex].data.node.template[field].display_name = display_name; gNodes[nodeIndex].data.node!.template[field].display_name = display_name;
} }
}); });