mirror of
https://github.com/ansible/awx.git
synced 2024-10-27 09:25:10 +03:00
Merge pull request #5203 from keithjgrant/warnings-cleanup
Cleanup console warnings/refactor Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
This commit is contained in:
softwarefactory-project-zuul[bot]
GitHub
commit
5246c842b2
@ -27,6 +27,8 @@ const DataListCell = styled(PFDataListCell)`
|
||||
const Switch = styled(PFSwitch)`
|
||||
display: flex;
|
||||
flex-wrap: no-wrap;
|
||||
/* workaround PF bug; used in calculating switch width: */
|
||||
--pf-c-switch__toggle-icon--Offset: 0.125rem;
|
||||
`;
|
||||
|
||||
function NotificationListItem(props) {
|
||||
|
||||
@ -331,9 +331,9 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
"componentStyle": ComponentStyle {
|
||||
"componentId": "NotificationListItem__Switch-w674ng-1",
|
||||
"isStatic": true,
|
||||
"lastClassName": "hbNxaH",
|
||||
"lastClassName": "hfzRow",
|
||||
"rules": Array [
|
||||
"display:flex;flex-wrap:no-wrap;",
|
||||
"display:flex;flex-wrap:no-wrap;--pf-c-switch__toggle-icon--Offset:0.125rem;",
|
||||
],
|
||||
},
|
||||
"displayName": "NotificationListItem__Switch",
|
||||
@ -356,7 +356,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Component
|
||||
aria-label="Toggle notification start"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-started-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -369,7 +369,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
componentProps={
|
||||
Object {
|
||||
"aria-label": "Toggle notification start",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hbNxaH",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hfzRow",
|
||||
"id": "notification-9000-started-toggle",
|
||||
"isChecked": false,
|
||||
"isDisabled": false,
|
||||
@ -382,7 +382,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Switch
|
||||
aria-label="Toggle notification start"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-started-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -397,7 +397,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
}
|
||||
>
|
||||
<label
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
htmlFor="notification-9000-started-toggle"
|
||||
>
|
||||
<input
|
||||
@ -451,9 +451,9 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
"componentStyle": ComponentStyle {
|
||||
"componentId": "NotificationListItem__Switch-w674ng-1",
|
||||
"isStatic": true,
|
||||
"lastClassName": "hbNxaH",
|
||||
"lastClassName": "hfzRow",
|
||||
"rules": Array [
|
||||
"display:flex;flex-wrap:no-wrap;",
|
||||
"display:flex;flex-wrap:no-wrap;--pf-c-switch__toggle-icon--Offset:0.125rem;",
|
||||
],
|
||||
},
|
||||
"displayName": "NotificationListItem__Switch",
|
||||
@ -476,7 +476,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Component
|
||||
aria-label="Toggle notification success"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-success-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -489,7 +489,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
componentProps={
|
||||
Object {
|
||||
"aria-label": "Toggle notification success",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hbNxaH",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hfzRow",
|
||||
"id": "notification-9000-success-toggle",
|
||||
"isChecked": false,
|
||||
"isDisabled": false,
|
||||
@ -502,7 +502,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Switch
|
||||
aria-label="Toggle notification success"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-success-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -517,7 +517,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
}
|
||||
>
|
||||
<label
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
htmlFor="notification-9000-success-toggle"
|
||||
>
|
||||
<input
|
||||
@ -571,9 +571,9 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
"componentStyle": ComponentStyle {
|
||||
"componentId": "NotificationListItem__Switch-w674ng-1",
|
||||
"isStatic": true,
|
||||
"lastClassName": "hbNxaH",
|
||||
"lastClassName": "hfzRow",
|
||||
"rules": Array [
|
||||
"display:flex;flex-wrap:no-wrap;",
|
||||
"display:flex;flex-wrap:no-wrap;--pf-c-switch__toggle-icon--Offset:0.125rem;",
|
||||
],
|
||||
},
|
||||
"displayName": "NotificationListItem__Switch",
|
||||
@ -596,7 +596,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Component
|
||||
aria-label="Toggle notification failure"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-error-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -609,7 +609,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
componentProps={
|
||||
Object {
|
||||
"aria-label": "Toggle notification failure",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hbNxaH",
|
||||
"className": "NotificationListItem__Switch-w674ng-1 hfzRow",
|
||||
"id": "notification-9000-error-toggle",
|
||||
"isChecked": false,
|
||||
"isDisabled": false,
|
||||
@ -622,7 +622,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
>
|
||||
<Switch
|
||||
aria-label="Toggle notification failure"
|
||||
className="NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
id="notification-9000-error-toggle"
|
||||
isChecked={false}
|
||||
isDisabled={false}
|
||||
@ -637,7 +637,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
|
||||
}
|
||||
>
|
||||
<label
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hbNxaH"
|
||||
className="pf-c-switch NotificationListItem__Switch-w674ng-1 hfzRow"
|
||||
htmlFor="notification-9000-error-toggle"
|
||||
>
|
||||
<input
|
||||
|
||||
@ -0,0 +1,54 @@
|
||||
import React, { useState, useRef, useEffect } from 'react';
|
||||
import { Link, withRouter } from 'react-router-dom';
|
||||
import { withI18n } from '@lingui/react';
|
||||
import { t } from '@lingui/macro';
|
||||
import { Dropdown, DropdownPosition } from '@patternfly/react-core';
|
||||
import { ToolbarAddButton } from '@components/PaginatedDataList';
|
||||
|
||||
function TemplateAddButton({ match, i18n }) {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const element = useRef(null);
|
||||
|
||||
const toggle = e => {
|
||||
if (!element || !element.current.contains(e.target)) {
|
||||
setIsOpen(false);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
document.addEventListener('click', toggle, false);
|
||||
return () => {
|
||||
document.removeEventListener('click', toggle);
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div ref={element} key="add">
|
||||
<Dropdown
|
||||
isPlain
|
||||
isOpen={isOpen}
|
||||
position={DropdownPosition.right}
|
||||
toggle={<ToolbarAddButton onClick={() => setIsOpen(!isOpen)} />}
|
||||
dropdownItems={[
|
||||
<Link
|
||||
key="job"
|
||||
className="pf-c-dropdown__menu-item"
|
||||
to={`${match.url}/job_template/add/`}
|
||||
>
|
||||
{i18n._(t`Job Template`)}
|
||||
</Link>,
|
||||
<Link
|
||||
key="workflow"
|
||||
className="pf-c-dropdown__menu-item"
|
||||
to={`${match.url}_workflow/add/`}
|
||||
>
|
||||
{i18n._(t`Workflow Template`)}
|
||||
</Link>,
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export { TemplateAddButton as _TemplateAddButton };
|
||||
export default withI18n()(withRouter(TemplateAddButton));
|
||||
@ -0,0 +1,25 @@
|
||||
import React from 'react';
|
||||
import { mountWithContexts } from '@testUtils/enzymeHelpers';
|
||||
import TemplateAddButton from './TemplateAddButton';
|
||||
|
||||
describe('<TemplateAddButton />', () => {
|
||||
test('should be closed initially', () => {
|
||||
const wrapper = mountWithContexts(<TemplateAddButton />);
|
||||
expect(wrapper.find('Dropdown').prop('isOpen')).toEqual(false);
|
||||
});
|
||||
|
||||
test('should render two links', () => {
|
||||
const wrapper = mountWithContexts(<TemplateAddButton />);
|
||||
wrapper.find('button').simulate('click');
|
||||
expect(wrapper.find('Dropdown').prop('isOpen')).toEqual(true);
|
||||
expect(wrapper.find('Link')).toHaveLength(2);
|
||||
});
|
||||
|
||||
test('should close when button re-clicked', () => {
|
||||
const wrapper = mountWithContexts(<TemplateAddButton />);
|
||||
wrapper.find('button').simulate('click');
|
||||
expect(wrapper.find('Dropdown').prop('isOpen')).toEqual(true);
|
||||
wrapper.find('button').simulate('click');
|
||||
expect(wrapper.find('Dropdown').prop('isOpen')).toEqual(false);
|
||||
});
|
||||
});
|
||||
@ -1,15 +1,8 @@
|
||||
import React, { Component } from 'react';
|
||||
import { withRouter, Link } from 'react-router-dom';
|
||||
import { withRouter } from 'react-router-dom';
|
||||
import { withI18n } from '@lingui/react';
|
||||
|
||||
import { t } from '@lingui/macro';
|
||||
import {
|
||||
Card,
|
||||
PageSection,
|
||||
Dropdown,
|
||||
DropdownItem,
|
||||
DropdownPosition,
|
||||
} from '@patternfly/react-core';
|
||||
import { Card, PageSection } from '@patternfly/react-core';
|
||||
|
||||
import { JobTemplatesAPI, WorkflowJobTemplatesAPI } from '@api';
|
||||
import AlertModal from '@components/AlertModal';
|
||||
@ -17,11 +10,11 @@ import DatalistToolbar from '@components/DataListToolbar';
|
||||
import ErrorDetail from '@components/ErrorDetail';
|
||||
import PaginatedDataList, {
|
||||
ToolbarDeleteButton,
|
||||
ToolbarAddButton,
|
||||
} from '@components/PaginatedDataList';
|
||||
import { getQSConfig, parseQueryString } from '@util/qs';
|
||||
|
||||
import TemplateListItem from './TemplateListItem';
|
||||
import TemplateAddButton from './TemplateAddButton';
|
||||
|
||||
// The type value in const QS_CONFIG below does not have a space between job_template and
|
||||
// workflow_job_template so the params sent to the API match what the api expects.
|
||||
@ -43,7 +36,6 @@ class TemplatesList extends Component {
|
||||
selected: [],
|
||||
templates: [],
|
||||
itemCount: 0,
|
||||
isAddOpen: false,
|
||||
};
|
||||
|
||||
this.loadTemplates = this.loadTemplates.bind(this);
|
||||
@ -51,7 +43,6 @@ class TemplatesList extends Component {
|
||||
this.handleSelect = this.handleSelect.bind(this);
|
||||
this.handleTemplateDelete = this.handleTemplateDelete.bind(this);
|
||||
this.handleDeleteErrorClose = this.handleDeleteErrorClose.bind(this);
|
||||
this.handleAddToggle = this.handleAddToggle.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@ -89,21 +80,6 @@ class TemplatesList extends Component {
|
||||
}
|
||||
}
|
||||
|
||||
handleAddToggle(e) {
|
||||
const { isAddOpen } = this.state;
|
||||
document.addEventListener('click', this.handleAddToggle, false);
|
||||
|
||||
if (this.node && this.node.contains(e.target) && isAddOpen) {
|
||||
document.removeEventListener('click', this.handleAddToggle, false);
|
||||
this.setState({ isAddOpen: false });
|
||||
} else if (this.node && this.node.contains(e.target) && !isAddOpen) {
|
||||
this.setState({ isAddOpen: true });
|
||||
} else {
|
||||
this.setState({ isAddOpen: false });
|
||||
document.removeEventListener('click', this.handleAddToggle, false);
|
||||
}
|
||||
}
|
||||
|
||||
async handleTemplateDelete() {
|
||||
const { selected, itemCount } = this.state;
|
||||
|
||||
@ -178,7 +154,6 @@ class TemplatesList extends Component {
|
||||
templates,
|
||||
itemCount,
|
||||
selected,
|
||||
isAddOpen,
|
||||
actions,
|
||||
} = this.state;
|
||||
const { match, i18n } = this.props;
|
||||
@ -231,35 +206,7 @@ class TemplatesList extends Component {
|
||||
itemsToDelete={selected}
|
||||
pluralizedItemName="Templates"
|
||||
/>,
|
||||
canAdd && (
|
||||
<div
|
||||
ref={node => {
|
||||
this.node = node;
|
||||
}}
|
||||
key="add"
|
||||
>
|
||||
<Dropdown
|
||||
isPlain
|
||||
isOpen={isAddOpen}
|
||||
position={DropdownPosition.right}
|
||||
toggle={
|
||||
<ToolbarAddButton onClick={this.handleAddToggle} />
|
||||
}
|
||||
dropdownItems={[
|
||||
<DropdownItem key="job">
|
||||
<Link to={`${match.url}/job_template/add/`}>
|
||||
{i18n._(t`Job Template`)}
|
||||
</Link>
|
||||
</DropdownItem>,
|
||||
<DropdownItem key="workflow">
|
||||
<Link to={`${match.url}_workflow/add/`}>
|
||||
{i18n._(t`Workflow Template`)}
|
||||
</Link>
|
||||
</DropdownItem>,
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
),
|
||||
canAdd && <TemplateAddButton key="add" />,
|
||||
]}
|
||||
/>
|
||||
)}
|
||||
@ -273,35 +220,7 @@ class TemplatesList extends Component {
|
||||
isSelected={selected.some(row => row.id === template.id)}
|
||||
/>
|
||||
)}
|
||||
emptyStateControls={
|
||||
canAdd && (
|
||||
<div
|
||||
ref={node => {
|
||||
this.node = node;
|
||||
}}
|
||||
key="add"
|
||||
>
|
||||
<Dropdown
|
||||
isPlain
|
||||
isOpen={isAddOpen}
|
||||
position={DropdownPosition.right}
|
||||
toggle={<ToolbarAddButton onClick={this.handleAddToggle} />}
|
||||
dropdownItems={[
|
||||
<DropdownItem key="job">
|
||||
<Link to={`${match.url}/job_template/add/`}>
|
||||
{i18n._(t`Job Template`)}
|
||||
</Link>
|
||||
</DropdownItem>,
|
||||
<DropdownItem key="workflow">
|
||||
<Link to={`${match.url}_workflow/add/`}>
|
||||
{i18n._(t`Workflow Template`)}
|
||||
</Link>
|
||||
</DropdownItem>,
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
emptyStateControls={canAdd && <TemplateAddButton />}
|
||||
/>
|
||||
</Card>
|
||||
<AlertModal
|
||||
|
||||
Loading…
Reference in New Issue
Block a user