Add RBAC to org views

src/components/DataListToolbar/DataListToolbar.jsx

@@ -1,6 +1,6 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
-import { I18n } from '@lingui/react';
+import { I18n, i18nMark } from '@lingui/react';
 import { t } from '@lingui/macro';
 import {
   Button,
@@ -28,23 +28,27 @@ import VerticalSeparator from '../VerticalSeparator';
 class DataListToolbar extends React.Component {
   render () {
     const {
+      add,
       addUrl,
       columns,
+      deleteTooltip,
       disableTrashCanIcon,
-      onSelectAll,
-      sortedColumnKey,
-      sortOrder,
-      showDelete,
-      showSelectAll,
       isAllSelected,
       isCompact,
       noLeftMargin,
       onSort,
-      onSearch,
+      onSearch
       onCompact,
       onExpand,
-      add,
-      onOpenDeleteModal
+      onOpenDeleteModal,
+      onSearch,
+      onSelectAll,
+      onSort,
+      showAdd,
+      showDelete,
+      showSelectAll,
+      sortOrder,
+      sortedColumnKey
     } = this.props;
 
     const showExpandCollapse = (onCompact && onExpand);
@@ -112,21 +116,23 @@ class DataListToolbar extends React.Component {
               <LevelItem>
                 { showDelete && (
                   <Tooltip
-                    content={i18n._(t`Delete`)}
-                    position="top"
+                    content={deleteTooltip}
+                    position="left"
                   >
-                    <Button
-                      className="awx-ToolBarBtn"
-                      variant="plain"
-                      aria-label={i18n._(t`Delete`)}
-                      onClick={onOpenDeleteModal}
-                      isDisabled={disableTrashCanIcon}
-                    >
-                      <TrashAltIcon className="awx-ToolBarTrashCanIcon" />
-                    </Button>
+                    <span>
+                      <Button
+                        className="awx-ToolBarBtn"
+                        variant="plain"
+                        aria-label={i18n._(t`Delete`)}
+                        onClick={onOpenDeleteModal}
+                        isDisabled={disableTrashCanIcon}
+                      >
+                        <TrashAltIcon className="awx-ToolBarTrashCanIcon" />
+                      </Button>
+                    </span>
                   </Tooltip>
                 )}
-                {addUrl && (
+                {showAdd && addUrl && (
                   <Link to={addUrl}>
                     <Button
                       variant="primary"
@@ -136,7 +142,7 @@ class DataListToolbar extends React.Component {
                     </Button>
                   </Link>
                 )}
-                {add && (
+                {showAdd && add && (
                   <Fragment>{add}</Fragment>
                 )}
               </LevelItem>
@@ -149,13 +155,16 @@ class DataListToolbar extends React.Component {
 }
 
 DataListToolbar.propTypes = {
+  add: PropTypes.node,
   addUrl: PropTypes.string,
   columns: PropTypes.arrayOf(PropTypes.object).isRequired,
+  deleteTooltip: PropTypes.node,
   isAllSelected: PropTypes.bool,
   noLeftMargin: PropTypes.bool,
   onSearch: PropTypes.func,
   onSelectAll: PropTypes.func,
   onSort: PropTypes.func,
+  showAdd: PropTypes.bool,
   showDelete: PropTypes.bool,
   showSelectAll: PropTypes.bool,
   sortOrder: PropTypes.string,
@@ -167,10 +176,17 @@ DataListToolbar.propTypes = {
 };
 
 DataListToolbar.defaultProps = {
+  add: null,
   addUrl: null,
+  deleteTooltip: i18nMark('Delete'),
+  isAllSelected: false,
+  isCompact: false,
+  onCompact: null,
+  onExpand: null,
   onSearch: null,
   onSelectAll: null,
   onSort: null,
+  showAdd: false,
   showDelete: false,
   showSelectAll: false,
   sortOrder: 'ascending',

src/components/DataListToolbar/styles.scss

@@ -74,7 +74,10 @@
   padding: 0px;
   margin: 0px;
   margin-right: 20px;
-  margin-left: 20px;
+}
+
+.awx-toolbar .pf-c-button {
+  margin-right: 20px;
 }
 
 .awx-toolbar .pf-l-toolbar__item .pf-c-button.pf-m-plain {

src/components/NotificationsList/NotificationListItem.jsx

@@ -13,6 +13,7 @@ import {
 class NotificationListItem extends React.Component {
   render () {
     const {
+      canToggleNotifications,
       itemId,
       name,
       notificationType,
@@ -49,12 +50,14 @@ class NotificationListItem extends React.Component {
               <Switch
                 label={i18n._(t`Successful`)}
                 isChecked={successTurnedOn}
+                isDisabled={!canToggleNotifications}
                 onChange={() => toggleNotification(itemId, successTurnedOn, 'success')}
                 aria-label={i18n._(t`Notification success toggle`)}
               />
               <Switch
                 label={i18n._(t`Failure`)}
                 isChecked={errorTurnedOn}
+                isDisabled={!canToggleNotifications}
                 onChange={() => toggleNotification(itemId, errorTurnedOn, 'error')}
                 aria-label={i18n._(t`Notification failure toggle`)}
               />
@@ -67,6 +70,7 @@ class NotificationListItem extends React.Component {
 }
 
 NotificationListItem.propTypes = {
+  canToggleNotifications: PropTypes.bool.isRequired,
   detailUrl: PropTypes.string.isRequired,
   errorTurnedOn: PropTypes.bool,
   itemId: PropTypes.number.isRequired,

src/components/NotificationsList/Notifications.list.jsx

@@ -273,6 +273,7 @@ class Notifications extends Component {
       successTemplateIds,
       errorTemplateIds
     } = this.state;
+    const { canToggleNotifications } = this.props;
     return (
       <Fragment>
         {noInitialResults && (
@@ -315,6 +316,7 @@ class Notifications extends Component {
                       toggleNotification={this.toggleNotification}
                       errorTurnedOn={errorTemplateIds.includes(o.id)}
                       successTurnedOn={successTemplateIds.includes(o.id)}
+                      canToggleNotifications={canToggleNotifications}
                     />
                   ))}
                 </ul>
@@ -337,6 +339,7 @@ class Notifications extends Component {
 }
 
 Notifications.propTypes = {
+  canToggleNotifications: PropTypes.bool.isRequired,
   onReadError: PropTypes.func.isRequired,
   onReadNotifications: PropTypes.func.isRequired,
   onReadSuccess: PropTypes.func.isRequired,