Adds ban/unban to cli. Fix ban user in the admin.

client/coral-admin/src/components/BanUserDialog.js

@@ -9,9 +9,14 @@ import I18n from 'coral-framework/modules/i18n/i18n';
 import translations from '../translations';
 const lang = new I18n(translations);
 
-const BanUserDialog = ({open, handleClose, authorName}) => (
-  <Dialog className={styles.dialog} open={open} title={lang.t('bandialog.ban_user')} onClose={handleClose} onCancel={handleClose}>
-    <span className={styles.close} onClick={handleClose}>×</span>
+const BanUserDialog = ({open, handleClose, onClickBanUser, user}) => {
+  const userName = (typeof user === 'undefined') ? '' : user['userName'];
+  const userId = (typeof user === 'undefined') ? '' : user['userId'];
+  const commentId = (typeof user === 'undefined') ? '' : user['commentId'];
+
+  return (
+    <Dialog className={styles.dialog} open={open} onClose={() => handleClose()} onCancel={() => handleClose()} title={lang.t('bandialog.ban_user')}>
+    <span className={styles.close} onClick={() => handleClose()}>×</span>
       <div>
         <div className={styles.header}>
           <h3>
@@ -20,21 +25,23 @@ const BanUserDialog = ({open, handleClose, authorName}) => (
         </div>
         <div className={styles.separator}>
           <h4>
-            {lang.t('bandialog.are_you_sure', authorName)}
+            {lang.t('bandialog.are_you_sure', userName)}
           </h4>
           <i>
             {lang.t('bandialog.note')}
           </i>
         </div>
         <div className={styles.buttons}>
-          <Button cStyle="cancel" full>
+          <Button cStyle="cancel" onClick={() => handleClose()} full>
             {lang.t('bandialog.cancel')}
           </Button>
-          <Button cStyle="black" full>
+          <Button cStyle="black" onClick={() => onClickBanUser(userId, commentId)} full>
             {lang.t('bandialog.yes_ban_user')}
           </Button>
         </div>
       </div>
   </Dialog>
-);
+  );
+};
+
 export default BanUserDialog;

client/coral-admin/src/components/Comment.js

@@ -9,9 +9,6 @@ import translations from '../translations.json';
 
 import {Icon} from 'react-mdl';
 import {FabButton, Button} from 'coral-ui';
-import BanUserDialog from './BanUserDialog';
-
-import {showBanUserDialog, hideBanUserDialog} from '../actions/comments';
 
 const linkify = new Linkify();
 
@@ -53,35 +50,27 @@ export default props => {
   );
 };
 
+//return props.author.get('status') === 'banned' ? 'disabled' : 'raised';
+
 // Get the button of the action performed over a comment if any
 const getActionButton = (action, i, props) => {
   const status = props.comment.get('status');
   const flagged = props.comment.get('flagged');
+  const banned = (props.author.get('status') === 'banned');
 
   if (action === 'flag' && (status || flagged === true)) {
     return null;
   }
   if (action === 'ban') {
     return (
-      // <Button
-      //   {...props.author.get('status') === 'banned' ? 'disabled' : 'raised'}
-      //   key={i}
-      //   onClick={() => props.onClickAction(props.actionsMap[action].status, props.comment.get('id'), props.author.get('id'))}>{lang.t('comment.ban_user')}</Button>
-      <div key={i}>
-          <Button {...props.author.get('status') === 'banned' ? 'disabled' : 'raised'}
-            cStyle="black"
-            onClick={showBanUserDialog()}
-            key={i}
-            {...props} >
-            {lang.t('comment.ban_user')}
-          </Button>
-          <BanUserDialog
-            open={props.showBanUserDialog}
-            handleClose={hideBanUserDialog()}
-            authorName={props.author.get('displayName')}
-          />
-        </div>
-  );
+      <Button
+        disabled={banned ? 'disabled' : ''}
+        cStyle='black'
+        onClick={() => props.onClickShowBanDialog(props.author.get('id'), props.author.get('displayName'), props.comment.get('id'))}
+        key={i} >
+        {lang.t('comment.ban_user')}
+      </Button>
+    );
   }
   return (
     <FabButton icon={props.actionsMap[action].icon} className={styles.actionButton}

client/coral-admin/src/components/CommentList.js

@@ -20,6 +20,7 @@ export default class CommentList extends React.Component {
 
     this.state = {active: null};
     this.onClickAction = this.onClickAction.bind(this);
+    this.onClickShowBanDialog = this.onClickShowBanDialog.bind(this);
   }
 
   // remove key handlers before leaving
@@ -113,6 +114,10 @@ export default class CommentList extends React.Component {
     this.props.onClickAction(action, id, author_id);
   }
 
+  onClickShowBanDialog(userId, userName, commentId) {
+    this.props.onClickShowBanDialog(userId, userName, commentId);
+  }
+
   render () {
     const {singleView, commentIds, comments, users, hideActive, key} = this.props;
     const {active} = this.state;
@@ -127,6 +132,7 @@ export default class CommentList extends React.Component {
             key={index}
             index={index}
             onClickAction={this.onClickAction}
+            onClickShowBanDialog={this.onClickShowBanDialog}
             actions={this.props.actions}
             actionsMap={actions}
             isActive={commentId === active}