@elyx-code/editor-ui 0.0.2

package/src/services/editor/connections.ts

@@ -0,0 +1,1019 @@
+import {
+	ConditionState,
+	EntityType,
+	ENTRY_POINT_TYPES,
+	EVENT_TYPES,
+	PASS_THROUGH_CALLABLE_TYPES,
+	PASS_THROUGH_CALLABLE_TYPES_WITH_OUTPUTS,
+	PassThroughCallableEntityWithOutputsState,
+	TERMINATION_TYPES,
+	TerminationEntityState,
+	VARIABLE_TYPES,
+} from '@elyx-code/project-logic-tree';
+import {
+	getCanvasEntityDOMId,
+	getCanvasEntityEntryCallerNodeDOMId,
+	getCanvasEntityExecutionNodeId,
+	getCanvasEntityErrorCallerNodeDOMId,
+	getCanvasEntitySuccessCallerNodeDOMId,
+	getCanvasEntityMainValueInputDOMId,
+	getCanvasEntityMainValueOutputDOMId,
+	getCreateEntityMenuSuccessNodeId,
+	getCreateEntityMenuMainValueOutputNodeId,
+	getCreateEntityMenuHeaderNodeId,
+	getCreateEntityMenuMainValueInputNodeId,
+} from './ui';
+import { Canvas } from '../../lib/canvas';
+import {
+	DraggableCallerEntityState,
+	OperationState,
+	DraggablePassThroughCallableEntityState,
+	ValueReadingEntityState,
+	ValueWritingEntityState,
+	VariableState,
+	PassThroughCallableEntityState,
+	CallableEntityState,
+	CallerEntityState,
+	InternalCallState,
+	FunctionCallState,
+	FunctionDeclarationState,
+	LoopState,
+	GlobalEventState,
+} from '@elyx-code/project-logic-tree';
+import { getParentCanvasEntity } from '@elyx-code/project-logic-tree';
+import { EditorService } from '.';
+import { CanvasEntityElement } from './CanvasElement';
+import { IConnectionOptions } from '../../lib/canvas/defs';
+
+// This function is an abstraction of the canvas connection logic
+// That given all data needed to connet, attempts to do so, and if it fails
+// It waits for the elements to be mounted and tries again
+function establishConnection(
+	startId: string,
+	endId: string,
+	sourceElement: CanvasEntityElement,
+	targetElement: CanvasEntityElement,
+	project: EditorService,
+	connectionOptions: IConnectionOptions,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const connect = () => {
+		const sourceDOMElement = Canvas.selectByAttribute(startId);
+		const targetDOMElement = Canvas.selectByAttribute(endId);
+
+		const newConnection = project.canvas?.connect(
+			sourceDOMElement as HTMLElement,
+			startId,
+			targetDOMElement as HTMLElement,
+			endId,
+			sourceElement.draggableObject,
+			targetElement.draggableObject,
+			connectionOptions,
+		);
+
+		connIds.add(newConnection?.id || '');
+
+		// Determine whether the connection should be disabled
+		if (suggestion || project.canvas?.disabled) {
+			newConnection.disable();
+		}
+	};
+
+	// If the entity to connect to is not found on the new canvas entities
+	// is because it was processed in a different batch and we can ignore it
+	if (!targetElement?.ready) {
+		const onMountHandler = () => {
+			try {
+				connect();
+
+				targetElement?.node.off('mount', onMountHandler);
+			} catch (e) {}
+		};
+
+		targetElement?.node.on('mount', onMountHandler);
+		return;
+	} else if (!sourceElement?.ready) {
+		const onMountHandler = () => {
+			try {
+				connect();
+
+				sourceElement?.node.off('mount', onMountHandler);
+			} catch (e) {}
+		};
+
+		sourceElement?.node.on('mount', onMountHandler);
+		return;
+	}
+
+	try {
+		connect();
+	} catch (e) {}
+}
+
+export function connectEntryCallerToExecutionNode(
+	sourceEntity: CallerEntityState,
+	sourceElement: CanvasEntityElement,
+	targetEntity: CallableEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	// Target the dependencies execution node as the end of the connection
+	const startId = getCanvasEntityEntryCallerNodeDOMId(sourceEntity);
+	const endId = getCanvasEntityExecutionNodeId(targetEntity);
+	const targetEntityCanvasParent = getParentCanvasEntity(targetEntity);
+
+	// Find the draggable object of the parent entity
+	const targetElement = project.getElement(targetEntityCanvasParent.id);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			dash: { animation: false },
+			size: 5,
+			color: 'var(--color-main-grey)',
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+export function connectSuccessToExecutionNode(
+	sourceEntity: PassThroughCallableEntityState,
+	sourceElement: CanvasEntityElement,
+	targetEntity: CallableEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	// Target the dependencies execution node as the end of the connection
+	const startId = getCanvasEntitySuccessCallerNodeDOMId(sourceEntity);
+	const endId = getCanvasEntityExecutionNodeId(targetEntity);
+
+	const targetEntityCanvasParent = getParentCanvasEntity(targetEntity);
+
+	// Find the draggable object of the parent entity
+	const targetElement = project.getElement(targetEntityCanvasParent.id);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			dash: { animation: false },
+			size: 5,
+			color: 'var(--color-main-grey)',
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+function connectFailureToExecutionNode(
+	sourceEntity: PassThroughCallableEntityState,
+	sourceElement: CanvasEntityElement,
+	targetEntity: CallableEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	// Target the dependencies execution node as the end of the connection
+	const startId = getCanvasEntityErrorCallerNodeDOMId(sourceEntity);
+	const endId = getCanvasEntityExecutionNodeId(targetEntity);
+
+	const targetEntityCanvasParent = getParentCanvasEntity(targetEntity);
+
+	// Find the draggable object of the parent entity
+	const targetElement = project.getElement(targetEntityCanvasParent.id);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			dash: { animation: false },
+			size: 5,
+			color: 'var(--color-main-grey)',
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+function connectSuccessAndFailureToExecutionNode(
+	sourceEntity: PassThroughCallableEntityState,
+	element: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const successTargetDependencies = (sourceEntity as FunctionCallState)
+		.successCalls;
+
+	for (let index = 0; index < successTargetDependencies.length; index++) {
+		const targetEntity = successTargetDependencies[index];
+
+		connectSuccessToExecutionNode(
+			sourceEntity,
+			element,
+			targetEntity,
+			project,
+			suggestion,
+			connIds,
+		);
+	}
+
+	const failTargetDependencies = (sourceEntity as FunctionCallState).errorCalls;
+
+	for (let index = 0; index < failTargetDependencies.length; index++) {
+		const targetEntity = failTargetDependencies[index];
+
+		connectFailureToExecutionNode(
+			sourceEntity,
+			element,
+			targetEntity,
+			project,
+			suggestion,
+			connIds,
+		);
+	}
+}
+
+interface ValueReadingEntityTarget {
+	endId: string;
+	targetDOMElement: HTMLElement;
+	targetElement: CanvasEntityElement;
+}
+
+interface ValueWritingEntityTarget {
+	startId: string;
+	sourceDOMElement: HTMLElement;
+	sourceElement: CanvasEntityElement;
+}
+
+function resolveSourceValueWritingEntity(
+	sourceEntity: ValueWritingEntityState,
+	project: EditorService,
+): ValueWritingEntityTarget | null {
+	if (PASS_THROUGH_CALLABLE_TYPES_WITH_OUTPUTS.includes(sourceEntity.type)) {
+		const startId = getCanvasEntityMainValueOutputDOMId(
+			sourceEntity as VariableState,
+		);
+		const sourceDOMElement = Canvas.selectByAttribute(startId);
+
+		// Find the draggable object of the parent entity
+		const canvasElement = project.getElement(sourceEntity.id);
+
+		return {
+			startId: startId,
+			sourceDOMElement: sourceDOMElement as HTMLElement,
+			sourceElement: canvasElement,
+		};
+	} else {
+		const startId = getCanvasEntityDOMId(sourceEntity);
+		const sourceDOMElement = Canvas.selectByAttribute(startId);
+		const sourceEntityCanvasParent = getParentCanvasEntity(sourceEntity);
+
+		// Find the draggable object of the parent entity
+		const canvasElement = project.getElement(sourceEntityCanvasParent.id);
+
+		return {
+			startId: startId,
+			sourceDOMElement: sourceDOMElement as HTMLElement,
+			sourceElement: canvasElement,
+		};
+	}
+}
+
+function resolveTargetValueReadingEntity(
+	targetEntity: ValueReadingEntityState,
+	project: EditorService,
+): ValueReadingEntityTarget | null {
+	if ([...VARIABLE_TYPES, ...TERMINATION_TYPES].includes(targetEntity.type)) {
+		const endId = getCanvasEntityMainValueInputDOMId(
+			targetEntity as VariableState,
+		);
+		const targetDOMElement = Canvas.selectByAttribute(endId);
+
+		// Find the draggable object of the parent entity
+		const canvasElement = project.getElement(targetEntity.id);
+
+		return {
+			endId: endId,
+			targetDOMElement: targetDOMElement as HTMLElement,
+			targetElement: canvasElement,
+		};
+	} else {
+		const endId = getCanvasEntityDOMId(targetEntity);
+		const targetDOMElement = Canvas.selectByAttribute(endId);
+		const targetEntityCanvasParent = getParentCanvasEntity(targetEntity);
+
+		// Find the draggable object of the parent entity
+		const canvasElement = project.getElement(targetEntityCanvasParent.id);
+
+		return {
+			endId: endId,
+			targetDOMElement: targetDOMElement as HTMLElement,
+			targetElement: canvasElement,
+		};
+	}
+}
+
+function connectMainValueToWrittenEntity(
+	sourceEntity: PassThroughCallableEntityWithOutputsState,
+	sourceElement: CanvasEntityElement,
+	targetEntity: ValueReadingEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const startId = getCanvasEntityMainValueOutputDOMId(
+		sourceEntity as VariableState,
+	);
+
+	const { targetElement, endId } = resolveTargetValueReadingEntity(
+		targetEntity,
+		project,
+	);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+function connectMainValueToWrittenEntities(
+	sourceEntity: PassThroughCallableEntityWithOutputsState,
+	element: CanvasEntityElement,
+	project: EditorService,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const targetDependencies = sourceEntity.writesValues;
+
+	for (let index = 0; index < targetDependencies.length; index++) {
+		const targetEntity = targetDependencies[index];
+
+		connectMainValueToWrittenEntity(
+			sourceEntity,
+			element,
+			targetEntity,
+			project,
+			false,
+			connIds,
+		);
+	}
+
+	// Connect output properties
+	connectValueWrittersToValueReaders(
+		sourceEntity.outputs,
+		element,
+		project,
+		false,
+		connIds,
+	);
+}
+
+function connectValueReaderFromValueWritter(
+	targetEntity: ValueReadingEntityState,
+	_targetElement: CanvasEntityElement,
+	sourceEntity: ValueWritingEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const { targetElement, endId } = resolveTargetValueReadingEntity(
+		targetEntity,
+		project,
+	);
+
+	const { sourceElement, startId } = resolveSourceValueWritingEntity(
+		sourceEntity,
+		project,
+	);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+function connectValueWritterToValueReader(
+	sourceEntity: ValueWritingEntityState,
+	sourceElement: CanvasEntityElement,
+	targetEntity: ValueReadingEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const startId = getCanvasEntityDOMId(sourceEntity);
+
+	const { targetElement, endId } = resolveTargetValueReadingEntity(
+		targetEntity,
+		project,
+	);
+
+	establishConnection(
+		startId,
+		endId,
+		sourceElement,
+		targetElement,
+		project,
+		{
+			classes: suggestion ? ['suggestion'] : [],
+		},
+		suggestion,
+		connIds,
+	);
+}
+
+function connectValueReadersFromValueWriters(
+	targetEntities: ValueReadingEntityState[],
+	targetElement: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	for (let index = 0; index < targetEntities.length; index++) {
+		const targetEntity = targetEntities[index];
+		const sourceEntity = targetEntity.readsValue;
+
+		if (!!sourceEntity) {
+			connectValueReaderFromValueWritter(
+				targetEntity,
+				targetElement,
+				sourceEntity,
+				project,
+				suggestion,
+				connIds,
+			);
+		}
+	}
+}
+
+function connectNestedConditions(
+	targetEntities: ConditionState[],
+	targetElement: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	for (let index = 0; index < targetEntities.length; index++) {
+		const targetEntity = targetEntities[index];
+
+		connectValueReadersFromValueWriters(
+			targetEntity.inputs,
+			targetElement,
+			project,
+			false,
+			connIds,
+		);
+
+		connectNestedConditions(
+			targetEntity.andChildrenGroup || [],
+			targetElement,
+			project,
+			suggestion,
+			connIds,
+		);
+
+		connectNestedConditions(
+			targetEntity.orChildrenGroup || [],
+			targetElement,
+			project,
+			suggestion,
+			connIds,
+		);
+	}
+}
+
+function connectValueWrittersToValueReaders(
+	sourceEntities: ValueWritingEntityState[],
+	sourceElement: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	for (let index = 0; index < sourceEntities.length; index++) {
+		const sourceEntity = sourceEntities[index];
+		const targetDependencies = sourceEntity.writesValues;
+
+		for (let j = 0; j < targetDependencies.length; j++) {
+			const targetEntity = targetDependencies[j];
+
+			connectValueWritterToValueReader(
+				sourceEntity,
+				sourceElement,
+				targetEntity,
+				project,
+				suggestion,
+				connIds,
+			);
+		}
+	}
+}
+
+function connectFunctionDeclaration(
+	entity: FunctionDeclarationState,
+	element: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	if (entity.collapsed) {
+		return;
+	}
+
+	const targetCalls = entity.calls;
+
+	for (let index = 0; index < targetCalls.length; index++) {
+		const dependency = targetCalls[index];
+
+		connectEntryCallerToExecutionNode(
+			entity as DraggableCallerEntityState,
+			element,
+			dependency,
+			project,
+			suggestion,
+			connIds,
+		);
+	}
+
+	connectValueWrittersToValueReaders(
+		entity.inputs,
+		element,
+		project,
+		suggestion,
+		connIds,
+	);
+}
+
+function connectMethods(
+	methods: FunctionDeclarationState[],
+	element: CanvasEntityElement,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	for (let index = 0; index < methods.length; index++) {
+		const entity = methods[index];
+
+		connectFunctionDeclaration(entity, element, project, suggestion, connIds);
+	}
+}
+
+function connectCalledBy(
+	entity: CallableEntityState,
+	project: EditorService,
+	suggestion: boolean = false,
+	connIds: Set<string> = new Set<string>(),
+) {
+	const sourceDependencies = entity.calledBy;
+
+	for (let index = 0; index < sourceDependencies.length; index++) {
+		const sourceEntity: CallerEntityState = sourceDependencies[index];
+
+		const sourceEntityCanvasParent = getParentCanvasEntity(sourceEntity);
+
+		let sourceElement = project.getElement(sourceEntityCanvasParent.id);
+
+		if (
+			!sourceElement &&
+			sourceEntity.type === EntityType.FunctionDeclaration &&
+			(sourceEntity.parent.type === EntityType.DefinitionEntity ||
+				sourceEntity.parent.type === EntityType.Loop)
+		) {
+			sourceElement = project.getElement(sourceEntity.parent.id);
+		}
+
+		if (PASS_THROUGH_CALLABLE_TYPES.includes(sourceEntity.type)) {
+			connectSuccessAndFailureToExecutionNode(
+				sourceEntity as DraggablePassThroughCallableEntityState,
+				sourceElement,
+				project,
+				suggestion,
+				connIds,
+			);
+		} else if (ENTRY_POINT_TYPES.includes(sourceEntity.type)) {
+			connectEntryCallerToExecutionNode(
+				sourceEntity,
+				sourceElement,
+				entity,
+				project,
+				suggestion,
+				connIds,
+			);
+		}
+	}
+}
+
+export function setupEntityConnectionsInCanvas(
+	element: CanvasEntityElement,
+	project: EditorService,
+	options: { debug?: boolean } = { debug: false },
+) {
+	// In order to update the connections, we need to create the missing ones, but also remove the ones that are not needed anymore,
+	// Every-time we add a new connection, we will add its id to the upToDateConnectionIds set,
+	// and at the end of the process we will remove the connections that are not in that set
+	const upToDateConnectionIds = new Set<string>();
+
+	if (options.debug) {
+		debugger;
+	}
+
+	if (EntityType.DefinitionEntity === element.entity.type) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectMethods(
+			element.entity.methods,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+		connectMethods(
+			element.entity.suggestedMethods,
+			element,
+			project,
+			true,
+			upToDateConnectionIds,
+		);
+	} else if (EVENT_TYPES.includes(element.entity.type)) {
+		if (options.debug) {
+			debugger;
+		}
+
+		if ((element.entity as GlobalEventState).collapsed) {
+			return;
+		}
+
+		const targetCalls = (element.entity as GlobalEventState).calls;
+
+		for (let index = 0; index < targetCalls.length; index++) {
+			const dependency = targetCalls[index];
+
+			connectEntryCallerToExecutionNode(
+				element.entity as DraggableCallerEntityState,
+				element,
+				dependency,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+		}
+
+		connectValueWrittersToValueReaders(
+			(element.entity as GlobalEventState).inputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		// This includes function declarations and loops
+	} else if (EntityType.Loop === element.entity.type) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectSuccessAndFailureToExecutionNode(
+			element.entity,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectValueReadersFromValueWriters(
+			element.entity.inputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectMainValueToWrittenEntities(
+			element.entity,
+			element,
+			project,
+			upToDateConnectionIds,
+		);
+
+		connectValueWrittersToValueReaders(
+			// Adding the error handling output property to the list
+			[
+				...((element.entity as LoopState).error
+					? [(element.entity as LoopState).error]
+					: []),
+				...(element.entity as LoopState).outputs,
+			],
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		const targetCalls = element.entity.body?.calls || [];
+
+		for (let index = 0; index < targetCalls.length; index++) {
+			const dependency = targetCalls[index];
+
+			connectEntryCallerToExecutionNode(
+				element.entity.body,
+				element,
+				dependency,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+		}
+
+		connectValueWrittersToValueReaders(
+			element.entity.body?.inputs || [],
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectCalledBy(
+			element.entity as CallableEntityState,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	} else if (EntityType.FunctionDeclaration === element.entity.type) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectFunctionDeclaration(
+			element.entity as FunctionDeclarationState,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	} else if (VARIABLE_TYPES.includes(element.entity.type)) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectSuccessAndFailureToExecutionNode(
+			element.entity as VariableState,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectMainValueToWrittenEntities(
+			// Adding the error handling output property to the list
+			element.entity as VariableState,
+			element,
+			project,
+			upToDateConnectionIds,
+		);
+
+		// Connect internal calls
+		(element.entity as VariableState).internalCalls.forEach((internalCall) => {
+			connectSuccessAndFailureToExecutionNode(
+				internalCall as InternalCallState,
+				element,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+
+			connectValueWrittersToValueReaders(
+				// Adding the error handling output property to the list
+				[
+					...((internalCall as InternalCallState).error
+						? [(internalCall as InternalCallState).error]
+						: []),
+					...(internalCall as InternalCallState).outputs,
+				],
+				element,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+
+			connectValueReadersFromValueWriters(
+				(internalCall as InternalCallState).inputs,
+				element,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+
+			connectCalledBy(internalCall, project, false, upToDateConnectionIds);
+		});
+
+		connectValueReadersFromValueWriters(
+			(element.entity as VariableState).inputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		if (!!(element.entity as VariableState).readsValue) {
+			connectValueReaderFromValueWritter(
+				element.entity as VariableState,
+				element,
+				(element.entity as VariableState).readsValue,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+		}
+
+		connectCalledBy(
+			element.entity as ConditionState,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	} else if (TERMINATION_TYPES.includes(element.entity.type)) {
+		if (options.debug) {
+			debugger;
+		}
+
+		if (!!(element.entity as TerminationEntityState).readsValue) {
+			connectValueReaderFromValueWritter(
+				element.entity as TerminationEntityState,
+				element,
+				(element.entity as TerminationEntityState).readsValue,
+				project,
+				false,
+				upToDateConnectionIds,
+			);
+		}
+
+		connectValueReadersFromValueWriters(
+			(element.entity as TerminationEntityState).outputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectCalledBy(
+			element.entity as CallableEntityState,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	} else if (
+		// This includes the condition entity but it should have already been handled
+		PASS_THROUGH_CALLABLE_TYPES.includes(element.entity.type) &&
+		![EntityType.Condition, EntityType.Loop, ...VARIABLE_TYPES].includes(
+			element.entity.type,
+		)
+	) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectSuccessAndFailureToExecutionNode(
+			element.entity as DraggablePassThroughCallableEntityState,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectValueReadersFromValueWriters(
+			(element.entity as OperationState).inputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectMainValueToWrittenEntities(
+			element.entity as PassThroughCallableEntityWithOutputsState,
+			element,
+			project,
+			upToDateConnectionIds,
+		);
+
+		connectValueWrittersToValueReaders(
+			// Adding the error handling output property to the list
+			[
+				...((element.entity as OperationState).error
+					? [(element.entity as OperationState).error]
+					: []),
+				...(element.entity as OperationState).outputs,
+			],
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectCalledBy(
+			element.entity as CallableEntityState,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	} else if (element.entity.type === EntityType.Condition) {
+		if (options.debug) {
+			debugger;
+		}
+
+		connectValueReadersFromValueWriters(
+			(element.entity as ConditionState).inputs,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectSuccessAndFailureToExecutionNode(
+			element.entity as ConditionState,
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectNestedConditions(
+			(element.entity as ConditionState).andChildrenGroup || [],
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectNestedConditions(
+			(element.entity as ConditionState).orChildrenGroup || [],
+			element,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+
+		connectCalledBy(
+			element.entity as ConditionState,
+			project,
+			false,
+			upToDateConnectionIds,
+		);
+	}
+
+	// Here delete any unrecognized ids
+	element.draggableObject.connections.forEach((connection) => {
+		const connectionId = connection.id;
+
+		if (!upToDateConnectionIds.has(connectionId)) {
+			// If it is connected to the temporary canvas entity creation menu
+			// We leave it, when the menu unmounts, it will delete them.
+			if (
+				[
+					getCreateEntityMenuSuccessNodeId(),
+					getCreateEntityMenuMainValueOutputNodeId(),
+				].some((prefix) => connectionId.startsWith(prefix)) ||
+				[
+					getCreateEntityMenuHeaderNodeId(),
+					getCreateEntityMenuMainValueInputNodeId(),
+				].some((suffix) => connectionId.endsWith(suffix))
+			) {
+				return;
+			}
+
+			connection.remove();
+		}
+	});
+}