From 8563ddffd35fa91085742260654f0846a5a2f9a4 Mon Sep 17 00:00:00 2001 From: okbel Date: Wed, 11 Apr 2018 23:55:50 -0300 Subject: [PATCH] Adding functionality and design functionality --- .../coral-admin/src/components/ActionsMenu.js | 2 +- .../coral-admin/src/components/UserDetail.js | 75 +++++++++++++++---- .../coral-admin/src/containers/UserDetail.js | 6 +- client/coral-framework/utils/user.js | 30 +++++++- 4 files changed, 94 insertions(+), 19 deletions(-) diff --git a/client/coral-admin/src/components/ActionsMenu.js b/client/coral-admin/src/components/ActionsMenu.js index 81b857a13..52370f9a7 100644 --- a/client/coral-admin/src/components/ActionsMenu.js +++ b/client/coral-admin/src/components/ActionsMenu.js @@ -76,7 +76,7 @@ ActionsMenu.propTypes = { icon: PropTypes.string, children: PropTypes.node, className: PropTypes.string, - label: PropTypes.string, + label: PropTypes.oneOfType([PropTypes.node, PropTypes.string]), buttonClassNames: PropTypes.string, }; diff --git a/client/coral-admin/src/components/UserDetail.js b/client/coral-admin/src/components/UserDetail.js index b917d81eb..a6684a04d 100644 --- a/client/coral-admin/src/components/UserDetail.js +++ b/client/coral-admin/src/components/UserDetail.js @@ -10,6 +10,9 @@ import { getReliability, isSuspended, isBanned, + isUsernameRejected, + isUsernameChanged, + getActiveStatuses, } from 'coral-framework/utils/user'; import ButtonCopyToClipboard from './ButtonCopyToClipboard'; import ClickOutside from 'coral-framework/components/ClickOutside'; @@ -26,6 +29,7 @@ import ActionsMenu from 'coral-admin/src/components/ActionsMenu'; import ActionsMenuItem from 'coral-admin/src/components/ActionsMenuItem'; import UserInfoTooltip from './UserInfoTooltip'; import t from 'coral-framework/services/i18n'; +import flatten from 'lodash/flatten'; class UserDetail extends React.Component { rejectThenReload = async info => { @@ -84,18 +88,43 @@ class UserDetail extends React.Component { ); } - getActionMenuLabel() { - const { root: { user } } = this.props; + getActionMenuLabel(user) { + const activeStatuses = getActiveStatuses(user); + const count = activeStatuses.length; - if (isBanned(user)) { - return 'Banned'; - } else if (isSuspended(user)) { - return 'Suspended'; + if (count > 1) { + return `Status(${count})`; + } else { + const activeStatus = flatten(activeStatuses)[0]; + + switch (activeStatus) { + case 'suspended': + return Suspended; + case 'banned': + return Banned; + case 'usernameRejected': + return ( + + Username + + ); + case 'usernameChanged': + return ( + + Username + + ); + default: + return activeStatus; + } } - - return ''; } + goToReportedUsernames = () => { + const { router } = this.props; + router.push('/admin/community/flagged'); + }; + renderLoaded() { const { root, @@ -122,8 +151,8 @@ class UserDetail extends React.Component { const banned = isBanned(user); const suspended = isSuspended(user); - - console.log(user); + const usernameRejected = isUsernameRejected(user); + const usernameChanged = isUsernameChanged(user); const slotPassthrough = { root, @@ -156,12 +185,8 @@ class UserDetail extends React.Component { }, 'talk-admin-user-detail-actions-button' )} - label={this.getActionMenuLabel()} + label={this.getActionMenuLabel(user)} > - rejectUsername({ id: user.id })}> - Reject Username - - {suspended ? ( unsuspendUser({ id: user.id })}> {t('user_detail.remove_suspension')} @@ -174,6 +199,7 @@ class UserDetail extends React.Component { {t('user_detail.suspend')} )} + {banned ? ( unbanUser({ id: user.id })}> {t('user_detail.remove_ban')} @@ -186,6 +212,24 @@ class UserDetail extends React.Component { {t('user_detail.ban')} )} + + {usernameChanged && ( + + Username needs approval + + )} + + {usernameRejected && !usernameChanged ? ( + + Username Rejected + + ) : ( + rejectUsername({ id: user.id })} + > + Reject Username + + )} )} @@ -361,6 +405,7 @@ class UserDetail extends React.Component { } UserDetail.propTypes = { + router: PropTypes.object.isRequired, userId: PropTypes.string.isRequired, hideUserDetail: PropTypes.func.isRequired, root: PropTypes.object.isRequired, diff --git a/client/coral-admin/src/containers/UserDetail.js b/client/coral-admin/src/containers/UserDetail.js index 2046f9c74..38a610880 100644 --- a/client/coral-admin/src/containers/UserDetail.js +++ b/client/coral-admin/src/containers/UserDetail.js @@ -5,6 +5,7 @@ import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import UserDetail from '../components/UserDetail'; import withQuery from 'coral-framework/hocs/withQuery'; +import { withRouter } from 'react-router'; import { getDefinitionName, getSlotFragmentSpreads, @@ -21,12 +22,12 @@ import { withSetCommentStatus, withUnbanUser, withUnsuspendUser, + withRejectUsername, } from 'coral-framework/graphql/mutations'; import UserDetailComment from './UserDetailComment'; import update from 'immutability-helper'; import { showBanUserDialog } from 'actions/banUserDialog'; import { showSuspendUserDialog } from 'actions/suspendUserDialog'; -import { withRejectUsername } from '../../../coral-framework/graphql/mutations'; const commentConnectionFragment = gql` fragment CoralAdmin_UserDetail_CommentConnection on CommentConnection { @@ -285,5 +286,6 @@ export default compose( withSetCommentStatus, withUnbanUser, withUnsuspendUser, - withRejectUsername + withRejectUsername, + withRouter )(UserDetailContainer); diff --git a/client/coral-framework/utils/user.js b/client/coral-framework/utils/user.js index 63a552110..c6b2ba83d 100644 --- a/client/coral-framework/utils/user.js +++ b/client/coral-framework/utils/user.js @@ -1,4 +1,6 @@ import get from 'lodash/get'; +import mapValues from 'lodash/mapValues'; +import toPairs from 'lodash/toPairs'; /** * getReliability @@ -40,5 +42,31 @@ export const isBanned = user => { */ export const isUsernameRejected = user => { - return get(user, 'state.status.username.status'); + return get(user, 'state.status.username.status') === 'REJECTED'; +}; + +/** + * isUsernameChanged + * retrieves boolean based on the username status + */ + +export const isUsernameChanged = user => { + return get(user, 'state.status.username.status') === 'CHANGED'; +}; + +/** + * getActiveStatuses + * returns an array of active status(es) + * i.e if suspension is active, it returns suspension + */ + +export const getActiveStatuses = user => { + const statusMap = { + suspended: isSuspended, + banned: isBanned, + usernameRejected: isUsernameRejected, + usernameChanged: isUsernameChanged, + }; + + return toPairs(mapValues(statusMap, fn => fn(user))).filter(x => x[1]); };