From 8e2622d1176880e2e1369d327fe81db19ca9c313 Mon Sep 17 00:00:00 2001
From: Keith Grant <keithjgrant@redhat.com>
Date: Thu, 17 Oct 2019 10:55:37 -0700
Subject: [PATCH 1/3] add error messages for InventorySelect

---
 .../src/components/Lookup/InventoryLookup.jsx        | 12 +++++++++++-
 .../src/screens/Template/shared/JobTemplateForm.jsx  |  2 ++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
index a974f913f2..1fda150cb5 100644
--- a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
+++ b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
@@ -12,13 +12,23 @@ const getInventories = async params => InventoriesAPI.read(params);
 
 class InventoryLookup extends React.Component {
   render() {
-    const { value, tooltip, onChange, required, i18n } = this.props;
+    const {
+      value,
+      tooltip,
+      onChange,
+      required,
+      isValid,
+      helperTextInvalid,
+      i18n,
+    } = this.props;
 
     return (
       <FormGroup
         label={i18n._(t`Inventory`)}
         isRequired={required}
         fieldId="inventory-lookup"
+        isValid={isValid}
+        helperTextInvalid={helperTextInvalid}
       >
         {tooltip && <FieldTooltip content={tooltip} />}
         <Lookup
diff --git a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
index 87cff2fa7e..c0f9460461 100644
--- a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
+++ b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
@@ -240,6 +240,8 @@ class JobTemplateForm extends Component {
                   form.setFieldValue('organizationId', value.organization);
                   this.setState({ inventory: value });
                 }}
+                isValid={!form.errors.inventory}
+                helperTextInvalid={form.errors.inventory}
                 required
               />
             )}

From df7e034b961c3d857b26d2c817df378620400911 Mon Sep 17 00:00:00 2001
From: Keith Grant <keithjgrant@redhat.com>
Date: Fri, 18 Oct 2019 08:40:48 -0700
Subject: [PATCH 2/3] fix blur behavior/error messages in JT form

---
 .../src/components/Lookup/InventoryLookup.jsx      |  2 ++
 .../screens/Template/shared/JobTemplateForm.jsx    | 14 +++++++++-----
 .../src/screens/Template/shared/PlaybookSelect.jsx | 11 ++++++++++-
 3 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
index 1fda150cb5..d570e79128 100644
--- a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
+++ b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx
@@ -16,6 +16,7 @@ class InventoryLookup extends React.Component {
       value,
       tooltip,
       onChange,
+      onBlur,
       required,
       isValid,
       helperTextInvalid,
@@ -37,6 +38,7 @@ class InventoryLookup extends React.Component {
           name="inventory"
           value={value}
           onLookupSave={onChange}
+          onBlur={onBlur}
           getItems={getInventories}
           required={required}
           qsNamespace="inventory"
diff --git a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
index c0f9460461..5108da297c 100644
--- a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
+++ b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
@@ -233,16 +233,19 @@ class JobTemplateForm extends Component {
             render={({ form }) => (
               <InventoryLookup
                 value={inventory}
+                onBlur={() => form.setFieldTouched('inventory')}
                 tooltip={i18n._(t`Select the inventory containing the hosts
                   you want this job to manage.`)}
+                isValid={!form.touched.inventory || !form.errors.inventory}
+                helperTextInvalid={form.errors.inventory}
                 onChange={value => {
                   form.setFieldValue('inventory', value.id);
                   form.setFieldValue('organizationId', value.organization);
                   this.setState({ inventory: value });
                 }}
-                isValid={!form.errors.inventory}
-                helperTextInvalid={form.errors.inventory}
                 required
+                touched={form.touched.inventory}
+                error={form.errors.inventory}
               />
             )}
           />
@@ -251,12 +254,12 @@ class JobTemplateForm extends Component {
             validate={this.handleProjectValidation()}
             render={({ form }) => (
               <ProjectLookup
-                helperTextInvalid={form.errors.project}
-                isValid={!form.errors.project}
                 value={project}
-                onBlur={handleBlur}
+                onBlur={() => form.setFieldTouched('project')}
                 tooltip={i18n._(t`Select the project containing the playbook
                   you want this job to execute.`)}
+                isValid={!form.touched.project || !form.errors.project}
+                helperTextInvalid={form.errors.project}
                 onChange={value => {
                   form.setFieldValue('project', value.id);
                   this.setState({ project: value });
@@ -289,6 +292,7 @@ class JobTemplateForm extends Component {
                     isValid={isValid}
                     form={form}
                     field={field}
+                    onBlur={() => form.setFieldTouched('playbook')}
                     onError={err => this.setState({ contentError: err })}
                   />
                 </FormGroup>
diff --git a/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx b/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx
index 3e7d03c37e..3f49be7a37 100644
--- a/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx
+++ b/awx/ui_next/src/screens/Template/shared/PlaybookSelect.jsx
@@ -5,7 +5,15 @@ import { t } from '@lingui/macro';
 import AnsibleSelect from '@components/AnsibleSelect';
 import { ProjectsAPI } from '@api';
 
-function PlaybookSelect({ projectId, isValid, form, field, onError, i18n }) {
+function PlaybookSelect({
+  projectId,
+  isValid,
+  form,
+  field,
+  onBlur,
+  onError,
+  i18n,
+}) {
   const [options, setOptions] = useState([]);
   useEffect(() => {
     if (!projectId) {
@@ -40,6 +48,7 @@ function PlaybookSelect({ projectId, isValid, form, field, onError, i18n }) {
       isValid={isValid}
       form={form}
       {...field}
+      onBlur={onBlur}
     />
   );
 }

From 155ed75f15c3c521618b910f227fcfe8d11f8d97 Mon Sep 17 00:00:00 2001
From: Keith Grant <keithjgrant@redhat.com>
Date: Fri, 18 Oct 2019 11:38:01 -0700
Subject: [PATCH 3/3] update jt Inventory field error message

---
 awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
index 5108da297c..bffdf85cef 100644
--- a/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
+++ b/awx/ui_next/src/screens/Template/shared/JobTemplateForm.jsx
@@ -229,7 +229,7 @@ class JobTemplateForm extends Component {
           />
           <Field
             name="inventory"
-            validate={required(null, i18n)}
+            validate={required(i18n._(t`Select a value for this field`), i18n)}
             render={({ form }) => (
               <InventoryLookup
                 value={inventory}