From b3f5b25eba8fc53e82ae5f371f363bd916a013c1 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 10:52:36 +0100 Subject: [PATCH 1/9] Removed direct attribution on data on updateFlowPosition --- .../components/nodeToolbarComponent/index.tsx | 4 +-- src/frontend/src/utils/reactflowUtils.ts | 28 +++++++++++-------- 2 files changed, 18 insertions(+), 14 deletions(-) diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index 99e94f233..bcebb7d18 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -69,6 +69,7 @@ export default function NodeToolbarComponent({ const nodes = useFlowStore((state) => state.nodes); const edges = useFlowStore((state) => state.edges); const setNodes = useFlowStore((state) => state.setNodes); + const setNode = useFlowStore((state) => state.setNode); const setEdges = useFlowStore((state) => state.setEdges); const saveComponent = useFlowsManagerStore((state) => state.saveComponent); @@ -124,8 +125,7 @@ export default function NodeToolbarComponent({ break; case "ungroup": takeSnapshot(); - updateFlowPosition(position, data.node?.flow!); - expandGroupNode(data, nodes, edges, setNodes, setEdges); + expandGroupNode(data.id, updateFlowPosition(position, data.node?.flow!), data.node!.template, nodes, edges, setNodes, setEdges); break; case "override": setShowOverrideModal(true); diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts index 902f3c82c..297a18c88 100644 --- a/src/frontend/src/utils/reactflowUtils.ts +++ b/src/frontend/src/utils/reactflowUtils.ts @@ -651,10 +651,13 @@ export function updateFlowPosition(NewPosition: XYPosition, flow: FlowType) { x: NewPosition.x - middlePoint.x, y: NewPosition.y - middlePoint.y, }; - flow.data!.nodes.forEach((node) => { - node.position.x += deltaPosition.x; - node.position.y += deltaPosition.y; - }); + return {...flow, data: {...flow.data!, nodes: flow.data!.nodes.map((node) => ({ + ...node, + position: { + x: node.position.x + deltaPosition.x, + y: node.position.y + deltaPosition.y, + }, + }))}}; } export function concatFlows( @@ -1018,13 +1021,14 @@ export function processFlowEdges(flow: FlowType) { } export function expandGroupNode( - groupNode: NodeDataType, + id: string, + flow: FlowType, + template: APITemplateType, nodes: Node[], edges: Edge[], setNodes: (update: Node[] | ((oldState: Node[]) => Node[])) => void, - setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void + setEdges: (update: Edge[] | ((oldState: Edge[]) => Edge[])) => void, ) { - const { template, flow } = _.cloneDeep(groupNode.node!); const idsMap = updateIds(flow!.data!); updateProxyIdsOnTemplate(template, idsMap); let flowEdges = edges; @@ -1035,7 +1039,7 @@ export function expandGroupNode( let updatedEdges: Edge[] = []; flowEdges.forEach((edge) => { let newEdge = _.cloneDeep(edge); - if (newEdge.target === groupNode.id) { + if (newEdge.target === id) { const targetHandle: targetHandleType = newEdge.data.targetHandle; if (targetHandle.proxy) { let type = targetHandle.type; @@ -1062,7 +1066,7 @@ export function expandGroupNode( } } } - if (newEdge.source === groupNode.id) { + if (newEdge.source === id) { const lastNode = _.cloneDeep(findLastNode(flow!.data!)); newEdge.source = lastNode!.id; let newSourceHandle: sourceHandleType = scapeJSONParse( @@ -1072,7 +1076,7 @@ export function expandGroupNode( newEdge.data.sourceHandle = newSourceHandle; newEdge.sourceHandle = scapedJSONStringfy(newSourceHandle); } - if (edge.target === groupNode.id || edge.source === groupNode.id) { + if (edge.target === id || edge.source === id) { updatedEdges.push(newEdge); } }); @@ -1109,12 +1113,12 @@ export function expandGroupNode( }); const filteredNodes = [ - ...nodes.filter((n) => n.id !== groupNode.id), + ...nodes.filter((n) => n.id !== id), ...gNodes, ]; const filteredEdges = [ ...edges.filter( - (e) => e.target !== groupNode.id && e.source !== groupNode.id + (e) => e.target !== id && e.source !== id ), ...gEdges, ...updatedEdges, From 30709221efc98ff864571454720319275c797dfb Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 10:54:47 +0100 Subject: [PATCH 2/9] removed direct attribution of official attribute --- src/frontend/src/utils/reactflowUtils.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts index 297a18c88..e25d648dd 100644 --- a/src/frontend/src/utils/reactflowUtils.ts +++ b/src/frontend/src/utils/reactflowUtils.ts @@ -1161,13 +1161,12 @@ export function createFlowComponent( nodeData: NodeDataType, version: string ): FlowType { - nodeData.node!.official = false; const flowNode: FlowType = { data: { edges: [], nodes: [ { - data: nodeData, + data: {...nodeData, node: {...nodeData.node, official: false}}, id: nodeData.id, position: { x: 0, y: 0 }, type: "genericNode", From cc548ba6042463e9ca62e2ac013cc6ff0122cfa3 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 10:56:55 +0100 Subject: [PATCH 3/9] removed unused createFlowComponent --- .../pages/FlowPage/components/nodeToolbarComponent/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index bcebb7d18..cf1adf925 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -113,7 +113,7 @@ export default function NodeToolbarComponent({ setShowNode(data.showNode ?? true ? false : true); break; case "Download": - downloadNode(createFlowComponent(cloneDeep(data), version)); + downloadNode(flowComponent!); break; case "SaveAll": saveComponent(cloneDeep(data), false); From 7ba26101847197d87e561eeb9cbd35952217079c Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:10:42 +0100 Subject: [PATCH 4/9] refactored number of handles --- .../components/parameterComponent/index.tsx | 3 +- .../src/CustomNodes/GenericNode/index.tsx | 30 +++++-------------- .../components/nodeToolbarComponent/index.tsx | 19 ++---------- src/frontend/src/types/components/index.ts | 4 +-- 4 files changed, 11 insertions(+), 45 deletions(-) diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx index 9720a9862..7201bba3b 100644 --- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx @@ -57,7 +57,6 @@ export default function ParameterComponent({ proxy, showNode, index = "", - isMinimized, }: ParameterComponentType): JSX.Element { const ref = useRef(null); const refHtml = useRef(null); @@ -289,7 +288,7 @@ export default function ParameterComponent({ className={classNames( left ? "my-12 -ml-0.5 " : " my-12 -mr-0.5 ", "h-3 w-3 rounded-full border-2 bg-background", - isMinimized ? "mt-0" : "" + !showNode ? "mt-0" : "" )} style={{ borderColor: color, diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index c8f2d2349..28ce8fc88 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { NodeToolbar, useUpdateNodeInternals } from "reactflow"; +import { NodeToolbar } from "reactflow"; import ShadTooltip from "../../components/ShadTooltipComponent"; import Tooltip from "../../components/TooltipComponent"; import IconComponent from "../../components/genericIconComponent"; @@ -40,15 +40,12 @@ export default function GenericNode({ ); const [validationStatus, setValidationStatus] = useState(null); - const [handles, setHandles] = useState([]); - const [isMinimized, setIsMinimized] = useState(false); - let numberOfInputs: boolean[] = []; - const updateNodeInternals = useUpdateNodeInternals(); + const [handles, setHandles] = useState(0); const takeSnapshot = useFlowsManagerStore((state) => state.takeSnapshot); function countHandles(): void { - numberOfInputs = Object.keys(data.node!.template) + let count = Object.keys(data.node!.template) .filter((templateField) => templateField.charAt(0) !== "_") .map((templateCamp) => { const { template } = data.node!; @@ -56,24 +53,20 @@ export default function GenericNode({ if (!template[templateCamp].show) return false; switch (template[templateCamp].type) { case "str": - return false; case "bool": - return false; case "float": - return false; case "code": - return false; case "prompt": - return false; case "file": - return false; case "int": return false; default: return true; } - }); - setHandles(numberOfInputs); + }) + .reduce((total, value) => total + (value ? 1 : 0), 0); + + setHandles(count); } useEffect(() => { @@ -114,10 +107,6 @@ export default function GenericNode({ const nameEditable = data.node?.flow || data.type === "CustomComponent"; - useEffect(() => { - updateNodeInternals(data.id); - }, [isMinimized]); - return ( <> @@ -136,7 +125,6 @@ export default function GenericNode({ }} numberOfHandles={handles} showNode={showNode} - setIsMinimized={setIsMinimized} > @@ -290,7 +278,6 @@ export default function GenericNode({ } proxy={data.node?.template[templateField].proxy} showNode={showNode} - isMinimized={isMinimized} /> ) )} @@ -317,7 +304,6 @@ export default function GenericNode({ type={data.node?.base_classes.join("|")} left={false} showNode={showNode} - isMinimized={isMinimized} /> )} @@ -522,7 +508,6 @@ export default function GenericNode({ } proxy={data.node?.template[templateField].proxy} showNode={showNode} - isMinimized={isMinimized} /> ) : ( <> @@ -566,7 +551,6 @@ export default function GenericNode({ type={data.node?.base_classes.join("|")} left={false} showNode={showNode} - isMinimized={isMinimized} /> )} diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index cf1adf925..ec07193b8 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -32,7 +32,6 @@ export default function NodeToolbarComponent({ setShowNode, numberOfHandles, showNode, - setIsMinimized, }: nodeToolbarPropsType): JSX.Element { const nodeLength = Object.keys(data.node!.template).filter( (templateField) => @@ -54,22 +53,13 @@ export default function NodeToolbarComponent({ const hasApiKey = useStoreStore((state) => state.hasApiKey); const validApiKey = useStoreStore((state) => state.validApiKey); - function canMinimize() { - let countHandles: number = 0; - numberOfHandles.forEach((bool) => { - if (bool) countHandles += 1; - }); - if (countHandles > 1) return false; - return true; - } - const isMinimal = canMinimize(); + const isMinimal = numberOfHandles <= 1; const isGroup = data.node?.flow ? true : false; const paste = useFlowStore((state) => state.paste); const nodes = useFlowStore((state) => state.nodes); const edges = useFlowStore((state) => state.edges); const setNodes = useFlowStore((state) => state.setNodes); - const setNode = useFlowStore((state) => state.setNode); const setEdges = useFlowStore((state) => state.setEdges); const saveComponent = useFlowsManagerStore((state) => state.saveComponent); @@ -78,7 +68,6 @@ export default function NodeToolbarComponent({ const takeSnapshot = useFlowsManagerStore((state) => state.takeSnapshot); const [showModalAdvanced, setShowModalAdvanced] = useState(false); const [showconfirmShare, setShowconfirmShare] = useState(false); - const [selectedValue, setSelectedValue] = useState(""); const [showOverrideModal, setShowOverrideModal] = useState(false); const [flowComponent, setFlowComponent] = useState(); @@ -99,10 +88,6 @@ export default function NodeToolbarComponent({ showconfirmShare, ]); - useEffect(() => { - setIsMinimized(!showNode); - }, [showNode]); - const handleSelectChange = (event) => { switch (event) { case "advanced": @@ -196,7 +181,7 @@ export default function NodeToolbarComponent({ )} -
diff --git a/src/frontend/src/types/components/index.ts b/src/frontend/src/types/components/index.ts index 6ed102590..d78ce867c 100644 --- a/src/frontend/src/types/components/index.ts +++ b/src/frontend/src/types/components/index.ts @@ -53,7 +53,6 @@ export type ParameterComponentType = { showNode?: boolean; index?: string; onCloseModal?: (close: boolean) => void; - isMinimized?: boolean; }; export type InputListComponentType = { value: string[]; @@ -478,9 +477,8 @@ export type nodeToolbarPropsType = { deleteNode: (idx: string) => void; position: XYPosition; setShowNode: (boolean: any) => void; - numberOfHandles: boolean[] | []; + numberOfHandles: number; showNode: boolean; - setIsMinimized: (boolean: boolean) => void; }; export type parsedDataType = { From f93724eb4445724298d33eac5d32eecb8eb16416 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:18:33 +0100 Subject: [PATCH 5/9] Fixed takeSnapshot deleting history if snapshot was equal to the previous --- src/frontend/src/stores/flowsManagerStore.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/frontend/src/stores/flowsManagerStore.ts b/src/frontend/src/stores/flowsManagerStore.ts index a75b68015..0204d600c 100644 --- a/src/frontend/src/stores/flowsManagerStore.ts +++ b/src/frontend/src/stores/flowsManagerStore.ts @@ -332,9 +332,11 @@ const useFlowsManagerStore = create((set, get) => ({ const pastLength = past[currentFlowId]?.length ?? 0; if ( pastLength > 0 && - JSON.stringify(past[currentFlowId][pastLength - 1]) !== + JSON.stringify(past[currentFlowId][pastLength - 1]) === JSON.stringify(newState) - ) { + ) + return; + if (pastLength > 0) { past[currentFlowId] = past[currentFlowId].slice( pastLength - defaultOptions.maxHistorySize + 1, pastLength From abe597823bf15279d03df5295c62b01ee4502af8 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:23:16 +0100 Subject: [PATCH 6/9] Fixed undoing not fixing group edges --- src/frontend/src/stores/flowsManagerStore.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/stores/flowsManagerStore.ts b/src/frontend/src/stores/flowsManagerStore.ts index 0204d600c..90d818ef9 100644 --- a/src/frontend/src/stores/flowsManagerStore.ts +++ b/src/frontend/src/stores/flowsManagerStore.ts @@ -24,6 +24,7 @@ import useAlertStore from "./alertStore"; import { useDarkStore } from "./darkStore"; import useFlowStore from "./flowStore"; import { useTypesStore } from "./typesStore"; +import { cloneDeep } from "lodash"; let saveTimeoutId: NodeJS.Timeout | null = null; @@ -328,7 +329,8 @@ const useFlowsManagerStore = create((set, get) => ({ takeSnapshot: () => { const currentFlowId = get().currentFlowId; // push the current graph to the past state - const newState = useFlowStore.getState(); + const flowStore = useFlowStore.getState(); + const newState = {nodes: cloneDeep(flowStore.nodes), edges: cloneDeep(flowStore.edges)}; const pastLength = past[currentFlowId]?.length ?? 0; if ( pastLength > 0 && From 911257c92fdf0c9bfd2d180ac21a15a96aa04cb2 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:31:24 +0100 Subject: [PATCH 7/9] Fix console error on code component --- src/frontend/src/modals/codeAreaModal/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index ff2f6a0be..a5ec3223b 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -146,6 +146,7 @@ export default function CodeAreaModal({ From 5984a45178aa7c4db55841178801d070500e6ea4 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:37:11 +0100 Subject: [PATCH 8/9] removed unused utils function --- src/frontend/src/utils/reactflowUtils.ts | 125 +++-------------------- 1 file changed, 13 insertions(+), 112 deletions(-) diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts index e25d648dd..208cae435 100644 --- a/src/frontend/src/utils/reactflowUtils.ts +++ b/src/frontend/src/utils/reactflowUtils.ts @@ -1,4 +1,4 @@ -import _, { cloneDeep } from "lodash"; +import { cloneDeep } from "lodash"; import { Connection, Edge, @@ -43,7 +43,7 @@ import { const uid = new ShortUniqueId({ length: 5 }); export function cleanEdges(nodes: Node[], edges: Edge[]) { - let newEdges = _.cloneDeep(edges); + let newEdges = cloneDeep(edges); edges.forEach((edge) => { // check if the source and target node still exists const sourceNode = nodes.find((node) => node.id === edge.source); @@ -86,7 +86,7 @@ export function cleanEdges(nodes: Node[], edges: Edge[]) { } export function unselectAllNodes({ updateNodes, data }: unselectAllNodesType) { - let newNodes = _.cloneDeep(data); + let newNodes = cloneDeep(data); newNodes.forEach((node: Node) => { node.selected = false; }); @@ -127,7 +127,7 @@ export function isValidConnection( } export function removeApiKeys(flow: FlowType): FlowType { - let cleanFLow = _.cloneDeep(flow); + let cleanFLow = cloneDeep(flow); cleanFLow.data!.nodes.forEach((node) => { for (const key in node.data.node.template) { if (node.data.node.template[key].password) { @@ -142,7 +142,7 @@ export function updateTemplate( reference: APITemplateType, objectToUpdate: APITemplateType ): APITemplateType { - let clonedObject: APITemplateType = _.cloneDeep(reference); + let clonedObject: APITemplateType = cloneDeep(reference); // Loop through each key in the reference object for (const key in clonedObject) { @@ -347,7 +347,7 @@ export function updateEdgesHandleIds({ edges, nodes, }: updateEdgesHandleIdsType): Edge[] { - let newEdges = _.cloneDeep(edges); + let newEdges = cloneDeep(edges); newEdges.forEach((edge) => { const sourceNodeId = edge.source; const targetNodeId = edge.target; @@ -749,7 +749,7 @@ export function mergeNodeTemplates({ */ let template: APITemplateType = {}; nodes.forEach((node) => { - let nodeTemplate = _.cloneDeep(node.data.node!.template); + let nodeTemplate = cloneDeep(node.data.node!.template); Object.keys(nodeTemplate) .filter((field_name) => field_name.charAt(0) !== "_") .forEach((key) => { @@ -834,9 +834,9 @@ export function generateNodeFromFlow( getNodeId: (type: string) => string ): NodeType { const { nodes } = flow.data!; - const outputNode = _.cloneDeep(findLastNode(flow.data!)); + const outputNode = cloneDeep(findLastNode(flow.data!)); const position = getMiddlePoint(nodes); - let data = _.cloneDeep(flow); + let data = cloneDeep(flow); const id = getNodeId(outputNode?.data.type!); const newGroupNode: NodeType = { data: { @@ -897,94 +897,6 @@ export function connectedInputNodesOnHandle( return connectedNodes; } -export function ungroupNode( - groupNode: NodeDataType, - BaseFlow: ReactFlowJsonObject -) { - const { template, flow } = groupNode.node!; - const gNodes: NodeType[] = flow!.data!.nodes; - const gEdges = flow!.data!.edges; - //redirect edges to correct proxy node - let updatedEdges: Edge[] = []; - BaseFlow.edges.forEach((edge) => { - let newEdge = _.cloneDeep(edge); - if (newEdge.target === groupNode.id) { - const targetHandle: targetHandleType = newEdge.data.targetHandle; - if (targetHandle.proxy) { - let type = targetHandle.type; - let field = targetHandle.proxy.field; - let proxyId = targetHandle.proxy.id; - let inputTypes = targetHandle.inputTypes; - let node: NodeType = gNodes.find((n) => n.id === proxyId)!; - if (node) { - newEdge.target = proxyId; - let newTargetHandle: targetHandleType = { - fieldName: field, - type, - id: proxyId, - inputTypes: inputTypes, - }; - if (node.data.node?.flow) { - newTargetHandle.proxy = { - field: node.data.node.template[field].proxy?.field!, - id: node.data.node.template[field].proxy?.id!, - }; - } - newEdge.data.targetHandle = newTargetHandle; - newEdge.targetHandle = scapedJSONStringfy(newTargetHandle); - } - } - } - if (newEdge.source === groupNode.id) { - const lastNode = _.cloneDeep(findLastNode(flow!.data!)); - newEdge.source = lastNode!.id; - let newSourceHandle: sourceHandleType = scapeJSONParse( - newEdge.sourceHandle! - ); - newSourceHandle.id = lastNode!.id; - newEdge.data.sourceHandle = newSourceHandle; - newEdge.sourceHandle = scapedJSONStringfy(newSourceHandle); - } - if (edge.target === groupNode.id || edge.source === groupNode.id) { - updatedEdges.push(newEdge); - } - }); - //update template values - Object.keys(template).forEach((key) => { - let { field, id } = template[key].proxy!; - let nodeIndex = gNodes.findIndex((n) => n.id === id); - if (nodeIndex !== -1) { - let display_name: string | undefined; - let show = gNodes[nodeIndex].data.node!.template[field].show; - let advanced = gNodes[nodeIndex].data.node!.template[field].advanced; - if (gNodes[nodeIndex].data.node!.template[field].display_name) { - display_name = - gNodes[nodeIndex].data.node!.template[field].display_name; - } else { - display_name = gNodes[nodeIndex].data.node!.template[field].name; - } - gNodes[nodeIndex].data.node!.template[field] = template[key]; - gNodes[nodeIndex].data.node!.template[field].show = show; - gNodes[nodeIndex].data.node!.template[field].advanced = advanced; - gNodes[nodeIndex].data.node!.template[field].display_name = display_name; - } - }); - - const nodes = [ - ...BaseFlow.nodes.filter((n) => n.id !== groupNode.id), - ...gNodes, - ]; - const edges = [ - ...BaseFlow.edges.filter( - (e) => e.target !== groupNode.id && e.source !== groupNode.id - ), - ...gEdges, - ...updatedEdges, - ]; - BaseFlow.nodes = nodes; - BaseFlow.edges = edges; -} - function updateProxyIdsOnTemplate( template: APITemplateType, idsMap: { [key: string]: string } @@ -1033,12 +945,12 @@ export function expandGroupNode( updateProxyIdsOnTemplate(template, idsMap); let flowEdges = edges; updateEdgesIds(flowEdges, idsMap); - const gNodes: NodeType[] = flow?.data?.nodes!; - const gEdges = flow!.data!.edges; + const gNodes: NodeType[] = cloneDeep(flow?.data?.nodes!); + const gEdges = cloneDeep(flow!.data!.edges); //redirect edges to correct proxy node let updatedEdges: Edge[] = []; flowEdges.forEach((edge) => { - let newEdge = _.cloneDeep(edge); + let newEdge = cloneDeep(edge); if (newEdge.target === id) { const targetHandle: targetHandleType = newEdge.data.targetHandle; if (targetHandle.proxy) { @@ -1067,7 +979,7 @@ export function expandGroupNode( } } if (newEdge.source === id) { - const lastNode = _.cloneDeep(findLastNode(flow!.data!)); + const lastNode = cloneDeep(findLastNode(flow!.data!)); newEdge.source = lastNode!.id; let newSourceHandle: sourceHandleType = scapeJSONParse( newEdge.sourceHandle! @@ -1127,17 +1039,6 @@ export function expandGroupNode( setEdges(filteredEdges); } -export function processFlow(FlowObject: ReactFlowJsonObject) { - let clonedFLow = _.cloneDeep(FlowObject); - clonedFLow.nodes.forEach((node: NodeType) => { - if (node.data.node?.flow) { - processFlow(node.data.node!.flow!.data!); - ungroupNode(node.data, clonedFLow); - } - }); - return clonedFLow; -} - export function getGroupStatus( flow: FlowType, ssData: { [key: string]: { valid: boolean; params: string } } From b49e0578d738008b75e6acbf9a1940d2ac8b4721 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Wed, 31 Jan 2024 11:54:08 +0100 Subject: [PATCH 9/9] fix cursor position on safari --- src/frontend/src/modals/codeAreaModal/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/frontend/src/modals/codeAreaModal/index.tsx b/src/frontend/src/modals/codeAreaModal/index.tsx index a5ec3223b..959685500 100644 --- a/src/frontend/src/modals/codeAreaModal/index.tsx +++ b/src/frontend/src/modals/codeAreaModal/index.tsx @@ -156,6 +156,7 @@ export default function CodeAreaModal({ readOnly={readonly} value={code} mode="python" + setOptions={{ fontFamily: "monospace"}} height={height ?? "100%"} highlightActiveLine={true} showPrintMargin={false}