diff --git a/awx/ui_next/src/components/ContentError/ContentError.jsx b/awx/ui_next/src/components/ContentError/ContentError.jsx
index 7f766f7e91..f6fb2d825c 100644
--- a/awx/ui_next/src/components/ContentError/ContentError.jsx
+++ b/awx/ui_next/src/components/ContentError/ContentError.jsx
@@ -25,6 +25,7 @@ function ContentError({ error, children, isNotFound, i18n }) {
return null;
}
}
+ console.error(error);
const is404 =
isNotFound || (error && error.response && error.response.status === 404);
const is401 = error && error.response && error.response.status === 401;
diff --git a/awx/ui_next/src/components/LaunchPrompt/CredentialsStep.jsx b/awx/ui_next/src/components/LaunchPrompt/CredentialsStep.jsx
index 8d68995197..f86513a550 100644
--- a/awx/ui_next/src/components/LaunchPrompt/CredentialsStep.jsx
+++ b/awx/ui_next/src/components/LaunchPrompt/CredentialsStep.jsx
@@ -9,6 +9,7 @@ import AnsibleSelect from '@components/AnsibleSelect';
import OptionsList from '@components/OptionsList';
import ContentLoading from '@components/ContentLoading';
import CredentialChip from '@components/CredentialChip';
+import ContentError from '@components/ContentError';
import { getQSConfig, parseQueryString } from '@util/qs';
import useRequest from '@util/useRequest';
@@ -21,7 +22,6 @@ const QS_CONFIG = getQSConfig('inventory', {
function CredentialsStep({ i18n }) {
const [field, , helpers] = useField('credentials');
const [selectedType, setSelectedType] = useState(null);
- const [selectedItems, setSelectedItems] = useState([]);
const history = useHistory();
const isTypeSelected = !!selectedType;
@@ -54,10 +54,13 @@ function CredentialsStep({ i18n }) {
request: fetchCredentials,
} = useRequest(
useCallback(async () => {
+ if (!selectedType) {
+ return { credentials: [], count: 0 };
+ }
const params = parseQueryString(QS_CONFIG, history.location.search);
const { data } = await CredentialsAPI.read({
...params,
- credential_type: selectedType.id || 1,
+ credential_type: selectedType.id,
});
return {
credentials: data.results,
@@ -75,6 +78,10 @@ function CredentialsStep({ i18n }) {
return ;
}
+ if (typesError || credentialsError) {
+ return ;
+ }
+
const isVault = selectedType?.kind === 'vault';
const renderChip = ({ item, removeItem, canDelete }) => (
@@ -110,53 +117,54 @@ function CredentialsStep({ i18n }) {
/>
)}
- {
- const hasSameVaultID = val =>
- val?.inputs?.vault_id !== undefined &&
- val?.inputs?.vault_id === item?.inputs?.vault_id;
- const hasSameKind = val => val.kind === item.kind;
- const newItems = selectedItems.filter(i =>
- isVault ? !hasSameVaultID(i) : !hasSameKind(i)
- );
- newItems.push(item);
- setSelectedItems(newItems);
- }}
- deselectItem={item => {
- setSelectedItems(selectedItems.filter(i => i.id !== item.id));
- }}
- renderItemChip={renderChip}
- />
- )
+ {!isCredentialsLoading && (
+ {
+ const hasSameVaultID = val =>
+ val?.inputs?.vault_id !== undefined &&
+ val?.inputs?.vault_id === item?.inputs?.vault_id;
+ const hasSameKind = val => val.kind === item.kind;
+ const newItems = field.value.filter(i =>
+ isVault ? !hasSameVaultID(i) : !hasSameKind(i)
+ );
+ newItems.push(item);
+ helpers.setValue(newItems);
+ }}
+ deselectItem={item => {
+ helpers.setValue(field.value.filter(i => i.id !== item.id));
+ }}
+ renderItemChip={renderChip}
+ />
+ )}
>
);
}
diff --git a/awx/ui_next/src/components/LaunchPrompt/InventoryStep.jsx b/awx/ui_next/src/components/LaunchPrompt/InventoryStep.jsx
index b35a9f4090..e34dc40664 100644
--- a/awx/ui_next/src/components/LaunchPrompt/InventoryStep.jsx
+++ b/awx/ui_next/src/components/LaunchPrompt/InventoryStep.jsx
@@ -8,6 +8,7 @@ import { getQSConfig, parseQueryString } from '@util/qs';
import useRequest from '@util/useRequest';
import OptionsList from '@components/OptionsList';
import ContentLoading from '@components/ContentLoading';
+import ContentError from '@components/ContentError';
const QS_CONFIG = getQSConfig('inventory', {
page: 1,
@@ -21,7 +22,7 @@ function InventoryStep({ i18n }) {
const {
isLoading,
- // error,
+ error,
result: { inventories, count },
request: fetchInventories,
} = useRequest(
@@ -46,6 +47,9 @@ function InventoryStep({ i18n }) {
if (isLoading) {
return ;
}
+ if (error) {
+ return ;
+ }
return (
c.id);
+ }
onLaunch(postValues);
};