Remove custom repository}
- bodyContent={Use this form to remove the values of an existing repository.
}
- >
-
-
- }
- description={
-
- Are you sure you want to remove this repository?
-
- }
- isOpen
- onClose={onClose}
- footer={
-
-
-
-
-
-
- }
- >
-
-
-
-
-
-
- Name
- {data?.name}
- URL
- {data?.url}
- Archicture
- {data?.distribution_arch ?? 'Any'}
- Versions
- {data?.distribution_versions ?? 'Any'}
- GPG Key
- { data?.gpg_key === undefined || data?.gpg_key === '' ? 'None' : data?.gpg_key }
-
-
- );
-};
-
-export default DeleteContent;
diff --git a/src/Pages/ContentListTable/components/DeleteContentModal/DeleteContentModal.tsx b/src/Pages/ContentListTable/components/DeleteContentModal/DeleteContentModal.tsx
new file mode 100644
index 00000000..8d2c9ccc
--- /dev/null
+++ b/src/Pages/ContentListTable/components/DeleteContentModal/DeleteContentModal.tsx
@@ -0,0 +1,166 @@
+import {
+ Bullseye,
+ Button,
+ Grid,
+ GridItem,
+ Modal,
+ ModalVariant,
+ Spinner,
+ Stack,
+ StackItem,
+ Text,
+ TextArea,
+ Title,
+} from '@patternfly/react-core';
+
+import { global_Color_100 } from '@patternfly/react-tokens';
+import { useEffect, useState } from 'react';
+import { createUseStyles } from 'react-jss';
+import Hide from '../../../../components/Hide/Hide';
+import {
+ CONTENT_ITEM_KEY,
+ useFetchContent,
+ useDeleteContentItemMutate,
+} from '../../../../services/Content/ContentQueries';
+import { useQueryClient } from 'react-query';
+import { useLocation, useNavigate } from 'react-router-dom';
+import { useContentListOutletContext } from '../../ContentListTable';
+import useRootPath from '../../../../Hooks/useRootPath';
+
+const useStyles = createUseStyles({
+ description: {
+ paddingTop: '12px', // 4px on the title bottom padding makes this the "standard" 16 total padding
+ color: global_Color_100.value,
+ },
+ removeButton: {
+ marginRight: '36px',
+ transition: 'unset!important',
+ },
+ textAreaContent: {
+ marginTop: '8px',
+ color: global_Color_100.value,
+ height: '200px',
+ },
+});
+
+export default function DeleteContentModal() {
+ const classes = useStyles();
+ const navigate = useNavigate();
+ const rootPath = useRootPath();
+ const queryClient = useQueryClient();
+ const { search } = useLocation();
+ const [isLoading, setIsLoading] = useState(true);
+ const {
+ clearCheckedRepositories,
+ deletionContext: { page, perPage, filterData, contentOrigin, sortString },
+ } = useContentListOutletContext();
+
+ const uuids = new URLSearchParams(search).get('repoUUIDS')?.split(',') || [];
+
+ const { mutate: deleteItem, isLoading: isDeleting } = useDeleteContentItemMutate(
+ queryClient,
+ page,
+ perPage,
+ filterData,
+ contentOrigin,
+ sortString,
+ );
+
+ const onClose = () => navigate(rootPath);
+ const onSave = async () => {
+ deleteItem(data?.uuid || '');
+ onClose();
+ clearCheckedRepositories();
+ queryClient.invalidateQueries(CONTENT_ITEM_KEY);
+ };
+
+ const { data, isError } = useFetchContent(uuids);
+ const values = data ? [data] : [];
+
+ useEffect(() => {
+ if (data) {
+ setIsLoading(false);
+ }
+ if (isError) {
+ onClose();
+ }
+ }, [values, isError]);
+
+ const actionTakingPlace = isDeleting || isLoading;
+
+ return (
+