blocked user actions in username change process

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

@@ -5,8 +5,9 @@ import Slot from 'coral-framework/components/Slot';
 import FlagLabel from 'coral-ui/components/FlagLabel';
 import cn from 'classnames';
 import styles from './CommentLabels.css';
+import { ADMIN, MODERATOR, STAFF } from 'coral-framework/constants/roles';
 
-const staffRoles = ['ADMIN', 'STAFF', 'MODERATOR'];
+const staffRoles = [ADMIN, MODERATOR, STAFF];
 
 function isUserFlagged(actions) {
   return actions.some(

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

@@ -10,6 +10,12 @@ import ActionsMenu from 'coral-admin/src/components/ActionsMenu';
 import ActionsMenuItem from 'coral-admin/src/components/ActionsMenuItem';
 import { isSuspended, isBanned } from 'coral-framework/utils/user';
 import moment from 'moment';
+import {
+  ADMIN,
+  COMMENTER,
+  MODERATOR,
+  STAFF,
+} from 'coral-framework/constants/roles';
 
 const headers = [
   {
@@ -200,19 +206,19 @@ class People extends React.Component {
                             onChange={role => setUserRole(user.id, role)}
                           >
                             <Option
-                              value={'COMMENTER'}
+                              value={COMMENTER}
                               label={t('community.commenter')}
                             />
                             <Option
-                              value={'STAFF'}
+                              value={STAFF}
                               label={t('community.staff')}
                             />
                             <Option
-                              value={'MODERATOR'}
+                              value={MODERATOR}
                               label={t('community.moderator')}
                             />
                             <Option
-                              value={'ADMIN'}
+                              value={ADMIN}
                               label={t('community.admin')}
                             />
                           </Dropdown>

client/coral-embed-stream/src/graphql/index.js

@@ -6,6 +6,7 @@ import {
   removeCommentFromEmbedQuery,
 } from './utils';
 import { mapLeaves } from 'coral-framework/utils';
+import { ADMIN, MODERATOR } from 'coral-framework/constants/roles';
 
 export default {
   fragments: {
@@ -195,7 +196,7 @@ export default {
           { mutationResult: { data: { createComment: { comment } } } }
         ) => {
           if (
-            (!['ADMIN', 'MODERATOR'].includes(prev.me.role) &&
+            (![ADMIN, MODERATOR].includes(prev.me.role) &&
               prev.asset.settings.moderation === 'PRE') ||
             comment.status === 'PREMOD' ||
             comment.status === 'REJECTED' ||

client/coral-embed-stream/src/tabs/stream/components/Comment.js

@@ -31,8 +31,9 @@ import {
 import t from 'coral-framework/services/i18n';
 import CommentContainer from '../containers/Comment';
 import { CommentAuthorName } from 'coral-framework/components';
+import { STAFF } from 'coral-framework/constants/roles';
 
-const isStaff = tags => !tags.every(t => t.tag.name !== 'STAFF');
+const isStaff = tags => !tags.every(t => t.tag.name !== STAFF);
 const hasTag = (tags, lookupTag) =>
   !!tags.filter(t => t.tag.name === lookupTag).length;
 const hasComment = (nodes, id) => nodes.some(node => node.id === id);
@@ -429,7 +430,7 @@ export default class Comment extends React.Component {
      * classnames is an array of objects with key as classnames and value as conditions
      * i.e:
      * {
-     *  'myClassName': { tags: ['STAFF']}
+     *  'myClassName': { tags: [STAFF]}
      * }
      *
      * This will add myClassName to comments tagged with STAFF TAG.

client/coral-framework/constants/roles.js

@@ -0,0 +1,4 @@
+export const ADMIN = 'ADMIN';
+export const COMMENTER = 'COMMENTER';
+export const MODERATOR = 'MODERATOR';
+export const STAFF = 'STAFF';

client/coral-framework/constants/usernameStatus.js

@@ -0,0 +1,22 @@
+// UNSET is used when the username can be changed, and does not necessarily
+// require moderator action to become active. This can be used when the user
+// signs up with a social login and has the option of setting their own
+// username.
+export const UNSET = 'UNSET';
+
+// SET is used when the username has been set for the first time, but cannot
+// change without the username being rejected by a moderator and that moderator
+// agreeing that the username should be allowed to change.
+export const SET = 'SET';
+
+// APPROVED is used when the username was changed, and subsequently approved by
+// said moderator.
+export const APPROVED = 'APPROVED';
+
+// REJECTED is used when the username was changed, and subsequently rejected by
+// said moderator.
+export const REJECTED = 'REJECTED';
+
+// CHANGED is used after a user has changed their username after it was
+// rejected.
+export const CHANGED = 'CHANGED';

client/coral-framework/services/perms.js

@@ -1,4 +1,7 @@
 import get from 'lodash/get';
+import includes from 'lodash/includes';
+import { ADMIN, MODERATOR, STAFF } from '../constants/roles';
+import { UNSET, REJECTED, CHANGED } from '../constants/usernameStatus';
 
 // =========================================================================
 // BASIC PERMISSIONS
@@ -6,15 +9,18 @@ import get from 'lodash/get';
 
 const basicPerms = {
   INTERACT_WITH_COMMUNITY: user => {
+    const usernameChangeInProgress = includes(
+      [UNSET, REJECTED, CHANGED],
+      get(user, 'status.username.status')
+    );
     const banned = get(user, 'status.banned.status');
     const suspensionUntil = get(user, 'status.suspension.until');
     const suspended = suspensionUntil && new Date(suspensionUntil) > new Date();
 
-    return !banned && !suspended;
+    return !usernameChangeInProgress && !banned && !suspended;
   },
   EDIT_NAME: user => {
-    const usernameStatus = user.status.username.status;
-    return usernameStatus === 'UNSET' || usernameStatus === 'REJECTED';
+    return includes([UNSET, REJECTED], get(user, 'status.username.status'));
   },
 };
 
@@ -23,18 +29,18 @@ const basicPerms = {
 // =========================================================================
 
 const basicRoles = {
-  HAS_STAFF_TAG: ['ADMIN', 'MODERATOR', 'STAFF'],
+  HAS_STAFF_TAG: [ADMIN, MODERATOR, STAFF],
 };
 
 const queryRoles = {
-  UPDATE_CONFIG: ['ADMIN'],
-  ACCESS_ADMIN: ['ADMIN', 'MODERATOR'],
-  VIEW_USER_EMAILS: ['ADMIN'],
+  UPDATE_CONFIG: [ADMIN],
+  ACCESS_ADMIN: [ADMIN, MODERATOR],
+  VIEW_USER_EMAILS: [ADMIN],
 };
 
 const mutationRoles = {
-  CHANGE_ROLES: ['ADMIN'],
-  MODERATE_COMMENTS: ['ADMIN', 'MODERATOR'],
+  CHANGE_ROLES: [ADMIN],
+  MODERATE_COMMENTS: [ADMIN, MODERATOR],
 };
 
 const roles = { ...basicRoles, ...queryRoles, ...mutationRoles };