diff --git a/client/coral-admin/src/components/UserDetail.css b/client/coral-admin/src/components/UserDetail.css index d7bf541da..d4c29559c 100644 --- a/client/coral-admin/src/components/UserDetail.css +++ b/client/coral-admin/src/components/UserDetail.css @@ -174,14 +174,14 @@ display: inline-block; } +.actionsMenuSuspended { + background-color: #F29336; + border-color: #F29336; + color: white; +} + .actionsMenuBanned { background-color: #E45241; border-color: #E45241; color: white; } - -.actionsMenuSuspended { - background-color: #F29336; - border-color: #F29336; - color: white; -} \ No newline at end of file diff --git a/client/coral-admin/src/components/UserDetail.js b/client/coral-admin/src/components/UserDetail.js index 5bf47c760..4a1814000 100644 --- a/client/coral-admin/src/components/UserDetail.js +++ b/client/coral-admin/src/components/UserDetail.js @@ -91,6 +91,18 @@ class UserDetail extends React.Component { ); } + getActionMenuLabel() { + const {root: {user}} = this.props; + + if (user.status === 'BANNED') { + return 'Banned'; + } else if (user.suspension.until && new Date(user.suspension.until) > new Date()) { + return 'Suspended'; + } else { + return ''; + } + } + renderLoaded() { const { data, @@ -117,6 +129,11 @@ class UserDetail extends React.Component { rejectedPercent = 0; } + const suspended = + user && + user.suspension.until && + new Date(user.suspension.until) > new Date(); + return ( @@ -129,12 +146,12 @@ class UserDetail extends React.Component { icon="person" className={cn(styles.actionsMenu, 'talk-admin-user-detail-actions-menu')} buttonClassNames={cn({ - [styles.actionsMenuSuspended]: user.status === 'SUSPENDED', + [styles.actionsMenuSuspended]: suspended, [styles.actionsMenuBanned]: user.status === 'BANNED', }, 'talk-admin-user-detail-actions-button')} - label={user.status !== 'ACTIVE' ? capitalize(user.status) : ''}> + label={this.getActionMenuLabel()}> - {user.status === 'SUSPENDED' && Remove Suspension } @@ -144,7 +161,7 @@ class UserDetail extends React.Component { Remove Ban } - {user.status !== 'SUSPENDED' && Suspend User } diff --git a/client/coral-admin/src/containers/UserDetail.js b/client/coral-admin/src/containers/UserDetail.js index ca907d098..75d2bd354 100644 --- a/client/coral-admin/src/containers/UserDetail.js +++ b/client/coral-admin/src/containers/UserDetail.js @@ -150,6 +150,9 @@ export const withUserDetailQuery = withQuery(gql` flagger } status + suspension { + until + } ${getSlotFragmentSpreads(slots, 'user')} } totalComments: commentCount(query: {author_id: $author_id, statuses: []})