From 10eea2bea7cffb6ce573a3f339ca3ab0e961c622 Mon Sep 17 00:00:00 2001
From: Ricardo Espinoza <ricardo@n8n.io>
Date: Thu, 4 Apr 2024 05:30:37 -0400
Subject: [PATCH] fix(editor): Issue showing Auth2 callback section when all
 properties are overriden (#8999)

---
 cypress/e2e/2-credentials.cy.ts               | 25 +++++++++++++++++++
 .../CredentialEdit/CredentialConfig.vue       |  5 +++-
 .../CredentialEdit/CredentialEdit.vue         | 23 ++++++++++++++++-
 3 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/cypress/e2e/2-credentials.cy.ts b/cypress/e2e/2-credentials.cy.ts
index ca1ca6e0147ff..008758aef2f75 100644
--- a/cypress/e2e/2-credentials.cy.ts
+++ b/cypress/e2e/2-credentials.cy.ts
@@ -236,4 +236,29 @@ describe('Credentials', () => {
 			.find('input')
 			.should('have.value', NEW_QUERY_AUTH_ACCOUNT_NAME);
 	});
+
+	it('should not show OAuth redirect URL section when OAuth2 credentials are overridden', () => {
+		cy.intercept('/types/credentials.json', { middleware: true }, (req) => {
+			req.headers['cache-control'] = 'no-cache, no-store';
+
+			req.on('response', (res) => {
+				const credentials = res.body || [];
+
+				const index = credentials.findIndex((c) => c.name === 'slackOAuth2Api');
+
+				credentials[index] = {
+					...credentials[index],
+					__overwrittenProperties: ['clientId', 'clientSecret'],
+				};
+			});
+		});
+
+		workflowPage.actions.visit(true);
+		workflowPage.actions.addNodeToCanvas('Slack');
+		workflowPage.actions.openNode('Slack');
+		workflowPage.getters.nodeCredentialsSelect().click();
+		getVisibleSelect().find('li').last().click();
+		credentialsModal.getters.credentialAuthTypeRadioButtons().first().click();
+		nodeDetailsView.getters.copyInput().should('not.exist');
+	});
 });
diff --git a/packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue b/packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue
index 3ef3a88a55ab4..530d39ca4528a 100644
--- a/packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue
+++ b/packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue
@@ -78,7 +78,7 @@
 			/>
 
 			<CopyInput
-				v-if="isOAuthType && credentialProperties.length"
+				v-if="isOAuthType && !allOAuth2BasePropertiesOverridden"
 				:label="$locale.baseText('credentialEdit.credentialConfig.oAuthRedirectUrl')"
 				:value="oAuthCallbackUrl"
 				:copy-button-text="$locale.baseText('credentialEdit.credentialConfig.clickToCopy')"
@@ -204,6 +204,9 @@ export default defineComponent({
 		isOAuthType: {
 			type: Boolean,
 		},
+		allOAuth2BasePropertiesOverridden: {
+			type: Boolean,
+		},
 		isOAuthConnected: {
 			type: Boolean,
 		},
diff --git a/packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue b/packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue
index a05618ffb3dd0..86a97e52367c9 100644
--- a/packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue
+++ b/packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue
@@ -75,6 +75,7 @@
 						:parent-types="parentTypes"
 						:required-properties-filled="requiredPropertiesFilled"
 						:credential-permissions="credentialPermissions"
+						:all-o-auth2-base-properties-overridden="allOAuth2BasePropertiesOverridden"
 						:mode="mode"
 						:selected-credential="selectedCredential"
 						:show-auth-type-selector="requiredCredentials"
@@ -427,6 +428,15 @@ export default defineComponent({
 					this.parentTypes.includes('oAuth1Api'))
 			);
 		},
+		allOAuth2BasePropertiesOverridden() {
+			if (this.credentialType?.__overwrittenProperties) {
+				return (
+					this.credentialType.__overwrittenProperties.includes('clientId') &&
+					this.credentialType.__overwrittenProperties.includes('clientSecret')
+				);
+			}
+			return false;
+		},
 		isOAuthConnected(): boolean {
 			return this.isOAuthType && !!this.credentialData.oauthTokenData;
 		},
@@ -435,7 +445,7 @@ export default defineComponent({
 				return [];
 			}
 
-			return this.credentialType.properties.filter((propertyData: INodeProperties) => {
+			const properties = this.credentialType.properties.filter((propertyData: INodeProperties) => {
 				if (!this.displayCredentialParameter(propertyData)) {
 					return false;
 				}
@@ -444,6 +454,17 @@ export default defineComponent({
 					!this.credentialType!.__overwrittenProperties.includes(propertyData.name)
 				);
 			});
+
+			/**
+			 * If after all credentials overrides are applied only "notice"
+			 * properties are left, do not return them. This will avoid
+			 * showing notices that refer to a property that was overridden.
+			 */
+			if (properties.every((p) => p.type === 'notice')) {
+				return [];
+			}
+
+			return properties;
 		},
 		requiredPropertiesFilled(): boolean {
 			for (const property of this.credentialProperties) {