build: Upgrade to Vite 5 (#7784)

package.json

@@ -67,7 +67,7 @@
     "tsc-watch": "^6.0.4",
     "turbo": "1.10.12",
     "typescript": "*",
-    "vite": "^4.4.7",
+    "vite": "^5.0.2",
     "vitest": "^0.33.0",
     "vue-tsc": "^1.8.8"
   },
@@ -79,7 +79,7 @@
       "@types/node": "^18.16.16",
       "chokidar": "3.5.2",
       "jsonwebtoken": "9.0.0",
-      "prettier": "^3.0.3",
+      "prettier": "^3.1.0",
       "semver": "^7.5.4",
       "tough-cookie": "^4.1.3",
       "tslib": "^2.6.1",

packages/cli/src/config/types.ts

@@ -32,12 +32,12 @@ type GetPathSegments<Traversable, Filter> = Traversable extends Filter
 type JoinByDotting<T extends string[]> = T extends [infer F]
 	? F
 	: T extends [infer F, ...infer R]
-	? F extends string
-		? R extends string[]
-			? `${F}.${JoinByDotting<R>}`
+	  ? F extends string
+			? R extends string[]
+				? `${F}.${JoinByDotting<R>}`
+				: never
 			: never
-		: never
-	: string;
+	  : string;
 
 type ToDottedPath<T> = JoinByDotting<RemoveExcess<T>>;
 
@@ -65,14 +65,14 @@ type ConfigOptionPath =
 type ToReturnType<T extends ConfigOptionPath> = T extends NumericPath
 	? number
 	: T extends BooleanPath
