From 88861754f175f20404f1a10dc5c6b6286d088186 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 8 May 2017 18:05:54 -0300
Subject: [PATCH] Adding full example with translations

---
 .../coral-plugin-love/client/LoveButton.js    | 27 +++++++++++++------
 .../client/translations.json                  |  8 +++---
 2 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/plugins/coral-plugin-love/client/LoveButton.js b/plugins/coral-plugin-love/client/LoveButton.js
index 667c32a79..260c5fc99 100644
--- a/plugins/coral-plugin-love/client/LoveButton.js
+++ b/plugins/coral-plugin-love/client/LoveButton.js
@@ -1,12 +1,20 @@
 import React from 'react';
-import withReaction from 'coral-framework/hocs/withReaction';
-import styles from './styles.css';
 import {Icon} from 'coral-ui';
+import styles from './styles.css';
+import {I18n} from 'coral-framework';
+import translations from './translations.json';
+import withReaction from 'coral-framework/hocs/withReaction';
+const lang = new I18n(translations);
 
 class LoveButton extends React.Component {
   handleClick = () => {
-    const { postReaction, deleteReaction, showSignInDialog, reactionSummary} = this.props;
-    const { root: { me }, comment } = this.props;
+    const {
+      postReaction,
+      deleteReaction,
+      showSignInDialog,
+      reactionSummary
+    } = this.props;
+    const {root: {me}, comment} = this.props;
 
     // If the current user does not exist, trigger sign in dialog.
     if (!me) {
@@ -29,13 +37,16 @@ class LoveButton extends React.Component {
   render() {
     const {count, reactionSummary} = this.props;
     return (
-      <button className={`${styles.button} ${reactionSummary? styles.loved : ''}`} onClick={this.handleClick}>
-        <span>Love</span>
-        <Icon name="favorite"/>
+      <button
+        className={`${styles.button} ${reactionSummary ? styles.loved : ''}`}
+        onClick={this.handleClick}
+      >
+        <span>{lang.t(reactionSummary ? 'loved' : 'love')}</span>
+        <Icon name="favorite" />
         <span>{count > 0 && count}</span>
       </button>
     );
   }
 }
 
-export default withReaction('love')(LoveButton);
\ No newline at end of file
+export default withReaction('love')(LoveButton);
diff --git a/plugins/coral-plugin-love/client/translations.json b/plugins/coral-plugin-love/client/translations.json
index 93d73d3a2..a015efa77 100644
--- a/plugins/coral-plugin-love/client/translations.json
+++ b/plugins/coral-plugin-love/client/translations.json
@@ -1,10 +1,10 @@
 {
   "en": {
-    "like": "Like",
-    "liked": "Liked"
+    "love": "Love",
+    "loved": "Loved"
   },
   "es": {
-    "like": "Me Gusta",
-    "liked": "Me Gustó"
+    "love": "Amo",
+    "loved": "Amé"
   }
 }