banUser and unBanUser - removing setUserStatus

client/coral-admin/src/routes/Community/components/People.js

@@ -18,8 +18,7 @@ const People = (props) => {
     totalPages,
     page,
     setRole,
-    banUser,
-    unBanUser,
+    setUserBanStatus,
     viewUserDetail,
   } = props;
 
@@ -47,8 +46,7 @@ const People = (props) => {
               users={users}
               setRole={setRole}
               viewUserDetail={viewUserDetail}
-              banUser={banUser}
-              unBanUser={unBanUser}
+              setUserBanStatus={setUserBanStatus}
               onHeaderClickHandler={onHeaderClickHandler}
               pageCount={totalPages}
               onPageChange={onPageChange}
@@ -69,8 +67,7 @@ People.propTypes = {
   onSearchChange: PropTypes.func,
   totalPages: PropTypes.number,
   onPageChange: PropTypes.func,
-  banUser: PropTypes.func.isRequired,
-  unBanUser: PropTypes.func.isRequired,
+  setUserBanStatus: PropTypes.func.isRequired,
   setRole: PropTypes.func.isRequired,
   viewUserDetail: PropTypes.func.isRequired,
 };

client/coral-admin/src/routes/Community/components/Table.js

@@ -23,84 +23,75 @@ const headers = [
     field: 'role'
   }
 ];
