From 216d2e0379735adfe6e441e627137f3ba27f153d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Iv=C3=A1n=20Ovejero?= <ivov.src@gmail.com>
Date: Mon, 9 May 2022 09:38:53 +0200
Subject: [PATCH] :zap: Hide params during custom action

---
 .../editor-ui/src/components/NodeSettings.vue | 14 +----------
 .../src/components/ParameterInputList.vue     |  7 ++++++
 .../src/components/mixins/nodeHelpers.ts      | 24 +++++++++++++++++++
 3 files changed, 32 insertions(+), 13 deletions(-)

diff --git a/packages/editor-ui/src/components/NodeSettings.vue b/packages/editor-ui/src/components/NodeSettings.vue
index 44a3b9215c..b0571a27e5 100644
--- a/packages/editor-ui/src/components/NodeSettings.vue
+++ b/packages/editor-ui/src/components/NodeSettings.vue
@@ -60,7 +60,7 @@
 					</n8n-text>
 				</div>
 
-				<div v-if="customActionSelected" class="parameter-item parameter-notice">
+				<div v-if="isCustomActionSelected(nodeValues)" class="parameter-item parameter-notice">
 					<n8n-notice
 						:content="$locale.baseText(
 							'nodeSettings.useTheHttpRequestNode',
@@ -132,18 +132,6 @@ export default mixins(
 		},
 		computed: {
 			...mapGetters('credentials', [ 'getCredentialTypeByName' ]),
-			customActionSelected (): boolean {
-				return (
-					this.nodeValues.parameters !== undefined &&
-					typeof this.nodeValues.parameters === 'object' &&
-					this.nodeValues.parameters !== null &&
-					!Array.isArray(this.nodeValues.parameters) &&
-					(
-						this.nodeValues.parameters.resource === 'customAction' ||
-						this.nodeValues.parameters.operation === 'customAction'
-					)
-				);
-			},
 			nodeType (): INodeTypeDescription | null {
 				if (this.node) {
 					return this.$store.getters.nodeType(this.node.type, this.node.typeVersion);
diff --git a/packages/editor-ui/src/components/ParameterInputList.vue b/packages/editor-ui/src/components/ParameterInputList.vue
index d757402088..7654f36541 100644
--- a/packages/editor-ui/src/components/ParameterInputList.vue
+++ b/packages/editor-ui/src/components/ParameterInputList.vue
@@ -178,6 +178,13 @@ export default mixins(
 					return false;
 				}
 
+				if (
+					this.isCustomActionSelected(this.nodeValues) &&
+					this.mustHideDuringCustomAction(parameter, this.nodeValues)
+				) {
+					return false;
+				}
+
 				if (parameter.displayOptions === undefined) {
 					// If it is not defined no need to do a proper check
 					return true;
diff --git a/packages/editor-ui/src/components/mixins/nodeHelpers.ts b/packages/editor-ui/src/components/mixins/nodeHelpers.ts
index 9d09389a2a..d11275c9aa 100644
--- a/packages/editor-ui/src/components/mixins/nodeHelpers.ts
+++ b/packages/editor-ui/src/components/mixins/nodeHelpers.ts
@@ -47,6 +47,23 @@ export const nodeHelpers = mixins(
 				return node.type === HTTP_REQUEST_NODE_TYPE && node.typeVersion === 2;
 			},
 
+			isCustomActionSelected (nodeValues: INodeParameters): boolean {
+				const { parameters } = nodeValues;
+
+				return (
+					isObjectLiteral(parameters) &&
+					(parameters.resource === 'customAction' || parameters.operation === 'customAction')
+				);
+			},
+
+			mustHideDuringCustomAction (parameter: INodeProperties, nodeValues: INodeParameters): boolean {
+				if (parameter && parameter.displayOptions && parameter.displayOptions.hide) return true;
+
+				const MUST_REMAIN_VISIBLE = ['authentication', 'resource', 'operation', ...Object.keys(nodeValues)];
+
+				return !MUST_REMAIN_VISIBLE.includes(parameter.name);
+			},
+
 			// Returns the parameter value
 			getParameterValue (nodeValues: INodeParameters, parameterName: string, path: string) {
 				return get(
@@ -57,6 +74,9 @@ export const nodeHelpers = mixins(
 
 			// Returns if the given parameter should be displayed or not
 			displayParameter (nodeValues: INodeParameters, parameter: INodeProperties | INodeCredentialDescription, path: string, node: INodeUi | null) {
+				// TODO: If enabled, cannot select operation // If disabled (per original), cannot hide displayOptions.hide
+				// if (this.isCustomActionSelected(nodeValues)) return false;
+
 				return NodeHelpers.displayParameterPath(nodeValues, parameter, path, node);
 			},
 
@@ -495,3 +515,7 @@ declare namespace HttpRequestNode {
 		};
 	}
 }
+
+function isObjectLiteral(maybeObject: unknown): maybeObject is { [key: string]: string } {
+	return typeof maybeObject === 'object' && maybeObject !== null && !Array.isArray(maybeObject);
+}