diff --git a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx
index b8675b134a..57d4323450 100644
--- a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx
+++ b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useCallback, useEffect } from 'react';
 import { node, func, bool } from 'prop-types';
 import { withRouter } from 'react-router-dom';
 import { withI18n } from '@lingui/react';
@@ -7,6 +7,7 @@ import { FormGroup } from '@patternfly/react-core';
 import { OrganizationsAPI } from '../../api';
 import { Organization } from '../../types';
 import { getQSConfig, parseQueryString } from '../../util/qs';
+import useRequest from '../../util/useRequest';
 import OptionsList from '../OptionsList';
 import Lookup from './Lookup';
 import LookupErrorMessage from './shared/LookupErrorMessage';
@@ -27,22 +28,28 @@ function OrganizationLookup({
   value,
   history,
 }) {
-  const [organizations, setOrganizations] = useState([]);
-  const [count, setCount] = useState(0);
-  const [error, setError] = useState(null);
+  const {
+    result: { itemCount, organizations },
+    error: contentError,
+    request: fetchOrganizations,
+  } = useRequest(
+    useCallback(async () => {
+      const params = parseQueryString(QS_CONFIG, history.location.search);
+      const { data } = await OrganizationsAPI.read(params);
+      return {
+        organizations: data.results,
+        itemCount: data.count,
+      };
+    }, [history.location]),
+    {
+      organizations: [],
+      itemCount: 0,
+    }
+  );
 
   useEffect(() => {
-    (async () => {
-      const params = parseQueryString(QS_CONFIG, history.location.search);
-      try {
-        const { data } = await OrganizationsAPI.read(params);
-        setOrganizations(data.results);
-        setCount(data.count);
-      } catch (err) {
-        setError(err);
-      }
-    })();
-  }, [history.location]);
+    fetchOrganizations();
+  }, [fetchOrganizations]);
 
   return (
     <FormGroup
@@ -65,7 +72,7 @@ function OrganizationLookup({
           <OptionsList
             value={state.selectedItems}
             options={organizations}
-            optionCount={count}
+            optionCount={itemCount}
             multiple={state.multiple}
             header={i18n._(t`Organization`)}
             name="organization"
@@ -77,11 +84,11 @@ function OrganizationLookup({
                 isDefault: true,
               },
               {
-                name: i18n._(t`Created By (Username)`),
+                name: i18n._(t`Created by (username)`),
                 key: 'created_by__username',
               },
               {
-                name: i18n._(t`Modified By (Username)`),
+                name: i18n._(t`Modified by (username)`),
                 key: 'modified_by__username',
               },
             ]}
@@ -97,7 +104,7 @@ function OrganizationLookup({
           />
         )}
       />
-      <LookupErrorMessage error={error} />
+      <LookupErrorMessage error={contentError} />
     </FormGroup>
   );
 }
diff --git a/awx/ui_next/src/screens/Credential/CredentialAdd/CredentialAdd.test.jsx b/awx/ui_next/src/screens/Credential/CredentialAdd/CredentialAdd.test.jsx
index 6d77aeba8b..09d57417bb 100644
--- a/awx/ui_next/src/screens/Credential/CredentialAdd/CredentialAdd.test.jsx
+++ b/awx/ui_next/src/screens/Credential/CredentialAdd/CredentialAdd.test.jsx
@@ -181,7 +181,10 @@ describe('<CredentialAdd />', () => {
 
     test('handleCancel should return the user back to the credentials list', async () => {
       await waitForElement(wrapper, 'isLoading', el => el.length === 0);
-      wrapper.find('Button[aria-label="Cancel"]').simulate('click');
+      await act(async () => {
+        wrapper.find('Button[aria-label="Cancel"]').simulate('click');
+      });
+      wrapper.update();
       expect(history.location.pathname).toEqual('/credentials');
     });
   });