From aa364e1abeaee4b4350fbf27f925bd4bbdaa0a53 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 12:58:25 -0300
Subject: [PATCH 1/7] Renaming Fragment and variable name

---
 plugins/talk-plugin-featured-comments/client/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-featured-comments/client/index.js b/plugins/talk-plugin-featured-comments/client/index.js
index 2ebde06a1..12c4a724f 100644
--- a/plugins/talk-plugin-featured-comments/client/index.js
+++ b/plugins/talk-plugin-featured-comments/client/index.js
@@ -89,14 +89,14 @@ export default {
       },
       update: (proxy) => {
 
-        if (name !== 'FEATURED') {
+        if (variables.name !== 'FEATURED') {
           return;
         }
 
         const fragmentId = `Comment_${variables.id}`;
 
         const fragment = gql`
-          fragment Talk_ModerationActions_addTag on Comment {
+          fragment Talk_FeaturedComments_addTag on Comment {
             status
           }
         `;

From 6bac6ee5c5bdf73a8f28e99dfc0cce0f253ea9d8 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 12:59:48 -0300
Subject: [PATCH 2/7] Removed old code

---
 plugins/talk-plugin-featured-comments/client/index.js | 11 -----------
 1 file changed, 11 deletions(-)

diff --git a/plugins/talk-plugin-featured-comments/client/index.js b/plugins/talk-plugin-featured-comments/client/index.js
index 12c4a724f..7b419c545 100644
--- a/plugins/talk-plugin-featured-comments/client/index.js
+++ b/plugins/talk-plugin-featured-comments/client/index.js
@@ -61,17 +61,6 @@ export default {
           if (previous.asset.comments) {
             updated = update(previous, {
               asset: {
-                comments: {
-                  nodes: {
-                    $apply: (nodes) => nodes.map((node) => {
-                      if (node.id === variables.id) {
-                        node.status = 'ACCEPTED';
-                      }
-    
-                      return node;
-                    })
-                  }
-                },
                 featuredComments: {
                   nodes: {
                     $apply: (nodes) => prependNewNodes(nodes, [comment]),

From 0042767fad3015449dbcd6e0b7b104d86ce76ca5 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 13:12:35 -0300
Subject: [PATCH 3/7] No approve button for Approved comments

---
 .../client/components/ApproveCommentAction.js | 24 +++++++++----------
 .../client/components/styles.css              |  2 ++
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js b/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
index f75a98c27..f683acae6 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
@@ -7,17 +7,15 @@ import cn from 'classnames';
 const isApproved = (status) => (status === 'ACCEPTED');
 
 export default ({approveComment, comment: {status}}) => (
-  <button className={cn(styles.button, 'talk-plugin-moderation-actions-reject')} onClick={approveComment}>
-    {isApproved(status) ? (
-      <span className={styles.approved}>
-        <Icon name="check_circle" className={styles.icon} />
-        {t('talk-plugin-moderation-actions.approved_comment')}
-      </span>
-    ) : (
-      <span>
-        <Icon name="done" className={styles.icon} />
-        {t('talk-plugin-moderation-actions.approve_comment')}
-      </span>
-    )}
-  </button>
+  isApproved(status) ? (
+    <span className={styles.approved}>
+      <Icon name="check_circle" className={styles.icon} />
+      {t('talk-plugin-moderation-actions.approved_comment')}
+    </span>
+  ) : (
+    <button className={cn(styles.button, 'talk-plugin-moderation-actions-reject')} onClick={approveComment}>
+      <Icon name="done" className={styles.icon} />
+      {t('talk-plugin-moderation-actions.approve_comment')}
+    </button>
+  )
 );
diff --git a/plugins/talk-plugin-moderation-actions/client/components/styles.css b/plugins/talk-plugin-moderation-actions/client/components/styles.css
index 12ae4bad5..c1ef4a98b 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/styles.css
+++ b/plugins/talk-plugin-moderation-actions/client/components/styles.css
@@ -24,6 +24,8 @@
 }
 
 .approved {
+  display: inline-block;
   color: #519954;
   font-weight: bold;
+  padding: 6px;
 }
\ No newline at end of file

From dbeca830a28860cf5040e3a4157a41c1929ba52c Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 13:30:15 -0300
Subject: [PATCH 4/7] Closing after featuring and unfeaturing

---
 .../client/components/ModActionButton.js          | 15 +++++++++++++--
 .../client/containers/ModActionButton.js          | 10 +++++++++-
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-featured-comments/client/components/ModActionButton.js b/plugins/talk-plugin-featured-comments/client/components/ModActionButton.js
index 5eabcdde7..b1811d2fc 100644
--- a/plugins/talk-plugin-featured-comments/client/components/ModActionButton.js
+++ b/plugins/talk-plugin-featured-comments/client/components/ModActionButton.js
@@ -29,12 +29,23 @@ export class ModActionButton extends React.Component {
     });
   }
 
+  handleDeleteTag = () => {
+    this.props.deleteTag();
+    this.props.closeTooltip();
+  }
+
+  handlePostTag = () => {
+    this.props.postTag();
+    this.props.closeTooltip();
+  }
+
   render() {
-    const {alreadyTagged, deleteTag, postTag} = this.props;
+    const {alreadyTagged} = this.props;
+    const {handleDeleteTag, handlePostTag} = this;
 
     return (
       <button className={cn(`${pluginName}-tag-button`, styles.button, {[styles.featured] : alreadyTagged})}
-        onClick={alreadyTagged ? deleteTag : postTag}
+        onClick={alreadyTagged ? handleDeleteTag : handlePostTag}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave} >
 
diff --git a/plugins/talk-plugin-featured-comments/client/containers/ModActionButton.js b/plugins/talk-plugin-featured-comments/client/containers/ModActionButton.js
index fe3491fee..520ce9344 100644
--- a/plugins/talk-plugin-featured-comments/client/containers/ModActionButton.js
+++ b/plugins/talk-plugin-featured-comments/client/containers/ModActionButton.js
@@ -1,9 +1,17 @@
 import {compose} from 'react-apollo';
+import {bindActionCreators} from 'redux';
 import ModActionButton from '../components/ModActionButton';
-import {withTags} from 'plugin-api/beta/client/hocs';
+import {withTags, connect} from 'plugin-api/beta/client/hocs';
+import {closeTooltip} from 'plugins/talk-plugin-moderation-actions/client/actions';
+
+const mapDispatchToProps = (dispatch) =>
+  bindActionCreators({
+    closeTooltip,
+  }, dispatch);
 
 const enhance = compose(
   withTags('featured'),
+  connect(null, mapDispatchToProps),
 );
 
 export default enhance(ModActionButton);

From 9c08b586eca4a7bd2d287f79119587b61c6b0509 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 13:40:26 -0300
Subject: [PATCH 5/7] Hiding after action

---
 .../client/components/ModerationActions.js                    | 4 ++--
 .../client/containers/ApproveCommentAction.js                 | 4 +++-
 .../client/containers/RejectCommentAction.js                  | 2 ++
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js b/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
index 016c14728..a7a21b186 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
@@ -31,8 +31,8 @@ export default class ModerationActions extends React.Component {
                 data={data}
               />
 
-              <ApproveCommentAction comment={comment} />
-              <RejectCommentAction comment={comment} />
+              <ApproveCommentAction comment={comment} hideTooltip={hideTooltip} />
+              <RejectCommentAction comment={comment} hideTooltip={hideTooltip} />
             </Tooltip>
           )}
         </div>
diff --git a/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js b/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
index 2c532801e..63b2b245f 100644
--- a/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
@@ -5,12 +5,14 @@ import ApproveCommentAction from '../components/ApproveCommentAction';
 class ApproveCommentActionContainer extends React.Component {
 
   approveComment = () => {
-    const {setCommentStatus, comment} = this.props;
+    const {setCommentStatus, comment, hideTooltip} = this.props;
 
     setCommentStatus({
       commentId: comment.id,
       status: 'ACCEPTED'
     });
+
+    hideTooltip();
   }
 
   render() {
diff --git a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
index d4c317f4c..05c39d22f 100644
--- a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
@@ -11,6 +11,8 @@ class RejectCommentActionContainer extends React.Component {
       commentId: comment.id,
       status: 'REJECTED'
     });
+    
+    hideTooltip();
   }
 
   render() {

From 297b9051634d7aa169a91bb50e3f1510af8032e3 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 13:42:49 -0300
Subject: [PATCH 6/7] Hiding after action

---
 .../client/containers/RejectCommentAction.js                  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
index 05c39d22f..dc940b834 100644
--- a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
@@ -5,13 +5,13 @@ import RejectCommentAction from '../components/RejectCommentAction';
 class RejectCommentActionContainer extends React.Component {
 
   rejectComment = () => {
-    const {setCommentStatus, comment} = this.props;
+    const {setCommentStatus, comment, hideTooltip} = this.props;
 
     setCommentStatus({
       commentId: comment.id,
       status: 'REJECTED'
     });
-    
+
     hideTooltip();
   }
 

From 0e7d74559f12bc2d58c7938127094298cdd119b2 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 12 Sep 2017 14:08:19 -0300
Subject: [PATCH 7/7] Notify errors

---
 .../client/containers/ApproveCommentAction.js | 31 ++++++++++++++-----
 .../client/containers/RejectCommentAction.js  | 29 +++++++++++++----
 2 files changed, 47 insertions(+), 13 deletions(-)

diff --git a/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js b/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
index 63b2b245f..19000ba1f 100644
--- a/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/containers/ApproveCommentAction.js
@@ -1,16 +1,25 @@
 import React from 'react';
+import {bindActionCreators} from 'redux';
+import {connect} from 'plugin-api/beta/client/hocs';
+import {getErrorMessages} from 'plugin-api/beta/client/utils';
 import {withSetCommentStatus} from 'plugin-api/beta/client/hocs';
+import {notify} from 'plugin-api/beta/client/actions/notification';
 import ApproveCommentAction from '../components/ApproveCommentAction';
 
 class ApproveCommentActionContainer extends React.Component {
 
-  approveComment = () => {
-    const {setCommentStatus, comment, hideTooltip} = this.props;
+  approveComment = async () => {
+    const {setCommentStatus, comment, hideTooltip, notify} = this.props;
 
-    setCommentStatus({
-      commentId: comment.id,
-      status: 'ACCEPTED'
-    });
+    try {
+      await setCommentStatus({
+        commentId: comment.id,
+        status: 'ACCEPTED'
+      });
+    }
+    catch(err) {
+      notify('error', getErrorMessages(err));
+    }
 
     hideTooltip();
   }
@@ -20,4 +29,12 @@ class ApproveCommentActionContainer extends React.Component {
   }
 }
 
-export default withSetCommentStatus(ApproveCommentActionContainer);
+const mapDispatchToProps = (dispatch) =>
+  bindActionCreators({
+    notify
+  }, dispatch);
+
+export default compose(
+  withSetCommentStatus,
+  connect(null, mapDispatchToProps)
+)(ApproveCommentActionContainer);
diff --git a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
index dc940b834..1636cf44a 100644
--- a/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/containers/RejectCommentAction.js
@@ -1,16 +1,25 @@
 import React from 'react';
+import {bindActionCreators} from 'redux';
+import {connect} from 'plugin-api/beta/client/hocs';
+import {getErrorMessages} from 'plugin-api/beta/client/utils'
 import {withSetCommentStatus} from 'plugin-api/beta/client/hocs';
+import {notify} from 'plugin-api/beta/client/actions/notification';
 import RejectCommentAction from '../components/RejectCommentAction';
 
 class RejectCommentActionContainer extends React.Component {
 
   rejectComment = () => {
-    const {setCommentStatus, comment, hideTooltip} = this.props;
+    const {setCommentStatus, comment, hideTooltip, notify} = this.props;
 
-    setCommentStatus({
-      commentId: comment.id,
-      status: 'REJECTED'
-    });
+    try {
+      await setCommentStatus({
+        commentId: comment.id,
+        status: 'REJECTED'
+      });
+    }
+    catch(err) {
+      notify('error', getErrorMessages(err));
+    }
 
     hideTooltip();
   }
@@ -20,4 +29,12 @@ class RejectCommentActionContainer extends React.Component {
   }
 }
 
-export default withSetCommentStatus(RejectCommentActionContainer);
+const mapDispatchToProps = (dispatch) =>
+bindActionCreators({
+  notify
+}, dispatch);
+
+export default compose(
+  withSetCommentStatus,
+  connect(null, mapDispatchToProps)
+)(RejectCommentActionContainer);