Merge pull request #7997 from mabashian/7480-webhook-disable

Fixes bug where users were unable to turn webhooks off when editing templates

Reviewed-by: Tiago Góes <tiago.goes2009@gmail.com>
             https://github.com/tiagodread

awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx

@@ -91,6 +91,15 @@ function JobTemplateForm({
   const [jobTagsField, , jobTagsHelpers] = useField('job_tags');
   const [skipTagsField, , skipTagsHelpers] = useField('skip_tags');
 
+  const [, webhookServiceMeta, webhookServiceHelpers] = useField(
+    'webhook_service'
+  );
+  const [, webhookUrlMeta, webhookUrlHelpers] = useField('webhook_url');
+  const [, webhookKeyMeta, webhookKeyHelpers] = useField('webhook_key');
+  const [, webhookCredentialMeta, webhookCredentialHelpers] = useField(
+    'webhook_credential'
+  );
+
   const {
     request: fetchProject,
     error: projectContentError,
@@ -126,6 +135,21 @@ function JobTemplateForm({
     loadRelatedInstanceGroups();
   }, [loadRelatedInstanceGroups]);
 
+  useEffect(() => {
+    if (enableWebhooks) {
+      webhookServiceHelpers.setValue(webhookServiceMeta.initialValue);
+      webhookUrlHelpers.setValue(webhookUrlMeta.initialValue);
+      webhookKeyHelpers.setValue(webhookKeyMeta.initialValue);
+      webhookCredentialHelpers.setValue(webhookCredentialMeta.initialValue);
+    } else {
+      webhookServiceHelpers.setValue('');
+      webhookUrlHelpers.setValue('');
+      webhookKeyHelpers.setValue('');
+      webhookCredentialHelpers.setValue(null);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [enableWebhooks]);
+
   const handleProjectValidation = project => {
     if (!project && projectMeta.touched) {
       return i18n._(t`Select a value for this field`);

awx/ui_next/src/screens/Template/shared/WebhookSubForm.jsx

@@ -25,9 +25,7 @@ import {
 
 function WebhookSubForm({ i18n, templateType }) {
   const { id } = useParams();
-
   const { pathname } = useLocation();
-
   const { origin } = document.location;
 
   const [
@@ -35,11 +33,7 @@ function WebhookSubForm({ i18n, templateType }) {
     webhookServiceMeta,
     webhookServiceHelpers,
   ] = useField('webhook_service');
-
+  const [webhookUrlField, , webhookUrlHelpers] = useField('webhook_url');
-  // eslint-disable-next-line no-unused-vars
-  const [webhookUrlField, webhookUrlMeta, webhookUrlHelpers] = useField(
-    'webhook_url'
-  );
   const [webhookKeyField, webhookKeyMeta, webhookKeyHelpers] = useField(
     'webhook_key'
   );

awx/ui_next/src/screens/Template/shared/WorkflowJobTemplateForm.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { t } from '@lingui/macro';
 import PropTypes, { shape } from 'prop-types';
 
@@ -57,6 +57,29 @@ function WorkflowJobTemplateForm({
     'organization'
   );
   const [scmField, , scmHelpers] = useField('scm_branch');
+  const [, webhookServiceMeta, webhookServiceHelpers] = useField(
+    'webhook_service'
+  );
+  const [, webhookUrlMeta, webhookUrlHelpers] = useField('webhook_url');
+  const [, webhookKeyMeta, webhookKeyHelpers] = useField('webhook_key');
+  const [, webhookCredentialMeta, webhookCredentialHelpers] = useField(
+    'webhook_credential'
+  );
+
+  useEffect(() => {
+    if (enableWebhooks) {
+      webhookServiceHelpers.setValue(webhookServiceMeta.initialValue);
+      webhookUrlHelpers.setValue(webhookUrlMeta.initialValue);
+      webhookKeyHelpers.setValue(webhookKeyMeta.initialValue);
+      webhookCredentialHelpers.setValue(webhookCredentialMeta.initialValue);
+    } else {
+      webhookServiceHelpers.setValue('');
+      webhookUrlHelpers.setValue('');
+      webhookKeyHelpers.setValue('');
+      webhookCredentialHelpers.setValue(null);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [enableWebhooks]);
 
   if (hasContentError) {
     return <ContentError error={hasContentError} />;