From f704f320b54fc336182fc165b840ed4bd1a40ec4 Mon Sep 17 00:00:00 2001 From: Alex Corey Date: Wed, 1 May 2019 11:05:29 -0400 Subject: [PATCH] address pr issues --- __tests__/components/DataListToolbar.test.jsx | 8 +++---- src/components/AddRole/AddResourceRole.jsx | 1 + src/components/AddRole/styles.scss | 2 +- .../DataListToolbar/DataListToolbar.jsx | 23 +++++++++++-------- src/components/DataListToolbar/styles.scss | 19 +++++++-------- .../screens/Organization/Organization.jsx | 3 ++- .../screens/OrganizationsList.jsx | 8 +++++-- 7 files changed, 37 insertions(+), 27 deletions(-) diff --git a/__tests__/components/DataListToolbar.test.jsx b/__tests__/components/DataListToolbar.test.jsx index 38959ff1e8..b6527d0454 100644 --- a/__tests__/components/DataListToolbar.test.jsx +++ b/__tests__/components/DataListToolbar.test.jsx @@ -217,11 +217,11 @@ describe('', () => { columns={columns} onOpenDeleteModal={onOpenDeleteModal} showDelete + disableDeleteIcon={false} /> ); - toolbar.find(openDeleteModalButton).simulate('click'); - expect(onOpenDeleteModal).toBeCalled(); + expect(onOpenDeleteModal).toHaveBeenCalled(); }); test('Tooltip says "Select a row to delete" when trash can icon is disabled', () => { @@ -229,7 +229,7 @@ describe('', () => { ); @@ -243,7 +243,7 @@ describe('', () => { ); const toolTip = toolbar.find('.pf-c-tooltip__content'); diff --git a/src/components/AddRole/AddResourceRole.jsx b/src/components/AddRole/AddResourceRole.jsx index 1b205a7c96..279a3f1363 100644 --- a/src/components/AddRole/AddResourceRole.jsx +++ b/src/components/AddRole/AddResourceRole.jsx @@ -238,6 +238,7 @@ class AddResourceRole extends React.Component { return ( - - { showDelete && ( + + {showDelete && (
@@ -163,6 +164,7 @@ DataListToolbar.propTypes = { addUrl: PropTypes.string, columns: PropTypes.arrayOf(PropTypes.object).isRequired, deleteTooltip: PropTypes.node, + disableDeleteIcon: PropTypes.bool, isAllSelected: PropTypes.bool, isCompact: PropTypes.bool, noLeftMargin: PropTypes.bool, @@ -175,13 +177,14 @@ DataListToolbar.propTypes = { showDelete: PropTypes.bool, showSelectAll: PropTypes.bool, sortOrder: PropTypes.string, - sortedColumnKey: PropTypes.string + sortedColumnKey: PropTypes.string, }; DataListToolbar.defaultProps = { add: null, addUrl: null, deleteTooltip: i18nMark('Delete'), + disableDeleteIcon: true, isAllSelected: false, isCompact: false, noLeftMargin: false, @@ -194,7 +197,7 @@ DataListToolbar.defaultProps = { showDelete: false, showSelectAll: false, sortOrder: 'ascending', - sortedColumnKey: 'name' + sortedColumnKey: 'name', }; export default DataListToolbar; diff --git a/src/components/DataListToolbar/styles.scss b/src/components/DataListToolbar/styles.scss index 8a29cef8f1..865ec3af88 100644 --- a/src/components/DataListToolbar/styles.scss +++ b/src/components/DataListToolbar/styles.scss @@ -30,6 +30,7 @@ .awx-toolbar button.pf-c-button { height: 30px; + width: 30px; padding: 0px; } @@ -82,27 +83,27 @@ .awx-ToolBarBtn{ width: 30px; - position: absolute; - right: 80px; display: flex; justify-content: center; margin-right: 20px; border-radius: 3px; } + .awx-ToolBarBtn:hover{ .awx-ToolBarTrashCanIcon { color:white; } background-color:#d9534f; } -.awx-ToolBarTrashCanIcon-disabled{ - width: 30px; - position: absolute; - right: 80px; - display: flex; - justify-content: center; - margin-right: 20px; + +.awx-ToolBarBtn--disabled:hover{ + .awx-ToolBarTrashCanIcon { + color: #d2d2d2; + } + background-color:white; + cursor: not-allowed; } + .pf-l-toolbar >div{ &:last-child{ display:none; diff --git a/src/pages/Organizations/screens/Organization/Organization.jsx b/src/pages/Organizations/screens/Organization/Organization.jsx index 479a12b642..676767e8fc 100644 --- a/src/pages/Organizations/screens/Organization/Organization.jsx +++ b/src/pages/Organizations/screens/Organization/Organization.jsx @@ -125,7 +125,8 @@ class Organization extends Component { } = this.state; const tabsPaddingOverride = { - padding: '0' + padding: '0', + borderBottom: '1px solid black' }; const canSeeNotificationsTab = me.is_system_auditor || isNotifAdmin || isAuditorOfThisOrg; diff --git a/src/pages/Organizations/screens/OrganizationsList.jsx b/src/pages/Organizations/screens/OrganizationsList.jsx index 721b545e95..d19def096f 100644 --- a/src/pages/Organizations/screens/OrganizationsList.jsx +++ b/src/pages/Organizations/screens/OrganizationsList.jsx @@ -285,6 +285,7 @@ class OrganizationsList extends Component { selected.length === 0 || selected.some(row => !row.summary_fields.user_capabilities.delete) ); + const deleteToolTipContent = disableDelete ? i18nMark('Select a row to delete') : i18nMark('Delete'); return ( @@ -337,7 +338,10 @@ class OrganizationsList extends Component { onSort={this.onSort} onSelectAll={this.onSelectAll} onOpenDeleteModal={this.handleOpenOrgDeleteModal} - disableTrashCanIcon={disableDelete} + disableDeleteIcon={disableDelete} + deleteIconStyling={disableDelete ? 'awx-ToolBarBtn awx-ToolBarBtn--disabled' + : 'awx-ToolBarBtn'} + deleteTooltip={ selected.some(row => !row.summary_fields.user_capabilities.delete) ? (
@@ -353,7 +357,7 @@ class OrganizationsList extends Component { )) }
- ) : undefined + ) : deleteToolTipContent } showDelete showSelectAll