Lookup tweaks/bug fixes

awx/ui_next/src/components/Lookup/CredentialLookup.jsx

@@ -71,7 +71,7 @@ function CredentialLookup({
             optionCount={count}
             header={label}
             qsConfig={QS_CONFIG}
-            readOnly={canDelete}
+            readOnly={!canDelete}
             selectItem={item => dispatch({ type: 'SELECT_ITEM', item })}
             deselectItem={item => dispatch({ type: 'DESELECT_ITEM', item })}
           />

awx/ui_next/src/components/Lookup/MultiCredentialsLookup.jsx

@@ -43,9 +43,7 @@ function MultiCredentialsLookup(props) {
       try {
         const types = await loadCredentialTypes();
         setCredentialTypes(types);
-        setSelectedType(
+        setSelectedType(types.find(type => type.kind === 'ssh') || types[0]);
-          types.find(type => type.name === 'Machine') || types[0]
-        );
       } catch (err) {
         onError(err);
       }
@@ -71,7 +69,7 @@ function MultiCredentialsLookup(props) {
     })();
   }, [selectedType, history.location.search, onError]);
 
-  const isMultiple = selectedType && selectedType.name === 'Vault';
+  const isMultiple = selectedType && selectedType.kind === 'vault';
   const renderChip = ({ item, removeItem, canDelete }) => (
     <CredentialChip
       key={item.id}

awx/ui_next/src/components/Lookup/shared/LookupErrorMessage.jsx

@@ -1,15 +1,17 @@
 import React from 'react';
+import { withI18n } from '@lingui/react';
+import { t } from '@lingui/macro';
 
-function LookupErrorMessage({ error }) {
+function LookupErrorMessage({ error, i18n }) {
   if (!error) {
     return null;
   }
 
   return (
     <div className="pf-c-form__helper-text pf-m-error" aria-live="polite">
-      {error.message || 'An error occured'}
+      {error.message || i18n._(t`An error occured`)}
     </div>
   );
 }
 
-export default LookupErrorMessage;
+export default withI18n()(LookupErrorMessage);

awx/ui_next/src/components/Lookup/shared/reducer.js

@@ -1,5 +1,3 @@
-// import { useReducer, useEffect } from 'react';
-
 export default function reducer(state, action) {
   switch (action.type) {
     case 'SELECT_ITEM':
@@ -51,10 +49,16 @@ function toggleModal(state) {
   if (isModalOpen) {
     return closeModal(state);
   }
+  let selectedItems = [];
+  if (multiple) {
+    selectedItems = [...value];
+  } else if (value) {
+    selectedItems.push(value);
+  }
   return {
     ...state,
     isModalOpen: !isModalOpen,
-    selectedItems: multiple ? [...value] : [value],
+    selectedItems,
   };
 }
 

awx/ui_next/src/components/Lookup/shared/reducer.test.js

@@ -129,6 +129,24 @@ describe('Lookup reducer', () => {
       });
     });
 
+    it('should set null value to empty array', () => {
+      const state = {
+        isModalOpen: false,
+        selectedItems: [{ id: 1 }],
+        value: null,
+        multiple: false,
+      };
+      const result = reducer(state, {
+        type: 'TOGGLE_MODAL',
+      });
+      expect(result).toEqual({
+        isModalOpen: true,
+        selectedItems: [],
+        value: null,
+        multiple: false,
+      });
+    });
+
     it('should open the modal (multiple)', () => {
       const state = {
         isModalOpen: false,