fix: Fix TS issues in connectors (no-changelog) (#9585)

packages/editor-ui/src/plugins/connectors/N8nCustomConnector.ts

@@ -79,6 +79,8 @@ const lineCalculators = {
 				],
 			}[axis];
 		}
+
+		return undefined;
 	},
 };
 
@@ -169,7 +171,7 @@ export class N8nConnector extends AbstractConnector {
 
 	overrideTargetEndpoint: Endpoint | null;
 
-	getEndpointOffset: Function | null;
+	getEndpointOffset?: (e: Endpoint) => number | null;
 
 	private internalSegments: FlowchartSegment[] = [];
 
@@ -269,8 +271,8 @@ export class N8nConnector extends AbstractConnector {
 	}
 
 	writeFlowchartSegments(paintInfo: N8nConnectorPaintGeometry) {
-		let current: FlowchartSegment = null;
+		let current: FlowchartSegment | null = null;
-		let next: FlowchartSegment = null;
+		let next: FlowchartSegment | null = null;
 		let currentDirection: [number, number];
 		let nextDirection: [number, number];
 
@@ -414,8 +416,8 @@ export class N8nConnector extends AbstractConnector {
 			const index = w > h ? 'curX' : 'curY';
 			const indexNum = w > h ? 0 : 1;
 			const oIndex = [1, 0][indexNum];
-			so = [];
+			so = [0, 0];
-			to = [];
+			to = [0, 0];
 			so[indexNum] = params.sourcePos[index] > targetPos[index] ? -1 : 1;
 			to[indexNum] = params.sourcePos[index] > targetPos[index] ? 1 : -1;
 			so[oIndex] = 0;
@@ -431,12 +433,12 @@ export class N8nConnector extends AbstractConnector {
 		const sourceStubWithOffset =
 			sourceStub +
 			(this.getEndpointOffset && params.sourceEndpoint
-				? this.getEndpointOffset(params.sourceEndpoint)
+				? this.getEndpointOffset(params.sourceEndpoint) ?? 0
 				: 0);
 
 		const targetStubWithOffset =
 			targetStub +
-			(this.getEndpointOffset && targetEndpoint ? this.getEndpointOffset(targetEndpoint) : 0);
+			(this.getEndpointOffset && targetEndpoint ? this.getEndpointOffset(targetEndpoint) ?? 0 : 0);
 
 		// same as paintinfo generated by jsplumb AbstractConnector type
 		const result = {
@@ -492,14 +494,9 @@ export class N8nConnector extends AbstractConnector {
 
 	_compute(originalPaintInfo: PaintGeometry, connParams: ConnectorComputeParams) {
 		const paintInfo = this._getPaintInfo(connParams);
-		// Set the type of key as key of paintInfo
+
-		// TODO: Check if this is the best way to do this
-		// Object.assign(originalPaintInfo, paintInfo);
-		Object.keys(paintInfo).forEach((key) => {
-			if (key === undefined) return;
 		// override so that bounding box is calculated correctly when target override is set
-			originalPaintInfo[key as keyof PaintGeometry] = paintInfo[key as keyof PaintGeometry];
+		Object.assign(originalPaintInfo, paintInfo);
-		});
 
 		try {
 			if (paintInfo.tx < 0) {
@@ -559,8 +556,8 @@ export class N8nConnector extends AbstractConnector {
 		if (this.lastx === x && this.lasty === y) {
 			return;
 		}
-		const lx = this.lastx === null ? paintInfo.sx : this.lastx;
+		const lx = this.lastx ?? paintInfo.sx;
-		const ly = this.lasty === null ? paintInfo.sy : this.lasty;
+		const ly = this.lasty ?? paintInfo.sy;
 		const o = lx === x ? 'v' : 'h';
 
 		this.lastx = x;
@@ -600,7 +597,7 @@ export class N8nConnector extends AbstractConnector {
 		this.writeFlowchartSegments(paintInfo);
 	}
 
-	transformGeometry(g: Geometry, dx: number, dy: number): Geometry {
+	transformGeometry(g: Geometry): Geometry {
 		return g;
 	}
 }

packages/editor-ui/src/plugins/jsplumb/N8nAddInputEndpointRenderer.ts

@@ -74,6 +74,6 @@ export const register = () => {
 
 			return container;
 		},
-		updateNode: (endpointInstance: N8nAddInputEndpoint) => {},
+		updateNode: () => {},
 	});
 };

packages/editor-ui/src/plugins/jsplumb/N8nAddInputEndpointType.ts

@@ -62,7 +62,13 @@ export const N8nAddInputEndpointHandler: EndpointHandler<
 > = {
 	type: N8nAddInputEndpoint.type,
 	cls: N8nAddInputEndpoint,
-	compute: (ep: N8nAddInputEndpoint, anchorPoint: AnchorPlacement): ComputedN8nAddInputEndpoint => {
+	compute: (
+		ep: EndpointRepresentation<ComputedN8nAddInputEndpoint>,
+		anchorPoint: AnchorPlacement,
+	): ComputedN8nAddInputEndpoint => {
+		if (!(ep instanceof N8nAddInputEndpoint)) {
+			throw Error('Unexpected Endpoint type');
+		}
 		const x = anchorPoint.curX - ep.params.width / 2;
 		const y = anchorPoint.curY - ep.params.width / 2;
 		const w = ep.params.width;

packages/editor-ui/src/plugins/jsplumb/N8nPlusEndpointType.ts

@@ -32,6 +32,8 @@ export class N8nPlusEndpoint extends EndpointRepresentation<ComputedN8nPlusEndpo
 
 	messageOverlay: Overlay | null;
 
+	canvas: HTMLElement | null;
+
 	constructor(endpoint: Endpoint, params: N8nPlusEndpointParams) {
 		super(endpoint, params);
 
@@ -39,6 +41,7 @@ export class N8nPlusEndpoint extends EndpointRepresentation<ComputedN8nPlusEndpo
 		this.label = '';
 		this.stalkOverlay = null;
 		this.messageOverlay = null;
+		this.canvas = null;
 
 		this.unbindEvents();
 		this.bindEvents();
@@ -183,7 +186,13 @@ export class N8nPlusEndpoint extends EndpointRepresentation<ComputedN8nPlusEndpo
 export const N8nPlusEndpointHandler: EndpointHandler<N8nPlusEndpoint, ComputedN8nPlusEndpoint> = {
 	type: N8nPlusEndpoint.type,
 	cls: N8nPlusEndpoint,
-	compute: (ep: N8nPlusEndpoint, anchorPoint: AnchorPlacement): ComputedN8nPlusEndpoint => {
+	compute: (
+		ep: EndpointRepresentation<ComputedN8nPlusEndpoint>,
+		anchorPoint: AnchorPlacement,
+	): ComputedN8nPlusEndpoint => {
+		if (!(ep instanceof N8nPlusEndpoint)) {
+			throw Error('Unexpected Endpoint type');
+		}
 		const x = anchorPoint.curX - ep.params.dimensions / 2;
 		const y = anchorPoint.curY - ep.params.dimensions / 2;
 		const w = ep.params.dimensions;