show notification on errors

client/coral-admin/src/routes/Community/containers/FlaggedAccounts.js

@@ -15,6 +15,7 @@ import { handleFlaggedUsernameChange } from '../graphql';
 import { notify } from 'coral-framework/actions/notification';
 import { isFlaggedUserDangling } from '../utils';
 import t from 'coral-framework/services/i18n';
+import { notifyOnMutationError } from 'coral-framework/hocs';
 
 import FlaggedAccounts from '../components/FlaggedAccounts';
 import FlaggedUser from '../containers/FlaggedUser';
@@ -294,6 +295,7 @@ const mapDispatchToProps = dispatch =>
 export default compose(
   connect(null, mapDispatchToProps),
   withApproveUsername,
+  notifyOnMutationError(['approveUsername']),
   withQuery(
     gql`
       query TalkAdmin_Community_FlaggedAccounts {

client/coral-admin/src/routes/Community/containers/RejectUsernameDialog.js

@@ -4,6 +4,8 @@ import { hideRejectUsernameDialog } from '../../../actions/community';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { compose } from 'react-apollo';
+import { notify } from 'coral-framework/actions/notification';
+import { notifyOnMutationError } from 'coral-framework/hocs';
 
 const mapStateToProps = state => ({
   user: state.community.user,
@@ -14,11 +16,13 @@ const mapDispatchToProps = dispatch =>
   bindActionCreators(
     {
       handleClose: hideRejectUsernameDialog,
+      notify,
     },
     dispatch
   );
 
 export default compose(
   connect(mapStateToProps, mapDispatchToProps),
-  withRejectUsername
+  withRejectUsername,
+  notifyOnMutationError(['rejectUsername'])
 )(RejectUsernameDialog);

client/coral-framework/hocs/index.js

@@ -6,3 +6,4 @@ export { default as withEmit } from './withEmit';
 export { default as excludeIf } from './excludeIf';
 export { default as connect } from './connect';
 export { default as withMergedSettings } from './withMergedSettings';
+export { default as notifyOnMutationError } from './notifyOnMutationError';

client/coral-framework/hocs/notifyOnMutationError.js

@@ -0,0 +1,35 @@
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+import { compose } from 'react-apollo';
+import { notify } from 'coral-framework/actions/notification';
+import { forEachError } from 'coral-framework/utils';
+import { withProps } from 'recompose';
+
+const notifyOnMutationError = keys =>
+  compose(
+    connect(null, dispatch =>
+      bindActionCreators(
+        {
+          notify,
+        },
+        dispatch
+      )
+    ),
+    withProps(ownProps =>
+      keys.reduce((props, key) => {
+        props[key] = async (...args) => {
+          try {
+            return await ownProps[key](...args);
+          } catch (e) {
+            forEachError(e, ({ msg }) => {
+              ownProps.notify('error', msg);
+            });
+            throw e;
+          }
+        };
+        return props;
+      }, {})
+    )
+  );
+
+export default notifyOnMutationError;