diff --git a/.eslintrc.json b/.eslintrc.json
index 285f5f7dc..293657679 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -4,18 +4,9 @@
         "node": true
     },
     "extends": "eslint:recommended",
-    "parser": "babel-eslint",
     "parserOptions": {
-        "ecmaVersion": 2017,
-        "sourceType": "module",
-        "ecmaFeatures": {
-            "jsx": true,
-            "experimentalObjectRestSpread": true
-        }
+        "ecmaVersion": 2017
     },
-    "plugins": [
-        "react"
-    ],
     "rules": {
         "indent": ["error",
             2
@@ -62,8 +53,6 @@
         }],
         "newline-per-chained-call": ["error", {
             "ignoreChainWithDepth": 2
-        }],
-        "react/jsx-uses-react": "error",
-        "react/jsx-uses-vars": "error"
+        }]
     }
 }
diff --git a/graph/helpers/response.js b/graph/helpers/response.js
new file mode 100644
index 000000000..ebdbc02ec
--- /dev/null
+++ b/graph/helpers/response.js
@@ -0,0 +1,31 @@
+const errors = require('../../errors');
+const {Error: {ValidationError}} = require('mongoose');
+
+/**
+ * Wraps up a promise to return an object with the resolution of the promise
+ * keyed at `key` or an error caught at `errors`.
+ */
+
+const wrapResponse = (key) => (promise) => {
+  return promise.then((value) => {
+    let res = {};
+    if (key) {
+      res[key] = value;
+    }
+    return res;
+  }).catch((err) => {
+    if (err instanceof errors.APIError) {
+      return {
+        errors: [err]
+      };
+    } else if (err instanceof ValidationError) {
+
+      // TODO: wrap this with one of our internal errors.
+      throw err;
+    }
+
+    throw err;
+  });
+};
+
+module.exports = wrapResponse;
diff --git a/graph/resolvers/root_mutation.js b/graph/resolvers/root_mutation.js
index a474407d2..3d5ea9ad9 100644
--- a/graph/resolvers/root_mutation.js
+++ b/graph/resolvers/root_mutation.js
@@ -1,33 +1,6 @@
-const {Error: {ValidationError}} = require('mongoose');
-const errors = require('../../errors');
+const wrapResponse = require('../helpers/response');
 const CommentsService = require('../../services/comments');
 
-/**
- * Wraps up a promise to return an object with the resolution of the promise
- * keyed at `key` or an error caught at `errors`.
- */
-const wrapResponse = (key) => (promise) => {
-  return promise.then((value) => {
-    let res = {};
-    if (key) {
-      res[key] = value;
-    }
-    return res;
-  }).catch((err) => {
-    if (err instanceof errors.APIError) {
-      return {
-        errors: [err]
-      };
-    } else if (err instanceof ValidationError) {
-
-      // TODO: wrap this with one of our internal errors.
-      throw err;
-    }
-
-    throw err;
-  });
-};
-
 const RootMutation = {
   createComment(_, {asset_id, parent_id, body}, {mutators: {Comment}}) {
     return wrapResponse('comment')(Comment.create({asset_id, parent_id, body}));
diff --git a/plugins.json b/plugins.json
index 6ac303c35..f135d8430 100644
--- a/plugins.json
+++ b/plugins.json
@@ -5,4 +5,4 @@
   "client": [
     "coral-plugin-respect"
   ]
-}
\ No newline at end of file
+}
diff --git a/plugins/coral-plugin-respect/client/.eslintrc.json b/plugins/coral-plugin-respect/client/.eslintrc.json
new file mode 100644
index 000000000..9fe56bd14
--- /dev/null
+++ b/plugins/coral-plugin-respect/client/.eslintrc.json
@@ -0,0 +1,23 @@
+{
+  "env": {
+    "browser": true,
+    "es6": true,
+    "mocha": true
+  },
+  "parserOptions": {
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "experimentalObjectRestSpread": true,
+      "jsx": true
+    }
+  },
+  "parser": "babel-eslint",
+  "plugins": [
+    "react"
+  ],
+  "rules": {
+    "react/jsx-uses-react": "error",
+    "react/jsx-uses-vars": "error",
+    "no-console": ["warn", { "allow": ["warn", "error"] }]
+  }
+}
diff --git a/plugins/coral-plugin-respect/client/components/Icon.js b/plugins/coral-plugin-respect/client/components/Icon.js
index 8a39218dc..1e4dd30b9 100644
--- a/plugins/coral-plugin-respect/client/components/Icon.js
+++ b/plugins/coral-plugin-respect/client/components/Icon.js
@@ -1,5 +1,5 @@
 import React from 'react';
 
 export default () => (
-  <i className="fa fa-handshake-o" aria-hidden="true"></i>
+  <i className="fa fa-handshake-o" aria-hidden="true"/>
 );
