notify error messages

client/coral-admin/src/components/UserDetail.css

@@ -131,11 +131,12 @@
   .bulkAction:last-child {
     margin-left: -10px;
   }
-  span {
-    align-self: center;
-    font-weight: 500;
-    margin-left: 15px;
-  }
+}
+
+.selectedCommentsInfo {
+  align-self: center;
+  font-weight: 500;
+  margin-left: 15px;
 }
 
 .loadMore>button {

client/coral-admin/src/components/UserDetail.js

@@ -12,6 +12,7 @@ import capitalize from 'lodash/capitalize';
 import {getReliability} from 'coral-framework/utils/user';
 import ApproveButton from './ApproveButton';
 import RejectButton from './RejectButton';
+import {getErrorMessages} from 'coral-framework/utils';
 
 export default class UserDetail extends React.Component {
 
@@ -33,7 +34,8 @@ export default class UserDetail extends React.Component {
     activeTab: PropTypes.string.isRequired,
     selectedCommentIds: PropTypes.array.isRequired,
     viewUserDetail: PropTypes.any.isRequired,
-    loadMore: PropTypes.any.isRequired
+    loadMore: PropTypes.any.isRequired,
+    notify: PropTypes.func.isRequired
   }
 
   rejectThenReload = async (info) => {
@@ -44,6 +46,7 @@ export default class UserDetail extends React.Component {
 
       // TODO: handle error.
       console.error(err);
+      this.props.notify('error', getErrorMessages(err));
     }
   }
 
@@ -55,6 +58,7 @@ export default class UserDetail extends React.Component {
 
       // TODO: handle error.
       console.error(err);
+      this.props.notify('error', getErrorMessages(err));
     }
   }
 
@@ -66,6 +70,7 @@ export default class UserDetail extends React.Component {
 
       // TODO: handle error.
       console.error(err);
+      this.props.notify('error', getErrorMessages(err));
     }
   }
 
@@ -77,6 +82,7 @@ export default class UserDetail extends React.Component {
 
       // TODO: handle error.
       console.error(err);
+      this.props.notify('error', getErrorMessages(err));
     }
   }
 
@@ -191,7 +197,7 @@ export default class UserDetail extends React.Component {
                       onClick={this.bulkRejectThenReload}
                       minimal
                     />
-                    <span>  {selectedCommentIds.length} comments selected</span>
+                    <span className={styles.selectedCommentsInfo}>  {selectedCommentIds.length} comments selected</span>
                   </div>
                 )
             }

client/coral-admin/src/containers/UserDetail.js

@@ -16,6 +16,7 @@ import {
 import {withSetCommentStatus} from 'coral-framework/graphql/mutations';
 import UserDetailComment from './UserDetailComment';
 import update from 'immutability-helper';
+import {notify} from 'coral-framework/actions/notification';
 
 const commentConnectionFragment = gql`
   fragment CoralAdmin_Moderation_CommentConnection on CommentConnection {
@@ -190,7 +191,8 @@ const mapDispatchToProps = (dispatch) => ({
     toggleSelectCommentInUserDetail,
     viewUserDetail,
     hideUserDetail,
-    toggleSelectAllCommentInUserDetail
+    toggleSelectAllCommentInUserDetail,
+    notify
   }, dispatch)
 });