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} />