import React, { useState, useCallback } from 'react'; import { useSelector } from 'react-redux'; import { translate as __ } from 'foremanReact/common/I18n'; import { TableVariant, Thead, Tbody, Tr, Th, Td } from '@patternfly/react-table'; import PropTypes from 'prop-types'; import TableWrapper from '../../../components/Table/TableWrapper'; import { getContent } from '../ContentActions'; import { selectContent, selectContentStatus, selectContentError } from '../ContentSelectors'; import SelectableDropdown from '../../../components/SelectableDropdown'; import contentConfig from '../ContentConfig'; /* eslint-disable react/no-array-index-key */ const ContentTable = ({ selectedContentType, setSelectedContentType, contentTypes, showContentTypeSelector, }) => { const status = useSelector(selectContentStatus); const error = useSelector(selectContentError); const response = useSelector(selectContent); const [searchQuery, updateSearchQuery] = useState(''); const { results, ...metadata } = response; const { columnHeaders } = contentConfig.find(type => type.names.singularLabel === contentTypes[selectedContentType][0]); return ( getContent(contentTypes[selectedContentType][1], params), [contentTypes, selectedContentType], )} actionButtons={ showContentTypeSelector && } > {columnHeaders.map(col => {col.title})} {results?.map(details => ( {columnHeaders.map((col, index) => {col.getProperty(details)}) } )) } ); }; ContentTable.propTypes = { selectedContentType: PropTypes.string.isRequired, setSelectedContentType: PropTypes.func.isRequired, contentTypes: PropTypes.shape({}).isRequired, showContentTypeSelector: PropTypes.bool, }; ContentTable.defaultProps = { showContentTypeSelector: true, }; export default ContentTable;