diff --git a/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx b/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx
index a4f8a63830..dc70c15f67 100644
--- a/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx
+++ b/awx/ui_next/src/screens/Inventory/InventoryDetail/InventoryDetail.jsx
@@ -3,6 +3,7 @@ import { Link, useHistory } from 'react-router-dom';
import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro';
import { Button, Chip } from '@patternfly/react-core';
+import AlertModal from '../../../components/AlertModal';
import { CardBody, CardActionsRow } from '../../../components/Card';
import {
DetailList,
@@ -11,11 +12,12 @@ import {
} from '../../../components/DetailList';
import { VariablesDetail } from '../../../components/CodeMirrorInput';
import DeleteButton from '../../../components/DeleteButton';
+import ErrorDetail from '../../../components/ErrorDetail';
import ContentError from '../../../components/ContentError';
import ContentLoading from '../../../components/ContentLoading';
import ChipGroup from '../../../components/ChipGroup';
import { InventoriesAPI } from '../../../api';
-import useRequest from '../../../util/useRequest';
+import useRequest, { useDismissableError } from '../../../util/useRequest';
import { Inventory } from '../../../types';
function InventoryDetail({ inventory, i18n }) {
@@ -24,7 +26,7 @@ function InventoryDetail({ inventory, i18n }) {
const {
result: instanceGroups,
isLoading,
- error,
+ error: instanceGroupsError,
request: fetchInstanceGroups,
} = useRequest(
useCallback(async () => {
@@ -38,10 +40,14 @@ function InventoryDetail({ inventory, i18n }) {
fetchInstanceGroups();
}, [fetchInstanceGroups]);
- const deleteInventory = async () => {
- await InventoriesAPI.destroy(inventory.id);
- history.push(`/inventories`);
- };
+ const { request: deleteInventory, error: deleteError } = useRequest(
+ useCallback(async () => {
+ await InventoriesAPI.destroy(inventory.id);
+ history.push(`/inventories`);
+ }, [inventory.id, history])
+ );
+
+ const { error, dismissError } = useDismissableError(deleteError);
const {
organization,
@@ -52,8 +58,8 @@ function InventoryDetail({ inventory, i18n }) {
return ;
}
- if (error) {
- return ;
+ if (instanceGroupsError) {
+ return ;
}
return (
@@ -123,6 +129,18 @@ function InventoryDetail({ inventory, i18n }) {
)}
+ {/* Update delete modal to show dependencies https://github.com/ansible/awx/issues/5546 */}
+ {error && (
+
+ {i18n._(t`Failed to delete inventory.`)}
+
+
+ )}
);
}