diff --git a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
index 98773323be..4fa38d2fd6 100644
--- a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
+++ b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
@@ -583,16 +583,15 @@ function JobTemplateForm({
>
)}
- {allowCallbacks && enableWebhooks && (
)}
+ {allowCallbacks && enableWebhooks &&
}
{enableWebhooks && (
<>
-
{i18n._(t`Webhook details`)}
+
+ {i18n._(t`Webhook details`)}
+
-
+
>
)}
diff --git a/awx/ui_next/src/screens/Template/shared/WebhookSubForm.jsx b/awx/ui_next/src/screens/Template/shared/WebhookSubForm.jsx
index 94adbeb600..b6ced55dd6 100644
--- a/awx/ui_next/src/screens/Template/shared/WebhookSubForm.jsx
+++ b/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 ;
}
return (
- enableWebhooks && (
-
-
-
- {
- 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.`)
+
+
+
+ {
+ 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);
+ }
+ }}
+ />
+
+ <>
+
+
+
- <>
-
-
-
-
-
-
-
-
-
-
-
- >
-
- {credTypeId && (
-
+ {
- webhookCredentialHelpers.setValue(value || null);
- }}
- isValid={!webhookCredentialMeta.error}
- helperTextInvalid={webhookCredentialMeta.error}
- value={webhookCredentialField.value}
/>
- )}
-
- )
+
+
+
+
+
+ >
+
+ {credTypeId && (
+ {
+ webhookCredentialHelpers.setValue(value || null);
+ }}
+ isValid={!webhookCredentialMeta.error}
+ helperTextInvalid={webhookCredentialMeta.error}
+ value={webhookCredentialField.value}
+ />
+ )}
+
);
}
export default withI18n()(WebhookSubForm);
diff --git a/awx/ui_next/src/screens/Template/shared/WebhookSubForm.test.jsx b/awx/ui_next/src/screens/Template/shared/WebhookSubForm.test.jsx
index 9b9896d694..cb5f18dacb 100644
--- a/awx/ui_next/src/screens/Template/shared/WebhookSubForm.test.jsx
+++ b/awx/ui_next/src/screens/Template/shared/WebhookSubForm.test.jsx
@@ -34,7 +34,7 @@ describe('', () => {
wrapper = mountWithContexts(
-
+
,
{
@@ -103,7 +103,7 @@ describe('', () => {
webhook_key: 'A NEW WEBHOOK KEY WILL BE GENERATED ON SAVE.',
}}
>
-
+
,
{
@@ -133,10 +133,7 @@ describe('', () => {
newWrapper = mountWithContexts(
-
+
,
{
diff --git a/awx/ui_next/src/screens/Template/shared/WorkflowJobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/WorkflowJobTemplateForm.jsx
index f7dfeb3a16..ece98a5e20 100644
--- a/awx/ui_next/src/screens/Template/shared/WorkflowJobTemplateForm.jsx
+++ b/awx/ui_next/src/screens/Template/shared/WorkflowJobTemplateForm.jsx
@@ -216,11 +216,10 @@ function WorkflowJobTemplateForm({
{enableWebhooks && (
- {i18n._(t`Webhook details`)}
-
+
+ {i18n._(t`Webhook details`)}
+
+
)}