🔀 Merge parent branch

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

@@ -77,7 +77,6 @@ import { showMessage } from '@/components/mixins/showMessage';
 import { mapGetters } from "vuex";
 
 import mixins from 'vue-typed-mixins';
-import { HTTP_REQUEST_NODE_TYPE } from '@/constants';
 
 export default mixins(
 	genericHelpers,
@@ -101,14 +100,12 @@ export default mixins(
 			getCredentialTypeByName: 'getCredentialTypeByName',
 		}),
 		isProxyAuth(): boolean {
-			return this.node.type === HTTP_REQUEST_NODE_TYPE
-				&& this.node.typeVersion === 2
-				&& this.node.parameters.authenticateWith === 'nodeCredential';
+			return this.isHttpRequestNodeV2(this.node) &&
+				this.node.parameters.authenticateWith === 'nodeCredential';
 		},
 		isGenericAuth(): boolean {
-			return this.node.type === HTTP_REQUEST_NODE_TYPE
-				&& this.node.typeVersion === 2
-				&& this.node.parameters.authenticateWith === 'genericAuth';
+			return this.isHttpRequestNodeV2(this.node) &&
+				this.node.parameters.authenticateWith === 'genericAuth';
 		},
 		credentialTypesNode (): string[] {
 			return this.credentialTypesNodeDescription

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

@@ -1,6 +1,6 @@
 <template>
 	<div class="parameter-input-list-wrapper">
-		<div v-for="(parameter, index) in filteredParameters" :key="parameter.name" :class="{indent}">
+		<div v-for="(parameter, index) in filteredParameters" :key="parameter.name">
 			<slot v-if="indexToShowSlotAt === index" />
 
 			<div
@@ -89,7 +89,6 @@
 <script lang="ts">
 
 import {
-	INode,
 	INodeParameters,
 	INodeProperties,
 	NodeParameterValue,
@@ -105,7 +104,6 @@ import ParameterInputFull from '@/components/ParameterInputFull.vue';
 import { get, set } from 'lodash';
 
 import mixins from 'vue-typed-mixins';
-import { HTTP_REQUEST_NODE_TYPE } from '@/constants';
 
 export default mixins(
 	genericHelpers,
@@ -136,9 +134,7 @@ export default mixins(
 				return this.$store.getters.activeNode;
 			},
 			indexToShowSlotAt (): number {
-				if (this.node.type === HTTP_REQUEST_NODE_TYPE && this.node.typeVersion === 2) {
-					return 2;
-				}
+				if (this.isHttpRequestNodeV2(this.node)) return 2;
 
 				return 0;
 			},
@@ -274,9 +270,10 @@ export default mixins(
 
 <style lang="scss">
 .parameter-input-list-wrapper {
-	display: flex;
-	flex-direction: column;
-	padding-top: var(--spacing-xs);
+
+	div:first-child > .node-credentials {
+		padding-top: var(--spacing-xs);
+	}
 
 	.delete-option {
 		display: none;
@@ -310,7 +307,7 @@ export default mixins(
 
 	.parameter-item {
 		position: relative;
-		margin: 0 0 var(--spacing-xs);
+		margin: var(--spacing-xs) 0;
 
 		>.delete-option {
 			top: var(--spacing-5xs);

packages/editor-ui/src/components/mixins/nodeHelpers.ts

@@ -43,6 +43,9 @@ export const nodeHelpers = mixins(
 			...mapGetters('credentials', [ 'getCredentialTypeByName', 'getCredentialsByType' ]),
 		},
 		methods: {
+			isHttpRequestNodeV2 (node: INodeUi): boolean {
+				return node.type === HTTP_REQUEST_NODE_TYPE && node.typeVersion === 2;
+			},
 
 			// Returns the parameter value
 			getParameterValue (nodeValues: INodeParameters, parameterName: string, path: string) {
@@ -121,6 +124,23 @@ export const nodeHelpers = mixins(
 				return false;
 			},
 
+			reportUnsetCredential(credentialType: ICredentialType) {
+				return {
+					credentials: {
+						[credentialType.name]: [
+							this.$locale.baseText(
+								'nodeHelpers.credentialsUnset',
+								{
+									interpolate: {
+										credentialType: credentialType.displayName,
+									},
+								},
+							),
+						],
+					},
+				};
+			},
+
 			// Updates the execution issues.
 			updateNodesExecutionIssues () {
 				const nodes = this.$store.getters.allNodes;
@@ -204,43 +224,43 @@ export const nodeHelpers = mixins(
 				let credentialDisplayName: string;
 				let selectedCredentials: INodeCredentialsDetails;
 
-				const { authenticateWith, genericAuthType, nodeCredentialType } = node.parameters as {
-					authenticateWith: 'none' | 'genericAuth' | 'nodeCredential';
-					genericAuthType: string;
-					nodeCredentialType: string;
-				};
+				const {
+					authenticateWith,
+					genericAuthType,
+					nodeCredentialType,
+				} = node.parameters as HttpRequestNode.V2.AuthParams;
 
 				if (
-					isHttpRequestNodeV2(node) &&
+					this.isHttpRequestNodeV2(node) &&
 					authenticateWith === 'genericAuth' &&
 					selectedCredsAreUnusable(node, genericAuthType)
 				) {
 					const credential = this.getCredentialTypeByName(genericAuthType);
-					return reportUnsetCredential(credential);
+					return this.reportUnsetCredential(credential);
 				}
 
 				if (
-					isHttpRequestNodeV2(node) &&
+					this.isHttpRequestNodeV2(node) &&
 					authenticateWith === 'nodeCredential' &&
 					nodeCredentialType !== '' &&
 					node.credentials !== undefined
 				) {
 					const stored = this.getCredentialsByType(nodeCredentialType);
 
-					if (selectedCredsWereDeleted(node, nodeCredentialType, stored)) {
+					if (selectedCredsDoNotExist(node, nodeCredentialType, stored)) {
 						const credential = this.getCredentialTypeByName(nodeCredentialType);
-						return reportUnsetCredential(credential);
+						return this.reportUnsetCredential(credential);
 					}
 				}
 
 				if (
-					isHttpRequestNodeV2(node) &&
+					this.isHttpRequestNodeV2(node) &&
 					authenticateWith === 'nodeCredential' &&
 					nodeCredentialType !== '' &&
 					selectedCredsAreUnusable(node, nodeCredentialType)
 				) {
 					const credential = this.getCredentialTypeByName(nodeCredentialType);
-					return reportUnsetCredential(credential);
+					return this.reportUnsetCredential(credential);
 				}
 
 				for (const credentialTypeDescription of nodeType!.credentials!) {
@@ -440,10 +460,6 @@ export const nodeHelpers = mixins(
 		},
 	});
 
-function isHttpRequestNodeV2(node: INodeUi) {
-	return node.type === HTTP_REQUEST_NODE_TYPE && node.typeVersion === 2;
-}
-
 /**
  * Whether the node has no selected credentials, or none of the node's
  * selected credentials are of the specified type.
@@ -456,7 +472,7 @@ function selectedCredsAreUnusable(node: INodeUi, credentialType: string) {
  * Whether the node's selected credentials of the specified type
  * can no longer be found in the database.
  */
-function selectedCredsWereDeleted(
+function selectedCredsDoNotExist(
 	node: INodeUi,
 	nodeCredentialType: string,
 	storedCredsByType: ICredentialsResponse[] | null,
@@ -470,10 +486,12 @@ function selectedCredsWereDeleted(
 	return !storedCredsByType.find((c) => c.id === selectedCredsByType.id);
 }
 
-function reportUnsetCredential(credentialType: ICredentialType) {
-	return {
-		credentials: {
-			[credentialType.name]: [`Credentials for "${credentialType.displayName}" are not set.`],
-		},
-	};
+declare namespace HttpRequestNode {
+	namespace V2 {
+		type AuthParams = {
+			authenticateWith: 'none' | 'genericAuth' | 'nodeCredential';
+			genericAuthType: string;
+			nodeCredentialType: string;
+		};
+	}
 }

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

@@ -5,7 +5,6 @@ import {
 	START_NODE_TYPE,
 	WEBHOOK_NODE_TYPE,
 	VIEWS,
-	HTTP_REQUEST_NODE_TYPE,
 } from '@/constants';
 
 import {
@@ -327,13 +326,11 @@ export const workflowHelpers = mixins(
 					const nodeParameters = NodeHelpers.getNodeParameters(nodeType.properties, node.parameters, false, false, node);
 					nodeData.parameters = nodeParameters !== null ? nodeParameters : {};
 
-					const fullAccess = node.type === HTTP_REQUEST_NODE_TYPE && node.typeVersion === 2;
-
 					// Add the node credentials if there are some set and if they should be displayed
 					if (node.credentials !== undefined && nodeType.credentials !== undefined) {
 						const saveCredenetials: INodeCredentials = {};
 						for (const nodeCredentialTypeName of Object.keys(node.credentials)) {
-							if (fullAccess) {
+							if (this.isHttpRequestNodeV2(node)) {
 								saveCredenetials[nodeCredentialTypeName] = node.credentials[nodeCredentialTypeName];
 								continue;
 							}

packages/editor-ui/src/plugins/i18n/locales/en.json

@@ -387,6 +387,7 @@
 	"nodeErrorView.stack": "Stack",
 	"nodeErrorView.theErrorCauseIsTooLargeToBeDisplayed": "The error cause is too large to be displayed",
 	"nodeErrorView.time": "Time",
+	"nodeHelpers.credentialsUnset": "Credentials for '{credentialType}' are not set.",
 	"nodeSettings.alwaysOutputData.description": "If active, will output a single, empty item when the output would have been empty. Use to prevent the workflow finishing on this node.",
 	"nodeSettings.alwaysOutputData.displayName": "Always Output Data",
 	"nodeSettings.clickOnTheQuestionMarkIcon": "Click the '?' icon to open this node on n8n.io",