-
-const Table = ({users, setRole, onHeaderClickHandler, banUser, unBanUser, viewUserDetail, pageCount, page, onPageChange}) => {
-
-  const getStatus = (status) => {
-    return status.banned.status ? 'BANNED' : 'ACTIVE';
-  };
-
-  const setUserBanStatus = (id, bannedStatus) => {
-    return bannedStatus ? unBanUser(id) : banUser(id);
-  };
-
-  return (
-    <div>
-      <table className={`mdl-data-table ${styles.dataTable}`}>
-        <thead>
-          <tr>
-            {headers.map((header, i) =>(
-              <th
-                key={i}
-                className={cn('mdl-data-table__cell--non-numeric', styles.header)}
-                scope="col"
-                onClick={() => onHeaderClickHandler({field: header.field})}>
-                {header.title}
-              </th>
-            ))}
-          </tr>
-        </thead>
-        <tbody>
-          {users.map((row, i)=> (
-            <tr key={i} className="talk-admin-community-people-row">
-              <td className="mdl-data-table__cell--non-numeric">
-                <button onClick={() => {viewUserDetail(row.id);}} className={cn(styles.username, styles.button)}>{row.username}</button>
-                <span className={styles.email}>{row.profiles.map(({id}) => id)}</span>
-              </td>
-              <td className="mdl-data-table__cell--non-numeric">
-                {row.created_at}
-              </td>
-              <td className="mdl-data-table__cell--non-numeric">
-                <Dropdown
-                  containerClassName="talk-admin-community-people-dd-status"
-                  value={getStatus(row.status)}
-                  placeholder={t('community.status')}
-                  onChange={(status) => setUserBanStatus(row.id, status === 'BANNED')}>
-                  <Option value={'ACTIVE'} label={t('community.active')} />
-                  <Option value={'BANNED'} label={t('community.banned')} />
-                </Dropdown>
-              </td>
-              <td className="mdl-data-table__cell--non-numeric">
-                <Dropdown
-                  containerClassName="talk-admin-community-people-dd-role"
-                  value={row.roles[0] || ''}
-                  placeholder={t('community.role')}
-                  onChange={(role) => setRole(row.id, role)}>
-                  <Option value={''} label={t('community.none')} />
-                  <Option value={'STAFF'} label={t('community.staff')} />
-                  <Option value={'MODERATOR'} label={t('community.moderator')} />
-                  <Option value={'ADMIN'} label={t('community.admin')} />
-                </Dropdown>
-              </td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-      <Paginate
-        pageCount={pageCount}
-        page={page - 1}
-        onPageChange={onPageChange}
-      />
-    </div>
-  );
+const getStatus = (status) => {
+  return status.banned.status ? 'BANNED' : 'ACTIVE';
 };
 
+const Table = ({users, setRole, onHeaderClickHandler, setUserBanStatus, viewUserDetail, pageCount, page, onPageChange}) => (
+  <div>
+    <table className={`mdl-data-table ${styles.dataTable}`}>
+      <thead>
+        <tr>
+          {headers.map((header, i) =>(
+            <th
+              key={i}
+              className={cn('mdl-data-table__cell--non-numeric', styles.header)}
+              scope="col"
+              onClick={() => onHeaderClickHandler({field: header.field})}>
+              {header.title}
+            </th>
+          ))}
+        </tr>
+      </thead>
+      <tbody>
+        {users.map((row, i)=> (
+          <tr key={i} className="talk-admin-community-people-row">
+            <td className="mdl-data-table__cell--non-numeric">
+              <button onClick={() => {viewUserDetail(row.id);}} className={cn(styles.username, styles.button)}>{row.username}</button>
+              <span className={styles.email}>{row.profiles.map(({id}) => id)}</span>
+            </td>
+            <td className="mdl-data-table__cell--non-numeric">
+              {row.created_at}
+            </td>
+            <td className="mdl-data-table__cell--non-numeric">
+              <Dropdown
+                containerClassName="talk-admin-community-people-dd-status"
+                value={getStatus(row.status)}
+                placeholder={t('community.status')}
+                onChange={(status) => setUserBanStatus(row.id, status === 'BANNED')}>
+                <Option value={'ACTIVE'} label={t('community.active')} />
+                <Option value={'BANNED'} label={t('community.banned')} />
+              </Dropdown>
+            </td>
+            <td className="mdl-data-table__cell--non-numeric">
+              <Dropdown
+                containerClassName="talk-admin-community-people-dd-role"
+                value={row.roles[0] || ''}
+                placeholder={t('community.role')}
+                onChange={(role) => setRole(row.id, role)}>
+                <Option value={''} label={t('community.none')} />
+                <Option value={'STAFF'} label={t('community.staff')} />
+                <Option value={'MODERATOR'} label={t('community.moderator')} />
+                <Option value={'ADMIN'} label={t('community.admin')} />
+              </Dropdown>
+            </td>
+          </tr>
+        ))}
+      </tbody>
+    </table>
+    <Paginate
+      pageCount={pageCount}
+      page={page - 1}
+      onPageChange={onPageChange}
+    />
+  </div>
+);
+
 Table.propTypes = {
   users: PropTypes.array,
   onHeaderClickHandler: PropTypes.func.isRequired,
   setRole: PropTypes.func.isRequired,
-  banUser: PropTypes.func.isRequired,
-  unBanUser: PropTypes.func.isRequired,
+  setUserBanStatus: PropTypes.func.isRequired,
   viewUserDetail: PropTypes.func.isRequired,
   pageCount: PropTypes.number.isRequired,
   page: PropTypes.number.isRequired,

client/coral-admin/src/routes/Community/containers/People.js

@@ -4,7 +4,7 @@ import {bindActionCreators} from 'redux';
 import {compose} from 'react-apollo';
 import People from '../components/People';
 import PropTypes from 'prop-types';
-import {withSetUserBanStatus} from 'coral-framework/graphql/mutations';
+import {withUnBanUser, withBanUser} from 'coral-framework/graphql/mutations';
 
 import {viewUserDetail} from '../../../actions/userDetail';
 
@@ -63,8 +63,9 @@ class PeopleContainer extends React.Component {
     this.fetchUsers({page});
   }
 
-  setUserBanStatus = async (input) => {
-    await this.props.setUserBanStatus(input);
+  setUserBanStatus = async (id, bannedStatus) => {
+    const {banUser, unBanUser} = this.props;
+    await bannedStatus ? banUser({id, message: ''}) : unBanUser({id});
     this.fetchUsers();
   } 
 
@@ -89,7 +90,8 @@ PeopleContainer.propTypes = {
   fetchUsers: PropTypes.func,
   updateSorting: PropTypes.func,
   setRole: PropTypes.func.isRequired,
-  setUserBanStatus: PropTypes.func.isRequired,
+  banUser: PropTypes.func.isRequired,
+  unBanUser: PropTypes.func.isRequired,
   setSearchValue: PropTypes.func.isRequired,
   viewUserDetail: PropTypes.func.isRequired,
   community: PropTypes.object,
@@ -108,5 +110,6 @@ const mapDispatchToProps = (dispatch) =>
 
 export default compose(
   connect(null, mapDispatchToProps),
-  withSetUserBanStatus,
+  withBanUser,
+  withUnBanUser,
 )(PeopleContainer);

client/coral-framework/graphql/fragments.js

@@ -4,7 +4,8 @@ import {createDefaultResponseFragments} from '../utils';
 export default {
   ...createDefaultResponseFragments(
     'ChangeUsernameResponse',
-    'SetUserBanStatusResponse',
+    'BanUsersResponse',
+    'UnBanUserResponse',
     'SetUserSuspensionStatusResponse',
     'SetCommentStatusResponse',
     'SuspendUserResponse',

plugin-api/beta/client/hocs/index.js

@@ -7,7 +7,8 @@ export {default as connect} from 'coral-framework/hocs/connect';
 export {default as withEmit} from 'coral-framework/hocs/withEmit';
 export {
   withIgnoreUser,
-  withSetUserBanStatus,
+  withBanUser,
+  withUnBanUser,
   withStopIgnoringUser,
   withSetCommentStatus,
 } from 'coral-framework/graphql/mutations';

plugins/talk-plugin-moderation-actions/client/containers/BanUserDialog.js

@@ -5,7 +5,7 @@ import {compose} from 'react-apollo';
 import {bindActionCreators} from 'redux';
 import {closeBanDialog, closeMenu} from '../actions';
 import {notify} from 'plugin-api/beta/client/actions/notification';
-import {connect, withSetCommentStatus, withSetUserBanStatus} from 'plugin-api/beta/client/hocs';
+import {connect, withSetCommentStatus, withBanUser} from 'plugin-api/beta/client/hocs';
 import {getErrorMessages} from 'plugin-api/beta/client/utils';
 import BanUserDialog from '../components/BanUserDialog';
 
@@ -20,11 +20,11 @@ class BanUserDialogContainer extends React.Component {
       closeMenu,
       closeBanDialog,
       setCommentStatus,
-      setUserBanStatus
+      banUser,
     } = this.props;
 
     try {
-      await setUserBanStatus({
+      await banUser({
         id: authorId,
         status: true,
       });
@@ -76,7 +76,7 @@ const mapDispatchToProps = (dispatch) =>
 const enhance = compose(
   connect(mapStateToProps, mapDispatchToProps),
   withSetCommentStatus,
-  withSetUserBanStatus
+  withBanUser,
 );
 
 export default enhance(BanUserDialogContainer);