More cleanup based on pr feedback. Adds org notif list page and tests

src/components/NotificationsList/NotificationListItem.jsx

@@ -10,31 +10,15 @@ import {
 } from '@patternfly/react-core';
 
 class NotificationListItem extends React.Component {
-  constructor (props) {
-    super(props);
-    this.errorToggleClick = this.errorToggleClick.bind(this);
-    this.successToggleClick = this.successToggleClick.bind(this);
-  }
-
-  errorToggleClick (flag) {
-    const { itemId, toggleError } = this.props;
-    toggleError(itemId, flag);
-  }
-
-  successToggleClick (flag) {
-    const { itemId, toggleSuccess } = this.props;
-    toggleSuccess(itemId, flag);
-  }
-
   render () {
     const {
       itemId,
       name,
       notificationType,
       detailUrl,
-      parentBreadcrumb,
       successTurnedOn,
-      errorTurnedOn
+      errorTurnedOn,
+      toggleNotification
     } = this.props;
 
     const capText = {
@@ -49,8 +33,7 @@ class NotificationListItem extends React.Component {
               <div className="pf-u-display-inline-flex">
                 <Link
                   to={{
-                    pathname: detailUrl,
-                    state: { breadcrumb: [parentBreadcrumb, { name, url: detailUrl }] }
+                    pathname: detailUrl
                   }}
                 >
                   <b>{name}</b>
@@ -69,13 +52,13 @@ class NotificationListItem extends React.Component {
               <Switch
                 label={i18n._(t`Successful`)}
                 isChecked={successTurnedOn}
-                onChange={() => this.successToggleClick(successTurnedOn)}
+                onChange={() => toggleNotification(itemId, successTurnedOn, 'success')}
                 aria-label={i18n._(t`Notification success toggle`)}
               />
               <Switch
                 label={i18n._(t`Failure`)}
                 isChecked={errorTurnedOn}
-                onChange={() => this.errorToggleClick(errorTurnedOn)}
+                onChange={() => toggleNotification(itemId, errorTurnedOn, 'error')}
                 aria-label={i18n._(t`Notification failure toggle`)}
               />
             </div>

src/components/NotificationsList/Notifications.list.jsx

@@ -56,8 +56,7 @@ class Notifications extends Component {
     this.onSetPage = this.onSetPage.bind(this);
     this.onSelectAll = this.onSelectAll.bind(this);
     this.onSelect = this.onSelect.bind(this);
-    this.toggleError = this.toggleError.bind(this);
-    this.toggleSuccess = this.toggleSuccess.bind(this);
+    this.toggleNotification = this.toggleNotification.bind(this);
     this.updateUrl = this.updateUrl.bind(this);
     this.postToError = this.postToError.bind(this);
     this.postToSuccess = this.postToSuccess.bind(this);
@@ -131,12 +130,12 @@ class Notifications extends Component {
     }
   };
 
-  toggleError = (id, isCurrentlyOn) => {
-    this.postToError(id, isCurrentlyOn);
-  };
-
-  toggleSuccess = (id, isCurrentlyOn) => {
-    this.postToSuccess(id, isCurrentlyOn);
+  toggleNotification = (id, isCurrentlyOn, status) => {
+    if (status === 'success') {
+      this.postToSuccess(id, isCurrentlyOn);
+    } else if (status === 'error') {
+      this.postToError(id, isCurrentlyOn);
+    }
   };
 
   updateUrl (queryParams) {
@@ -293,8 +292,6 @@ class Notifications extends Component {
       successTemplateIds,
       errorTemplateIds
     } = this.state;
-    const { match } = this.props;
-    const parentBreadcrumb = { name: i18nMark('Organizations'), url: match.url };
 
     return (
       <Fragment>
@@ -335,13 +332,11 @@ class Notifications extends Component {
                       name={o.name}
                       notificationType={o.notification_type}
                       detailUrl={`notifications/${o.id}`}
-                      parentBreadcrumb={parentBreadcrumb}
                       isSelected={selected.includes(o.id)}
                       onSelect={() => this.onSelect(o.id)}
+                      toggleNotification={this.toggleNotification}
                       errorTurnedOn={errorTemplateIds.includes(o.id)}
-                      toggleError={this.toggleError}
                       successTurnedOn={successTemplateIds.includes(o.id)}
-                      toggleSuccess={this.toggleSuccess}
                     />
                   ))}
                 </ul>

src/pages/Organizations/screens/Organization/OrganizationDetail.jsx

@@ -12,7 +12,7 @@ import {
   Route
 } from 'react-router-dom';
 
-import NotificationsList from '../../../../components/NotificationsList/Notifications.list';
+import OrganizationNotifications from './OrganizationNotifications';
 
 import Tab from '../../../../components/Tabs/Tab';
 import Tabs from '../../../../components/Tabs/Tabs';
@@ -54,12 +54,8 @@ const OrganizationDetail = ({
     switch (currentTab) {
       case 'notifications':
         relatedTemplate = (
-          <NotificationsList
-            getNotifications={(id, reqParams) => api.getOrganizationNotifications(id, reqParams)}
-            getSuccess={(id, reqParams) => api.getOrganizationNotificationSuccess(id, reqParams)}
-            getError={(id, reqParams) => api.getOrganizationNotificationError(id, reqParams)}
-            postSuccess={(id, data) => api.createOrganizationNotificationSuccess(id, data)}
-            postError={(id, data) => api.createOrganizationNotificationError(id, data)}
+          <OrganizationNotifications
+            api={api}
             match={match}
             location={location}
             history={history}

src/pages/Organizations/screens/Organization/OrganizationNotifications.jsx

@@ -0,0 +1,63 @@
+import React, { Component } from 'react';
+
+import NotificationsList from '../../../../components/NotificationsList/Notifications.list';
+
+class OrganizationNotifications extends Component {
+  constructor (props) {
+    super(props);
+
+    this.getOrgNotifications = this.getOrgNotifications.bind(this);
+    this.getOrgNotificationSuccess = this.getOrgNotificationSuccess.bind(this);
+    this.getOrgNotificationError = this.getOrgNotificationError.bind(this);
+    this.createOrgNotificationSuccess = this.createOrgNotificationSuccess.bind(this);
+    this.createOrgNotificationError = this.createOrgNotificationError.bind(this);
+  }
+
+  getOrgNotifications (id, reqParams) {
+    const { api } = this.props;
+    return api.getOrganizationNotifications(id, reqParams);
+  }
+
+  getOrgNotificationSuccess (id, reqParams) {
+    const { api } = this.props;
+    return api.getOrganizationNotificationSuccess(id, reqParams);
+  }
+
+  getOrgNotificationError (id, reqParams) {
+    const { api } = this.props;
+    return api.getOrganizationNotificationError(id, reqParams);
+  }
+
+  createOrgNotificationSuccess (id, data) {
+    const { api } = this.props;
+    return api.createOrganizationNotificationSuccess(id, data);
+  }
+
+  createOrgNotificationError (id, data) {
+    const { api } = this.props;
+    return api.createOrganizationNotificationError(id, data);
+  }
+
+  render () {
+    const {
+      location,
+      match,
+      history
+    } = this.props;
+
+    return (
+      <NotificationsList
+        getNotifications={this.getOrgNotifications}
+        getSuccess={this.getOrgNotificationSuccess}
+        getError={this.getOrgNotificationError}
+        postSuccess={this.createOrgNotificationSuccess}
+        postError={this.createOrgNotificationError}
+        match={match}
+        location={location}
+        history={history}
+      />
+    );
+  }
+}
+
+export default OrganizationNotifications;