Add validate for CredentialLookup using required prop

When using `CredentialLookup` with required prop. The `validate`
argument must be provided to the `useField`.

See: https://github.com/ansible/awx/issues/8184

awx/ui_next/src/screens/InstanceGroup/shared/ContainerGroupForm.jsx

@@ -23,9 +23,11 @@ import { VariablesField } from '../../../components/CodeMirrorInput';
 
 function ContainerGroupFormFields({ i18n, instanceGroup }) {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
+
   const [overrideField] = useField('override');
 
   const onCredentialChange = useCallback(

awx/ui_next/src/screens/InstanceGroup/shared/ContainerGroupForm.test.jsx

@@ -28,12 +28,21 @@ const instanceGroup = {
   is_controller: false,
   is_isolated: false,
   is_containerized: false,
-  credential: null,
+  credential: 3,
   policy_instance_percentage: 46,
   policy_instance_minimum: 12,
   policy_instance_list: [],
   pod_spec_override: '',
   summary_fields: {
+    credential: {
+      id: 3,
+      name: 'test',
+      description: 'Simple one',
+      kind: 'kubernetes_bearer_token',
+      cloud: false,
+      kubernetes: true,
+      credential_type_id: 17,
+    },
     user_capabilities: {
       edit: true,
       delete: true,
@@ -101,7 +110,7 @@ describe('<ContainerGroupForm/>', () => {
         .find('Checkbox[aria-label="Customize pod specification"]')
         .prop('isChecked')
     ).toBeFalsy();
-    expect(wrapper.find('CredentialLookup').prop('value')).toBeFalsy();
+    expect(wrapper.find('CredentialLookup').prop('value').name).toBe('test');
   });
 
   test('should update form values', () => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/AzureSubForm.jsx

@@ -11,12 +11,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const AzureSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/CloudFormsSubForm.jsx

@@ -11,12 +11,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const CloudFormsSubForm = ({ i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/GCESubForm.jsx

@@ -10,12 +10,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const GCESubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/OpenStackSubForm.jsx

@@ -11,12 +11,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const OpenStackSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/SatelliteSubForm.jsx

@@ -11,12 +11,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const SatelliteSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/TowerSubForm.jsx

@@ -10,12 +10,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const TowerSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/VMwareSubForm.jsx

@@ -11,12 +11,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const VMwareSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {

awx/ui_next/src/screens/Inventory/shared/InventorySourceSubForms/VirtualizationSubForm.jsx

@@ -10,12 +10,14 @@ import {
   EnabledValueField,
   HostFilterField,
 } from './SharedFields';
+import { required } from '../../../../util/validators';
 
 const VirtualizationSubForm = ({ autoPopulateCredential, i18n }) => {
   const { setFieldValue } = useFormikContext();
-  const [credentialField, credentialMeta, credentialHelpers] = useField(
+  const [credentialField, credentialMeta, credentialHelpers] = useField({
-    'credential'
+    name: 'credential',
-  );
+    validate: required(i18n._(t`Select a value for this field`), i18n),
+  });
 
   const handleCredentialUpdate = useCallback(
     value => {