diff --git a/src/components/GroupSystems/GroupSystems.js b/src/components/GroupSystems/GroupSystems.js
index d02d42118..d31f79e0c 100644
--- a/src/components/GroupSystems/GroupSystems.js
+++ b/src/components/GroupSystems/GroupSystems.js
@@ -1,10 +1,12 @@
+import { Button } from '@patternfly/react-core';
import { fitContent, TableVariant } from '@patternfly/react-table';
import difference from 'lodash/difference';
import map from 'lodash/map';
import PropTypes from 'prop-types';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
-import { selectEntity } from '../../store/inventory-actions';
+import { clearFilters, selectEntity } from '../../store/inventory-actions';
+import AddSystemsToGroupModal from '../InventoryGroups/Modals/AddSystemsToGroupModal';
import InventoryTable from '../InventoryTable/InventoryTable';
const prepareColumns = (initialColumns) => {
@@ -29,7 +31,7 @@ const prepareColumns = (initialColumns) => {
return columns;
};
-const GroupSystems = ({ groupName }) => {
+const GroupSystems = ({ groupName, groupId }) => {
const dispatch = useDispatch();
const selected = useSelector(
@@ -42,58 +44,98 @@ const GroupSystems = ({ groupName }) => {
const pageSelected =
difference(displayedIds, [...selected.keys()]).length === 0;
+ const [isModalOpen, setIsModalOpen] = useState(false);
+
+ const resetTable = () => {
+ dispatch(clearFilters());
+ dispatch(selectEntity(-1, false));
+ };
+
+ useEffect(() => {
+ return () => {
+ resetTable();
+ };
+ }, []);
+
return (
-
- await defaultGetEntities(
- items,
- // filter systems by the group name
- {
- ...config,
- filters: {
- ...config.filters,
- groupName: [groupName] // TODO: the param is not yet supported by `apiHostGetHostList`
- }
- },
- showTags
- )
- }
- tableProps={{
- isStickyHeader: true,
- variant: TableVariant.compact,
- canSelectAll: false
- }}
- bulkSelect={{
- count: selected.size,
- id: 'bulk-select-groups',
- items: [
- {
- title: 'Select none (0)',
- onClick: () => dispatch(selectEntity(-1, false)),
- props: { isDisabled: noneSelected }
- },
- {
- title: `${pageSelected ? 'Deselect' : 'Select'} page (${
+ {
+ isModalOpen && {
+ resetTable();
+ setIsModalOpen(value);
+ }
+ }
+ groupId={groupId}
+ groupName={groupName}
+ />
+ }
+ {
+ !isModalOpen &&
+
+ await defaultGetEntities(
+ items,
+ // filter systems by the group name
+ {
+ ...config,
+ filters: {
+ ...config.filters,
+ groupName: [groupName] // TODO: the param is not yet supported by `apiHostGetHostList`
+ }
+ },
+ showTags
+ )
+ }
+ tableProps={{
+ isStickyHeader: true,
+ variant: TableVariant.compact,
+ canSelectAll: false
+ }}
+ bulkSelect={{
+ count: selected.size,
+ id: 'bulk-select-groups',
+ items: [
+ {
+ title: 'Select none (0)',
+ onClick: () => dispatch(selectEntity(-1, false)),
+ props: { isDisabled: noneSelected }
+ },
+ {
+ title: `${pageSelected ? 'Deselect' : 'Select'} page (${
rows.length
} items)`,
- onClick: () => dispatch(selectEntity(0, !pageSelected))
- }
- // TODO: Implement "select all"
- ],
- onSelect: (value) => {
- dispatch(selectEntity(0, value));
- },
- checked: selected.size > 0 // TODO: support partial selection (dash sign) in FEC BulkSelect
- }}
- />
+ onClick: () => dispatch(selectEntity(0, !pageSelected))
+ }
+ // TODO: Implement "select all"
+ ],
+ onSelect: (value) => {
+ dispatch(selectEntity(0, value));
+ },
+ checked: selected.size > 0 // TODO: support partial selection (dash sign) in FEC BulkSelect
+ }}
+ >
+
+
+ }
);
};
GroupSystems.propTypes = {
- groupName: PropTypes.string.isRequired
+ groupName: PropTypes.string.isRequired,
+ groupId: PropTypes.string.isRequired
};
export default GroupSystems;
diff --git a/src/components/GroupSystems/index.js b/src/components/GroupSystems/index.js
index 4a4f84994..9c7177334 100644
--- a/src/components/GroupSystems/index.js
+++ b/src/components/GroupSystems/index.js
@@ -16,7 +16,7 @@ const GroupSystemsWrapper = ({ groupName, groupId }) => {
) : hosts.length > 0 ? (
-
+
) :
;
};
diff --git a/src/components/InventoryGroups/Modals/AddSystemsToGroupModal.js b/src/components/InventoryGroups/Modals/AddSystemsToGroupModal.js
index 14605b254..8a2645dca 100644
--- a/src/components/InventoryGroups/Modals/AddSystemsToGroupModal.js
+++ b/src/components/InventoryGroups/Modals/AddSystemsToGroupModal.js
@@ -172,6 +172,7 @@ const AddSystemsToGroupModal = ({
},
checked: selected.size > 0 // TODO: support partial selection (dash sign) in FEC BulkSelect
}}
+ initialLoading={true}
/>
>