Remove enableWebhooks conditional in WebhookSubForm

Signed-off-by: Vadiem Janssens <info@vadiemjanssens.nl>

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

@@ -583,16 +583,15 @@ function JobTemplateForm({
                     </>
                   )}
 
-                  {allowCallbacks && enableWebhooks && (<br />)}
+                  {allowCallbacks && enableWebhooks && <br />}
 
                   {enableWebhooks && (
                     <>
-                      <Title size="md" headingLevel="h4">{i18n._(t`Webhook details`)}</Title>
+                      <Title size="md" headingLevel="h4">
+                        {i18n._(t`Webhook details`)}
+                      </Title>
                       <FormColumnLayout>
-                        <WebhookSubForm
-                          enableWebhooks={enableWebhooks}
-                          templateType={template.type}
-                        />
+                        <WebhookSubForm templateType={template.type} />
                       </FormColumnLayout>
                     </>
                   )}

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

@@ -23,7 +23,7 @@ import {
   CredentialTypesAPI,
 } from '../../../api';
 
-function WebhookSubForm({ i18n, enableWebhooks, templateType }) {
+function WebhookSubForm({ i18n, templateType }) {
   const { id } = useParams();
 
   const { pathname } = useLocation();
@@ -36,6 +36,7 @@ function WebhookSubForm({ i18n, enableWebhooks, templateType }) {
     webhookServiceHelpers,
   ] = useField('webhook_service');
 
+  // eslint-disable-next-line no-unused-vars
   const [webhookUrlField, webhookUrlMeta, webhookUrlHelpers] = useField(
     'webhook_url'
   );
@@ -71,21 +72,6 @@ function WebhookSubForm({ i18n, enableWebhooks, templateType }) {
     loadCredentialType();
   }, [loadCredentialType]);
 
-  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 { request: fetchWebhookKey, error: webhookKeyError } = useRequest(
     useCallback(async () => {
       const updateWebhookKey =
@@ -134,108 +120,106 @@ function WebhookSubForm({ i18n, enableWebhooks, templateType }) {
     return <ContentLoading />;
   }
   return (
-    enableWebhooks && (
-      <FormColumnLayout>
-        <FormGroup
-          name="webhook_service"
-          fieldId="webhook_service"
-          helperTextInvalid={webhookServiceMeta.error}
-          label={i18n._(t`Webhook Service`)}
-        >
-          <FieldTooltip content={i18n._(t`Select a webhook service.`)} />
-          <AnsibleSelect
-            {...webhookServiceField}
-            id="webhook_service"
-            data={webhookServiceOptions}
-            onChange={(event, val) => {
-              webhookServiceHelpers.setValue(val);
-              webhookUrlHelpers.setValue(
-                pathname.endsWith('/add')
-                  ? i18n
-                      ._(t`a new webhook url will be generated on save.`)
-                      .toUpperCase()
-                  : `${origin}/api/v2/${templateType}s/${id}/${val}/`
-              );
-              if (val === webhookServiceMeta.initialValue || val === '') {
-                webhookKeyHelpers.setValue(webhookKeyMeta.initialValue);
-                webhookCredentialHelpers.setValue(
-                  webhookCredentialMeta.initialValue
-                );
-              } else {
-                webhookKeyHelpers.setValue(
-                  i18n
-                    ._(t`a new webhook key will be generated on save.`)
+    <FormColumnLayout>
+      <FormGroup
+        name="webhook_service"
+        fieldId="webhook_service"
+        helperTextInvalid={webhookServiceMeta.error}
+        label={i18n._(t`Webhook Service`)}
+      >
+        <FieldTooltip content={i18n._(t`Select a webhook service.`)} />
+        <AnsibleSelect
+          {...webhookServiceField}
+          id="webhook_service"
+          data={webhookServiceOptions}
+          onChange={(event, val) => {
+            webhookServiceHelpers.setValue(val);
+            webhookUrlHelpers.setValue(
+              pathname.endsWith('/add')
+                ? i18n
+                    ._(t`a new webhook url will be generated on save.`)
                     .toUpperCase()
-                );
-                webhookCredentialHelpers.setValue(null);
-              }
-            }}
+                : `${origin}/api/v2/${templateType}s/${id}/${val}/`
+            );
+            if (val === webhookServiceMeta.initialValue || val === '') {
+              webhookKeyHelpers.setValue(webhookKeyMeta.initialValue);
+              webhookCredentialHelpers.setValue(
+                webhookCredentialMeta.initialValue
+              );
+            } else {
+              webhookKeyHelpers.setValue(
+                i18n
+                  ._(t`a new webhook key will be generated on save.`)
+                  .toUpperCase()
+              );
+              webhookCredentialHelpers.setValue(null);
+            }
+          }}
+        />
+      </FormGroup>
+      <>
+        <FormGroup
+          type="text"
+          fieldId="jt-webhookURL"
+          label={i18n._(t`Webhook URL`)}
+          name="webhook_url"
+        >
+          <FieldTooltip
+            content={i18n._(
+              t`Webhook services can launch jobs with this workflow job template by making a POST request to this URL.`
+            )}
+          />
+          <TextInput
+            id="t-webhookURL"
+            aria-label={i18n._(t`Webhook URL`)}
+            value={webhookUrlField.value}
+            isReadOnly
           />
         </FormGroup>
-        <>
-          <FormGroup
-            type="text"
-            fieldId="jt-webhookURL"
-            label={i18n._(t`Webhook URL`)}
-            name="webhook_url"
-          >
-            <FieldTooltip
-              content={i18n._(
-                t`Webhook services can launch jobs with this workflow job template by making a POST request to this URL.`
-              )}
-            />
-            <TextInput
-              id="t-webhookURL"
-              aria-label={i18n._(t`Webhook URL`)}
-              value={webhookUrlField.value}
-              isReadOnly
-            />
-          </FormGroup>
-          <FormGroup
-            label={i18n._(t`Webhook Key`)}
-            fieldId="template-webhook_key"
-          >
-            <FieldTooltip
-              content={i18n._(
-                t`Webhook services can use this as a shared secret.`
-              )}
-            />
-            <InputGroup>
-              <TextInput
-                id="template-webhook_key"
-                isReadOnly
-                aria-label="wfjt-webhook-key"
-                value={webhookKeyField.value}
-              />
-              <Button
-                isDisabled={isUpdateKeyDisabled}
-                variant="tertiary"
-                aria-label={i18n._(t`Update webhook key`)}
-                onClick={changeWebhookKey}
-              >
-                <SyncAltIcon />
-              </Button>
-            </InputGroup>
-          </FormGroup>
-        </>
-
-        {credTypeId && (
-          <CredentialLookup
-            label={i18n._(t`Webhook Credential`)}
-            tooltip={i18n._(
-              t`Optionally select the credential to use to send status updates back to the webhook service.`
+        <FormGroup
+          label={i18n._(t`Webhook Key`)}
+          fieldId="template-webhook_key"
+        >
+          <FieldTooltip
+            content={i18n._(
+              t`Webhook services can use this as a shared secret.`
             )}
-            credentialTypeId={credTypeId}
-            onChange={value => {
-              webhookCredentialHelpers.setValue(value || null);
-            }}
-            isValid={!webhookCredentialMeta.error}
-            helperTextInvalid={webhookCredentialMeta.error}
-            value={webhookCredentialField.value}
           />
-        )}
-      </FormColumnLayout>
-    )
+          <InputGroup>
+            <TextInput
+              id="template-webhook_key"
+              isReadOnly
+              aria-label="wfjt-webhook-key"
+              value={webhookKeyField.value}
+            />
+            <Button
+              isDisabled={isUpdateKeyDisabled}
+              variant="tertiary"
+              aria-label={i18n._(t`Update webhook key`)}
+              onClick={changeWebhookKey}
+            >
+              <SyncAltIcon />
+            </Button>
+          </InputGroup>
+        </FormGroup>
+      </>
+
+      {credTypeId && (
+        <CredentialLookup
+          label={i18n._(t`Webhook Credential`)}
+          tooltip={i18n._(
+            t`Optionally select the credential to use to send status updates back to the webhook service.`
+          )}
+          credentialTypeId={credTypeId}
+          onChange={value => {
+            webhookCredentialHelpers.setValue(value || null);
+          }}
+          isValid={!webhookCredentialMeta.error}
+          helperTextInvalid={webhookCredentialMeta.error}
+          value={webhookCredentialField.value}
+        />
+      )}
+    </FormColumnLayout>
   );
 }
 export default withI18n()(WebhookSubForm);

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

@@ -34,7 +34,7 @@ describe('<WebhookSubForm />', () => {
       wrapper = mountWithContexts(
         <Route path="templates/:templateType/:id/edit">
           <Formik initialValues={initialValues}>
-            <WebhookSubForm enableWebhooks templateType="job_template" />
+            <WebhookSubForm templateType="job_template" />
           </Formik>
         </Route>,
         {
@@ -103,7 +103,7 @@ describe('<WebhookSubForm />', () => {
               webhook_key: 'A NEW WEBHOOK KEY WILL BE GENERATED ON SAVE.',
             }}
           >
-            <WebhookSubForm enableWebhooks templateType="job_template" />
+            <WebhookSubForm templateType="job_template" />
           </Formik>
         </Route>,
         {
@@ -133,10 +133,7 @@ describe('<WebhookSubForm />', () => {
       newWrapper = mountWithContexts(
         <Route path="templates/:templateType/:id/edit">
           <Formik initialValues={{ ...initialValues, webhook_url }}>
-            <WebhookSubForm
-              enableWebhooks
-              templateType="workflow_job_template"
-            />
+            <WebhookSubForm templateType="workflow_job_template" />
           </Formik>
         </Route>,
         {

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

@@ -216,11 +216,10 @@ function WorkflowJobTemplateForm({
 
       {enableWebhooks && (
         <SubFormLayout>
-          <Title size="md" headingLevel="h4">{i18n._(t`Webhook details`)}</Title>
-          <WebhookSubForm
-            enableWebhooks={enableWebhooks}
-            templateType={template.type}
-          />
+          <Title size="md" headingLevel="h4">
+            {i18n._(t`Webhook details`)}
+          </Title>
+          <WebhookSubForm templateType={template.type} />
         </SubFormLayout>
       )}