Um/fe review 3

docker/images/n8n-custom/Dockerfile

@@ -1,11 +1,11 @@
 # 1. Create an image to build n8n
-FROM node:14.15-alpine as builder
+FROM node:16-alpine as builder
 
 # Update everything and install needed dependencies
 USER root
 
 # Install all needed dependencies
-RUN apk --update add --virtual build-dependencies python build-base ca-certificates && \
+RUN apk --update add --virtual build-dependencies python3 build-base ca-certificates && \
 	npm_config_user=root npm install -g lerna
 
 WORKDIR /data
@@ -20,13 +20,14 @@ COPY packages/nodes-base/ ./packages/nodes-base/
 COPY packages/workflow/ ./packages/workflow/
 RUN rm -rf node_modules packages/*/node_modules packages/*/dist
 
+RUN npm config set legacy-peer-deps true
 RUN npm install --production --loglevel notice
 RUN lerna bootstrap --hoist -- --production
 RUN npm run build
 
 
 # 2. Start with a new clean image with just the code that is needed to run n8n
-FROM node:14.15-alpine
+FROM node:16-alpine
 
 USER root
 

docker/images/n8n-debian/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:14.15
+FROM node:16
 
 ARG N8N_VERSION
 

docker/images/n8n/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:14.15-alpine
+FROM node:16-alpine
 
 ARG N8N_VERSION
 
@@ -12,7 +12,7 @@ USER root
 
 # Install n8n and the also temporary all the packages
 # it needs to build it correctly.
-RUN apk --update add --virtual build-dependencies python build-base ca-certificates && \
+RUN apk --update add --virtual build-dependencies python3 build-base ca-certificates && \
 	npm_config_user=root npm install -g full-icu n8n@${N8N_VERSION} && \
 	apk del build-dependencies \
 	&& rm -rf /root /tmp/* /var/cache/apk/* && mkdir /root;

packages/cli/config/index.ts

@@ -831,6 +831,15 @@ const config = convict({
 		},
 	},
 
+	hiringBanner: {
+		enabled: {
+			doc: 'Whether hiring banner in browser console is enabled.',
+			format: Boolean,
+			default: true,
+			env: 'N8N_HIRING_BANNER_ENABLED',
+		},
+	},
+
 	personalization: {
 		enabled: {
 			doc: 'Whether personalization is enabled.',

packages/cli/src/Interfaces.ts

@@ -434,7 +434,7 @@ export interface IN8nUISettings {
 	userManagement: IUserManagementSettings;
 	workflowTagsDisabled: boolean;
 	logLevel: 'info' | 'debug' | 'warn' | 'error' | 'verbose';
-	deploymentType: string;
+	hiringBannerEnabled: boolean;
 	templates: {
 		enabled: boolean;
 		host: string;

packages/cli/src/Server.ts

@@ -322,7 +322,7 @@ class App {
 			},
 			workflowTagsDisabled: config.get('workflowTagsDisabled'),
 			logLevel: config.get('logs.level'),
-			deploymentType: config.get('deployment.type'),
+			hiringBannerEnabled: config.get('hiringBanner.enabled'),
 			templates: {
 				enabled: config.get('templates.enabled'),
 				host: config.get('templates.host'),

packages/core/src/NodeExecuteFunctions.ts

@@ -744,6 +744,10 @@ function convertN8nRequestToAxios(n8nRequest: IHttpRequestOptions): AxiosRequest
 		axiosRequest.headers['User-Agent'] = 'n8n';
 	}
 
+	if (n8nRequest.ignoreHttpStatusErrors) {
+		axiosRequest.validateStatus = () => true;
+	}
+
 	return axiosRequest;
 }
 

packages/design-system/package.json

@@ -29,16 +29,15 @@
     "@fortawesome/fontawesome-svg-core": "1.x",
     "@fortawesome/free-solid-svg-icons": "5.x",
     "@fortawesome/vue-fontawesome": "2.x",
-    "core-js": "3.x",
-    "element-ui": "2.15.x"
+    "core-js": "3.x"
   },
   "devDependencies": {
     "@babel/core": "^7.14.6",
     "@fortawesome/fontawesome-svg-core": "^1.2.35",
     "@fortawesome/free-solid-svg-icons": "^5.15.3",
     "@fortawesome/vue-fontawesome": "^2.0.2",
     "core-js": "^3.6.5",
-    "element-ui": "2.15.x",
+    "element-ui": "~2.15.7",
     "@storybook/addon-actions": "^6.3.6",
     "@storybook/addon-essentials": "^6.3.6",
     "@storybook/addon-links": "^6.3.6",

packages/design-system/src/components/N8nActionBox/ActionBox.vue

@@ -1,9 +1,8 @@
 <template functional>
 	<div :class="$style.container">
-		<span :class="$style.emoji">{{props.emoji}}</span>
 		<div :class="$style.description">
-			<component :is="$options.components.N8nHeading" size="xlarge">{{ props.heading }}</component>
-			<component :is="$options.components.N8nText" color="text-base">{{ props.description }}</component>
+			<component :is="$options.components.N8nHeading" size="xlarge" align="center">{{ props.heading }}</component>
+			<slot></slot>
 		</div>
 		<component :is="$options.components.N8nButton" :label="props.buttonText" size="large"
 			@click="(e) => listeners.click && listeners.click(e)"
@@ -19,15 +18,9 @@ import N8nText from '../N8nText';
 export default {
 	name: 'n8n-action-box',
 	props: {
-		emoji: {
-			type: String,
-		},
 		heading: {
 			type: String,
 		},
-		description: {
-			type: String,
-		},
 		buttonText: {
 			type: String,
 		},
@@ -61,7 +54,6 @@ export default {
 .description {
 	display: flex;
 	flex-direction: column;
-	text-align: center;
 
 	> *:first-child {
 		margin-bottom: var(--spacing-2xs);

packages/design-system/src/components/N8nAvatar/Avatar.vue

@@ -66,6 +66,6 @@ export default {
 .empty {
 	border-radius: 50%;
 	background-color: var(--color-foreground-dark);
-	opacity: .7;
+	opacity: .3;
 }
 </style>

packages/design-system/src/components/N8nFormInputs/FormInputs.vue

@@ -98,7 +98,11 @@ export default Vue.extend({
 		onSubmit() {
 			this.showValidationWarnings = true;
 			if (this.isReadyToSubmit) {
-				this.$emit('submit', this.values);
+				const toSubmit = this.filteredInputs.reduce((accu, input: IFormInput) => {
+					accu[input.name] = this.values[input.name];
+					return accu;
+				}, {});
+				this.$emit('submit', toSubmit);
 			}
 		},
 	},

packages/design-system/src/components/N8nHeading/Heading.vue

@@ -25,6 +25,10 @@ export default {
 			type: String,
 			validator: (value: string): boolean => ['primary', 'text-dark', 'text-base', 'text-light', 'text-xlight'].includes(value),
 		},
+		align: {
+			type: String,
+			validator: (value: string): boolean => ['right', 'left', 'center'].includes(value),
+		},
 	},
 	methods: {
 		getClass(props: {size: string, bold: boolean}) {
@@ -35,6 +39,9 @@ export default {
 			if (props.color) {
 				styles.color = `var(--color-${props.color})`;
 			}
+			if (props.align) {
+				styles['text-align'] = props.align;
+			}
 			return styles;
 		},
 	},