diff --git a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx index 8f8d0ecea6..b91cdf977e 100644 --- a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx +++ b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx @@ -15,6 +15,8 @@ import Search from '../Search'; import Sort from '../Sort'; import VerticalSeparator from '../VerticalSeparator'; +import { QSConfig } from '@types'; + const AWXToolbar = styled.div` --awx-toolbar--BackgroundColor: var(--pf-global--BackgroundColor--light-100); --awx-toolbar--BorderColor: #ebebeb; @@ -98,6 +100,7 @@ class DataListToolbar extends React.Component { sortedColumnKey, additionalControls, i18n, + qsConfig, } = this.props; const showExpandCollapse = onCompact && onExpand; @@ -120,6 +123,7 @@ class DataListToolbar extends React.Component { )} qsConfig + .integerFields + .filter(field => field === key).length || qsConfig.dateFields + .filter(field => field === key).length; + + // TODO: this will probably become more sophisticated, where date + // fields and string fields are passed to a formatter + const actualSearchKey = isNonStringField(searchKey) ? searchKey : `${searchKey}__icontains`; + + onSearch(actualSearchKey, searchValue); this.setState({ searchValue: '' }); } @@ -202,6 +212,7 @@ class Search extends React.Component { } Search.propTypes = { + qsConfig: QSConfig.isRequired, columns: PropTypes.arrayOf(PropTypes.object).isRequired, onSearch: PropTypes.func, sortedColumnKey: PropTypes.string, diff --git a/awx/ui_next/src/screens/Job/JobList/JobList.jsx b/awx/ui_next/src/screens/Job/JobList/JobList.jsx index 7836aabf9a..c5460b6f7b 100644 --- a/awx/ui_next/src/screens/Job/JobList/JobList.jsx +++ b/awx/ui_next/src/screens/Job/JobList/JobList.jsx @@ -183,6 +183,7 @@ class JobList extends Component { showExpandCollapse isAllSelected={isAllSelected} onSelectAll={this.handleSelectAll} + qsConfig={QS_CONFIG} additionalControls={[ ( { export function getQSConfig( namespace, defaultParams = { page: 1, page_size: 5, order_by: 'name' }, - integerFields = ['page', 'page_size'] + integerFields = ['page', 'page_size'], + dateFields = ['modified', 'created'] ) { if (!namespace) { throw new Error('a QS namespace is required'); @@ -170,6 +171,7 @@ export function getQSConfig( namespace, defaultParams, integerFields, + dateFields }; }