From 9711c3367531ac802fcac8014710d3ffc1ccd458 Mon Sep 17 00:00:00 2001
From: Keith Grant <keithjgrant@redhat.com>
Date: Fri, 4 Sep 2020 15:35:30 -0700
Subject: [PATCH] fix multiple notification form bugs

---
 .../components/FormField/FormSubmitError.jsx  | 29 ++++++++++++-------
 .../shared/NotificationTemplateForm.jsx       |  3 +-
 .../shared/TypeInputsSubForm.jsx              | 12 ++++----
 .../shared/typeFieldNames.js                  |  3 +-
 awx/ui_next/src/util/validators.jsx           |  3 ++
 5 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/awx/ui_next/src/components/FormField/FormSubmitError.jsx b/awx/ui_next/src/components/FormField/FormSubmitError.jsx
index 44ad062f59..b93cfa89f1 100644
--- a/awx/ui_next/src/components/FormField/FormSubmitError.jsx
+++ b/awx/ui_next/src/components/FormField/FormSubmitError.jsx
@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { useFormikContext } from 'formik';
 import { Alert } from '@patternfly/react-core';
+import { FormFullWidthLayout } from '../FormLayout';
 
 const findErrorStrings = (obj, messages = []) => {
   if (typeof obj === 'string') {
@@ -35,7 +36,13 @@ function FormSubmitError({ error }) {
       typeof error.response.data === 'object' &&
       Object.keys(error.response.data).length > 0
     ) {
-      const errorMessages = error.response.data;
+      const errorMessages = {};
+      Object.keys(error.response.data).forEach(fieldName => {
+        const errors = error.response.data[fieldName];
+        if (errors && errors.length) {
+          errorMessages[fieldName] = errors.join(' ');
+        }
+      });
       setErrors(errorMessages);
 
       const messages = findErrorStrings(error.response.data);
@@ -52,15 +59,17 @@ function FormSubmitError({ error }) {
   }
 
   return (
-    <Alert
-      variant="danger"
-      isInline
-      title={
-        Array.isArray(errorMessage)
-          ? errorMessage.map(msg => <div key={msg}>{msg}</div>)
-          : errorMessage
-      }
-    />
+    <FormFullWidthLayout>
+      <Alert
+        variant="danger"
+        isInline
+        title={
+          Array.isArray(errorMessage)
+            ? errorMessage.map(msg => <div key={msg}>{msg}</div>)
+            : errorMessage
+        }
+      />
+    </FormFullWidthLayout>
   );
 }
 
diff --git a/awx/ui_next/src/screens/NotificationTemplate/shared/NotificationTemplateForm.jsx b/awx/ui_next/src/screens/NotificationTemplate/shared/NotificationTemplateForm.jsx
index 6999ff62dd..50477fabeb 100644
--- a/awx/ui_next/src/screens/NotificationTemplate/shared/NotificationTemplateForm.jsx
+++ b/awx/ui_next/src/screens/NotificationTemplate/shared/NotificationTemplateForm.jsx
@@ -54,12 +54,13 @@ function NotificationTemplateFormFields({ i18n, defaultMessages }) {
         fieldId="notification-type"
         helperTextInvalid={typeMeta.error}
         isRequired
-        validated={!typeMeta.touched || typeMeta.error ? 'default' : 'error'}
+        validated={!typeMeta.touched || !typeMeta.error ? 'default' : 'error'}
         label={i18n._(t`Type`)}
       >
         <AnsibleSelect
           {...typeField}
           id="notification-type"
+          isValid={!typeMeta.touched || !typeMeta.error}
           data={[
             {
               value: '',
diff --git a/awx/ui_next/src/screens/NotificationTemplate/shared/TypeInputsSubForm.jsx b/awx/ui_next/src/screens/NotificationTemplate/shared/TypeInputsSubForm.jsx
index e6a2829fcc..14a38e8f32 100644
--- a/awx/ui_next/src/screens/NotificationTemplate/shared/TypeInputsSubForm.jsx
+++ b/awx/ui_next/src/screens/NotificationTemplate/shared/TypeInputsSubForm.jsx
@@ -20,6 +20,7 @@ import {
   required,
   requiredEmail,
   url,
+  minMaxValue,
 } from '../../../util/validators';
 import { NotificationType } from '../../../types';
 
@@ -104,16 +105,17 @@ function EmailFields({ i18n }) {
         label={i18n._(t`Port`)}
         name="notification_configuration.port"
         type="number"
-        validate={required(null, i18n)}
+        validate={combine([required(null, i18n), minMaxValue(1, 65535, i18n)])}
         isRequired
         min="0"
+        max="65535"
       />
       <FormField
         id="email-timeout"
         label={i18n._(t`Timeout`)}
         name="notification_configuration.timeout"
         type="number"
-        validate={required(null, i18n)}
+        validate={combine([required(null, i18n), minMaxValue(1, 120, i18n)])}
         isRequired
         min="1"
         max="120"
@@ -306,7 +308,7 @@ function PagerdutyFields({ i18n }) {
         label={i18n._(t`Pagerduty subdomain`)}
         name="notification_configuration.subdomain"
         type="text"
-        validate={required(i18n)}
+        validate={required(null, i18n)}
         isRequired
       />
       <FormField
@@ -314,7 +316,7 @@ function PagerdutyFields({ i18n }) {
         label={i18n._(t`API service/integration key`)}
         name="notification_configuration.service_key"
         type="text"
-        validate={required(i18n)}
+        validate={required(null, i18n)}
         isRequired
       />
       <FormField
@@ -322,7 +324,7 @@ function PagerdutyFields({ i18n }) {
         label={i18n._(t`Client identifier`)}
         name="notification_configuration.client_name"
         type="text"
-        validate={required(i18n)}
+        validate={required(null, i18n)}
         isRequired
       />
     </>
diff --git a/awx/ui_next/src/screens/NotificationTemplate/shared/typeFieldNames.js b/awx/ui_next/src/screens/NotificationTemplate/shared/typeFieldNames.js
index 7f87baa41a..4dd991cfa9 100644
--- a/awx/ui_next/src/screens/NotificationTemplate/shared/typeFieldNames.js
+++ b/awx/ui_next/src/screens/NotificationTemplate/shared/typeFieldNames.js
@@ -48,7 +48,8 @@ export default typeFieldNames;
 const initialConfigValues = {};
 Object.keys(typeFieldNames).forEach(key => {
   typeFieldNames[key].forEach(fieldName => {
-    initialConfigValues[fieldName] = '';
+    const isBoolean = fieldName.includes('_ssl');
+    initialConfigValues[fieldName] = isBoolean ? false : '';
   });
 });
 
diff --git a/awx/ui_next/src/util/validators.jsx b/awx/ui_next/src/util/validators.jsx
index 959740d317..111736c3ed 100644
--- a/awx/ui_next/src/util/validators.jsx
+++ b/awx/ui_next/src/util/validators.jsx
@@ -78,6 +78,9 @@ export function integer(i18n) {
 
 export function url(i18n) {
   return value => {
+    if (!value) {
+      return undefined;
+    }
     // URL regex from https://urlregex.com/
     if (
       // eslint-disable-next-line max-len