External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-07-27 16:09:55 -02:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5639 from jlmitch5/searchLabelImprovement

Browse Source 
update select-based search items to utilize labels, not just the api value

Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
This commit is contained in:
softwarefactory-project-zuul[bot]
2020-01-14 20:39:09 +00:00
committed by GitHub
parent df5231f527 9ecb704e10
commit 7b3d36ba53
6 changed files with 91 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
awx/ui_next/src/components/DataListToolbar/DataListToolbar.jsx
View File

@@ -67,7 +67,7 @@ class DataListToolbar extends React.Component {
<DataToolbar <DataToolbar
id={`${qsConfig.namespace}-list-toolbar`} id={`${qsConfig.namespace}-list-toolbar`}
clearAllFilters={clearAllFilters} clearAllFilters={clearAllFilters}
collapseListedFiltersBreakpoint="xl" collapseListedFiltersBreakpoint="lg"
> >
<DataToolbarContent> <DataToolbarContent>
{showSelectAll && ( {showSelectAll && (
@@ -83,7 +83,7 @@ class DataListToolbar extends React.Component {
<DataToolbarSeparator variant="separator" /> <DataToolbarSeparator variant="separator" />
</DataToolbarGroup> </DataToolbarGroup>
)} )}
<DataToolbarToggleGroup toggleIcon={<SearchIcon />} breakpoint="xl"> <DataToolbarToggleGroup toggleIcon={<SearchIcon />} breakpoint="lg">
<DataToolbarItem> <DataToolbarItem>
<Search <Search
qsConfig={qsConfig} qsConfig={qsConfig}

1
awx/ui_next/src/components/Lookup/ProjectLookup.jsx
View File

@@ -78,6 +78,7 @@ function ProjectLookup({
}, },
{ {
name: i18n._(t`Type`), name: i18n._(t`Type`),
key: 'type',
options: [ options: [
[``, i18n._(t`Manual`)], [``, i18n._(t`Manual`)],
[`git`, i18n._(t`Git`)], [`git`, i18n._(t`Git`)],

34
awx/ui_next/src/components/Search/Search.jsx
View File

@@ -204,13 +204,14 @@ class Search extends React.Component {
} }
isOpen={isSearchDropdownOpen} isOpen={isSearchDropdownOpen}
dropdownItems={searchDropdownItems} dropdownItems={searchDropdownItems}
style={{ width: '100%' }} style={{ width: '100%', maxWidth: '100px' }}
/> />
) : ( ) : (
<NoOptionDropdown>{searchColumnName}</NoOptionDropdown> <NoOptionDropdown>{searchColumnName}</NoOptionDropdown>
)} )}
</DataToolbarItem> </DataToolbarItem>
{columns.map(({ key, name, options, isBoolean }) => ( {columns.map(
({ key, name, options, isBoolean, booleanLabels = {} }) => (
<DataToolbarFilter <DataToolbarFilter
chips={chipsByKey[key] ? chipsByKey[key].chips : []} chips={chipsByKey[key] ? chipsByKey[key].chips : []}
deleteChip={(unusedKey, val) => { deleteChip={(unusedKey, val) => {
@@ -222,10 +223,6 @@ class Search extends React.Component {
> >
{(options && ( {(options && (
<Fragment> <Fragment>
{/* TODO: update value to being object
{ actualValue: optionKey, toString: () => label }
currently a pf bug that makes the checked logic
not work with object-based values */}
<Select <Select
variant={SelectVariant.checkbox} variant={SelectVariant.checkbox}
aria-label={name} aria-label={name}
@@ -235,10 +232,12 @@ class Search extends React.Component {
} }
selections={chipsByKey[key].chips} selections={chipsByKey[key].chips}
isExpanded={isFilterDropdownOpen} isExpanded={isFilterDropdownOpen}
placeholderText={`Filter by ${name.toLowerCase()}`} placeholderText={`Filter By ${name}`}
> >
{options.map(([optionKey]) => ( {options.map(([optionKey, optionLabel]) => (
<SelectOption key={optionKey} value={optionKey} /> <SelectOption key={optionKey} value={optionKey}>
{optionLabel}
</SelectOption>
))} ))}
</Select> </Select>
</Fragment> </Fragment>
@@ -252,14 +251,14 @@ class Search extends React.Component {
} }
selections={chipsByKey[key].chips[0]} selections={chipsByKey[key].chips[0]}
isExpanded={isFilterDropdownOpen} isExpanded={isFilterDropdownOpen}
placeholderText={`Filter by ${name.toLowerCase()}`} placeholderText={`Filter By ${name}`}
> >
{/* TODO: update value to being object <SelectOption key="true" value="true">
{ actualValue: optionKey, toString: () => label } {booleanLabels.true || i18n._(t`Yes`)}
currently a pf bug that makes the checked logic </SelectOption>
not work with object-based values */} <SelectOption key="false" value="false">
<SelectOption key="true" value="true" /> {booleanLabels.false || i18n._(t`No`)}
<SelectOption key="false" value="false" /> </SelectOption>
</Select> </Select>
)) || ( )) || (
<InputGroup> <InputGroup>
@@ -288,7 +287,8 @@ class Search extends React.Component {
</InputGroup> </InputGroup>
)} )}
</DataToolbarFilter> </DataToolbarFilter>
))} )
)}
</DataToolbarGroup> </DataToolbarGroup>
); );
} }

1
awx/ui_next/src/components/Sort/Sort.jsx
View File

@@ -135,6 +135,7 @@ class Sort extends React.Component {
onSelect={this.handleDropdownSelect} onSelect={this.handleDropdownSelect}
direction={up} direction={up}
isOpen={isSortDropdownOpen} isOpen={isSortDropdownOpen}
style={{ width: '100%', maxWidth: '100px' }}
toggle={ toggle={
<DropdownToggle <DropdownToggle
id="awx-sort" id="awx-sort"

6
awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupsList.jsx
View File

@@ -184,9 +184,13 @@ function InventoryGroupsList({ i18n, location, match }) {
isDefault: true, isDefault: true,
}, },
{ {
name: i18n._(t`Is Root Group`), name: i18n._(t`Group Type`),
key: 'parents__isnull', key: 'parents__isnull',
isBoolean: true, isBoolean: true,
booleanLabels: {
true: i18n._(t`Show Only Root Groups`),
false: i18n._(t`Show All Groups`),
},
}, },
{ {
name: i18n._(t`Created By (Username)`), name: i18n._(t`Created By (Username)`),

4
awx/ui_next/src/types.js
View File

@@ -257,6 +257,10 @@ export const SearchColumns = arrayOf(
key: string.isRequired, key: string.isRequired,
isDefault: bool, isDefault: bool,
isBoolean: bool, isBoolean: bool,
booleanLabels: shape({
true: string.isRequired,
false: string.isRequired,
}),
options: arrayOf(arrayOf(string, string)), options: arrayOf(arrayOf(string, string)),
}) })
); );