Format ts files in editor-ui, design-system and chat with biome

biome.jsonc

@@ -23,9 +23,7 @@
 			"cypress/fixtures",
 			"**/CHANGELOG.md",
 			// These are still handled by prettier
-			"**/packages/@n8n/chat/**",
-			"**/packages/editor-ui/**",
-			"**/packages/design-system/**",
+			"**/*.vue",
 			// Too large files
 			"packages/@n8n/benchmark/scripts/mock-api/mappings/mockApiData.json"
 		]

packages/@n8n/chat/package.json

@@ -12,8 +12,8 @@
     "typecheck": "vue-tsc --noEmit",
     "lint": "eslint . --ext .js,.ts,.vue --quiet",
     "lintfix": "eslint . --ext .js,.ts,.vue --fix",
-    "format": "prettier --write src/ --ignore-path ../../.prettierignore",
-    "format:check": "prettier --check src/ --ignore-path ../../.prettierignore",
+    "format": "biome format --write src .storybook && prettier --write src/ --ignore-path ../../.prettierignore",
+    "format:check": "biome ci src .storybook && prettier --check src/ --ignore-path ../../.prettierignore",
     "storybook": "storybook dev -p 6006 --no-open",
     "build:storybook": "storybook build"
   },

packages/design-system/package.json

@@ -13,8 +13,8 @@
     "build:storybook": "storybook build",
     "storybook": "storybook dev -p 6006",
     "chromatic": "chromatic",
-    "format": "prettier --write . --ignore-path ../../.prettierignore",
-    "format:check": "prettier --check . --ignore-path ../../.prettierignore",
+    "format": "biome format --write src .storybook  && prettier --write . --ignore-path ../../.prettierignore",
+    "format:check": "biome ci src .storybook  && prettier --check . --ignore-path ../../.prettierignore",
     "lint": "eslint src --ext .js,.ts,.vue --quiet",
     "lintfix": "eslint src --ext .js,.ts,.vue --fix"
   },

packages/editor-ui/package.json

@@ -10,8 +10,8 @@
     "dev": "pnpm serve",
     "lint": "eslint src --ext .js,.ts,.vue --quiet",
     "lintfix": "eslint src --ext .js,.ts,.vue --fix",
-    "format": "prettier --write . --ignore-path ../../.prettierignore",
-    "format:check": "prettier --check . --ignore-path ../../.prettierignore",
+    "format": "biome format --write src tests && prettier --write . --ignore-path ../../.prettierignore",
+    "format:check": "biome ci src tests && prettier --check . --ignore-path ../../.prettierignore",
     "serve": "cross-env VUE_APP_URL_BASE_API=http://localhost:5678/ vite --host 0.0.0.0 --port 8080 dev",
     "test": "vitest run",
     "test:dev": "vitest"

packages/editor-ui/src/components/CodeNodeEditor/theme.ts

@@ -95,7 +95,7 @@ export const codeNodeEditorTheme = ({
 				: { minHeight: rows && rows !== -1 ? `${Number(rows + 1) * 1.3}em` : 'auto' }),
 		},
 		'.cm-gutter,.cm-content': {
-			minHeight: rows && rows !== -1 ? 'auto' : minHeight ?? 'calc(35vh - var(--spacing-2xl))',
+			minHeight: rows && rows !== -1 ? 'auto' : (minHeight ?? 'calc(35vh - var(--spacing-2xl))'),
 		},
 		'.cm-diagnosticAction': {
 			backgroundColor: BASE_STYLING.diagnosticButton.backgroundColor,

packages/editor-ui/src/components/Node/NodeCreator/utils.ts

@@ -142,7 +142,7 @@ export function groupItemsInSections(
 				title: section.title,
 				children: sortAlphabetically
 					? sortNodeCreateElements(children[section.key] ?? [])
-					: children[section.key] ?? [],
+					: (children[section.key] ?? []),
 			}),
 		);
 

packages/editor-ui/src/composables/useExpressionEditor.ts

