From 2d4adb60be38bab47a50c93f385645dd3e8e6a27 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 4 Sep 2017 23:55:44 +0700
Subject: [PATCH] Show notification on success

---
 client/coral-embed/src/Snackbar.js                   |  2 +-
 client/coral-framework/services/notification.js      | 12 ++++++------
 plugin-api/beta/client/actions/notification.js       |  2 +-
 .../client/containers/IgnoreUserConfirmation.js      |  4 ++++
 .../talk-plugin-ignore-user/client/translations.yml  |  2 ++
 5 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/client/coral-embed/src/Snackbar.js b/client/coral-embed/src/Snackbar.js
index c518288c6..11219102d 100644
--- a/client/coral-embed/src/Snackbar.js
+++ b/client/coral-embed/src/Snackbar.js
@@ -38,7 +38,7 @@ export default class Snackbar {
   }
 
   alert(message) {
-    const [type, text] = message.split('|');
+    const {type, text} = JSON.parse(message);
     this.el.style.transform = 'translate(-50%, 20px)';
     this.el.style.opacity = 0;
     this.el.className = `coral-notif-${type}`;
diff --git a/client/coral-framework/services/notification.js b/client/coral-framework/services/notification.js
index 5730200ad..a3f1a6520 100644
--- a/client/coral-framework/services/notification.js
+++ b/client/coral-framework/services/notification.js
@@ -5,14 +5,14 @@
  */
 export function createNotificationService(pym) {
   return {
-    success(msg) {
-      pym.sendMessage('coral-alert', `success|${msg}`);
+    success(text) {
+      pym.sendMessage('coral-alert', JSON.stringify({kind: 'success', text}));
     },
-    error(msg) {
-      pym.sendMessage('coral-alert', `error|${msg}`);
+    error(text) {
+      pym.sendMessage('coral-alert', JSON.stringify({kind: 'error', text}));
     },
-    info(msg) {
-      pym.sendMessage('coral-alert', `info|${msg}`);
+    info(text) {
+      pym.sendMessage('coral-alert', JSON.stringify({kind: 'info', text}));
     },
   };
 }
diff --git a/plugin-api/beta/client/actions/notification.js b/plugin-api/beta/client/actions/notification.js
index c1a75cb7a..0fae2b983 100644
--- a/plugin-api/beta/client/actions/notification.js
+++ b/plugin-api/beta/client/actions/notification.js
@@ -1 +1 @@
-export {addNotification} from 'coral-framework/actions/notification';
+export {notify} from 'coral-framework/actions/notification';
diff --git a/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js b/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
index 4821fae9b..2e1c7a820 100644
--- a/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
+++ b/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
@@ -4,11 +4,14 @@ import {compose, gql} from 'react-apollo';
 import {connect, withFragments, withIgnoreUser} from 'plugin-api/beta/client/hocs';
 import {bindActionCreators} from 'redux';
 import {closeMenu} from 'plugins/talk-plugin-author-menu/client/actions';
+import {notify} from 'plugin-api/beta/client/actions/notification';
+import {t} from 'plugin-api/beta/client/services';
 
 class IgnoreUserConfirmationContainer extends React.Component {
 
   ignoreUser = () => {
     this.props.ignoreUser(this.props.comment.user.id);
+    this.props.notify('success', t('talk-plugin-ignore-user.notify_success', this.props.comment.user.username));
     this.props.closeMenu();
   };
 
@@ -28,6 +31,7 @@ class IgnoreUserConfirmationContainer extends React.Component {
 const mapDispatchToProps = (dispatch) =>
   bindActionCreators({
     closeMenu,
+    notify,
   }, dispatch);
 
 const withIgnoreUserConfirmationFragments = withFragments({
diff --git a/plugins/talk-plugin-ignore-user/client/translations.yml b/plugins/talk-plugin-ignore-user/client/translations.yml
index d3d3c2aba..a10c68a8d 100644
--- a/plugins/talk-plugin-ignore-user/client/translations.yml
+++ b/plugins/talk-plugin-ignore-user/client/translations.yml
@@ -5,5 +5,7 @@ en:
     confirmation: |
       When you ignore a user, all comments they wrote on the site will be hidden from you. You can
       undo this later from My Profile.
+    notify_success: |
+      You are now ignoring {0}. You can undo this action from My Profile.
 es:
   talk-plugin-ignore-user: