diff --git a/awx/ui_next/src/components/AddRole/AddResourceRole.jsx b/awx/ui_next/src/components/AddRole/AddResourceRole.jsx index a7668f92b3..2a1189dfb6 100644 --- a/awx/ui_next/src/components/AddRole/AddResourceRole.jsx +++ b/awx/ui_next/src/components/AddRole/AddResourceRole.jsx @@ -146,7 +146,7 @@ class AddResourceRole extends React.Component { { name: i18n._(t`Username`), key: 'username', - isDefault: true + isDefault: true, }, { name: i18n._(t`First Name`), @@ -155,7 +155,7 @@ class AddResourceRole extends React.Component { { name: i18n._(t`Last Name`), key: 'last_name', - } + }, ]; const userSortColumns = [ @@ -170,14 +170,14 @@ class AddResourceRole extends React.Component { { name: i18n._(t`Last Name`), key: 'last_name', - } + }, ]; const teamSearchColumns = [ { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Created By (Username)`), diff --git a/awx/ui_next/src/components/AddRole/SelectResourceStep.jsx b/awx/ui_next/src/components/AddRole/SelectResourceStep.jsx index 75a35431ac..64e60c9f21 100644 --- a/awx/ui_next/src/components/AddRole/SelectResourceStep.jsx +++ b/awx/ui_next/src/components/AddRole/SelectResourceStep.jsx @@ -24,7 +24,11 @@ class SelectResourceStep extends React.Component { this.qsConfig = getQSConfig('resource', { page: 1, page_size: 5, - order_by: `${props.sortColumns.filter(col => col.key === 'name').length ? 'name' : 'username'}` + order_by: `${ + props.sortColumns.filter(col => col.key === 'name').length + ? 'name' + : 'username' + }`, }); } diff --git a/awx/ui_next/src/components/AddRole/SelectResourceStep.test.jsx b/awx/ui_next/src/components/AddRole/SelectResourceStep.test.jsx index 6e37f1019d..9d25292c96 100644 --- a/awx/ui_next/src/components/AddRole/SelectResourceStep.test.jsx +++ b/awx/ui_next/src/components/AddRole/SelectResourceStep.test.jsx @@ -10,14 +10,14 @@ describe('', () => { { name: 'Username', key: 'username', - isDefault: true + isDefault: true, }, ]; const sortColumns = [ { name: 'Username', - key: 'username' + key: 'username', }, ]; afterEach(() => { diff --git a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx index b8c0cb2ad9..9bded82e19 100644 --- a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx +++ b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx @@ -2,12 +2,16 @@ import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; -import { - Checkbox, -} from '@patternfly/react-core'; +import { Checkbox } from '@patternfly/react-core'; import styled from 'styled-components'; import { SearchIcon } from '@patternfly/react-icons'; -import { DataToolbar, DataToolbarContent, DataToolbarGroup, DataToolbarToggleGroup, DataToolbarItem } from '@patternfly/react-core/dist/umd/experimental'; +import { + DataToolbar, + DataToolbarContent, + DataToolbarGroup, + DataToolbarToggleGroup, + DataToolbarItem, +} from '@patternfly/react-core/dist/umd/experimental'; import ExpandCollapse from '../ExpandCollapse'; import Search from '../Search'; import Sort from '../Sort'; @@ -60,7 +64,8 @@ class DataListToolbar extends React.Component { const showExpandCollapse = onCompact && onExpand; return ( - @@ -89,11 +94,7 @@ class DataListToolbar extends React.Component { /> - + diff --git a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.test.jsx b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.test.jsx index cc3852f764..1734b19ae9 100644 --- a/awx/ui_next/src/components/DataListToolbar/DataListToolbar.test.jsx +++ b/awx/ui_next/src/components/DataListToolbar/DataListToolbar.test.jsx @@ -25,12 +25,8 @@ describe('', () => { const onSelectAll = jest.fn(); test('it triggers the expected callbacks', () => { - const searchColumns = [ - { name: 'Name', key: 'name', isDefault: true } - ]; - const sortColumns = [ - { name: 'Name', key: 'name' } - ]; + const searchColumns = [{ name: 'Name', key: 'name', isDefault: true }]; + const sortColumns = [{ name: 'Name', key: 'name' }]; const search = 'button[aria-label="Search submit button"]'; const searchTextInput = 'input[aria-label="Search text input"]'; const selectAll = 'input[aria-label="Select all"]'; @@ -86,12 +82,12 @@ describe('', () => { const searchColumns = [ { name: 'Foo', key: 'foo', isDefault: true }, - { name: 'Bar', key: 'bar' } + { name: 'Bar', key: 'bar' }, ]; const sortColumns = [ { name: 'Foo', key: 'foo' }, { name: 'Bar', key: 'bar' }, - { name: 'Bakery', key: 'Bakery' } + { name: 'Bakery', key: 'Bakery' }, ]; toolbar = mountWithContexts( @@ -189,17 +185,13 @@ describe('', () => { const downAlphaIconSelector = 'SortAlphaDownIcon'; const upAlphaIconSelector = 'SortAlphaUpIcon'; - const numericColumns = [ - { name: 'ID', key: 'id' }, - ]; + const numericColumns = [{ name: 'ID', key: 'id' }]; - const alphaColumns = [ - { name: 'Name', key: 'name' }, - ]; + const alphaColumns = [{ name: 'Name', key: 'name' }]; const searchColumns = [ { name: 'Name', key: 'name', isDefault: true }, - { name: 'ID', key: 'id' } + { name: 'ID', key: 'id' }, ]; toolbar = mountWithContexts( @@ -248,12 +240,8 @@ describe('', () => { }); test('should render additionalControls', () => { - const searchColumns = [ - { name: 'Name', key: 'name', isDefault: true } - ]; - const sortColumns = [ - { name: 'Name', key: 'name' } - ]; + const searchColumns = [{ name: 'Name', key: 'name', isDefault: true }]; + const sortColumns = [{ name: 'Name', key: 'name' }]; toolbar = mountWithContexts( ', () => { }); test('it triggers the expected callbacks', () => { - const searchColumns = [ - { name: 'Name', key: 'name', isDefault: true } - ]; - const sortColumns = [ - { name: 'Name', key: 'name' } - ]; + const searchColumns = [{ name: 'Name', key: 'name', isDefault: true }]; + const sortColumns = [{ name: 'Name', key: 'name' }]; toolbar = mountWithContexts( {isEmpty ? ( - diff --git a/awx/ui_next/src/components/ListHeader/ListHeader.test.jsx b/awx/ui_next/src/components/ListHeader/ListHeader.test.jsx index b4481d6d13..3392bea65e 100644 --- a/awx/ui_next/src/components/ListHeader/ListHeader.test.jsx +++ b/awx/ui_next/src/components/ListHeader/ListHeader.test.jsx @@ -16,12 +16,8 @@ describe('ListHeader', () => { ); @@ -37,12 +33,8 @@ describe('ListHeader', () => { , { context: { router: { history } } } ); diff --git a/awx/ui_next/src/components/Lookup/CredentialLookup.jsx b/awx/ui_next/src/components/Lookup/CredentialLookup.jsx index 6b59c54aec..bd3dbe3a5c 100644 --- a/awx/ui_next/src/components/Lookup/CredentialLookup.jsx +++ b/awx/ui_next/src/components/Lookup/CredentialLookup.jsx @@ -27,7 +27,7 @@ function CredentialLookup({ credentialTypeId, value, history, - i18n + i18n, }) { const [credentials, setCredentials] = useState([]); const [count, setCount] = useState(0); @@ -79,7 +79,7 @@ function CredentialLookup({ { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Created By (Username)`), @@ -88,12 +88,14 @@ function CredentialLookup({ { name: i18n._(t`Modified By (Username)`), key: 'modified_by__username', - } + }, + ]} + sortColumns={[ + { + name: i18n._(t`Name`), + key: 'name', + }, ]} - sortColumns={[{ - name: i18n._(t`Name`), - key: 'name' - }]} readOnly={!canDelete} selectItem={item => dispatch({ type: 'SELECT_ITEM', item })} deselectItem={item => dispatch({ type: 'DESELECT_ITEM', item })} diff --git a/awx/ui_next/src/components/Lookup/InstanceGroupsLookup.jsx b/awx/ui_next/src/components/Lookup/InstanceGroupsLookup.jsx index 08ab47d12b..a0c75d4527 100644 --- a/awx/ui_next/src/components/Lookup/InstanceGroupsLookup.jsx +++ b/awx/ui_next/src/components/Lookup/InstanceGroupsLookup.jsx @@ -68,11 +68,11 @@ function InstanceGroupsLookup(props) { { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Credential Name`), - key: 'credential__name' + key: 'credential__name', }, { name: i18n._(t`Created By (Username)`), @@ -83,10 +83,12 @@ function InstanceGroupsLookup(props) { key: 'modified_by__username', }, ]} - sortColumns={[{ - name: i18n._(t`Name`), - key: 'name' - }]} + sortColumns={[ + { + name: i18n._(t`Name`), + key: 'name', + }, + ]} multiple={state.multiple} header={i18n._(t`Instance Groups`)} name="instanceGroups" diff --git a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx index 0cef3b1c25..938ab80273 100644 --- a/awx/ui_next/src/components/Lookup/InventoryLookup.jsx +++ b/awx/ui_next/src/components/Lookup/InventoryLookup.jsx @@ -72,7 +72,7 @@ function InventoryLookup({ { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Created By (Username)`), diff --git a/awx/ui_next/src/components/Lookup/MultiCredentialsLookup.jsx b/awx/ui_next/src/components/Lookup/MultiCredentialsLookup.jsx index 8d5cf0f8e8..8a1e15faf4 100644 --- a/awx/ui_next/src/components/Lookup/MultiCredentialsLookup.jsx +++ b/awx/ui_next/src/components/Lookup/MultiCredentialsLookup.jsx @@ -126,7 +126,7 @@ function MultiCredentialsLookup(props) { { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Created By (Username)`), @@ -137,10 +137,12 @@ function MultiCredentialsLookup(props) { key: 'modified_by__username', }, ]} - sortColumns={[{ - name: i18n._(t`Name`), - key: 'name' - }]} + sortColumns={[ + { + name: i18n._(t`Name`), + key: 'name', + }, + ]} multiple={isMultiple} header={i18n._(t`Credentials`)} name="credentials" diff --git a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx index d787c133db..51d3787ef0 100644 --- a/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx +++ b/awx/ui_next/src/components/Lookup/OrganizationLookup.jsx @@ -74,7 +74,7 @@ function OrganizationLookup({ { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Created By (Username)`), @@ -85,10 +85,12 @@ function OrganizationLookup({ key: 'modified_by__username', }, ]} - sortColumns={[{ - name: i18n._(t`Name`), - key: 'name' - }]} + sortColumns={[ + { + name: i18n._(t`Name`), + key: 'name', + }, + ]} readOnly={!canDelete} selectItem={item => dispatch({ type: 'SELECT_ITEM', item })} deselectItem={item => dispatch({ type: 'DESELECT_ITEM', item })} diff --git a/awx/ui_next/src/components/Lookup/ProjectLookup.jsx b/awx/ui_next/src/components/Lookup/ProjectLookup.jsx index 17da912ed9..63f4e1c181 100644 --- a/awx/ui_next/src/components/Lookup/ProjectLookup.jsx +++ b/awx/ui_next/src/components/Lookup/ProjectLookup.jsx @@ -74,32 +74,17 @@ function ProjectLookup({ { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Type`), options: [ - [ - ``, - i18n._(t`Manual`) - ], - [ - `git`, - i18n._(t`Git`) - ], - [ - `hg`, - i18n._(t`Mercurial`) - ], - [ - `svn`, - i18n._(t`Subversion`) - ], - [ - `insights`, - i18n._(t`Red Hat Insights`) - ] - ] + [``, i18n._(t`Manual`)], + [`git`, i18n._(t`Git`)], + [`hg`, i18n._(t`Mercurial`)], + [`svn`, i18n._(t`Subversion`)], + [`insights`, i18n._(t`Red Hat Insights`)], + ], }, { name: i18n._(t`SCM URL`), @@ -118,7 +103,7 @@ function ProjectLookup({ { name: i18n._(t`Name`), key: 'name', - } + }, ]} options={projects} optionCount={count} diff --git a/awx/ui_next/src/components/Lookup/shared/OptionsList.jsx b/awx/ui_next/src/components/Lookup/shared/OptionsList.jsx index 9fd1dec6c1..6d72c9cc52 100644 --- a/awx/ui_next/src/components/Lookup/shared/OptionsList.jsx +++ b/awx/ui_next/src/components/Lookup/shared/OptionsList.jsx @@ -101,7 +101,7 @@ OptionsList.defaultProps = { multiple: false, renderItemChip: null, searchColumns: [], - sortColumns: [] + sortColumns: [], }; export default withI18n()(OptionsList); diff --git a/awx/ui_next/src/components/Lookup/shared/OptionsList.test.jsx b/awx/ui_next/src/components/Lookup/shared/OptionsList.test.jsx index 67c8d51b05..7d4574020e 100644 --- a/awx/ui_next/src/components/Lookup/shared/OptionsList.test.jsx +++ b/awx/ui_next/src/components/Lookup/shared/OptionsList.test.jsx @@ -17,7 +17,7 @@ describe('', () => { value={[]} options={options} optionCount={3} - searchColumns={[{name: 'Foo', key: 'foo', isDefault: true}]} + searchColumns={[{ name: 'Foo', key: 'foo', isDefault: true }]} sortColumns={[{ name: 'Foo', key: 'foo' }]} qsConfig={qsConfig} selectItem={() => {}} @@ -40,7 +40,7 @@ describe('', () => { value={[options[1]]} options={options} optionCount={3} - searchColumns={[{name: 'Foo', key: 'foo', isDefault: true}]} + searchColumns={[{ name: 'Foo', key: 'foo', isDefault: true }]} sortColumns={[{ name: 'Foo', key: 'foo' }]} qsConfig={qsConfig} selectItem={() => {}} diff --git a/awx/ui_next/src/components/NotificationList/NotificationList.jsx b/awx/ui_next/src/components/NotificationList/NotificationList.jsx index ee6498566b..ed30b364ea 100644 --- a/awx/ui_next/src/components/NotificationList/NotificationList.jsx +++ b/awx/ui_next/src/components/NotificationList/NotificationList.jsx @@ -202,7 +202,7 @@ class NotificationList extends Component { { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, { name: i18n._(t`Type`), @@ -218,7 +218,7 @@ class NotificationList extends Component { ['slack', i18n._(t`Slack`)], ['twilio', i18n._(t`Twilio`)], ['webhook', i18n._(t`Webhook`)], - ] + ], }, { name: i18n._(t`Created By (Username)`), diff --git a/awx/ui_next/src/components/PaginatedDataList/PaginatedDataList.jsx b/awx/ui_next/src/components/PaginatedDataList/PaginatedDataList.jsx index 2165703348..254ecabbe2 100644 --- a/awx/ui_next/src/components/PaginatedDataList/PaginatedDataList.jsx +++ b/awx/ui_next/src/components/PaginatedDataList/PaginatedDataList.jsx @@ -80,7 +80,7 @@ class PaginatedDataList extends React.Component { { name: i18n._(t`Name`), key: 'name', - isDefault: true + isDefault: true, }, ]; const sortColumns = toolbarSortColumns.length diff --git a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx index 158e43ab83..1baefcf6a5 100644 --- a/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx +++ b/awx/ui_next/src/components/ResourceAccessList/ResourceAccessList.jsx @@ -166,7 +166,7 @@ class ResourceAccessList extends React.Component { { name: i18n._(t`Username`), key: 'username', - isDefault: true + isDefault: true, }, { name: i18n._(t`First Name`), diff --git a/awx/ui_next/src/components/Search/Search.jsx b/awx/ui_next/src/components/Search/Search.jsx index 6afa4f64ec..606719d227 100644 --- a/awx/ui_next/src/components/Search/Search.jsx +++ b/awx/ui_next/src/components/Search/Search.jsx @@ -19,7 +19,7 @@ import { import { DataToolbarGroup, DataToolbarItem, - DataToolbarFilter + DataToolbarFilter, } from '@patternfly/react-core/dist/umd/experimental'; import { SearchIcon } from '@patternfly/react-icons'; import { parseQueryString } from '@util/qs'; @@ -44,7 +44,7 @@ class Search extends React.Component { isSearchDropdownOpen: false, searchKey: columns.find(col => col.isDefault).key, searchValue: '', - isFilterDropdownOpen: false + isFilterDropdownOpen: false, }; this.handleSearchInputChange = this.handleSearchInputChange.bind(this); @@ -52,8 +52,12 @@ class Search extends React.Component { this.handleDropdownSelect = this.handleDropdownSelect.bind(this); this.handleSearch = this.handleSearch.bind(this); this.handleTextKeyDown = this.handleTextKeyDown.bind(this); - this.handleFilterDropdownToggle = this.handleFilterDropdownToggle.bind(this); - this.handleFilterDropdownSelect = this.handleFilterDropdownSelect.bind(this); + this.handleFilterDropdownToggle = this.handleFilterDropdownToggle.bind( + this + ); + this.handleFilterDropdownSelect = this.handleFilterDropdownSelect.bind( + this + ); this.handleFilterBooleanSelect = this.handleFilterBooleanSelect.bind(this); } @@ -77,8 +81,8 @@ class Search extends React.Component { const { onSearch, qsConfig } = this.props; const isNonStringField = - qsConfig.integerFields.filter(field => field === searchKey).length || - qsConfig.dateFields.filter(field => field === searchKey).length; + qsConfig.integerFields.find(field => field === searchKey) || + qsConfig.dateFields.find(field => field === searchKey); const actualSearchKey = isNonStringField ? searchKey @@ -121,7 +125,12 @@ class Search extends React.Component { render() { const { up } = DropdownPosition; const { columns, i18n, onRemove, qsConfig, location } = this.props; - const { isSearchDropdownOpen, searchKey, searchValue, isFilterDropdownOpen } = this.state; + const { + isSearchDropdownOpen, + searchKey, + searchValue, + isFilterDropdownOpen, + } = this.state; const { name: searchColumnName } = columns.find( ({ key }) => key === searchKey ); @@ -143,8 +152,8 @@ class Search extends React.Component { const queryParams = parseQueryString(qsConfig, location.search); const queryParamsByKey = {}; - columns.forEach(({name, key}) => { - queryParamsByKey[key] = {key, label: name, chips: []}; + columns.forEach(({ name, key }) => { + queryParamsByKey[key] = { key, label: name, chips: [] }; }); const nonDefaultParams = filterDefaultParams( Object.keys(queryParams || {}), @@ -152,12 +161,13 @@ class Search extends React.Component { ); nonDefaultParams.forEach(key => { - const columnKey = key - .replace('__icontains', '') - .replace('or__', ''); - const label = columns - .filter(({key: keyToCheck}) => columnKey === keyToCheck).length ? columns - .filter(({key: keyToCheck}) => columnKey === keyToCheck)[0].name : columnKey; + const columnKey = key.replace('__icontains', '').replace('or__', ''); + const label = columns.filter( + ({ key: keyToCheck }) => columnKey === keyToCheck + ).length + ? columns.filter(({ key: keyToCheck }) => columnKey === keyToCheck)[0] + .name + : columnKey; queryParamsByKey[columnKey] = { key, label, chips: [] }; @@ -171,7 +181,7 @@ class Search extends React.Component { }); return queryParamsByKey; - } + }; const chipsByKey = getChipsByKey(); @@ -179,7 +189,7 @@ class Search extends React.Component { {searchDropdownItems.length > 0 ? ( - ) : ({searchColumnName})} - - {columns.map(({ key, name, options, isBoolean }) => ( { onRemove(chipsByKey[key].key, val) }} - categoryName={chipsByKey[key] ? chipsByKey[key].label : key} - key={key} - showToolbarItem={searchKey === key} - > - {options && () || isBoolean && ( - - ) || ( - {/* TODO: add support for dates: - qsConfig.dateFields.filter(field => field === key).length && "date" */} - field === key).length && "number" || "search"} - aria-label={i18n._(t`Search text input`)} - value={searchValue} - onChange={this.handleSearchInputChange} - onKeyDown={this.handleTextKeyDown} /> - - )} - ))} + ) : ( + {searchColumnName} + )} + + {columns.map(({ key, name, options, isBoolean }) => ( + { + onRemove(chipsByKey[key].key, val); + }} + categoryName={chipsByKey[key] ? chipsByKey[key].label : key} + key={key} + showToolbarItem={searchKey === key} + > + {(options && ( + + )) || + (isBoolean && ( + + )) || ( + + {/* TODO: add support for dates: + qsConfig.dateFields.filter(field => field === key).length && "date" */} + field === searchKey + ) && + 'number') || + 'search' + } + aria-label={i18n._(t`Search text input`)} + value={searchValue} + onChange={this.handleSearchInputChange} + onKeyDown={this.handleTextKeyDown} + /> + + + )} + + ))} ); } @@ -266,12 +298,12 @@ Search.propTypes = { qsConfig: QSConfig.isRequired, columns: SearchColumns.isRequired, onSearch: PropTypes.func, - onRemove: PropTypes.func + onRemove: PropTypes.func, }; Search.defaultProps = { onSearch: null, - onRemove: null + onRemove: null, }; export default withI18n()(withRouter(Search)); diff --git a/awx/ui_next/src/components/Search/Search.test.jsx b/awx/ui_next/src/components/Search/Search.test.jsx index c69cf76bd8..76a7981bfb 100644 --- a/awx/ui_next/src/components/Search/Search.test.jsx +++ b/awx/ui_next/src/components/Search/Search.test.jsx @@ -1,5 +1,8 @@ import React from 'react'; -import { DataToolbar, DataToolbarContent } from '@patternfly/react-core/dist/umd/experimental'; +import { + DataToolbar, + DataToolbarContent, +} from '@patternfly/react-core/dist/umd/experimental'; import { mountWithContexts } from '../../../testUtils/enzymeHelpers'; import Search from './Search'; @@ -20,9 +23,7 @@ describe('', () => { }); test('it triggers the expected callbacks', () => { - const columns = [ - { name: 'Name', key: 'name', isDefault: true } - ]; + const columns = [{ name: 'Name', key: 'name', isDefault: true }]; const searchBtn = 'button[aria-label="Search submit button"]'; const searchTextInput = 'input[aria-label="Search text input"]'; @@ -30,16 +31,13 @@ describe('', () => { const onSearch = jest.fn(); search = mountWithContexts( - {}} collapseListedFiltersBreakpoint="md" > - + ); @@ -53,21 +51,16 @@ describe('', () => { }); test('handleDropdownToggle properly updates state', async () => { - const columns = [ - { name: 'Name', key: 'name', isDefault: true } - ]; + const columns = [{ name: 'Name', key: 'name', isDefault: true }]; const onSearch = jest.fn(); const wrapper = mountWithContexts( - {}} collapseListedFiltersBreakpoint="md" > - + ).find('Search'); @@ -83,16 +76,13 @@ describe('', () => { ]; const onSearch = jest.fn(); const wrapper = mountWithContexts( - {}} collapseListedFiltersBreakpoint="md" > - + ).find('Search'); diff --git a/awx/ui_next/src/components/Sort/Sort.jsx b/awx/ui_next/src/components/Sort/Sort.jsx index 78b2eb5e1d..700679fc2a 100644 --- a/awx/ui_next/src/components/Sort/Sort.jsx +++ b/awx/ui_next/src/components/Sort/Sort.jsx @@ -19,9 +19,7 @@ import { SortNumericUpIcon, } from '@patternfly/react-icons'; -import { - parseQueryString -} from '@util/qs'; +import { parseQueryString } from '@util/qs'; import { SortColumns, QSConfig } from '@types'; import styled from 'styled-components'; @@ -51,7 +49,7 @@ class Sort extends React.Component { sortOrder = 'ascending'; } - if (qsConfig.integerFields.filter(field => field === sortKey).length) { + if (qsConfig.integerFields.find(field => field === sortKey)) { isNumeric = true; } else { isNumeric = false; @@ -61,7 +59,7 @@ class Sort extends React.Component { isSortDropdownOpen: false, sortKey, sortOrder, - isNumeric + isNumeric, }; this.handleDropdownToggle = this.handleDropdownToggle.bind(this); @@ -78,13 +76,11 @@ class Sort extends React.Component { const { sortOrder } = this.state; const { innerText } = target; - const [{ key: sortKey }] = columns.filter( - ({ name }) => name === innerText - ); + const [{ key: sortKey }] = columns.filter(({ name }) => name === innerText); let isNumeric; - if (qsConfig.integerFields.filter(field => field === sortKey).length) { + if (qsConfig.integerFields.find(field => field === sortKey)) { isNumeric = true; } else { isNumeric = false; @@ -131,23 +127,23 @@ class Sort extends React.Component { {sortedColumnName && ( - {sortDropdownItems.length > 0 && ( - {sortedColumnName} - - } - dropdownItems={sortDropdownItems} - />) || ( - {sortedColumnName} - )} + {(sortDropdownItems.length > 0 && ( + + {sortedColumnName} + + } + dropdownItems={sortDropdownItems} + /> + )) || {sortedColumnName}}