diff --git a/awx/ui/src/screens/Credential/CredentialAdd/CredentialAdd.js b/awx/ui/src/screens/Credential/CredentialAdd/CredentialAdd.js
index af5d182616..2525e74826 100644
--- a/awx/ui/src/screens/Credential/CredentialAdd/CredentialAdd.js
+++ b/awx/ui/src/screens/Credential/CredentialAdd/CredentialAdd.js
@@ -12,6 +12,20 @@ import {
 import useRequest from 'hooks/useRequest';
 import CredentialForm from '../shared/CredentialForm';
 
+const fetchCredentialTypes = async (pageNo = 1, credentialTypes = []) => {
+  const { data } = await CredentialTypesAPI.read({
+    page_size: 200,
+    page: pageNo,
+  });
+  if (data.next) {
+    return fetchCredentialTypes(
+      pageNo + 1,
+      credentialTypes.concat(data.results)
+    );
+  }
+  return credentialTypes.concat(data.results);
+};
+
 function CredentialAdd({ me }) {
   const history = useHistory();
 
@@ -76,6 +90,7 @@ function CredentialAdd({ me }) {
       history.push(`/credentials/${credentialId}/details`);
     }
   }, [credentialId, history]);
+
   const {
     isLoading,
     error,
@@ -83,23 +98,7 @@ function CredentialAdd({ me }) {
     result,
   } = useRequest(
     useCallback(async () => {
-      const { data } = await CredentialTypesAPI.read({ page_size: 200 });
-      const credTypes = data.results;
-      if (data.next && data.next.includes('page=2')) {
-        let pageNo = 2;
-        /* eslint-disable no-await-in-loop */
-        do {
-          const {
-            data: { results },
-          } = await CredentialTypesAPI.read({
-            page_size: 200,
-            page: pageNo,
-          });
-          credTypes.push(...results);
-          pageNo++;
-        } while (data.count !== credTypes.length);
-      } /* eslint-enable no-await-in-loop */
-
+      const credTypes = await fetchCredentialTypes();
       const creds = credTypes.reduce((credentialTypesMap, credentialType) => {
         credentialTypesMap[credentialType.id] = credentialType;
         return credentialTypesMap;