mirror of
https://github.com/ansible/awx.git
synced 2024-10-30 22:21:13 +03:00
Remove style overrides from Lookup component
Remove style overrides from Lookup component. Also, update related tests. closes: https://github.com/ansible/awx/issues/6810
This commit is contained in:
parent
69589821ce
commit
14b2bd3445
@ -14,7 +14,7 @@ import {
|
||||
Button,
|
||||
ButtonVariant,
|
||||
Chip,
|
||||
InputGroup as PFInputGroup,
|
||||
InputGroup,
|
||||
Modal,
|
||||
} from '@patternfly/react-core';
|
||||
import { withI18n } from '@lingui/react';
|
||||
@ -25,31 +25,9 @@ import ChipGroup from '../ChipGroup';
|
||||
import reducer, { initReducer } from './shared/reducer';
|
||||
import { QSConfig } from '../../types';
|
||||
|
||||
const SearchButton = styled(Button)`
|
||||
::after {
|
||||
border: var(--pf-c-button--BorderWidth) solid
|
||||
var(--pf-global--BorderColor--200);
|
||||
}
|
||||
`;
|
||||
SearchButton.displayName = 'SearchButton';
|
||||
|
||||
const InputGroup = styled(PFInputGroup)`
|
||||
${props =>
|
||||
props.multiple &&
|
||||
`
|
||||
--pf-c-form-control--Height: 90px;
|
||||
overflow-y: auto;
|
||||
`}
|
||||
`;
|
||||
|
||||
const ChipHolder = styled.div`
|
||||
--pf-c-form-control--BorderTopColor: var(--pf-global--BorderColor--200);
|
||||
--pf-c-form-control--BorderRightColor: var(--pf-global--BorderColor--200);
|
||||
--pf-c-form-control--Height: auto;
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
`;
|
||||
|
||||
function Lookup(props) {
|
||||
const {
|
||||
id,
|
||||
@ -120,15 +98,15 @@ function Lookup(props) {
|
||||
return (
|
||||
<Fragment>
|
||||
<InputGroup onBlur={onBlur}>
|
||||
<SearchButton
|
||||
<Button
|
||||
aria-label="Search"
|
||||
id={id}
|
||||
onClick={() => dispatch({ type: 'TOGGLE_MODAL' })}
|
||||
variant={ButtonVariant.tertiary}
|
||||
variant={ButtonVariant.control}
|
||||
isDisabled={isLoading}
|
||||
>
|
||||
<SearchIcon />
|
||||
</SearchButton>
|
||||
</Button>
|
||||
<ChipHolder className="pf-c-form-control">
|
||||
<ChipGroup numChips={5} totalChips={items.length}>
|
||||
{items.map(item =>
|
||||
|
@ -104,7 +104,10 @@ describe('<MultiCredentialsLookup />', () => {
|
||||
/>
|
||||
);
|
||||
});
|
||||
const searchButton = await waitForElement(wrapper, 'SearchButton');
|
||||
const searchButton = await waitForElement(
|
||||
wrapper,
|
||||
'Button[aria-label="Search"]'
|
||||
);
|
||||
await act(async () => {
|
||||
searchButton.invoke('onClick')();
|
||||
});
|
||||
@ -140,7 +143,10 @@ describe('<MultiCredentialsLookup />', () => {
|
||||
/>
|
||||
);
|
||||
});
|
||||
const searchButton = await waitForElement(wrapper, 'SearchButton');
|
||||
const searchButton = await waitForElement(
|
||||
wrapper,
|
||||
'Button[aria-label="Search"]'
|
||||
);
|
||||
await act(async () => {
|
||||
searchButton.invoke('onClick')();
|
||||
});
|
||||
@ -180,7 +186,10 @@ describe('<MultiCredentialsLookup />', () => {
|
||||
/>
|
||||
);
|
||||
});
|
||||
const searchButton = await waitForElement(wrapper, 'SearchButton');
|
||||
const searchButton = await waitForElement(
|
||||
wrapper,
|
||||
'Button[aria-label="Search"]'
|
||||
);
|
||||
await act(async () => {
|
||||
searchButton.invoke('onClick')();
|
||||
});
|
||||
@ -226,7 +235,10 @@ describe('<MultiCredentialsLookup />', () => {
|
||||
/>
|
||||
);
|
||||
});
|
||||
const searchButton = await waitForElement(wrapper, 'SearchButton');
|
||||
const searchButton = await waitForElement(
|
||||
wrapper,
|
||||
'Button[aria-label="Search"]'
|
||||
);
|
||||
await act(async () => {
|
||||
searchButton.invoke('onClick')();
|
||||
});
|
||||
@ -279,7 +291,10 @@ describe('<MultiCredentialsLookup />', () => {
|
||||
/>
|
||||
);
|
||||
});
|
||||
const searchButton = await waitForElement(wrapper, 'SearchButton');
|
||||
const searchButton = await waitForElement(
|
||||
wrapper,
|
||||
'Button[aria-label="Search"]'
|
||||
);
|
||||
await act(async () => {
|
||||
searchButton.invoke('onClick')();
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user