diff --git a/plugins/coral-plugin-respect/client/config.json b/plugins/coral-plugin-respect/client/config.json
index 7d822b10f..ef9fed04f 100644
--- a/plugins/coral-plugin-respect/client/config.json
+++ b/plugins/coral-plugin-respect/client/config.json
@@ -1,4 +1,4 @@
 {
   "name": "Coral Plugin Respect",
   "slot": "Comment.Detail"
-}
\ No newline at end of file
+}
diff --git a/plugins/coral-plugin-respect/client/index.js b/plugins/coral-plugin-respect/client/index.js
index 341363571..de23f994b 100644
--- a/plugins/coral-plugin-respect/client/index.js
+++ b/plugins/coral-plugin-respect/client/index.js
@@ -2,6 +2,10 @@ import React from 'react';
 import styles from './style.css';
 import Icon from './components/Icon';
 
+import {I18n} from 'coral-framework';
+import translations from './translations.json';
+const lang = new I18n(translations);
+
 import {getActionSummary} from 'coral-framework/utils';
 
 class RespectButton extends React.Component {
@@ -15,7 +19,7 @@ class RespectButton extends React.Component {
   }
 
   handleClick = () => {
-    const {comment, postRespect, showSignInDialog, currentUser} = this.props.context;
+    const {comment, postRespect, showSignInDialog, currentUser, deleteAction} = this.props.context;
     const {localPost, localDelete} = this.state;
     const respect = getActionSummary('RespectActionSummary', comment);
     const respected = (respect && respect.current_user && !localDelete) || localPost;
@@ -54,6 +58,7 @@ class RespectButton extends React.Component {
 
     } else {
       this.setState((prev) => prev.localPost ? {...prev, localPost: null} : {...prev, localDelete: true});
+      deleteAction(localPost || respect.current_user.id);
     }
   }
 
@@ -61,6 +66,7 @@ class RespectButton extends React.Component {
     const {comment} = this.props.context;
     const {localPost, localDelete} = this.state;
     const respect = getActionSummary('RespectActionSummary', comment);
+    const respected = (respect && respect.current_user && !localDelete) || localPost;
     let count = respect ? respect.count : 0;
 
     if (localPost) {count += 1;}
@@ -68,8 +74,10 @@ class RespectButton extends React.Component {
 
     return (
       <div className={styles.Respect}>
-        <button onClick={this.handleClick}>
-          Respect
+        <button
+          className={respected ? styles.respected : ''}
+          onClick={this.handleClick} >
+          <span>{lang.t(respected ? 'respected' : 'respect')}</span>
           <Icon />
           {count > 0 && count}
         </button>
diff --git a/plugins/coral-plugin-respect/client/style.css b/plugins/coral-plugin-respect/client/style.css
index 7933f8d8e..485315bfa 100644
--- a/plugins/coral-plugin-respect/client/style.css
+++ b/plugins/coral-plugin-respect/client/style.css
@@ -14,11 +14,14 @@
          }
     }
 
-    .clicked {
+    .respected {
         color: #ffcc00;
+        i {
+          color: #161616;
+        }
     }
 
     i {
         padding: 0 5px;
     }
-}
\ No newline at end of file
+}
diff --git a/plugins/coral-plugin-respect/index.js b/plugins/coral-plugin-respect/index.js
index ee03cf8bc..5e960976d 100644
--- a/plugins/coral-plugin-respect/index.js
+++ b/plugins/coral-plugin-respect/index.js
@@ -1,12 +1,13 @@
 const {readFileSync} = require('fs');
 const path = require('path');
+const wrapResponse = require('../../graph/helpers/response');
 
 module.exports = {
   typeDefs: readFileSync(path.join(__dirname, 'server/typeDefs.graphql'), 'utf8'),
   resolvers: {
     RootMutation: {
       createRespect(_, {respect: {item_id, item_type}}, {mutators: {Action}}) {
-        return Action.create({item_id, item_type, action_type: 'RESPECT'});
+        return wrapResponse('respect')(Action.create({item_id, item_type, action_type: 'RESPECT'}));
       }
     }
   },