From 446021cf22f4c91c948a598da2843662e7ddd4ea Mon Sep 17 00:00:00 2001 From: Marliana Lara Date: Tue, 11 Feb 2020 13:55:35 -0500 Subject: [PATCH 1/3] Remove Switch component --- .../components/NotificationList/NotificationList.jsx | 2 +- .../NotificationList/NotificationListItem.jsx | 2 +- awx/ui_next/src/components/Switch/Switch.jsx | 10 ---------- awx/ui_next/src/components/Switch/index.js | 1 - awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx | 3 +-- awx/ui_next/src/screens/Host/HostList/HostList.jsx | 6 +++--- awx/ui_next/src/screens/Host/HostList/HostListItem.jsx | 2 +- .../Inventory/InventoryHosts/InventoryHostItem.jsx | 2 +- 8 files changed, 8 insertions(+), 20 deletions(-) delete mode 100644 awx/ui_next/src/components/Switch/Switch.jsx delete mode 100644 awx/ui_next/src/components/Switch/index.js diff --git a/awx/ui_next/src/components/NotificationList/NotificationList.jsx b/awx/ui_next/src/components/NotificationList/NotificationList.jsx index ed30b364ea..120d9c86b0 100644 --- a/awx/ui_next/src/components/NotificationList/NotificationList.jsx +++ b/awx/ui_next/src/components/NotificationList/NotificationList.jsx @@ -164,7 +164,7 @@ class NotificationList extends Component { } this.setState(stateUpdateFunction); } catch (err) { - this.setState({ toggleError: true }); + this.setState({ toggleError: err }); } finally { this.setState({ toggleLoading: false }); } diff --git a/awx/ui_next/src/components/NotificationList/NotificationListItem.jsx b/awx/ui_next/src/components/NotificationList/NotificationListItem.jsx index 307ad6e1e4..fb4e80cfa9 100644 --- a/awx/ui_next/src/components/NotificationList/NotificationListItem.jsx +++ b/awx/ui_next/src/components/NotificationList/NotificationListItem.jsx @@ -8,8 +8,8 @@ import { DataListItemRow, DataListItemCells, DataListCell as PFDataListCell, + Switch, } from '@patternfly/react-core'; -import Switch from '@components/Switch'; import styled from 'styled-components'; diff --git a/awx/ui_next/src/components/Switch/Switch.jsx b/awx/ui_next/src/components/Switch/Switch.jsx deleted file mode 100644 index f62376e61b..0000000000 --- a/awx/ui_next/src/components/Switch/Switch.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import { Switch } from '@patternfly/react-core'; -import styled from 'styled-components'; - -Switch.displayName = 'PFSwitch'; -export default styled(Switch)` - display: flex; - flex-wrap: no-wrap; - /* workaround PF bug; used in calculating switch width: */ - --pf-c-switch__toggle-icon--Offset: 0.125rem; -`; diff --git a/awx/ui_next/src/components/Switch/index.js b/awx/ui_next/src/components/Switch/index.js deleted file mode 100644 index ed80f23e5b..0000000000 --- a/awx/ui_next/src/components/Switch/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './Switch'; diff --git a/awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx b/awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx index a705c87bdc..f3c70b066f 100644 --- a/awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx +++ b/awx/ui_next/src/screens/Host/HostDetail/HostDetail.jsx @@ -3,7 +3,7 @@ import { Link, useHistory, useParams, useLocation } from 'react-router-dom'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { Host } from '@types'; -import { Button } from '@patternfly/react-core'; +import { Button, Switch } from '@patternfly/react-core'; import { CardBody, CardActionsRow } from '@components/Card'; import AlertModal from '@components/AlertModal'; import ErrorDetail from '@components/ErrorDetail'; @@ -11,7 +11,6 @@ import { DetailList, Detail, UserDateDetail } from '@components/DetailList'; import { VariablesDetail } from '@components/CodeMirrorInput'; import { Sparkline } from '@components/Sparkline'; import DeleteButton from '@components/DeleteButton'; -import Switch from '@components/Switch'; import { HostsAPI } from '@api'; function HostDetail({ host, i18n, onUpdateHost }) { diff --git a/awx/ui_next/src/screens/Host/HostList/HostList.jsx b/awx/ui_next/src/screens/Host/HostList/HostList.jsx index 36ddd8f0dc..a84af76a4c 100644 --- a/awx/ui_next/src/screens/Host/HostList/HostList.jsx +++ b/awx/ui_next/src/screens/Host/HostList/HostList.jsx @@ -34,7 +34,7 @@ class HostsList extends Component { selected: [], itemCount: 0, actions: null, - toggleError: false, + toggleError: null, toggleLoading: null, }; @@ -83,7 +83,7 @@ class HostsList extends Component { } handleHostToggleErrorClose() { - this.setState({ toggleError: false }); + this.setState({ toggleError: null }); } async handleHostDelete() { @@ -112,7 +112,7 @@ class HostsList extends Component { ), }); } catch (err) { - this.setState({ toggleError: true }); + this.setState({ toggleError: err }); } finally { this.setState({ toggleLoading: null }); } diff --git a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx index d5523d74ff..bda2b0a7a5 100644 --- a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx +++ b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx @@ -6,6 +6,7 @@ import { DataListItem, DataListItemRow, DataListItemCells, + Switch, Tooltip, } from '@patternfly/react-core'; import { Link } from 'react-router-dom'; @@ -16,7 +17,6 @@ import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; import { Sparkline } from '@components/Sparkline'; -import Switch from '@components/Switch'; import VerticalSeparator from '@components/VerticalSeparator'; import { Host } from '@types'; diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx index 439da004c6..46eaff8b02 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx @@ -6,6 +6,7 @@ import { DataListItem, DataListItemRow, DataListItemCells, + Switch, Tooltip, } from '@patternfly/react-core'; import { Link } from 'react-router-dom'; @@ -16,7 +17,6 @@ import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; import { Sparkline } from '@components/Sparkline'; -import Switch from '@components/Switch'; import VerticalSeparator from '@components/VerticalSeparator'; import { Host } from '@types'; From 3b9dd3ba8c170b042c30fddb7b6aafee003c7fe5 Mon Sep 17 00:00:00 2001 From: Marliana Lara Date: Tue, 11 Feb 2020 15:44:10 -0500 Subject: [PATCH 2/3] Remove ActionButtonCell component --- .../ActionButtonCell/ActionButtonCell.jsx | 10 --- .../ActionButtonCell.test.jsx | 10 --- .../src/components/ActionButtonCell/index.js | 1 - .../CheckboxListItem/CheckboxListItem.jsx | 9 +-- .../CredentialList/CredentialListItem.jsx | 5 +- .../screens/Host/HostList/HostListItem.jsx | 8 ++- .../InventoryGroups/InventoryGroupItem.jsx | 5 +- .../InventoryHosts/InventoryHostItem.jsx | 8 ++- .../InventoryList/InventoryListItem.jsx | 5 +- .../src/screens/Job/JobList/JobListItem.jsx | 14 ++-- .../OrganizationList/OrganizationListItem.jsx | 5 +- .../Project/ProjectList/ProjectListItem.jsx | 7 +- .../shared/ProjectSubForms/ManualSubForm.jsx | 20 +++--- .../screens/Team/TeamList/TeamListItem.jsx | 5 +- .../TemplateList/TemplateListItem.jsx | 67 +++---------------- .../screens/User/UserList/UserListItem.jsx | 5 +- 16 files changed, 52 insertions(+), 132 deletions(-) delete mode 100644 awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.jsx delete mode 100644 awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.test.jsx delete mode 100644 awx/ui_next/src/components/ActionButtonCell/index.js diff --git a/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.jsx b/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.jsx deleted file mode 100644 index ce8f58ef27..0000000000 --- a/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import DataListCell from '@components/DataListCell'; -import styled from 'styled-components'; - -const ActionButtonCell = styled(DataListCell)` - & > :not(:first-child) { - margin-left: 20px; - } -`; -ActionButtonCell.displayName = 'ActionButtonCell'; -export default ActionButtonCell; diff --git a/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.test.jsx b/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.test.jsx deleted file mode 100644 index 894e481a65..0000000000 --- a/awx/ui_next/src/components/ActionButtonCell/ActionButtonCell.test.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import React from 'react'; -import { mount } from 'enzyme'; -import ActionButtonCell from './ActionButtonCell'; - -describe('ActionButtonCell', () => { - test('renders the expected content', () => { - const wrapper = mount(); - expect(wrapper).toHaveLength(1); - }); -}); diff --git a/awx/ui_next/src/components/ActionButtonCell/index.js b/awx/ui_next/src/components/ActionButtonCell/index.js deleted file mode 100644 index 6eff34a9c4..0000000000 --- a/awx/ui_next/src/components/ActionButtonCell/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ActionButtonCell'; diff --git a/awx/ui_next/src/components/CheckboxListItem/CheckboxListItem.jsx b/awx/ui_next/src/components/CheckboxListItem/CheckboxListItem.jsx index 94e8f82017..2616cf15cd 100644 --- a/awx/ui_next/src/components/CheckboxListItem/CheckboxListItem.jsx +++ b/awx/ui_next/src/components/CheckboxListItem/CheckboxListItem.jsx @@ -5,10 +5,9 @@ import { DataListItemRow, DataListItemCells, DataListCell, + DataListCheck, } from '@patternfly/react-core'; -import DataListCheck from '@components/DataListCheck'; import DataListRadio from '@components/DataListRadio'; -import VerticalSeparator from '../VerticalSeparator'; const CheckboxListItem = ({ itemId, @@ -37,12 +36,6 @@ const CheckboxListItem = ({ /> - - , , - + {canEdit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx index bda2b0a7a5..a9420a7032 100644 --- a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx +++ b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx @@ -12,7 +12,6 @@ import { import { Link } from 'react-router-dom'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -83,7 +82,7 @@ class HostListItem extends React.Component { )} , - + + , + {host.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx index 3c76f84444..95dcb0eabc 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx @@ -13,7 +13,6 @@ import { import { Link } from 'react-router-dom'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -47,7 +46,7 @@ function InventoryGroupItem({ {group.name} , - + {group.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx index 46eaff8b02..9d737af3b3 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx @@ -12,7 +12,6 @@ import { import { Link } from 'react-router-dom'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -59,7 +58,7 @@ function InventoryHostItem(props) { , - + + , + {host.summary_fields.user_capabilities?.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx index 7772e4f21c..3eef420580 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx @@ -11,7 +11,6 @@ import { t } from '@lingui/macro'; import { Link } from 'react-router-dom'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -55,7 +54,7 @@ class InventoryListItem extends React.Component { ? i18n._(t`Smart Inventory`) : i18n._(t`Inventory`)} , - + {inventory.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx b/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx index 4d2c734a37..51ec77b57c 100644 --- a/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx +++ b/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx @@ -4,17 +4,16 @@ import styled from 'styled-components'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { + DataListCell, + DataListCheck, DataListItem, DataListItemRow, DataListItemCells, Tooltip, } from '@patternfly/react-core'; import { RocketIcon } from '@patternfly/react-icons'; -import DataListCell from '@components/DataListCell'; -import DataListCheck from '@components/DataListCheck'; import LaunchButton from '@components/LaunchButton'; import ListActionButton from '@components/ListActionButton'; -import VerticalSeparator from '@components/VerticalSeparator'; import { StatusIcon } from '@components/Sparkline'; import { toTitleCase } from '@util/strings'; import { formatDateString } from '@util/dates'; @@ -29,11 +28,7 @@ class JobListItem extends Component { const { i18n, job, isSelected, onSelect } = this.props; return ( - + - {job.status && } {formatDateString(job.finished)} , - + {job.type !== 'system_job' && job.summary_fields.user_capabilities.start && ( diff --git a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx index 364b963cdb..f376ae8bb4 100644 --- a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx +++ b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx @@ -13,7 +13,6 @@ import { Link } from 'react-router-dom'; import styled from 'styled-components'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -85,7 +84,7 @@ function OrganizationListItem({ , - + {organization.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx b/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx index 255b076f26..4348fe7da5 100644 --- a/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx +++ b/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx @@ -11,7 +11,6 @@ import { t } from '@lingui/macro'; import { Link } from 'react-router-dom'; import { PencilAltIcon, SyncIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import ClipboardCopyButton from '@components/ClipboardCopyButton'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; @@ -116,7 +115,7 @@ class ProjectListItem extends React.Component { /> ) : null} , - + {project.summary_fields.user_capabilities.start && ( @@ -128,6 +127,8 @@ class ProjectListItem extends React.Component { )} + , + {project.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx b/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx index 94a624b380..688d3eecc9 100644 --- a/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx +++ b/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx @@ -37,22 +37,22 @@ const ManualSubForm = ({ return ( <> - {options.length === 1 && ( - - {i18n._(t` + {/* {options.length === 1 && ( */} + + {i18n._(t` There are no available playbook directories in ${project_base_dir}. Either that directory is empty, or all of the contents are already assigned to other projects. Create a new directory there and make sure the playbook files can be read by the "awx" system user, or have ${brandName} directly retrieve your playbooks from source control using the SCM Type option above.`)} - - )} + + {/* )} */} )} , - + {team.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx index ed32babfd3..73f5991ff9 100644 --- a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx +++ b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx @@ -3,7 +3,7 @@ import { Link } from 'react-router-dom'; import { DataListItem, DataListItemRow, - DataListItemCells as PFDataListItemCells, + DataListItemCells, Tooltip, } from '@patternfly/react-core'; import { t } from '@lingui/macro'; @@ -14,7 +14,6 @@ import { RocketIcon, } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import LaunchButton from '@components/LaunchButton'; @@ -22,42 +21,6 @@ import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { Sparkline } from '@components/Sparkline'; import { toTitleCase } from '@util/strings'; -import styled from 'styled-components'; - -const rightStyle = ` -@media screen and (max-width: 768px) { - && { - padding-top: 0px; - flex: 0 0 33%; - padding-right: 20px; - } -} -`; - -const DataListItemCells = styled(PFDataListItemCells)` - display: flex; - @media screen and (max-width: 768px) { - flex-wrap: wrap; - justify-content: space-between; - } -`; - -const LeftDataListCell = styled(DataListCell)` - @media screen and (max-width: 768px) { - && { - padding-bottom: 16px; - flex: 1 1 100%; - } - } -`; - -const RightDataListCell = styled(DataListCell)` - ${rightStyle} -`; - -const RightActionButtonCell = styled(ActionButtonCell)` - ${rightStyle} -`; function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { const canLaunch = template.summary_fields.user_capabilities.start; @@ -71,7 +34,6 @@ function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { return ( @@ -83,7 +45,7 @@ function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { /> + @@ -102,23 +64,14 @@ function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { )} - , - + , + {toTitleCase(template.type)} - , - + , + - , - + , + {canLaunch && template.type === 'job_template' && ( @@ -130,6 +83,8 @@ function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { )} + , + {template.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> diff --git a/awx/ui_next/src/screens/User/UserList/UserListItem.jsx b/awx/ui_next/src/screens/User/UserList/UserListItem.jsx index 0ae8eaf07e..e856564222 100644 --- a/awx/ui_next/src/screens/User/UserList/UserListItem.jsx +++ b/awx/ui_next/src/screens/User/UserList/UserListItem.jsx @@ -11,7 +11,6 @@ import { import { Link } from 'react-router-dom'; import { PencilAltIcon } from '@patternfly/react-icons'; -import ActionButtonCell from '@components/ActionButtonCell'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import ListActionButton from '@components/ListActionButton'; @@ -62,7 +61,7 @@ class UserListItem extends React.Component { )} , - + {user.summary_fields.user_capabilities.edit && ( )} - , + , ]} /> From 590199baff52d590f5c5fa342634c0a9bce8ce2e Mon Sep 17 00:00:00 2001 From: Marliana Lara Date: Tue, 11 Feb 2020 16:11:47 -0500 Subject: [PATCH 3/3] Remove ListActionButton component --- .../ClipboardCopyButton.jsx | 16 +- .../ListActionButton/ListActionButton.jsx | 11 - .../ListActionButton.test.jsx | 10 - .../src/components/ListActionButton/index.js | 1 - .../NotificationList.test.jsx | 12 +- .../NotificationListItem.test.jsx.snap | 441 ++++++------------ .../CredentialList/CredentialListItem.jsx | 8 +- .../screens/Host/HostList/HostListItem.jsx | 10 +- .../InventoryGroups/InventoryGroupItem.jsx | 12 +- .../InventoryHosts/InventoryHostItem.jsx | 14 +- .../InventoryHosts/InventoryHostList.test.jsx | 8 +- .../InventoryList/InventoryListItem.jsx | 8 +- .../src/screens/Job/JobList/JobListItem.jsx | 9 +- .../OrganizationList/OrganizationListItem.jsx | 8 +- .../Project/ProjectList/ProjectListItem.jsx | 16 +- .../shared/ProjectSubForms/ManualSubForm.jsx | 20 +- .../screens/Team/TeamList/TeamListItem.jsx | 8 +- .../TemplateList/TemplateListItem.jsx | 12 +- .../screens/User/UserList/UserListItem.jsx | 8 +- 19 files changed, 226 insertions(+), 406 deletions(-) delete mode 100644 awx/ui_next/src/components/ListActionButton/ListActionButton.jsx delete mode 100644 awx/ui_next/src/components/ListActionButton/ListActionButton.test.jsx delete mode 100644 awx/ui_next/src/components/ListActionButton/index.js diff --git a/awx/ui_next/src/components/ClipboardCopyButton/ClipboardCopyButton.jsx b/awx/ui_next/src/components/ClipboardCopyButton/ClipboardCopyButton.jsx index 9bd91fbac3..8fcac00468 100644 --- a/awx/ui_next/src/components/ClipboardCopyButton/ClipboardCopyButton.jsx +++ b/awx/ui_next/src/components/ClipboardCopyButton/ClipboardCopyButton.jsx @@ -3,18 +3,6 @@ import PropTypes from 'prop-types'; import { Button, Tooltip } from '@patternfly/react-core'; import { CopyIcon } from '@patternfly/react-icons'; -import styled from 'styled-components'; - -const CopyButton = styled(Button)` - padding: 2px 4px; - margin-left: 8px; - border: none; - &:hover { - background-color: #0066cc; - color: white; - } -`; - export const clipboardCopyFunc = (event, text) => { const clipboard = event.currentTarget.parentElement; const el = document.createElement('input'); @@ -62,13 +50,13 @@ class ClipboardCopyButton extends React.Component { trigger="mouseenter focus click" content={copied ? clickTip : hoverTip} > - - + ); } diff --git a/awx/ui_next/src/components/ListActionButton/ListActionButton.jsx b/awx/ui_next/src/components/ListActionButton/ListActionButton.jsx deleted file mode 100644 index 3081b4637f..0000000000 --- a/awx/ui_next/src/components/ListActionButton/ListActionButton.jsx +++ /dev/null @@ -1,11 +0,0 @@ -import { Button } from '@patternfly/react-core'; -import styled from 'styled-components'; - -export default styled(Button)` - padding: 5px 8px; - border: none; - &:hover { - background-color: #0066cc; - color: white; - } -`; diff --git a/awx/ui_next/src/components/ListActionButton/ListActionButton.test.jsx b/awx/ui_next/src/components/ListActionButton/ListActionButton.test.jsx deleted file mode 100644 index cab3534a69..0000000000 --- a/awx/ui_next/src/components/ListActionButton/ListActionButton.test.jsx +++ /dev/null @@ -1,10 +0,0 @@ -import React from 'react'; -import { mount } from 'enzyme'; -import ListActionButton from './ListActionButton'; - -describe('ListActionButton', () => { - test('renders the expected content', () => { - const wrapper = mount(); - expect(wrapper).toHaveLength(1); - }); -}); diff --git a/awx/ui_next/src/components/ListActionButton/index.js b/awx/ui_next/src/components/ListActionButton/index.js deleted file mode 100644 index de229f6c76..0000000000 --- a/awx/ui_next/src/components/ListActionButton/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './ListActionButton'; diff --git a/awx/ui_next/src/components/NotificationList/NotificationList.test.jsx b/awx/ui_next/src/components/NotificationList/NotificationList.test.jsx index bbc0a603b8..b0485542a3 100644 --- a/awx/ui_next/src/components/NotificationList/NotificationList.test.jsx +++ b/awx/ui_next/src/components/NotificationList/NotificationList.test.jsx @@ -123,7 +123,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(1) - .find('PFSwitch[aria-label="Toggle notification success"]') + .find('Switch[aria-label="Toggle notification success"]') .prop('onChange')(); expect(MockModelAPI.associateNotificationTemplate).toHaveBeenCalledWith( 1, @@ -150,7 +150,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(0) - .find('PFSwitch[aria-label="Toggle notification failure"]') + .find('Switch[aria-label="Toggle notification failure"]') .prop('onChange')(); expect(MockModelAPI.associateNotificationTemplate).toHaveBeenCalledWith( 1, @@ -178,7 +178,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(0) - .find('PFSwitch[aria-label="Toggle notification start"]') + .find('Switch[aria-label="Toggle notification start"]') .prop('onChange')(); expect(MockModelAPI.associateNotificationTemplate).toHaveBeenCalledWith( 1, @@ -205,7 +205,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(0) - .find('PFSwitch[aria-label="Toggle notification success"]') + .find('Switch[aria-label="Toggle notification success"]') .prop('onChange')(); expect(MockModelAPI.disassociateNotificationTemplate).toHaveBeenCalledWith( 1, @@ -232,7 +232,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(1) - .find('PFSwitch[aria-label="Toggle notification failure"]') + .find('Switch[aria-label="Toggle notification failure"]') .prop('onChange')(); expect(MockModelAPI.disassociateNotificationTemplate).toHaveBeenCalledWith( 1, @@ -259,7 +259,7 @@ describe('', () => { const items = wrapper.find('NotificationListItem'); items .at(2) - .find('PFSwitch[aria-label="Toggle notification start"]') + .find('Switch[aria-label="Toggle notification start"]') .prop('onChange')(); expect(MockModelAPI.disassociateNotificationTemplate).toHaveBeenCalledWith( 1, diff --git a/awx/ui_next/src/components/NotificationList/__snapshots__/NotificationListItem.test.jsx.snap b/awx/ui_next/src/components/NotificationList/__snapshots__/NotificationListItem.test.jsx.snap index 7f6acb15b1..c531e44c0c 100644 --- a/awx/ui_next/src/components/NotificationList/__snapshots__/NotificationListItem.test.jsx.snap +++ b/awx/ui_next/src/components/NotificationList/__snapshots__/NotificationListItem.test.jsx.snap @@ -63,7 +63,7 @@ exports[` initially renders succe - initially renders succe labelOff="Start" onChange={[Function]} /> - initially renders succe labelOff="Success" onChange={[Function]} /> - initially renders succe className="pf-c-data-list__cell NotificationListItem__DataListCell-w674ng-0 dXsFLF" righthalf="true" > - initially renders succe labelOff="Start" onChange={[Function]} > - - - + - - - - + + + + + + initially renders succe labelOff="Success" onChange={[Function]} > - - - + - - - - + + + + + + initially renders succe labelOff="Failure" onChange={[Function]} > - - - + - - - + Failure + + + + + + diff --git a/awx/ui_next/src/screens/Credential/CredentialList/CredentialListItem.jsx b/awx/ui_next/src/screens/Credential/CredentialList/CredentialListItem.jsx index c1f1a7d095..937dde8607 100644 --- a/awx/ui_next/src/screens/Credential/CredentialList/CredentialListItem.jsx +++ b/awx/ui_next/src/screens/Credential/CredentialList/CredentialListItem.jsx @@ -4,6 +4,7 @@ import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { Link } from 'react-router-dom'; import { + Button, DataListItem, DataListItemRow, DataListItemCells as _DataListItemCells, @@ -13,7 +14,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import styled from 'styled-components'; import { Credential } from '@types'; @@ -58,16 +58,16 @@ function CredentialListItem({ {credential.summary_fields.credential_type.name} , - + {canEdit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx index a9420a7032..cb81224fd3 100644 --- a/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx +++ b/awx/ui_next/src/screens/Host/HostList/HostListItem.jsx @@ -3,6 +3,7 @@ import { string, bool, func } from 'prop-types'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -14,7 +15,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import { Sparkline } from '@components/Sparkline'; import VerticalSeparator from '@components/VerticalSeparator'; import { Host } from '@types'; @@ -82,7 +82,7 @@ class HostListItem extends React.Component { )} , - + , - + {host.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx index 95dcb0eabc..94c4edb7f4 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryGroups/InventoryGroupItem.jsx @@ -5,6 +5,7 @@ import { t } from '@lingui/macro'; import { Group } from '@types'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -15,7 +16,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; function InventoryGroupItem({ @@ -46,16 +46,12 @@ function InventoryGroupItem({ {group.name} , - + {group.summary_fields.user_capabilities.edit && ( - + )} , diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx index 9d737af3b3..305fdfca92 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostItem.jsx @@ -3,6 +3,7 @@ import { string, bool, func } from 'prop-types'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -14,7 +15,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import { Sparkline } from '@components/Sparkline'; import VerticalSeparator from '@components/VerticalSeparator'; import { Host } from '@types'; @@ -58,7 +58,7 @@ function InventoryHostItem(props) { , - + , - + {host.summary_fields.user_capabilities?.edit && ( - + )} , diff --git a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx index e5d01c256d..0a60a71ada 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryHosts/InventoryHostList.test.jsx @@ -154,14 +154,14 @@ describe('', () => { HostsAPI.update.mockResolvedValueOnce({ data: { ...mockHosts[1], enabled: false }, }); - expect(wrapper.find('PFSwitch[id="host-2-toggle"]').props().isChecked).toBe( + expect(wrapper.find('Switch[id="host-2-toggle"]').props().isChecked).toBe( true ); await act(async () => { - wrapper.find('PFSwitch[id="host-2-toggle"]').invoke('onChange')(); + wrapper.find('Switch[id="host-2-toggle"]').invoke('onChange')(); }); wrapper.update(); - expect(wrapper.find('PFSwitch[id="host-2-toggle"]').props().isChecked).toBe( + expect(wrapper.find('Switch[id="host-2-toggle"]').props().isChecked).toBe( false ); expect(HostsAPI.update).toHaveBeenCalledTimes(1); @@ -170,7 +170,7 @@ describe('', () => { test('should show error modal if host is not successfully toggled', async () => { HostsAPI.update.mockImplementationOnce(() => Promise.reject(new Error())); await act(async () => { - wrapper.find('PFSwitch[id="host-2-toggle"]').invoke('onChange')(); + wrapper.find('Switch[id="host-2-toggle"]').invoke('onChange')(); }); wrapper.update(); await waitForElement( diff --git a/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx b/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx index 3eef420580..168ac9e61b 100644 --- a/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx +++ b/awx/ui_next/src/screens/Inventory/InventoryList/InventoryListItem.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { string, bool, func } from 'prop-types'; import { withI18n } from '@lingui/react'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -13,7 +14,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { Inventory } from '@types'; @@ -54,10 +54,10 @@ class InventoryListItem extends React.Component { ? i18n._(t`Smart Inventory`) : i18n._(t`Inventory`)} , - + {inventory.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx b/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx index 51ec77b57c..47acd95865 100644 --- a/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx +++ b/awx/ui_next/src/screens/Job/JobList/JobListItem.jsx @@ -4,6 +4,7 @@ import styled from 'styled-components'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { + Button, DataListCell, DataListCheck, DataListItem, @@ -13,7 +14,6 @@ import { } from '@patternfly/react-core'; import { RocketIcon } from '@patternfly/react-icons'; import LaunchButton from '@components/LaunchButton'; -import ListActionButton from '@components/ListActionButton'; import { StatusIcon } from '@components/Sparkline'; import { toTitleCase } from '@util/strings'; import { formatDateString } from '@util/dates'; @@ -60,12 +60,9 @@ class JobListItem extends Component { {({ handleRelaunch }) => ( - + )} diff --git a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx index f376ae8bb4..261dee5700 100644 --- a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx +++ b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx @@ -4,6 +4,7 @@ import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { Badge as PFBadge, + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -15,7 +16,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { Organization } from '@types'; @@ -84,16 +84,16 @@ function OrganizationListItem({ , - + {organization.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx b/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx index 4348fe7da5..10626c5c70 100644 --- a/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx +++ b/awx/ui_next/src/screens/Project/ProjectList/ProjectListItem.jsx @@ -2,6 +2,7 @@ import React, { Fragment } from 'react'; import { string, bool, func } from 'prop-types'; import { withI18n } from '@lingui/react'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -14,7 +15,6 @@ import { PencilAltIcon, SyncIcon } from '@patternfly/react-icons'; import ClipboardCopyButton from '@components/ClipboardCopyButton'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import ProjectSyncButton from '../shared/ProjectSyncButton'; import { StatusIcon } from '@components/Sparkline'; import VerticalSeparator from '@components/VerticalSeparator'; @@ -105,7 +105,7 @@ class ProjectListItem extends React.Component { ? i18n._(t`Manual`) : toTitleCase(project.scm_type)} , - + {project.scm_revision.substring(0, 7)} {project.scm_revision ? ( ) : null} , - + {project.summary_fields.user_capabilities.start && ( {handleSync => ( - + )} )} , - + {project.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx b/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx index 688d3eecc9..94a624b380 100644 --- a/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx +++ b/awx/ui_next/src/screens/Project/shared/ProjectSubForms/ManualSubForm.jsx @@ -37,22 +37,22 @@ const ManualSubForm = ({ return ( <> - {/* {options.length === 1 && ( */} - - {i18n._(t` + {options.length === 1 && ( + + {i18n._(t` There are no available playbook directories in ${project_base_dir}. Either that directory is empty, or all of the contents are already assigned to other projects. Create a new directory there and make sure the playbook files can be read by the "awx" system user, or have ${brandName} directly retrieve your playbooks from source control using the SCM Type option above.`)} - - {/* )} */} + + )} )} , - + {team.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx index 73f5991ff9..b3742dc574 100644 --- a/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx +++ b/awx/ui_next/src/screens/Template/TemplateList/TemplateListItem.jsx @@ -1,6 +1,7 @@ import React from 'react'; import { Link } from 'react-router-dom'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -17,7 +18,6 @@ import { import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; import LaunchButton from '@components/LaunchButton'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { Sparkline } from '@components/Sparkline'; import { toTitleCase } from '@util/strings'; @@ -76,24 +76,24 @@ function TemplateListItem({ i18n, template, isSelected, onSelect, detailUrl }) { {({ handleLaunch }) => ( - + )} )} , - + {template.summary_fields.user_capabilities.edit && ( - - + )} , diff --git a/awx/ui_next/src/screens/User/UserList/UserListItem.jsx b/awx/ui_next/src/screens/User/UserList/UserListItem.jsx index e856564222..cf9ee9a382 100644 --- a/awx/ui_next/src/screens/User/UserList/UserListItem.jsx +++ b/awx/ui_next/src/screens/User/UserList/UserListItem.jsx @@ -3,6 +3,7 @@ import { string, bool, func } from 'prop-types'; import { withI18n } from '@lingui/react'; import { t } from '@lingui/macro'; import { + Button, DataListItem, DataListItemRow, DataListItemCells, @@ -13,7 +14,6 @@ import { PencilAltIcon } from '@patternfly/react-icons'; import DataListCell from '@components/DataListCell'; import DataListCheck from '@components/DataListCheck'; -import ListActionButton from '@components/ListActionButton'; import VerticalSeparator from '@components/VerticalSeparator'; import { User } from '@types'; @@ -61,16 +61,16 @@ class UserListItem extends React.Component { )} , - + {user.summary_fields.user_capabilities.edit && ( - - + )} ,