@@ -405,7 +405,8 @@ export const useExpressionEditor = ({
 		if (pos === 'lastExpression') {
 			const END_OF_EXPRESSION = ' }}';
 			const endOfLastExpression = readEditorValue().lastIndexOf(END_OF_EXPRESSION);
-			pos = endOfLastExpression !== -1 ? endOfLastExpression : editor.value?.state.doc.length ?? 0;
+			pos =
+				endOfLastExpression !== -1 ? endOfLastExpression : (editor.value?.state.doc.length ?? 0);
 		} else if (pos === 'end') {
 			pos = editor.value?.state.doc.length ?? 0;
 		}
@@ -414,7 +415,7 @@ export const useExpressionEditor = ({
 
 	function select(anchor: number, head: number | 'end' = 'end'): void {
 		editor.value?.dispatch({
-			selection: { anchor, head: head === 'end' ? editor.value?.state.doc.length ?? 0 : head },
+			selection: { anchor, head: head === 'end' ? (editor.value?.state.doc.length ?? 0) : head },
 		});
 	}
 

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

@@ -433,12 +433,14 @@ export class N8nConnector extends AbstractConnector {
 		const sourceStubWithOffset =
 			sourceStub +
 			(this.getEndpointOffset && params.sourceEndpoint
-				? this.getEndpointOffset(params.sourceEndpoint) ?? 0
+				? (this.getEndpointOffset(params.sourceEndpoint) ?? 0)
 				: 0);
 
 		const targetStubWithOffset =
 			targetStub +
-			(this.getEndpointOffset && targetEndpoint ? this.getEndpointOffset(targetEndpoint) ?? 0 : 0);
+			(this.getEndpointOffset && targetEndpoint
+				? (this.getEndpointOffset(targetEndpoint) ?? 0)
+				: 0);
 
 		// same as paintinfo generated by jsplumb AbstractConnector type
 		const result = {

packages/editor-ui/src/plugins/i18n/index.ts

@@ -76,7 +76,7 @@ export class I18nClass {
 	 * Render a string of dynamic text, i.e. a string with a constructed path to the localized value.
 	 */
 	private dynamicRender({ key, fallback }: { key: string; fallback?: string }) {
-		return this.i18n.te(key) ? this.i18n.t(key).toString() : fallback ?? '';
+		return this.i18n.te(key) ? this.i18n.t(key).toString() : (fallback ?? '');
 	}
 
 	displayTimer(msPassed: number, showMs = false): string {

packages/editor-ui/src/router.ts

@@ -739,7 +739,7 @@ function withCanvasReadOnlyMeta(route: RouteRecordRaw) {
 }
 
 const router = createRouter({
-	history: createWebHistory(import.meta.env.DEV ? '/' : window.BASE_PATH ?? '/'),
+	history: createWebHistory(import.meta.env.DEV ? '/' : (window.BASE_PATH ?? '/')),
 	scrollBehavior(to: RouteLocationNormalized, _, savedPosition) {
 		// saved position == null means the page is NOT visited from history (back button)
 		if (savedPosition === null && to.name === VIEWS.TEMPLATES && to.meta?.setScrollPosition) {

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

@@ -189,7 +189,7 @@ export const useCredentialsStore = defineStore(STORES.CREDENTIALS, () => {
 				? email
 					? `${name} (${email})`
 					: name
-				: email ?? i18n.baseText('credentialEdit.credentialSharing.info.sharee.fallback');
+				: (email ?? i18n.baseText('credentialEdit.credentialSharing.info.sharee.fallback'));
 		};
 	});
 

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

@@ -91,7 +91,7 @@ export const useNDVStore = defineStore(STORES.NDV, {
 		ndvInputDataWithPinnedData(): INodeExecutionData[] {
 			const data = this.ndvInputData;
 			return this.ndvInputNodeName
-				? useWorkflowsStore().pinDataByNodeName(this.ndvInputNodeName) ?? data
+				? (useWorkflowsStore().pinDataByNodeName(this.ndvInputNodeName) ?? data)
 				: data;
 		},
 		hasInputData(): boolean {

packages/editor-ui/src/stores/workflows.ee.store.ts

@@ -21,7 +21,7 @@ export const useWorkflowsEEStore = defineStore(STORES.WORKFLOWS_EE, {
 				const workflow = useWorkflowsStore().getWorkflowById(workflowId);
 				const { name, email } = splitName(workflow?.homeProject?.name ?? '');
 
-				return name ? (email ? `${name} (${email})` : name) : email ?? fallback;
+				return name ? (email ? `${name} (${email})` : name) : (email ?? fallback);
 			};
 		},
 	},

packages/editor-ui/src/types/externalHooks.ts

@@ -302,8 +302,10 @@ export type ExternalHooksKey = {
 	[K in keyof ExternalHooks]: `${K}.${Extract<keyof ExternalHooks[K], string>}`;
 }[keyof ExternalHooks];
 
-type ExtractHookMethodArray<P extends keyof ExternalHooks, S extends keyof ExternalHooks[P]> =
-	ExternalHooks[P][S] extends Array<infer U> ? U : never;
+type ExtractHookMethodArray<
+	P extends keyof ExternalHooks,
+	S extends keyof ExternalHooks[P],
+> = ExternalHooks[P][S] extends Array<infer U> ? U : never;
 
 type ExtractHookMethodFunction<T> = T extends ExternalHooksMethod ? T : never;