updated tests, changeUsername container, etc

client/coral-embed-stream/src/components/ChangeUsername.js

@@ -2,34 +2,34 @@ import React, {Component} from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 import t from 'coral-framework/services/i18n';
-import styles from './SuspendAccount.css';
+import styles from './ChangeUsername.css';
 import {Button} from 'coral-ui';
 import validate from 'coral-framework/helpers/validate';
 import RestrictedMessageBox from 'coral-framework/components/RestrictedMessageBox';
 
-class SuspendedAccount extends Component {
+class ChangeUsername extends Component {
 
   static propTypes = {
-    canEditName: PropTypes.bool,
-    editName: PropTypes.func.isRequired,
-    currentUsername: PropTypes.string.isRequired,
+    canEditName: PropTypes.bool.isRequired,
+    changeUsername: PropTypes.func.isRequired,
+    user: PropTypes.object.isRequired,
   }
 
   state = {
     username: '',
-    alert: ''
+    alert: '',
   }
 
   onSubmitClick = (e) => {
-    const {editName} = this.props;
+    const {changeUsername, user} = this.props;
     const {username} = this.state;
     e.preventDefault();
 
-    if (username === this.props.currentUsername) {
+    if (username === this.props.user.username) {
       this.setState({alert: t('error.SAME_USERNAME_PROVIDED')});
     }
     else if (validate.username(username)) {
-      editName(username)
+      changeUsername(user.id, username)
         .then(() => location.reload())
         .catch((error) => {
           this.setState({alert: t(`error.${error.translation_key}`)});
@@ -67,14 +67,14 @@ class SuspendedAccount extends Component {
             </label>
             <input
               type='text'
-              className={cn(styles.editNameInput, 'talk-suspended-account-username-input')}
+              className={cn(styles.editNameInput, 'talk-change-username-username-input')}
               value={username}
               placeholder={t('framework.edit_name.label')}
               id='username'
               onChange={(e) => this.setState({username: e.target.value})}
               rows={3}/><br/>
             <Button
-              className="talk-suspended-account-submit-button"
+              className="talk-change-username-submit-button"
               onClick={this.onSubmitClick} >
               {t('framework.edit_name.button')}
             </Button>
@@ -84,4 +84,4 @@ class SuspendedAccount extends Component {
   }
 }
 
-export default SuspendedAccount;
+export default ChangeUsername;

client/coral-embed-stream/src/components/Stream.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import {StreamError} from './StreamError';
 import Comment from '../containers/Comment';
-import SuspendedAccount from './SuspendedAccount';
+import ChangeUsername from '../containers/ChangeUsername';
 import Slot from 'coral-framework/components/Slot';
 import InfoBox from 'talk-plugin-infobox/InfoBox';
 import {can} from 'coral-framework/services/perms';
@@ -215,6 +215,7 @@ class Stream extends React.Component {
 
     const banned = get(user, 'status.banned.status');
     const suspensionUntil = get(user, 'status.suspension.until');
+    const rejectedUsername = get(user, 'status.username.status') === 'REJECTED';
 
     const temporarilySuspended =
       user &&
@@ -262,11 +263,10 @@ class Stream extends React.Component {
                     timeago(suspensionUntil)
                   )}
                 </RestrictedMessageBox>}
-            {banned &&
-                <SuspendedAccount
+            {rejectedUsername &&
+                <ChangeUsername
                   canEditName={can(user, 'EDIT_NAME')}
-                  editName={editName}
-                  currentUsername={user.username}
+                  user={user}
                 />}
             {showCommentBox &&
                 <CommentBox

client/coral-embed-stream/src/containers/ChangeUsername.js

@@ -0,0 +1,7 @@
+import {compose} from 'react-apollo';
+import {withChangeUsername} from 'coral-framework/graphql/mutations';
+import ChangeUsername from '../components/ChangeUsername';
+
+export default compose(
+  withChangeUsername,
+)(ChangeUsername);

test/e2e/specs/04_userStatus.js

@@ -1,110 +1,118 @@
 module.exports = {
-
-   before: (client) => {
-    client.resizeWindow(1600, 1200);
-  },
-
-  afterEach: (client, done) => {
-    if (client.currentTest.results.failed) {
-      throw new Error('Test Case failed, skipping all the rest');
-    }
-    done();
-  },
-
-  after: (client) => {
-    client.end();
-  },
-
-  'admin logs in': (client) => {
-    const adminPage = client.page.admin();
-    const {testData: {admin}} = client.globals;
-
-    adminPage.navigateAndLogin(admin);
-  },
-  'admin flags user\'s username as offensive': (client) => {
-    const embedStream = client.page.embedStream();
-
-    const comments = embedStream
-      .navigate()
-      .ready();
-
-    comments
-      .waitForElementVisible('@firstComment')
-      .waitForElementVisible('@flagButton')
-      .click('@flagButton');
-
-    comments.section.flag
-      .waitForElementVisible('@flagUsernameRadio')
-      .click('@flagUsernameRadio')
-      .waitForElementVisible('@continueButton')
-      .click('@continueButton')
-      .waitForElementVisible('@offensiveUsernameRadio')
-      .click('@offensiveUsernameRadio')
-      .click('@continueButton')
-      .waitForElementVisible('@popUpText')
-      .click('@continueButton');
-  },
-  'admin goes to Reported Usernames': (client) => {
-    const adminPage = client.page.admin();
-
-    const community = adminPage
-      .navigate()
-      .ready()
-      .goToCommunity();
-
-    community
-      .waitForElementVisible('@flaggedAccountsContainer')
-      .waitForElementVisible('@flaggedUser');
-  },
-  'admin rejects the user flag': (client) => {
-    const community = client.page.admin().section.community;
-
-    community
-      .waitForElementVisible('@flaggedUserRejectButton')
-      .click('@flaggedUserRejectButton');
-  },
-  'admin suspends the user': (client) => {
-    const community = client.page.admin().section.community;
-
-    community
-      .waitForElementVisible('@usernameDialog')
-      .waitForElementVisible('@usernameDialogButtons')
-      .waitForElementVisible('@usernameDialogSuspend')
-      .click('@usernameDialogSuspend')
-      .waitForElementVisible('@usernameDialogSuspensionMessage')
-      .click('@usernameDialogSuspend')
-      .waitForElementNotPresent('@flaggedUser');
-  },
-  'admin logs out': (client) => {
-    client.page.admin().logout();
-  },
-  'user logs in': (client) => {
-    const {testData: {user}} = client.globals;
-    const embedStream = client.page.embedStream();
-
-    embedStream
-      .navigate()
-      .ready()
-      .openLoginPopup((popup) => popup.login(user));
-  },
-  'user picks another username': (client) => {
-    const embedStream = client.page.embedStream();
-    const comments = embedStream.section.comments;
-    const {testData: {user}} = client.globals;
-
-    comments
-      .waitForElementVisible('@suspendedAccountInput')
-      .setValue('@suspendedAccountInput', `${user.username}_alternative`)
-      .waitForElementVisible('@suspendedAccountSubmitButton')
-      .click('@suspendedAccountSubmitButton')
-      .waitForElementNotPresent('@suspendedAccountInput');
-  },
-  'user should not be able to comment': (client) => {
-    const embedStream = client.page.embedStream();
-    const comments = embedStream.section.comments;
-
-    comments
-      .waitForElementNotPresent('@commentBoxTextarea')
-      .waitForElementNotPresent('@commentBoxPostButton');
-  },
-};
+  
+     before: (client) => {
+      client.resizeWindow(1600, 1200);
+    },
+  
+    afterEach: (client, done) => {
+      if (client.currentTest.results.failed) {
+        throw new Error('Test Case failed, skipping all the rest');
+      }
+      done();
+    },
+  
+    after: (client) => {
+      client.end();
+    },
+  
+    'admin logs in': (client) => {
+      const adminPage = client.page.admin();
+      const {testData: {admin}} = client.globals;
+  
+      adminPage.navigateAndLogin(admin);
+    },
+    'admin flags user\'s username as offensive': (client) => {
+      const embedStream = client.page.embedStream();
+  
+      const comments = embedStream
+        .navigate()
+        .ready();
+  
+      comments
+        .waitForElementVisible('@firstComment')
+        .waitForElementVisible('@flagButton')
+        .click('@flagButton');
+  
+      comments.section.flag
+        .waitForElementVisible('@flagUsernameRadio')
+        .click('@flagUsernameRadio')
+        .waitForElementVisible('@continueButton')
+        .click('@continueButton')
+        .waitForElementVisible('@offensiveUsernameRadio')
+        .click('@offensiveUsernameRadio')
+        .click('@continueButton')
+        .waitForElementVisible('@popUpText')
+        .click('@continueButton');
+    },
+    'admin goes to Reported Usernames': (client) => {
+      const adminPage = client.page.admin();
+  
+      const community = adminPage
+        .navigate()
+        .ready()
+        .goToCommunity();
+  
+      community
+        .waitForElementVisible('@flaggedAccountsContainer')
+        .waitForElementVisible('@flaggedUser');
+    },
+    'admin rejects the user flag': (client) => {
+      const community = client.page.admin().section.community;
+  
+      community
+        .waitForElementVisible('@flaggedUserRejectButton')
+        .click('@flaggedUserRejectButton');
+    },
+    'admin suspends the user': (client) => {
+      const community = client.page.admin().section.community;
+  
+      community
+        .waitForElementVisible('@usernameDialog')
+        .waitForElementVisible('@usernameDialogButtons')
+        .waitForElementVisible('@usernameDialogSuspend')
+        .click('@usernameDialogSuspend')
+        .waitForElementVisible('@usernameDialogSuspensionMessage')
+        .click('@usernameDialogSuspend')
+        .waitForElementNotPresent('@flaggedUser');
+    },
+    'admin logs out': (client) => {
+      client.page.admin().logout();
+    },
+    'user logs in': (client) => {
+      const {testData: {user}} = client.globals;
+      const embedStream = client.page.embedStream();
+  
+      embedStream
+        .navigate()
+        .ready()
+        .openLoginPopup((popup) => popup.login(user));
+    },
+    'user account is suspended, should see restricted message box': (client) => {
+      const embedStream = client.page.embedStream();
+      const comments = embedStream.section.comments;
+  
+      comments
+        .waitForElementVisible('@restrictedMessageBox');
+    },
+    'user picks another username': (client) => {
+      const embedStream = client.page.embedStream();
+      const comments = embedStream.section.comments;
+      const {testData: {user}} = client.globals;
+  
+      comments
+        .waitForElementVisible('@suspendedAccountInput')
+        .setValue('@suspendedAccountInput', `${user.username}_alternative`)
+        .waitForElementVisible('@suspendedAccountSubmitButton')
+        .click('@suspendedAccountSubmitButton')
+        .waitForElementNotPresent('@suspendedAccountInput');
+    },
+    'user should not be able to comment': (client) => {
+      const embedStream = client.page.embedStream();
+      const comments = embedStream.section.comments;
+  
+      comments
+        .waitForElementNotPresent('@commentBoxTextarea')
+        .waitForElementNotPresent('@commentBoxPostButton');
+    },
+  };
+