-	? boolean
-	: T extends StringLiteralArrayPath
-	? StringLiteralMap[T]
-	: T extends keyof ExceptionPaths
-	? ExceptionPaths[T]
-	: T extends StringPath
-	? string
-	: unknown;
+	  ? boolean
+	  : T extends StringLiteralArrayPath
+	    ? StringLiteralMap[T]
+	    : T extends keyof ExceptionPaths
+	      ? ExceptionPaths[T]
+	      : T extends StringPath
+	        ? string
+	        : unknown;
 
 type ExceptionPaths = {
 	'queue.bull.redis': object;

packages/cli/src/databases/migrations/common/1674509946020-CreateLdapEntities.ts

@@ -29,15 +29,15 @@ export class CreateLdapEntities1674509946020 implements ReversibleMigration {
 			dbType === 'sqlite'
 				? 'INTEGER PRIMARY KEY AUTOINCREMENT'
 				: dbType === 'postgresdb'
-				? 'SERIAL NOT NULL PRIMARY KEY'
-				: 'INTEGER NOT NULL AUTO_INCREMENT';
+				  ? 'SERIAL NOT NULL PRIMARY KEY'
+				  : 'INTEGER NOT NULL AUTO_INCREMENT';
 
 		const timestampColumn =
 			dbType === 'sqlite'
 				? 'DATETIME NOT NULL'
 				: dbType === 'postgresdb'
-				? 'TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP'
-				: 'DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP';
+				  ? 'TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP'
+				  : 'DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP';
 
 		await runQuery(
 			`CREATE TABLE IF NOT EXISTS ${escape.tableName('auth_provider_sync_history')} (

packages/cli/src/decorators/Authorized.ts

@@ -3,7 +3,7 @@ import { CONTROLLER_AUTH_ROLES } from './constants';
 import type { AuthRoleMetadata } from './types';
 
 export function Authorized(authRole: AuthRoleMetadata[string] = 'any'): Function {
-	return function (target: Function | Object, handlerName?: string) {
+	return function (target: Function | object, handlerName?: string) {
 		const controllerClass = handlerName ? target.constructor : target;
 		const authRoles = (Reflect.getMetadata(CONTROLLER_AUTH_ROLES, controllerClass) ??
 			{}) as AuthRoleMetadata;

packages/editor-ui/package.json

@@ -66,7 +66,7 @@
     "n8n-design-system": "workspace:*",
     "n8n-workflow": "workspace:*",
     "pinia": "^2.1.6",
-    "prettier": "^3.0.3",
+    "prettier": "^3.1.0",
     "qrcode.vue": "^3.3.4",
     "stream-browserify": "^3.0.0",
     "timeago.js": "^4.0.2",

packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalOutput.vue

@@ -78,8 +78,8 @@ export default defineComponent({
 						segment.kind === 'plaintext'
 							? segment.plaintext.length
 							: segment.resolved
-							? segment.resolved.toString().length
-							: 0;
+							  ? segment.resolved.toString().length
+							  : 0;
 
 					segment.to = cursor;
 

packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorOutput.vue

@@ -119,8 +119,8 @@ export default defineComponent({
 						segment.kind === 'plaintext'
 							? segment.plaintext.length
 							: segment.resolved
-							? segment.resolved.toString().length
-							: 0;
+							  ? segment.resolved.toString().length
+							  : 0;
 					segment.to = cursor;
 					return segment;
 				})

packages/editor-ui/src/components/Node.vue

@@ -268,7 +268,7 @@ export default defineComponent({
 			}
 		},
 		isPollingTypeNode(): boolean {
-			return !!(this.nodeType && this.nodeType.polling);
+			return !!this.nodeType?.polling;
 		},
 		isExecuting(): boolean {
 			return this.workflowsStore.isNodeExecuting(this.data.name);

packages/editor-ui/src/components/OutputPanel.vue

@@ -201,7 +201,7 @@ export default defineComponent({
 			return false;
 		},
 		isPollingTypeNode(): boolean {
-			return !!(this.nodeType && this.nodeType.polling);
+			return !!this.nodeType?.polling;
 		},
 		isScheduleTrigger(): boolean {
 			return !!(this.nodeType && this.nodeType.group.includes('schedule'));

packages/editor-ui/src/components/Sticky.vue

@@ -246,8 +246,8 @@ export default defineComponent({
 					isOnboardingNote && isWelcomeVideo
 						? 'welcome_video'
 						: isOnboardingNote && link.getAttribute('href') === '/templates'
-						? 'templates'
-						: 'other';
+						  ? 'templates'
+						  : 'other';
 
 				this.$telemetry.track('User clicked note link', { type });
 			}

packages/editor-ui/src/components/TriggerPanel.vue

@@ -193,7 +193,7 @@ export default defineComponent({
 			return Boolean(this.nodeType?.webhooks?.length);
 		},
 		isPollingNode(): boolean {
-			return Boolean(this.nodeType && this.nodeType.polling);
+			return Boolean(this.nodeType?.polling);
 		},
 		isListeningForEvents(): boolean {
 			const waitingOnWebhook = this.workflowsStore.executionWaitingForWebhook;

packages/editor-ui/src/hooks/segment/getters.ts

@@ -235,9 +235,8 @@ export const getExecutionFinishedEventData = (
 
 	if (meta.errorMessage || meta.resultDataError) {
 		eventData.properties!.status = 'failed';
-		eventData.properties!.error_message =
-			(meta.resultDataError && meta.resultDataError.message) || '';
-		eventData.properties!.error_stack = (meta.resultDataError && meta.resultDataError.stack) || '';
+		eventData.properties!.error_message = meta.resultDataError?.message || '';
+		eventData.properties!.error_stack = meta.resultDataError?.stack || '';
 		eventData.properties!.error_ui_message = meta.errorMessage || '';
 		eventData.properties!.error_timestamp = new Date();
 

packages/editor-ui/src/mixins/pushConnection.ts

@@ -415,7 +415,7 @@ export const pushConnection = defineComponent({
 							execution &&
 							execution.executedNode &&
 							execution.data?.resultData?.runData?.[execution.executedNode];
-						if (nodeType && nodeType.polling && !nodeOutput) {
+						if (nodeType?.polling && !nodeOutput) {
 							this.showMessage({
 								title: this.$locale.baseText('pushConnection.pollingNode.dataNotFound', {
 									interpolate: {

packages/editor-ui/src/mixins/workflowHelpers.ts

@@ -201,7 +201,7 @@ export function resolveParameter(
 		// in pagination expressions
 		additionalKeys.$response = get(
 			executionData,
-			`data.executionData.contextData['node:${activeNode!.name}'].response`,
+			`data.executionData.contextData['node:${activeNode.name}'].response`,
 			{},
 		);
 	}

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

@@ -325,14 +325,14 @@ export class N8nConnector extends AbstractConnector {
 						current[2] === current[0]
 							? 0
 							: current[2] > current[0]
-							? paintInfo.lw / 2
-							: -(paintInfo.lw / 2),
+							  ? paintInfo.lw / 2
+							  : -(paintInfo.lw / 2),
 					dy =
 						current[3] === current[1]
 							? 0
 							: current[3] > current[1]
-							? paintInfo.lw / 2
-							: -(paintInfo.lw / 2);
+							  ? paintInfo.lw / 2
+							  : -(paintInfo.lw / 2);
 
 				this._addSegment(StraightSegment, {
 					x1: current[0] - dx,

packages/editor-ui/src/stores/canvas.store.ts

@@ -98,8 +98,8 @@ export const useCanvasStore = defineStore('canvas', () => {
 		const sidebarWidth = isDemo.value
 			? 0
 			: uiStore.sidebarMenuCollapsed
-			? SIDEBAR_WIDTH
-			: SIDEBAR_WIDTH_EXPANDED;
+			  ? SIDEBAR_WIDTH
+			  : SIDEBAR_WIDTH_EXPANDED;
 
 		const relativeX = position[0] - sidebarWidth;
 		const relativeY = isDemo.value

packages/editor-ui/src/utils/pairedItemUtils.ts

@@ -30,8 +30,8 @@ export function getSourceItems(data: IExecutionResponse, target: TargetItem): Ta
 	const pairedItem: IPairedItemData[] = Array.isArray(item.pairedItem)
 		? item.pairedItem
 		: typeof item.pairedItem === 'object'
-		? [item.pairedItem]
-		: [{ item: item.pairedItem }];
+		  ? [item.pairedItem]
+		  : [{ item: item.pairedItem }];
 	const sourceItems = pairedItem.map((item) => {
 		const input = item.input || 0;
 		return {

packages/editor-ui/tsconfig.json

@@ -19,7 +19,8 @@
 		"lib": ["esnext", "dom", "dom.iterable", "scripthost"],
 		// TODO: remove all options below this line
 		"noUnusedLocals": false,
-		"useUnknownInCatchVariables": false
+		"useUnknownInCatchVariables": false,
+		"experimentalDecorators": true
 	},
 	"include": ["src/**/*.ts", "src/**/*.vue"]
 }

packages/editor-ui/vite.config.ts → packages/editor-ui/vite.config.mts

@@ -51,7 +51,7 @@ const alias = [
 	},
 	...['orderBy', 'camelCase', 'cloneDeep', 'startCase'].map((name) => ({
 		find: new RegExp(`^lodash.${name}$`, 'i'),
-		replacement: require.resolve(`lodash-es/${name}`),
+		replacement: `lodash-es/${name}`,
 	})),
 	{
 		find: /^lodash\.(.+)$/,

packages/nodes-base/nodes/Code/Code.node.ts

@@ -117,9 +117,9 @@ export class Code implements INodeType {
 				workflowMode === 'manual'
 					? this.sendMessageToUI
 					: CODE_ENABLE_STDOUT === 'true'
-					? (...args) =>
-							console.log(`[Workflow "${this.getWorkflow().id}"][Node "${node.name}"]`, ...args)
-					: () => {},
+					  ? (...args) =>
+								console.log(`[Workflow "${this.getWorkflow().id}"][Node "${node.name}"]`, ...args)
+					  : () => {},
 			);
 			return sandbox;
 		};

packages/nodes-base/nodes/Discord/v1/DiscordV1.node.ts

@@ -9,9 +9,8 @@ import type {
 } from 'n8n-workflow';
 import { jsonParse, NodeApiError, NodeOperationError, sleep } from 'n8n-workflow';
 
-import type { DiscordAttachment, DiscordWebhook } from './Interfaces';
-
 import { oldVersionNotice } from '../../../utils/descriptions';
+import type { DiscordAttachment, DiscordWebhook } from './Interfaces';
 
 const versionDescription: INodeTypeDescription = {
 	displayName: 'Discord',

packages/nodes-base/nodes/Discord/v2/actions/channel/index.ts

@@ -1,11 +1,11 @@
 import type { INodeProperties } from 'n8n-workflow';
 
+import { guildRLC } from '../common.description';
 import * as create from './create.operation';
 import * as get from './get.operation';
 import * as getAll from './getAll.operation';
 import * as update from './update.operation';
 import * as deleteChannel from './deleteChannel.operation';
-import { guildRLC } from '../common.description';
 
 export { create, get, getAll, update, deleteChannel };
 

packages/nodes-base/nodes/Discord/v2/actions/member/index.ts

@@ -1,9 +1,9 @@
 import type { INodeProperties } from 'n8n-workflow';
 
+import { guildRLC } from '../common.description';
 import * as getAll from './getAll.operation';
 import * as roleAdd from './roleAdd.operation';
 import * as roleRemove from './roleRemove.operation';
-import { guildRLC } from '../common.description';
 
 export { getAll, roleAdd, roleRemove };
 

packages/nodes-base/nodes/Discord/v2/actions/message/index.ts

@@ -1,11 +1,11 @@
 import type { INodeProperties } from 'n8n-workflow';
 
+import { guildRLC } from '../common.description';
 import * as getAll from './getAll.operation';
 import * as react from './react.operation';
 import * as send from './send.operation';
 import * as deleteMessage from './deleteMessage.operation';
 import * as get from './get.operation';
-import { guildRLC } from '../common.description';
 
 export { getAll, react, send, deleteMessage, get };
 

packages/nodes-base/nodes/Discord/v2/helpers/utils.ts

@@ -8,8 +8,8 @@ import type {
 import { jsonParse, NodeOperationError } from 'n8n-workflow';
 import { isEmpty } from 'lodash';
 import FormData from 'form-data';
-import { capitalize } from '../../../../utils/utilities';
 import { extension } from 'mime-types';
+import { capitalize } from '../../../../utils/utilities';
 import { discordApiRequest } from '../transport';
 
 export const createSimplifyFunction =

packages/nodes-base/nodes/EmailSend/v2/send.operation.ts

@@ -285,9 +285,7 @@ export async function execute(this: IExecuteFunctions): Promise<INodeExecutionDa
 					<em>${attributionText}<a href="${link}" target="_blank">n8n</a></em>
 					`;
 				} else {
-					mailOptions.text = `${
-						mailOptions.text
-					}\n\n---\n${attributionText}n8n\n${'https://n8n.io'}`;
+					mailOptions.text = `${mailOptions.text}\n\n---\n${attributionText}n8n\n${'https://n8n.io'}`;
 				}
 			}
 

packages/nodes-base/nodes/Google/CloudStorage/ObjectDescription.ts

@@ -179,9 +179,8 @@ export const objectOperations: INodeProperties[] = [
 								// Set the headers
 								if (!requestOptions.headers) requestOptions.headers = {};
 								requestOptions.headers['Content-Length'] = body.getLengthSync();
-								requestOptions.headers[
-									'Content-Type'
-								] = `multipart/related; boundary=${body.getBoundary()}`;
+								requestOptions.headers['Content-Type'] =
+									`multipart/related; boundary=${body.getBoundary()}`;
 
 								// Return the request data
 								requestOptions.body = body;

packages/nodes-base/nodes/Grist/GenericFunctions.ts

@@ -30,8 +30,8 @@ export async function gristApiRequest(
 		planType === 'free'
 			? `https://docs.getgrist.com/api${endpoint}`
 			: planType === 'paid'
-			? `https://${customSubdomain}.getgrist.com/api${endpoint}`
-			: `${selfHostedUrl}/api${endpoint}`;
+			  ? `https://${customSubdomain}.getgrist.com/api${endpoint}`
+			  : `${selfHostedUrl}/api${endpoint}`;
 
 	const options: OptionsWithUri = {
 		headers: {

packages/nodes-base/nodes/Grist/Grist.node.ts

@@ -83,8 +83,8 @@ export class Grist implements INodeType {
 					planType === 'free'
 						? `https://docs.getgrist.com/api${endpoint}`
 						: planType === 'paid'
-						? `https://${customSubdomain}.getgrist.com/api${endpoint}`
-						: `${selfHostedUrl}/api${endpoint}`;
+						  ? `https://${customSubdomain}.getgrist.com/api${endpoint}`
+						  : `${selfHostedUrl}/api${endpoint}`;
 
 				const options: OptionsWithUri = {
 					headers: {

packages/nodes-base/nodes/HaloPSA/GenericFunctions.ts

@@ -106,11 +106,10 @@ export async function haloPSAApiRequest(
 				}`;
 			}
 			if (message.includes('403')) {
-				(
-					error as JsonObject
-				).message = `You don\'t have permissions to ${method.toLowerCase()} ${resource
-					.split('/')[1]
-					.toLowerCase()}.`;
+				(error as JsonObject).message =
+					`You don\'t have permissions to ${method.toLowerCase()} ${resource
+						.split('/')[1]
+						.toLowerCase()}.`;
 			}
 		}
 		throw new NodeApiError(this.getNode(), error as JsonObject);

packages/nodes-base/nodes/HttpRequest/test/node/HttpRequest.test.ts

@@ -1,3 +1,4 @@
+import { parse as parseUrl } from 'url';
 import nock from 'nock';
 import {
 	initBinaryDataService,
@@ -6,7 +7,6 @@ import {
 	workflowToTests,
 	getWorkflowFilenames,
 } from '@test/nodes/Helpers';
-import { parse as parseUrl } from 'url';
 
 describe('Test HTTP Request Node', () => {
 	const workflows = getWorkflowFilenames(__dirname);