From d51b6b31f666291fdd66bf5b54fbe418d5019016 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 6 Nov 2017 23:53:19 -0300
Subject: [PATCH] Adding missing classes and proptypes

---
 .../client/components/ApproveCommentAction.js       | 12 ++++++++++--
 .../client/components/BanUserAction.js              | 11 +++++++++--
 .../client/components/Menu.js                       | 10 +++++++++-
 .../client/components/ModerationActions.js          | 13 ++++++++++++-
 .../client/components/RejectCommentAction.js        |  9 ++++++++-
 5 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js b/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
index f683acae6..125a3589e 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/ApproveCommentAction.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './styles.css';
 import {t} from 'plugin-api/beta/client/services';
 import {Icon} from 'plugin-api/beta/client/components/ui';
@@ -6,16 +7,23 @@ import cn from 'classnames';
 
 const isApproved = (status) => (status === 'ACCEPTED');
 
-export default ({approveComment, comment: {status}}) => (
+const ApproveCommentAction = ({approveComment, comment: {status}}) => (
   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}>
+    <button className={cn(styles.button, 'talk-plugin-moderation-actions-approve')} onClick={approveComment}>
       <Icon name="done" className={styles.icon} />
       {t('talk-plugin-moderation-actions.approve_comment')}
     </button>
   )
 );
+
+ApproveCommentAction.propTypes = {
+  approveComment: PropTypes.func,
+  comment: PropTypes.object,
+};
+
+export default ApproveCommentAction;
\ No newline at end of file
diff --git a/plugins/talk-plugin-moderation-actions/client/components/BanUserAction.js b/plugins/talk-plugin-moderation-actions/client/components/BanUserAction.js
index 36f9b1489..75956a0b6 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/BanUserAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/BanUserAction.js
@@ -1,14 +1,21 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './styles.css';
 import {t} from 'plugin-api/beta/client/services';
 import {Icon} from 'plugin-api/beta/client/components/ui';
 import cn from 'classnames';
 
-export default ({onBanUser}) => (
+const BanUserAction = ({onBanUser}) => (
   <button 
-    className={cn(styles.button, 'talk-plugin-moderation-actions-reject')}
+    className={cn(styles.button, 'talk-plugin-moderation-actions-ban')}
     onClick={onBanUser} >
     <Icon name="block" className={styles.icon} />
     {t('talk-plugin-moderation-actions.ban_user')}
   </button>
 );
+
+BanUserAction.propTypes = {
+  onBanUser: PropTypes.func,
+};
+
+export default BanUserAction;
diff --git a/plugins/talk-plugin-moderation-actions/client/components/Menu.js b/plugins/talk-plugin-moderation-actions/client/components/Menu.js
index 470349b69..29120423e 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/Menu.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/Menu.js
@@ -1,9 +1,10 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import styles from './Menu.css';
 import {t} from 'plugin-api/beta/client/services';
 
-export default ({className = '', children}) => (
+const Menu = ({className = '', children}) => (
   <div className={cn(styles.menu, className)}>
     <h3 className={styles.headline}>
       {t('talk-plugin-moderation-actions.moderation_actions')}
@@ -11,3 +12,10 @@ export default ({className = '', children}) => (
     {children}
   </div>
 );
+
+Menu.propTypes = {
+  className: PropTypes.string,
+  children: PropTypes.node,
+};
+
+export default Menu;
diff --git a/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js b/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
index fa12500de..e27626298 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/ModerationActions.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import Menu from './Menu';
 import styles from './ModerationActions.css';
@@ -21,7 +22,7 @@ export default class ModerationActions extends React.Component {
               <Icon name="keyboard_arrow_down" className={styles.icon} />}
           </span>
           {menuVisible && (
-            <Menu>
+            <Menu className="talk-plugin-modetarion-actions-menu">
               <Slot
                 className="talk-plugin-modetarion-actions-slot"
                 fill="moderationActions"
@@ -38,3 +39,13 @@ export default class ModerationActions extends React.Component {
     );
   }
 }
+
+ModerationActions.propTypes = {
+  comment: PropTypes.object,
+  root: PropTypes.object,
+  asset: PropTypes.object,
+  data: PropTypes.object,
+  menuVisible: PropTypes.bool,
+  toogleMenu: PropTypes.func,
+  hideMenu: PropTypes.func,
+};
diff --git a/plugins/talk-plugin-moderation-actions/client/components/RejectCommentAction.js b/plugins/talk-plugin-moderation-actions/client/components/RejectCommentAction.js
index 827820a7a..48a31c864 100644
--- a/plugins/talk-plugin-moderation-actions/client/components/RejectCommentAction.js
+++ b/plugins/talk-plugin-moderation-actions/client/components/RejectCommentAction.js
@@ -1,12 +1,19 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import styles from './styles.css';
 import {t} from 'plugin-api/beta/client/services';
 import {Icon} from 'plugin-api/beta/client/components/ui';
 
-export default ({rejectComment}) => (
+const RejectCommentAction = ({rejectComment}) => (
   <button className={cn(styles.button, 'talk-plugin-moderation-actions-reject')} onClick={rejectComment}>
     <Icon name="clear" className={styles.icon} />
     {t('talk-plugin-moderation-actions.reject_comment')}
   </button>
 );
+
+RejectCommentAction.propTypes = {
+  rejectComment: PropTypes.func,
+};
+
+export default RejectCommentAction;