Merge branch 'master' into change-pass-error-bug

plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js

@@ -18,10 +18,18 @@ class ChangeEmailContentDialog extends React.Component {
 
   confirmChanges = async e => {
     e.preventDefault();
+
+    if (this.formHasError()) {
+      this.showError();
+      return;
+    }
+
     await this.props.save();
     this.props.next();
   };
 
+  formHasError = () => this.props.hasError('confirmPassword');
+
   render() {
     return (
       <div>
@@ -53,18 +61,17 @@ class ChangeEmailContentDialog extends React.Component {
               type="password"
               onChange={this.props.onChange}
               defaultValue=""
-              hasError={
-                !this.props.formData.confirmPassword && this.state.showError
-              }
-              errorMsg={t(
-                'talk-plugin-local-auth.change_email.incorrect_password'
-              )}
+              hasError={this.props.hasError('confirmPassword')}
+              errorMsg={this.props.getError('confirmPassword')}
               showError={this.state.showError}
               columnDisplay
-              showSuccess={false}
             />
             <div className={styles.bottomActions}>
-              <Button className={styles.cancel} onClick={this.props.cancel}>
+              <Button
+                className={styles.cancel}
+                onClick={this.props.cancel}
+                type="button"
+              >
                 {t('talk-plugin-local-auth.change_email.cancel')}
               </Button>
               <Button className={styles.confirmChanges} type="submit">
@@ -85,6 +92,8 @@ ChangeEmailContentDialog.propTypes = {
   onChange: PropTypes.func,
   formData: PropTypes.object,
   email: PropTypes.string,
+  hasError: PropTypes.func,
+  getError: PropTypes.func,
 };
 
 export default ChangeEmailContentDialog;

plugins/talk-plugin-local-auth/client/components/ChangePassword.js

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
 import styles from './ChangePassword.css';
-import { Button } from 'plugin-api/beta/client/components/ui';
+import { Button, BareButton } from 'plugin-api/beta/client/components/ui';
 import validate from 'coral-framework/helpers/validate';
 import errorMsj from 'coral-framework/helpers/error';
 import isEqual from 'lodash/isEqual';
@@ -231,9 +231,13 @@ class ChangePassword extends React.Component {
               >
                 {t('talk-plugin-local-auth.change_password.save')}
               </Button>
-              <a className={styles.cancelButton} onClick={this.cancel}>
+              <BareButton
+                type="button"
+                className={styles.cancelButton}
+                onClick={this.cancel}
+              >
                 {t('talk-plugin-local-auth.change_password.cancel')}
-              </a>
+              </BareButton>
             </div>
           </form>
         ) : (

plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js

@@ -84,7 +84,11 @@ class ChangeUsernameContentDialog extends React.Component {
               </span>
             </InputField>
             <div className={styles.bottomActions}>
-              <Button className={styles.cancel} onClick={this.props.cancel}>
+              <Button
+                className={styles.cancel}
+                onClick={this.props.cancel}
+                type="button"
+              >
                 {t('talk-plugin-local-auth.change_username.cancel')}
               </Button>
               <Button className={styles.confirmChanges} type="submit">

plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css

@@ -1,84 +0,0 @@
-.dialog {
-  border: none;
-  box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2);
-  width: 320px;
-  top: 10px;
-  font-family: Helvetica, 'Helvetica Neue', Verdana, sans-serif;
-  font-size: 14px;
-  border-radius: 4px;
-  padding: 12px 20px;
-}
-
-.close {
-  font-size: 20px;
-  line-height: 14px;
-  top: 10px;
-  right: 10px;
-  position: absolute;
-  display: block;
-  font-weight: bold;
-  color: #363636;
-  cursor: pointer;
-
-  &:hover {
-    color: #6b6b6b;
-  }
-}
-
-.title {
-  font-size: 1.3em;
-  margin-bottom: 8px;
-}
-
-.description {
-  font-size: 1em;
-  line-height: 20px;
-  margin: 0;
-}
-
-.item {
-  display: block;
-  color: #4C4C4D;
-  font-size: 1em;
-  margin-bottom: 2px;
-}
-
-.bottomNote {
-  font-size: 0.9em;
-  line-height: 20px;
-  padding-top: 10px;
-  display: block;
-}
-
-.bottomActions {
-  text-align: right;
-}
-
-.usernamesChange {
-  margin: 18px 0;
-}
-
-.cancel {
-  border: 1px solid #787d80;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-
-  &:hover {
-    background-color: #eaeaea;
-  }
-}
-
-.confirmChanges {
-  background-color: #3498DB;
-  border-color: #3498DB;
-  color: white;
-  height: 30px;
-  font-size: 0.9em;
-  
-  &:hover {
-    background-color: #3ba3ec;
-    color: white;
-  }
-}

plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js

@@ -1,120 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'classnames';
-import styles from './ChangeUsernameDialog.css';
-import InputField from './InputField';
-import { Button, Dialog } from 'plugin-api/beta/client/components/ui';
-import { t } from 'plugin-api/beta/client/services';
-
-class ChangeUsernameDialog extends React.Component {
-  state = {
-    showError: false,
-  };
-
-  showError = () => {
-    this.setState({
-      showError: true,
-    });
-  };
-
-  confirmChanges = async () => {
-    if (this.formHasError()) {
-      this.showError();
-      return;
-    }
-
-    if (!this.props.canUsernameBeUpdated) {
-      this.props.notify(
-        'error',
-        t('talk-plugin-local-auth.change_username.change_username_attempt')
-      );
-      return;
-    }
-
-    await this.props.saveChanges();
-    this.props.closeDialog();
-  };
-
-  formHasError = () =>
-    this.props.formData.confirmNewUsername !== this.props.formData.newUsername;
-
-  render() {
-    return (
-      <Dialog
-        open={this.props.showDialog}
-        className={cn(
-          styles.dialog,
-          'talk-plugin-local-auth--edit-profile-dialog'
-        )}
-      >
-        <span className={styles.close} onClick={this.props.closeDialog}>
-          ×
-        </span>
-        <h1 className={styles.title}>
-          {t('talk-plugin-local-auth.change_username.confirm_username_change')}
-        </h1>
-        <div className={styles.content}>
-          <p className={styles.description}>
-            {t('talk-plugin-local-auth.change_username.description')}
-          </p>
-          <div className={styles.usernamesChange}>
-            <span className={styles.item}>
-              {t('talk-plugin-local-auth.change_username.old_username')}:{' '}
-              {this.props.username}
-            </span>
-            <span className={styles.item}>
-              {t('talk-plugin-local-auth.change_username.new_username')}:{' '}
-              {this.props.formData.newUsername}
-            </span>
-          </div>
-          <form>
-            <InputField
-              id="confirmNewUsername"
-              label="Re-enter new username"
-              name="confirmNewUsername"
-              type="text"
-              onChange={this.props.onChange}
-              defaultValue=""
-              hasError={this.formHasError() && this.state.showError}
-              errorMsg={t(
-                'talk-plugin-local-auth.change_username.username_does_not_match'
-              )}
-              showError={this.state.showError}
-              columnDisplay
-              showSuccess={false}
-              validationType="username"
-            >
-              <span className={styles.bottomNote}>
-                {t('talk-plugin-local-auth.change_username.bottom_note')}
-              </span>
-            </InputField>
-          </form>
-          <div className={styles.bottomActions}>
-            <Button className={styles.cancel}>
-              {t('talk-plugin-local-auth.change_username.cancel')}
-            </Button>
-            <Button
-              className={styles.confirmChanges}
-              onClick={this.confirmChanges}
-            >
-              {t('talk-plugin-local-auth.change_username.confirm_changes')}
-            </Button>
-          </div>
-        </div>
-      </Dialog>
-    );
-  }
-}
-
-ChangeUsernameDialog.propTypes = {
-  saveChanges: PropTypes.func,
-  closeDialog: PropTypes.func,
-  showDialog: PropTypes.bool,
-  onChange: PropTypes.func,
-  username: PropTypes.string,
-  formData: PropTypes.object,
-  canUsernameBeUpdated: PropTypes.bool.isRequired,
-  notify: PropTypes.func.isRequired,
-};
-
-export default ChangeUsernameDialog;

plugins/talk-plugin-local-auth/client/components/Profile.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
 import styles from './Profile.css';
-import { Button } from 'plugin-api/beta/client/components/ui';
+import { Button, BareButton } from 'plugin-api/beta/client/components/ui';
 import { t } from 'plugin-api/beta/client/services';
 import InputField from './InputField';
 import { getErrorMessages } from 'coral-framework/utils';
@@ -155,6 +155,10 @@ class Profile extends React.Component {
     }
   };
 
+  getError = errorKey => {
+    return this.state.errors[errorKey];
+  };
+
   finish = () => {
     this.clearForm();
     this.disableEditing();
@@ -193,6 +197,7 @@ class Profile extends React.Component {
               formData={this.state.formData}
               username={username}
               enable={formData.newUsername && username !== formData.newUsername}
+              hasError={this.hasError}
             />
           )}
           <ChangeEmailContentDialog
@@ -201,6 +206,8 @@ class Profile extends React.Component {
             formData={this.state.formData}
             email={email}
             enable={formData.newEmail && email !== formData.newEmail}
+            hasError={this.hasError}
+            getError={this.getError}
           />
         </ConfirmChangesDialog>
 
@@ -244,9 +251,13 @@ class Profile extends React.Component {
               >
                 {t('talk-plugin-local-auth.change_username.save')}
               </Button>
-              <a className={styles.cancelButton} onClick={this.cancel}>
+              <BareButton
+                className={styles.cancelButton}
+                onClick={this.cancel}
+                type="button"
+              >
                 {t('talk-plugin-local-auth.change_username.cancel')}
-              </a>
+              </BareButton>
             </div>
           </form>
         ) : (

plugins/talk-plugin-local-auth/client/translations.yml

@@ -11,7 +11,7 @@ en:
       changed_password_msg: "Changed Password - Your password has been successfully changed"
       forgot_password_sent: "Forgot Password - We sent you an email to recover your password"
     change_username:
-      change_username_note: "Usernames can be changed every 14 days"
+      change_username_note: "Usernames can only be changed once every 14 days. Your username is not currently eligible to be updated."
       save: "Save"
       edit_profile: "Edit Profile"
       cancel: "Cancel"

plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js

@@ -37,13 +37,13 @@ class AccountDeletionRequestedSign extends React.Component {
         </h4>
         <p className={styles.description}>
           {t('delete_request.received_on')}
-          {deletionScheduledFor}.
+          {deletionScheduledOn}.
         </p>
         <p className={styles.description}>
           {t('delete_request.cancel_request_description')}
           <b>
             {' '}
-            {t('delete_request.before')} {deletionScheduledOn}
+            {t('delete_request.before')} {deletionScheduledFor}
           </b>.
         </p>
         <div className={styles.actions}>

plugins/talk-plugin-profile-data/client/translations.yml

@@ -20,9 +20,9 @@ en:
     cancel_account_deletion_request: "Cancel Account Deletion Request"
     delete_my_account: "Delete My Account"
     delete_my_account_description: "Deleting your account will permanently erase your profile and remove all your comments from this site."
-    already_submitted_request_description: "You have already submitted a request to delete your account. Your account will be deleted on {0}. You may cancel the request until that time"
+    already_submitted_request_description: "You have already submitted a request to delete your account. Your account will be deleted after {0}. You may cancel the request until that time"
     your_request_submitted_description: "Your request has been submitted and confirmation has been sent to the email address associated with your account."
-    your_account_deletion_scheduled: "Your account is scheduled to be deleted at:"
+    your_account_deletion_scheduled: "Your account is scheduled to be deleted after:"
     changed_your_mind: "Changed your mind?"
     simply_go_to: "Simply go to your account again before this time and click"
     tell_us_why: "Tell us why"

plugins/talk-plugin-profile-data/server/router.js

@@ -71,9 +71,15 @@ async function loadComments(ctx, userID, archive, latestContentDate) {
   const csv = stringify();
 
   // Add all the streams as files to the archive.
-  archive.append(csv, { name: 'talk-export/my_comments.csv' });
+  archive.append(csv, { name: 'comments-export/my_comments.csv' });
 
-  csv.write(['ID', 'Timestamp', 'Article', 'Link', 'Body']);
+  csv.write([
+    'Comment ID',
+    'Published Timestamp',
+    'Article URL',
+    'Comment Link',
+    'Comment Text',
+  ]);
 
   // Load the first batch's comments from the latest date that we were provided
   // from the token.