From 2adec1bc344137ba2383b62820c70c30542658ec Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 18 Apr 2018 13:13:41 -0600
Subject: [PATCH 001/160] added deletion graph endpoints

---
 graph/mutators/user.js                        |  5 +-
 perms/constants/mutation.js                   |  2 +-
 perms/reducers/mutation.js                    |  1 +
 plugin-api/beta/server/getReactionConfig.js   | 15 +---
 plugins/talk-plugin-profile-data/package.json |  1 +
 .../server/connect.js                         | 88 ++++++++++++++++++-
 .../talk-plugin-profile-data/server/errors.js | 27 +++++-
 .../server/mutators.js                        | 64 ++++++++++++--
 .../server/resolvers.js                       | 18 ++++
 .../server/typeDefs.graphql                   | 38 ++++++++
 10 files changed, 235 insertions(+), 24 deletions(-)

diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index 6c673111b..0343e1f2e 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -8,7 +8,7 @@ const {
   SET_USER_BAN_STATUS,
   SET_USER_SUSPENSION_STATUS,
   UPDATE_USER_ROLES,
-  DELETE_USER,
+  DELETE_OTHER_USER,
 } = require('../../perms/constants');
 
 const setUserUsernameStatus = async (ctx, id, status) => {
@@ -155,6 +155,7 @@ module.exports = ctx => {
       setUsername: () => Promise.reject(new ErrNotAuthorized()),
       stopIgnoringUser: () => Promise.reject(new ErrNotAuthorized()),
       del: () => Promise.reject(new ErrNotAuthorized()),
+      delSelf: () => Promise.reject(new ErrNotAuthorized()),
     },
   };
 
@@ -191,7 +192,7 @@ module.exports = ctx => {
         setUserSuspensionStatus(ctx, id, until, message);
     }
 
-    if (ctx.user.can(DELETE_USER)) {
+    if (ctx.user.can(DELETE_OTHER_USER)) {
       mutators.User.del = id => delUser(ctx, id);
     }
   }
diff --git a/perms/constants/mutation.js b/perms/constants/mutation.js
index d2ebe73f1..dba126ceb 100644
--- a/perms/constants/mutation.js
+++ b/perms/constants/mutation.js
@@ -18,5 +18,5 @@ module.exports = {
   UPDATE_ASSET_SETTINGS: 'UPDATE_ASSET_SETTINGS',
   UPDATE_ASSET_STATUS: 'UPDATE_ASSET_STATUS',
   UPDATE_SETTINGS: 'UPDATE_SETTINGS',
-  DELETE_USER: 'DELETE_USER',
+  DELETE_OTHER_USER: 'DELETE_OTHER_USER',
 };
diff --git a/perms/reducers/mutation.js b/perms/reducers/mutation.js
index 73ee7ef28..7e23b274b 100644
--- a/perms/reducers/mutation.js
+++ b/perms/reducers/mutation.js
@@ -36,6 +36,7 @@ module.exports = (user, perm) => {
     case types.UPDATE_USER_ROLES:
     case types.CREATE_TOKEN:
     case types.REVOKE_TOKEN:
+    case types.DELETE_OTHER_USER:
       return check(user, ['ADMIN']);
 
     default:
diff --git a/plugin-api/beta/server/getReactionConfig.js b/plugin-api/beta/server/getReactionConfig.js
index da075d76c..b6e0a5c1d 100644
--- a/plugin-api/beta/server/getReactionConfig.js
+++ b/plugin-api/beta/server/getReactionConfig.js
@@ -2,24 +2,11 @@ const { SEARCH_OTHER_USERS } = require('../../../perms/constants');
 const { ErrNotFound, ErrAlreadyExists } = require('../../../errors');
 const pluralize = require('pluralize');
 const sc = require('snake-case');
-// const { CREATE_MONGO_INDEXES } = require('../../../config');
 
 function getReactionConfig(reaction) {
+  // Ensure that the reaction is a lowercase string.
   reaction = reaction.toLowerCase();
 
-  // if (CREATE_MONGO_INDEXES) {
-  //   // Create the index on the comment model based on the reaction config.
-  //   CommentModel.collection.createIndex(
-  //     {
-  //       created_at: 1,
-  //       [`action_counts.${sc(reaction)}`]: 1,
-  //     },
-  //     {
-  //       background: true,
-  //     }
-  //   );
-  // }
-
   const reactionPlural = pluralize(reaction);
   const Reaction = reaction.charAt(0).toUpperCase() + reaction.slice(1);
   const REACTION = reaction.toUpperCase();
diff --git a/plugins/talk-plugin-profile-data/package.json b/plugins/talk-plugin-profile-data/package.json
index ed5a29050..4329aba7e 100644
--- a/plugins/talk-plugin-profile-data/package.json
+++ b/plugins/talk-plugin-profile-data/package.json
@@ -7,6 +7,7 @@
   "private": false,
   "dependencies": {
     "archiver": "^2.1.1",
+    "cron": "^1.3.0",
     "csv-stringify": "^3.0.0"
   }
 }
diff --git a/plugins/talk-plugin-profile-data/server/connect.js b/plugins/talk-plugin-profile-data/server/connect.js
index f09b2dc7b..eab76828f 100644
--- a/plugins/talk-plugin-profile-data/server/connect.js
+++ b/plugins/talk-plugin-profile-data/server/connect.js
@@ -1,7 +1,13 @@
 const path = require('path');
+const moment = require('moment');
+const { CronJob } = require('cron');
 
 module.exports = connectors => {
-  const { services: { Mailer } } = connectors;
+  const {
+    services: { Mailer },
+    models: { User },
+    graph: { Context },
+  } = connectors;
 
   // Setup the mail templates.
   ['txt', 'html'].forEach(format => {
@@ -11,4 +17,84 @@ module.exports = connectors => {
       format
     );
   });
+
+  // Setup the cron job that will scan for accounts to delete every 30 minutes.
+  new CronJob({
+    cronTime: '0,30 * * * *',
+    timeZone: 'America/New_York',
+    start: true,
+    runOnInit: true,
+    onTick: async () => {
+      // Create the context we'll use to perform user deletions.
+      const ctx = Context.forSystem();
+
+      // rescheduledDeletionDate is the date in the future that we'll set the
+      // user's account to be deleted on if this delete fails.
+      const rescheduledDeletionDate = moment()
+        .add(1, 'hours')
+        .toDate();
+
+      try {
+        // Keep running for each user we can pull.
+        while (true) {
+          // We'll find any user that has an account deletion date before now
+          // and update the user such that their deletion time is 1 hour from
+          // now. This will ensure that only one instance can pull the same
+          // user at a time, and if the delete fails, it will be retried an
+          // hour from now. If the deletion was successful, well, it can't be
+          // retried because the reference to the scheduledDeletionDate will
+          // get deleted along with the user.
+          const user = await User.findOneAndUpdate(
+            {
+              'metadata.scheduledDeletionDate': { $lte: new Date() },
+            },
+            {
+              $set: {
+                'metadata.scheduledDeletionDate': rescheduledDeletionDate,
+              },
+            }
+          );
+          if (!user) {
+            // There are no more users that meet the search criteria! We're
+            // done!
+            ctx.log.info('no more users are scheduled for deletion');
+            break;
+          }
+
+          ctx.log.info(
+            {
+              userID: user.id,
+              scheduledDeletionDate: user.metadata.scheduledDeletionDate,
+            },
+            'starting user delete'
+          );
+
+          // Delete the user using the existing graph call.
+          const { data, errors } = await ctx.graphql(
+            `
+            mutation DeleteUser($user_id: ID!) {
+              delUser(id: $user_id) {
+                errors {
+                  translation_key
+                }
+              }
+            }
+          `,
+            { user_id: user.id }
+          );
+          if (errors) {
+            throw errors;
+          }
+
+          if (data.errors) {
+            throw data.errors;
+          }
+
+          ctx.log.info({ userID: user.id }, 'user was deleted successfully');
+        }
+      } catch (err) {
+        ctx.log.error({ err }, 'could not handle user deletions');
+      }
+    },
+  });
 };
diff --git a/plugins/talk-plugin-profile-data/server/errors.js b/plugins/talk-plugin-profile-data/server/errors.js
index 6261ebe89..f205c1f6e 100644
--- a/plugins/talk-plugin-profile-data/server/errors.js
+++ b/plugins/talk-plugin-profile-data/server/errors.js
@@ -15,4 +15,29 @@ class ErrDownloadToken extends TalkError {
   }
 }
 
-module.exports = { ErrDownloadToken };
+// ErrDeletionAlreadyScheduled is returned when a user requests that their
+// account get deleted when their account is already scheduled for deletion.
+class ErrDeletionAlreadyScheduled extends TalkError {
+  constructor() {
+    super('Deletion is already scheduled', {
+      translation_key: 'DELETION_ALREADY_SCHEDULED',
+      status: 400,
+    });
+  }
+}
+// ErrDeletionNotScheduled is returned when a user requests that their
+// account deletion to be canceled when it was not scheduled for deletion.
+class ErrDeletionNotScheduled extends TalkError {
+  constructor() {
+    super('Deletion was not scheduled', {
+      translation_key: 'DELETION_NOT_SCHEDULED',
+      status: 400,
+    });
+  }
+}
+
+module.exports = {
+  ErrDownloadToken,
+  ErrDeletionAlreadyScheduled,
+  ErrDeletionNotScheduled,
+};
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index 5a897a2e1..dafc7dc42 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -1,6 +1,12 @@
+const { get } = require('lodash');
 const moment = require('moment');
 const uuid = require('uuid/v4');
 const { DOWNLOAD_LINK_SUBJECT } = require('./constants');
+const {
+  ErrDeletionAlreadyScheduled,
+  ErrDeletionNotScheduled,
+} = require('./errors');
+const { ErrNotAuthorized } = require('errors');
 
 async function sendDownloadLink({
   user,
@@ -66,8 +72,56 @@ async function sendDownloadLink({
   );
 }
 
-module.exports = ctx => ({
-  User: {
-    requestDownloadLink: () => sendDownloadLink(ctx),
-  },
-});
+// requestDeletion will schedule the current user to have their account deleted
+// by setting the `scheduledDeletionDate` on the user 12 hours from now.
+async function requestDeletion({ user, connectors: { models: { User } } }) {
+  // Ensure the user doesn't already have a deletion scheduled.
+  if (get(user, 'metadata.scheduledDeletionDate')) {
+    throw new ErrDeletionAlreadyScheduled();
+  }
+
+  // Get the date in the future 12 hours from now.
+  const scheduledDeletionDate = moment()
+    .add(12, 'hours')
+    .toDate();
+
+  // Amend the scheduledDeletionDate on the user.
+  await User.update(
+    { id: user.id },
+    { $set: { 'metadata.scheduledDeletionDate': scheduledDeletionDate } }
+  );
+
+  return scheduledDeletionDate;
+}
+
+// cancelDeletion will unset the scheduled deletion date on the user account
+// that is used to indicate that the user was scheduled for deletion.
+async function cancelDeletion({ user, connectors: { models: { User } } }) {
+  // Ensure the user has a deletion scheduled.
+  if (!get(user, 'metadata.scheduledDeletionDate', null)) {
+    throw new ErrDeletionNotScheduled();
+  }
+
+  // Amend the scheduledDeletionDate on the user.
+  await User.update(
+    { id: user.id },
+    { $unset: { 'metadata.scheduledDeletionDate': 1 } }
+  );
+}
+
+module.exports = ctx =>
+  ctx.user
+    ? {
+        User: {
+          requestDownloadLink: () => sendDownloadLink(ctx),
+          requestDeletion: () => requestDeletion(ctx),
+          cancelDeletion: () => cancelDeletion(ctx),
+        },
+      }
+    : {
+        User: {
+          requestDownloadLink: () => Promise.reject(new ErrNotAuthorized()),
+          requestDeletion: () => Promise.reject(new ErrNotAuthorized()),
+          cancelDeletion: () => Promise.reject(new ErrNotAuthorized()),
+        },
+      };
diff --git a/plugins/talk-plugin-profile-data/server/resolvers.js b/plugins/talk-plugin-profile-data/server/resolvers.js
index 691907f8c..a90c617e2 100644
--- a/plugins/talk-plugin-profile-data/server/resolvers.js
+++ b/plugins/talk-plugin-profile-data/server/resolvers.js
@@ -5,6 +5,12 @@ module.exports = {
     requestDownloadLink: async (_, args, { mutators: { User } }) => {
       await User.requestDownloadLink();
     },
+    requestAccountDeletion: async (_, args, { mutators: { User } }) => ({
+      scheduledDeletionDate: await User.requestDeletion(),
+    }),
+    cancelAccountDeletion: async (_, args, { mutators: { User } }) => {
+      await User.cancelDeletion();
+    },
   },
   User: {
     lastAccountDownload: (user, args, { user: currentUser }) => {
@@ -16,5 +22,17 @@ module.exports = {
 
       return get(user, 'metadata.lastAccountDownload', null);
     },
+    scheduledDeletionDate: (user, args, { user: currentUser }) => {
+      // If the current user is not the requesting user, and the user is not
+      // an admin or a moderator, return nothing.
+      if (
+        user.id !== currentUser.id &&
+        !['ADMIN', 'MODERATOR'].includes(user.role)
+      ) {
+        return null;
+      }
+
+      return get(user, 'metadata.scheduledDeletionDate', null);
+    },
   },
 };
diff --git a/plugins/talk-plugin-profile-data/server/typeDefs.graphql b/plugins/talk-plugin-profile-data/server/typeDefs.graphql
index 0029111c3..c785fb2cc 100644
--- a/plugins/talk-plugin-profile-data/server/typeDefs.graphql
+++ b/plugins/talk-plugin-profile-data/server/typeDefs.graphql
@@ -3,17 +3,55 @@ type User {
   # lastAccountDownload is the date that the user last requested a comment
   # download.
   lastAccountDownload: Date
+
+  # scheduledDeletionDate is the data for which the user account will be deleted
+  # after. The account may be deleted up to half an hour after this date because
+  # the job responsible for deleting the scheduled account will only run once
+  # every half hour.
+  scheduledDeletionDate: Date
 }
 
+# RequestDownloadLinkResponse contains the account download errors relating to
+# the request for an account download.
 type RequestDownloadLinkResponse implements Response {
 
   # An array of errors relating to the mutation that occurred.
   errors: [UserError!]
 }
 
+# RequestAccountDeletionResponse contains the account deletion schedule errors
+# relating to schedulding an account for deletion.
+type RequestAccountDeletionResponse implements Response {
+
+  # scheduledDeletionDate is the data for which the user account will be deleted
+  # after. The account may be deleted up to half an hour after this date because
+  # the job responsible for deleting the scheduled account will only run once
+  # every half hour.
+  scheduledDeletionDate: Date
+
+  # An array of errors relating to the mutation that occurred.
+  errors: [UserError!]
+}
+
+# CancelAccountDeletionResponse contains the account deletion errors relating to
+# canceling an account deletion that was scheduled.
+type CancelAccountDeletionResponse implements Response {
+
+  # An array of errors relating to the mutation that occurred.
+  errors: [UserError!]
+}
+
 type RootMutation {
 
   # requestDownloadLink will request a download link be sent to the primary
   # users email address.
   requestDownloadLink: RequestDownloadLinkResponse
+
+  # requestAccountDeletion requests that the current account get deleted. The
+  # mutation will return the date that the account is scheduled to be deleted.
+  requestAccountDeletion: RequestAccountDeletionResponse
+
+  # cancelAccountDeletion will cancel a pending account deletion that was
+  # previously scheduled.
+  cancelAccountDeletion: CancelAccountDeletionResponse
 }

From 8e34fd1925fe23c745de480c773aa4bdab11af80 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 18 Apr 2018 17:22:39 -0600
Subject: [PATCH 002/160] implemented tombstoning

---
 .../src/tabs/stream/components/Comment.js     | 11 +++-
 .../stream/components/CommentTombstone.js     |  2 +
 client/coral-framework/utils/index.js         |  8 +++
 graph/mutators/user.js                        | 53 +++++++++++--------
 graph/resolvers/comment.js                    |  6 ++-
 graph/typeDefs.graphql                        |  5 +-
 locales/en.yml                                |  1 +
 models/schema/comment.js                      |  8 ++-
 perms/constants/query.js                      |  1 +
 perms/reducers/query.js                       |  1 +
 services/migration/helpers.js                 | 10 +++-
 11 files changed, 75 insertions(+), 31 deletions(-)

diff --git a/client/coral-embed-stream/src/tabs/stream/components/Comment.js b/client/coral-embed-stream/src/tabs/stream/components/Comment.js
index 5df119fbc..e60756f39 100644
--- a/client/coral-embed-stream/src/tabs/stream/components/Comment.js
+++ b/client/coral-embed-stream/src/tabs/stream/components/Comment.js
@@ -27,6 +27,7 @@ import {
   getActionSummary,
   iPerformedThisAction,
   isCommentActive,
+  isCommentDeleted,
   getShallowChanges,
 } from 'coral-framework/utils';
 import t from 'coral-framework/services/i18n';
@@ -742,8 +743,14 @@ export default class Comment extends React.Component {
 
     return (
       <div className={rootClassName} id={id}>
-        {this.renderComment()}
-        {activeReplyBox === comment.id && this.renderReplyBox()}
+        {isCommentDeleted(comment) ? (
+          <CommentTombstone action="deleted" />
+        ) : (
+          <div>
+            {this.renderComment()}
+            {activeReplyBox === comment.id && this.renderReplyBox()}
+          </div>
+        )}
         {this.renderRepliesContainer()}
       </div>
     );
diff --git a/client/coral-embed-stream/src/tabs/stream/components/CommentTombstone.js b/client/coral-embed-stream/src/tabs/stream/components/CommentTombstone.js
index a10369850..95184dffd 100644
--- a/client/coral-embed-stream/src/tabs/stream/components/CommentTombstone.js
+++ b/client/coral-embed-stream/src/tabs/stream/components/CommentTombstone.js
@@ -13,6 +13,8 @@ class CommentTombstone extends React.Component {
         return t('framework.comment_is_ignored');
       case 'reject':
         return t('framework.comment_is_rejected');
+      case 'deleted':
+        return t('framework.comment_is_deleted');
       default:
         return t('framework.comment_is_hidden');
     }
diff --git a/client/coral-framework/utils/index.js b/client/coral-framework/utils/index.js
index 66792b9b3..f69e83bdc 100644
--- a/client/coral-framework/utils/index.js
+++ b/client/coral-framework/utils/index.js
@@ -1,6 +1,7 @@
 import { gql } from 'react-apollo';
 import t from 'coral-framework/services/i18n';
 import union from 'lodash/union';
+import get from 'lodash/get';
 import { capitalize } from 'coral-framework/helpers/strings';
 import assignWith from 'lodash/assignWith';
 import mapValues from 'lodash/mapValues';
@@ -221,6 +222,13 @@ export function isCommentActive(commentStatus) {
   return ['NONE', 'ACCEPTED'].indexOf(commentStatus) >= 0;
 }
 
+export function isCommentDeleted(comment) {
+  return (
+    get(comment, 'body', null) === null ||
+    get(comment, 'deleted_at', null) !== null
+  );
+}
+
 export function getShallowChanges(a, b) {
   return union(Object.keys(a), Object.keys(b)).filter(key => a[key] !== b[key]);
 }
diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index 0343e1f2e..f5bf3c930 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -92,7 +92,7 @@ const delUser = async (ctx, id) => {
     updateBatchSize: 10000,
   });
 
-  // Remove all actions against comments.
+  // Remove all actions against this users comments.
   await transformSingleWithCursor(
     Action.collection.find({ user_id: user.id, item_type: 'COMMENTS' }),
     actionDecrTransformer,
@@ -111,34 +111,41 @@ const delUser = async (ctx, id) => {
     .setOptions({ multi: true })
     .remove();
 
-  // Removes all the user's reply counts on each of the comments that they
-  // have commented on.
+  // For each comment that the user has authored, purge the comment data from it
+  // and unset their id from those comments.
   await transformSingleWithCursor(
-    Comment.collection.aggregate([
-      { $match: { author_id: user.id } },
-      {
-        $group: {
-          _id: '$parent_id',
-          count: { $sum: 1 },
-        },
-      },
-    ]),
-    ({ _id: parent_id, count }) => ({
-      query: { id: parent_id },
-      update: {
-        $inc: {
-          reply_count: -1 * count,
-        },
+    Comment.collection.find({ author_id: user.id }),
+    ({
+      id,
+      asset_id,
+      status,
+      parent_id,
+      reply_count,
+      created_at,
+      updated_at,
+    }) => ({
+      query: { id },
+      replace: {
+        id,
+        body: null,
+        body_history: [],
+        asset_id,
+        author_id: null,
+        status_history: [],
+        status,
+        parent_id,
+        reply_count,
+        action_counts: {},
+        tags: [],
+        metadata: {},
+        deleted_at: new Date(),
+        created_at,
+        updated_at,
       },
     }),
     Comment
   );
 
-  // Remove all the user's comments.
-  await Comment.where({ author_id: user.id })
-    .setOptions({ multi: true })
-    .remove();
-
   // Remove the user.
   await user.remove();
 };
diff --git a/graph/resolvers/comment.js b/graph/resolvers/comment.js
index 064835f8f..e562c062c 100644
--- a/graph/resolvers/comment.js
+++ b/graph/resolvers/comment.js
@@ -4,6 +4,7 @@ const {
   SEARCH_ACTIONS,
   SEARCH_COMMENT_STATUS_HISTORY,
   VIEW_BODY_HISTORY,
+  VIEW_COMMENT_DELETED_AT,
 } = require('../../perms/constants');
 const {
   decorateWithTags,
@@ -23,7 +24,9 @@ const Comment = {
     return Comments.get.load(parent_id);
   },
   user({ author_id }, _, { loaders: { Users } }) {
-    return Users.getByID.load(author_id);
+    if (author_id) {
+      return Users.getByID.load(author_id);
+    }
   },
   replies({ id, asset_id, reply_count }, { query }, { loaders: { Comments } }) {
     // Don't bother looking up replies if there aren't any there!
@@ -83,6 +86,7 @@ decorateWithTags(Comment);
 decorateWithPermissionCheck(Comment, {
   actions: [SEARCH_ACTIONS],
   status_history: [SEARCH_COMMENT_STATUS_HISTORY],
+  deleted_at: [VIEW_COMMENT_DELETED_AT],
 });
 
 // Protect privileged fields.
diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql
index f94322344..9a03e2729 100644
--- a/graph/typeDefs.graphql
+++ b/graph/typeDefs.graphql
@@ -503,7 +503,7 @@ type Comment {
   id: ID!
 
   # The actual comment data.
-  body: String!
+  body: String
 
   # The body history of the comment. Requires the `ADMIN` or `MODERATOR` role or
   # the author.
@@ -537,6 +537,9 @@ type Comment {
   # The status history of the comment. Requires the `ADMIN` or `MODERATOR` role.
   status_history: [CommentStatusHistory!]
 
+  # The date that the comment was deleted at if it was.
+  deleted_at: Date
+
   # The time when the comment was created
   created_at: Date!
 
diff --git a/locales/en.yml b/locales/en.yml
index 50845b96f..f4c477710 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -258,6 +258,7 @@ en:
     comment: comment
     comment_is_ignored: "This comment is hidden because you ignored this user."
     comment_is_rejected: "You have rejected this comment."
+    comment_is_deleted: "This comment was deleted."
     comment_is_hidden: "This comment is not available."
     comments: comments
     configure_stream: "Configure"
diff --git a/models/schema/comment.js b/models/schema/comment.js
index 6ef5434d5..985f5c399 100644
--- a/models/schema/comment.js
+++ b/models/schema/comment.js
@@ -58,8 +58,6 @@ const Comment = new Schema(
     },
     body: {
       type: String,
-      required: [true, 'The body is required.'],
-      minlength: 2,
     },
     body_history: [BodyHistoryItemSchema],
     asset_id: String,
@@ -89,6 +87,12 @@ const Comment = new Schema(
     // Tags are added by the self or by administrators.
     tags: [TagLinkSchema],
 
+    // deleted_at stores the date that the given comment was deleted.
+    deleted_at: {
+      type: Date,
+      default: null,
+    },
+
     // Additional metadata stored on the field.
     metadata: {
       default: {},
diff --git a/perms/constants/query.js b/perms/constants/query.js
index 197c5d9f9..0c7f4024d 100644
--- a/perms/constants/query.js
+++ b/perms/constants/query.js
@@ -11,4 +11,5 @@ module.exports = {
   VIEW_USER_ROLE: 'VIEW_USER_ROLE',
   VIEW_USER_EMAIL: 'VIEW_USER_EMAIL',
   VIEW_BODY_HISTORY: 'VIEW_BODY_HISTORY',
+  VIEW_COMMENT_DELETED_AT: 'VIEW_COMMENT_DELETED_AT',
 };
diff --git a/perms/reducers/query.js b/perms/reducers/query.js
index ed507139d..5c8b17307 100644
--- a/perms/reducers/query.js
+++ b/perms/reducers/query.js
@@ -14,6 +14,7 @@ module.exports = (user, perm) => {
     case types.VIEW_USER_ROLE:
     case types.VIEW_USER_EMAIL:
     case types.VIEW_BODY_HISTORY:
+    case types.VIEW_COMMENT_DELETED_AT:
       return check(user, ['ADMIN', 'MODERATOR']);
     case types.LIST_OWN_TOKENS:
       return check(user, ['ADMIN']);
diff --git a/services/migration/helpers.js b/services/migration/helpers.js
index 5eb33aadf..49acc78aa 100644
--- a/services/migration/helpers.js
+++ b/services/migration/helpers.js
@@ -10,8 +10,14 @@ const processUpdates = async (model, updates) => {
   // Create a new batch operation.
   const bulk = model.collection.initializeUnorderedBulkOp();
 
-  for (const { query, update } of updates) {
-    bulk.find(query).updateOne(update);
+  for (const { query, update, replace } of updates) {
+    if (update) {
+      bulk.find(query).updateOne(update);
+    } else if (replace) {
+      bulk.find(query).replaceOne(replace);
+    } else {
+      throw new Error('invalid update object provided');
+    }
   }
 
   // Execute the bulk update operation.

From 68461308c68c1cedd3810bc6336daa9c65dd95b2 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 19 Apr 2018 13:37:14 -0600
Subject: [PATCH 003/160] pull ignored users from db

---
 graph/mutators/user.js | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index f5bf3c930..68112e732 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -111,6 +111,15 @@ const delUser = async (ctx, id) => {
     .setOptions({ multi: true })
     .remove();
 
+  // Remove the user from all other user's ignore lists.
+  await User.update(
+    { ignoresUsers: user.id },
+    {
+      $pull: { ignoresUsers: user.id },
+    },
+    { multi: true }
+  );
+
   // For each comment that the user has authored, purge the comment data from it
   // and unset their id from those comments.
   await transformSingleWithCursor(

From 2e013c33ac1e834bbae94bd470f64cbf18390f21 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 19 Apr 2018 17:19:14 -0600
Subject: [PATCH 004/160] GDPR Email Support

- Email and password can be used to create a new local profile
- Email can be changed with accounts that already have a local profile
---
 plugins/talk-plugin-auth/README.md            |   1 +
 plugins/talk-plugin-auth/index.js             |  12 +-
 plugins/talk-plugin-auth/server/errors.js     |  25 +++
 plugins/talk-plugin-auth/server/mutators.js   | 158 ++++++++++++++++++
 plugins/talk-plugin-auth/server/resolvers.js  |  10 ++
 .../talk-plugin-auth/server/translations.yml  |   8 +
 .../talk-plugin-auth/server/typeDefs.graphql  |  47 ++++++
 plugins/talk-plugin-auth/server/typeDefs.js   |   7 +
 8 files changed, 267 insertions(+), 1 deletion(-)
 create mode 100644 plugins/talk-plugin-auth/server/errors.js
 create mode 100644 plugins/talk-plugin-auth/server/mutators.js
 create mode 100644 plugins/talk-plugin-auth/server/resolvers.js
 create mode 100644 plugins/talk-plugin-auth/server/translations.yml
 create mode 100644 plugins/talk-plugin-auth/server/typeDefs.graphql
 create mode 100644 plugins/talk-plugin-auth/server/typeDefs.js

diff --git a/plugins/talk-plugin-auth/README.md b/plugins/talk-plugin-auth/README.md
index fd5218365..0a00db5ea 100644
--- a/plugins/talk-plugin-auth/README.md
+++ b/plugins/talk-plugin-auth/README.md
@@ -7,6 +7,7 @@ plugin:
     default: true
     provides:
         - Client
+        - Server
 ---
 
 This provides the base plugin that is the basis for all auth based plugins that
diff --git a/plugins/talk-plugin-auth/index.js b/plugins/talk-plugin-auth/index.js
index f053ebf79..7e4ee6a3c 100644
--- a/plugins/talk-plugin-auth/index.js
+++ b/plugins/talk-plugin-auth/index.js
@@ -1 +1,11 @@
-module.exports = {};
+const typeDefs = require('./server/typeDefs');
+const resolvers = require('./server/resolvers');
+const mutators = require('./server/mutators');
+const path = require('path');
+
+module.exports = {
+  translations: path.join(__dirname, 'server', 'translations.yml'),
+  typeDefs,
+  mutators,
+  resolvers,
+};
diff --git a/plugins/talk-plugin-auth/server/errors.js b/plugins/talk-plugin-auth/server/errors.js
new file mode 100644
index 000000000..808ceb3a6
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/errors.js
@@ -0,0 +1,25 @@
+const { TalkError } = require('errors');
+
+// ErrNoLocalProfile is returned when there is no existing local profile
+// attached to a user.
+class ErrNoLocalProfile extends TalkError {
+  constructor() {
+    super('No local profile associated with account', {
+      translation_key: 'NO_LOCAL_PROFILE',
+      status: 400,
+    });
+  }
+}
+
+// ErrLocalProfile is returned when a profile is already attached to a user and
+// the user is trying to attach a new profile to it.
+class ErrLocalProfile extends TalkError {
+  constructor() {
+    super('Local profile already associated with account', {
+      translation_key: 'LOCAL_PROFILE',
+      status: 400,
+    });
+  }
+}
+
+module.exports = { ErrLocalProfile, ErrNoLocalProfile };
diff --git a/plugins/talk-plugin-auth/server/mutators.js b/plugins/talk-plugin-auth/server/mutators.js
new file mode 100644
index 000000000..9fe0dd0db
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/mutators.js
@@ -0,0 +1,158 @@
+const {
+  ErrNotAuthorized,
+  ErrPasswordTooShort,
+  ErrNotFound,
+  ErrEmailTaken,
+} = require('errors');
+const { ErrNoLocalProfile, ErrLocalProfile } = require('./errors');
+const { get } = require('lodash');
+const bcrypt = require('bcryptjs');
+
+function hasLocalProfile(user) {
+  return Boolean(
+    get(user, 'profiles', []).find(({ provider }) => provider === 'local')
+  );
+}
+
+// updateUserEmailAddress will verify that the user has sent the correct
+// password followed by executing the email change and notifying the emails
+// about that change.
+async function updateUserEmailAddress(ctx, email, confirmPassword) {
+  const {
+    user,
+    loaders: { Settings },
+    connectors: { models: { User }, services: { Mailer, I18n, Users } },
+  } = ctx;
+
+  // Ensure that the user has a local profile associated with their account.
+  if (!hasLocalProfile(user)) {
+    throw new ErrNoLocalProfile();
+  }
+
+  // Ensure that the password provided matches what we have on file.
+  if (!await user.verifyPassword(confirmPassword)) {
+    throw new ErrNotAuthorized();
+  }
+
+  // Cleanup the email address.
+  email = email.toLowerCase().trim();
+
+  // Update the Users email address.
+  await User.update(
+    {
+      id: user.id,
+      profiles: { $elemMatch: { provider: 'local' } },
+    },
+    {
+      $set: { 'profiles.$.id': email },
+    }
+  );
+
+  // Get some context for the email to be sent.
+  const { organizationContactEmail } = await Settings.load([
+    'organizationContactEmail',
+  ]);
+
+  // Send off the email to the old email address that we have changed it.
+  await Mailer.send({
+    email: user.firstEmail,
+    template: 'plain',
+    locals: {
+      body: I18n.t(
+        'email.email_change_original.body',
+        user.email,
+        email,
+        organizationContactEmail
+      ),
+    },
+    subject: I18n.t('email.email_change_original.subject'),
+  });
+
+  // Send off the email to the new email address that we need to verify the new
+  // address.
+  await Users.sendEmailConfirmation(user, email);
+}
+
+// attachUserLocalAuth will attach a new local profile to an existing user.
+async function attachUserLocalAuth(ctx, email, password) {
+  const { user, connectors: { models: { User }, services: { Users } } } = ctx;
+
+  // Ensure that the current user doesn't already have a local account
+  // associated with them.
+  if (hasLocalProfile(user)) {
+    throw new ErrLocalProfile();
+  }
+
+  // Cleanup the email address.
+  email = email.toLowerCase().trim();
+
+  // Validate the password.
+  if (!password || password.length < 8) {
+    throw new ErrPasswordTooShort();
+  }
+
+  // Hash the new password.
+  const hashedPassword = await bcrypt.hash(password, 10);
+
+  try {
+    // Associate the account with the user.
+    const updatedUser = await User.findOneAndUpdate(
+      {
+        id: user.id,
+        'profiles.provider': { $ne: 'local' },
+      },
+      {
+        $push: {
+          profiles: {
+            provider: 'local',
+            id: email,
+          },
+        },
+        $set: {
+          password: hashedPassword,
+        },
+      },
+      { new: true }
+    );
+    if (!updatedUser) {
+      const foundUser = await User.findOne({ id: user.id });
+      if (foundUser === null) {
+        throw new ErrNotFound();
+      }
+
+      if (hasLocalProfile(foundUser)) {
+        throw new ErrLocalProfile();
+      }
+
+      throw new Error('local auth attachment failed due to unexpected reason');
+    }
+
+    // Send off the email to the new email address that we need to verify the
+    // new address.
+    await Users.sendEmailConfirmation(updatedUser, email);
+  } catch (err) {
+    if (err.code === 11000) {
+      throw new ErrEmailTaken();
+    }
+    throw err;
+  }
+}
+
+module.exports = ctx => {
+  const mutators = {
+    User: {
+      updateEmailAddress: () => Promise.reject(new ErrNotAuthorized()),
+      attachLocalAuth: () => Promise.reject(new ErrNotAuthorized()),
+    },
+  };
+
+  if (ctx.user) {
+    mutators.User.updateEmailAddress = ({ email, confirmPassword }) =>
+      updateUserEmailAddress(ctx, email, confirmPassword);
+
+    mutators.User.attachLocalAuth = ({ email, password }) =>
+      attachUserLocalAuth(ctx, email, password);
+  }
+
+  return mutators;
+};
diff --git a/plugins/talk-plugin-auth/server/resolvers.js b/plugins/talk-plugin-auth/server/resolvers.js
new file mode 100644
index 000000000..23815de00
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/resolvers.js
@@ -0,0 +1,10 @@
+module.exports = {
+  RootMutation: {
+    updateEmailAddress: async (root, { input }, { mutators: { User } }) => {
+      await User.updateEmailAddress(input);
+    },
+    attachLocalAuth: async (root, { input }, { mutators: { User } }) => {
+      await User.attachLocalAuth(input);
+    },
+  },
+};
diff --git a/plugins/talk-plugin-auth/server/translations.yml b/plugins/talk-plugin-auth/server/translations.yml
new file mode 100644
index 000000000..d35b02525
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/translations.yml
@@ -0,0 +1,8 @@
+en:
+  email:
+    email_change_original:
+      subject: Email change
+      body: Your email address has been changed from {0} to {1}. If you did not initiate this change, please contact {2}.
+  error:
+    NO_LOCAL_PROFILE: No existing email address is associated with this account.
+    LOCAL_PROFILE: An email address is already associated with this account.
diff --git a/plugins/talk-plugin-auth/server/typeDefs.graphql b/plugins/talk-plugin-auth/server/typeDefs.graphql
new file mode 100644
index 000000000..6202e8842
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/typeDefs.graphql
@@ -0,0 +1,47 @@
+# UpdateEmailAddressInput provides input for changing a users email address
+# associated with their account.
+input UpdateEmailAddressInput {
+
+  # email is the Users email address that they want to update to.
+  email: String!
+
+  # confirmPassword is the Users current password.
+  confirmPassword: String!
+}
+
+# UpdateEmailAddressResponse is returned when you try to update a users email
+# address.
+type UpdateEmailAddressResponse implements Response {
+
+  # An array of errors relating to the mutation that occurred.
+  errors: [UserError!]
+}
+
+# AttachLocalAuthInput provides the input for attaching a new local
+# authentication profile.
+input AttachLocalAuthInput {
+
+  # email is the Users email address that they want to add.
+  email: String!
+
+  # password is the Users password that they want to add.
+  password: String!
+}
+
+# AttachLocalAuthResponse returns any errors for when the user attempts to
+# attach a new local authentication profile.
+type AttachLocalAuthResponse implements Response {
+
+  # An array of errors relating to the mutation that occurred.
+  errors: [UserError!]
+}
+
+type RootMutation {
+
+  # updateEmailAddress changes the email address of the current logged in user.
+  updateEmailAddress(input: UpdateEmailAddressInput!): UpdateEmailAddressResponse
+
+  # attachLocalAuth will attach a new local authentication profile to an
+  # account.
+  attachLocalAuth(input: AttachLocalAuthInput!): AttachLocalAuthResponse
+}
diff --git a/plugins/talk-plugin-auth/server/typeDefs.js b/plugins/talk-plugin-auth/server/typeDefs.js
new file mode 100644
index 000000000..7ab1954e1
--- /dev/null
+++ b/plugins/talk-plugin-auth/server/typeDefs.js
@@ -0,0 +1,7 @@
+const fs = require('fs');
+const path = require('path');
+
+module.exports = fs.readFileSync(
+  path.join(__dirname, 'typeDefs.graphql'),
+  'utf8'
+);

From 7d644115d1fc79fe70886e04b1325918f40917ca Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 20 Apr 2018 13:11:35 -0600
Subject: [PATCH 005/160] cleanups

---
 plugins/talk-plugin-auth/server/mutators.js   | 25 +++++++------------
 .../talk-plugin-auth/server/translations.yml  |  2 +-
 2 files changed, 10 insertions(+), 17 deletions(-)

diff --git a/plugins/talk-plugin-auth/server/mutators.js b/plugins/talk-plugin-auth/server/mutators.js
index 9fe0dd0db..fb866b92c 100644
--- a/plugins/talk-plugin-auth/server/mutators.js
+++ b/plugins/talk-plugin-auth/server/mutators.js
@@ -1,18 +1,12 @@
-const {
-  ErrNotAuthorized,
-  ErrPasswordTooShort,
-  ErrNotFound,
-  ErrEmailTaken,
-} = require('errors');
+const { ErrNotAuthorized, ErrNotFound, ErrEmailTaken } = require('errors');
 const { ErrNoLocalProfile, ErrLocalProfile } = require('./errors');
 const { get } = require('lodash');
 const bcrypt = require('bcryptjs');
 
-function hasLocalProfile(user) {
-  return Boolean(
-    get(user, 'profiles', []).find(({ provider }) => provider === 'local')
-  );
-}
+// hasLocalProfile checks a user's profiles to see if they already have a local
+// profile associated with their account.
+const hasLocalProfile = user =>
+  get(user, 'profiles', []).some(({ provider }) => provider === 'local');
 
 // updateUserEmailAddress will verify that the user has sent the correct
 // password followed by executing the email change and notifying the emails
@@ -60,7 +54,7 @@ async function updateUserEmailAddress(ctx, email, confirmPassword) {
     locals: {
       body: I18n.t(
         'email.email_change_original.body',
-        user.email,
+        user.firstEmail,
         email,
         organizationContactEmail
       ),
@@ -87,9 +81,7 @@ async function attachUserLocalAuth(ctx, email, password) {
   email = email.toLowerCase().trim();
 
   // Validate the password.
-  if (!password || password.length < 8) {
-    throw new ErrPasswordTooShort();
-  }
+  await Users.isValidPassword(password);
 
   // Hash the new password.
   const hashedPassword = await bcrypt.hash(password, 10);
@@ -116,10 +108,11 @@ async function attachUserLocalAuth(ctx, email, password) {
     );
     if (!updatedUser) {
       const foundUser = await User.findOne({ id: user.id });
-      if (foundUser === null) {
+      if (!foundUser) {
         throw new ErrNotFound();
       }
 
+      // Check to see if this was the result of a race.
       if (hasLocalProfile(foundUser)) {
         throw new ErrLocalProfile();
       }
diff --git a/plugins/talk-plugin-auth/server/translations.yml b/plugins/talk-plugin-auth/server/translations.yml
index d35b02525..7df3d7b88 100644
--- a/plugins/talk-plugin-auth/server/translations.yml
+++ b/plugins/talk-plugin-auth/server/translations.yml
@@ -2,7 +2,7 @@ en:
   email:
     email_change_original:
       subject: Email change
-      body: Your email address has been changed from {0} to {1}. If you did not initiate this change, please contact {2}.
+      body: Your email address has been changed from {0} to {1}. If you did not initiate this change, please contact {2}. # TODO: update translation
   error:
     NO_LOCAL_PROFILE: No existing email address is associated with this account.
     LOCAL_PROFILE: An email address is already associated with this account.

From 10d27357f49fcb688a2de9d54c3db87dca23faea Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 20 Apr 2018 13:17:57 -0600
Subject: [PATCH 006/160] reorganized

---
 .gitignore                                    |  5 +++--
 plugins.default.json                          | 11 +++++-----
 plugins/talk-plugin-auth/README.md            |  1 -
 plugins/talk-plugin-auth/index.js             | 12 +----------
 plugins/talk-plugin-local-auth/README.md      | 20 +++++++++++++++++++
 plugins/talk-plugin-local-auth/index.js       | 11 ++++++++++
 .../server/errors.js                          |  0
 .../server/mutators.js                        |  0
 .../server/resolvers.js                       |  0
 .../server/translations.yml                   |  0
 .../server/typeDefs.graphql                   |  0
 .../server/typeDefs.js                        |  0
 12 files changed, 41 insertions(+), 19 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/README.md
 create mode 100644 plugins/talk-plugin-local-auth/index.js
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/errors.js (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/mutators.js (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/resolvers.js (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/translations.yml (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/typeDefs.graphql (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-local-auth}/server/typeDefs.js (100%)

diff --git a/.gitignore b/.gitignore
index e8cb92653..9373b1893 100644
--- a/.gitignore
+++ b/.gitignore
@@ -38,6 +38,7 @@ plugins/*
 !plugins/talk-plugin-google-auth
 !plugins/talk-plugin-ignore-user
 !plugins/talk-plugin-like
+!plugins/talk-plugin-local-auth
 !plugins/talk-plugin-love
 !plugins/talk-plugin-member-since
 !plugins/talk-plugin-mod
@@ -50,10 +51,11 @@ plugins/*
 !plugins/talk-plugin-notifications-digest-hourly
 !plugins/talk-plugin-offtopic
 !plugins/talk-plugin-permalink
-!plugins/talk-plugin-profile-settings
 !plugins/talk-plugin-profile-data
+!plugins/talk-plugin-profile-settings
 !plugins/talk-plugin-remember-sort
 !plugins/talk-plugin-respect
+!plugins/talk-plugin-rich-text
 !plugins/talk-plugin-slack-notifications
 !plugins/talk-plugin-sort-most-downvoted
 !plugins/talk-plugin-sort-most-liked
@@ -67,7 +69,6 @@ plugins/*
 !plugins/talk-plugin-toxic-comments
 !plugins/talk-plugin-upvote
 !plugins/talk-plugin-viewing-options
-!plugins/talk-plugin-rich-text
 
 **/node_modules/*
 yarn-error.log
diff --git a/plugins.default.json b/plugins.default.json
index e1011aa87..0fbc6e658 100644
--- a/plugins.default.json
+++ b/plugins.default.json
@@ -1,9 +1,9 @@
 {
   "server": [
-    "talk-plugin-auth",
     "talk-plugin-featured-comments",
-    "talk-plugin-respect",
-    "talk-plugin-profile-data"
+    "talk-plugin-local-auth",
+    "talk-plugin-profile-data",
+    "talk-plugin-respect"
   ],
   "client": [
     "talk-plugin-auth",
@@ -11,15 +11,16 @@
     "talk-plugin-featured-comments",
     "talk-plugin-flag-details",
     "talk-plugin-ignore-user",
+    "talk-plugin-local-auth",
     "talk-plugin-member-since",
     "talk-plugin-moderation-actions",
     "talk-plugin-permalink",
+    "talk-plugin-profile-data",
     "talk-plugin-respect",
     "talk-plugin-sort-most-replied",
     "talk-plugin-sort-most-respected",
     "talk-plugin-sort-newest",
     "talk-plugin-sort-oldest",
-    "talk-plugin-viewing-options",
-    "talk-plugin-profile-data"
+    "talk-plugin-viewing-options"
   ]
 }
diff --git a/plugins/talk-plugin-auth/README.md b/plugins/talk-plugin-auth/README.md
index 0a00db5ea..fd5218365 100644
--- a/plugins/talk-plugin-auth/README.md
+++ b/plugins/talk-plugin-auth/README.md
@@ -7,7 +7,6 @@ plugin:
     default: true
     provides:
         - Client
-        - Server
 ---
 
 This provides the base plugin that is the basis for all auth based plugins that
diff --git a/plugins/talk-plugin-auth/index.js b/plugins/talk-plugin-auth/index.js
index 7e4ee6a3c..f053ebf79 100644
--- a/plugins/talk-plugin-auth/index.js
+++ b/plugins/talk-plugin-auth/index.js
@@ -1,11 +1 @@
-const typeDefs = require('./server/typeDefs');
-const resolvers = require('./server/resolvers');
-const mutators = require('./server/mutators');
-const path = require('path');
-
-module.exports = {
-  translations: path.join(__dirname, 'server', 'translations.yml'),
-  typeDefs,
-  mutators,
-  resolvers,
-};
+module.exports = {};
diff --git a/plugins/talk-plugin-local-auth/README.md b/plugins/talk-plugin-local-auth/README.md
new file mode 100644
index 000000000..ee5a6b880
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/README.md
@@ -0,0 +1,20 @@
+---
+title: talk-plugin-local-auth
+permalink: /plugin/talk-plugin-local-auth/
+layout: plugin
+plugin:
+    name: talk-plugin-local-auth
+    default: true
+    provides:
+        - Client
+        - Server
+---
+
+This plugin will eventually contain all the local authentication code that is
+responsible for creating, resetting, and managing accounts provided locally
+through an email and password based login.
+
+## Features
+
+- *Email Change*: Allows users to change their existing email address on their account.
+- *Local Account Association*: Allows users that have signed up with an external auth strategy (such as Google) the ability to associate a email address and password for login. **Note: Existing users with external authentication will be prompted to setup a local account when they sign in and when new users create an account.**
diff --git a/plugins/talk-plugin-local-auth/index.js b/plugins/talk-plugin-local-auth/index.js
new file mode 100644
index 000000000..7e4ee6a3c
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/index.js
@@ -0,0 +1,11 @@
+const typeDefs = require('./server/typeDefs');
+const resolvers = require('./server/resolvers');
+const mutators = require('./server/mutators');
+const path = require('path');
+
+module.exports = {
+  translations: path.join(__dirname, 'server', 'translations.yml'),
+  typeDefs,
+  mutators,
+  resolvers,
+};
diff --git a/plugins/talk-plugin-auth/server/errors.js b/plugins/talk-plugin-local-auth/server/errors.js
similarity index 100%
rename from plugins/talk-plugin-auth/server/errors.js
rename to plugins/talk-plugin-local-auth/server/errors.js
diff --git a/plugins/talk-plugin-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
similarity index 100%
rename from plugins/talk-plugin-auth/server/mutators.js
rename to plugins/talk-plugin-local-auth/server/mutators.js
diff --git a/plugins/talk-plugin-auth/server/resolvers.js b/plugins/talk-plugin-local-auth/server/resolvers.js
similarity index 100%
rename from plugins/talk-plugin-auth/server/resolvers.js
rename to plugins/talk-plugin-local-auth/server/resolvers.js
diff --git a/plugins/talk-plugin-auth/server/translations.yml b/plugins/talk-plugin-local-auth/server/translations.yml
similarity index 100%
rename from plugins/talk-plugin-auth/server/translations.yml
rename to plugins/talk-plugin-local-auth/server/translations.yml
diff --git a/plugins/talk-plugin-auth/server/typeDefs.graphql b/plugins/talk-plugin-local-auth/server/typeDefs.graphql
similarity index 100%
rename from plugins/talk-plugin-auth/server/typeDefs.graphql
rename to plugins/talk-plugin-local-auth/server/typeDefs.graphql
diff --git a/plugins/talk-plugin-auth/server/typeDefs.js b/plugins/talk-plugin-local-auth/server/typeDefs.js
similarity index 100%
rename from plugins/talk-plugin-auth/server/typeDefs.js
rename to plugins/talk-plugin-local-auth/server/typeDefs.js

From 8e21857a529bef586bcd3f2a1abb656a9bc740ec Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 20 Apr 2018 13:20:11 -0600
Subject: [PATCH 007/160] added new plugin to registry

---
 docs/source/_data/plugins.yml | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/docs/source/_data/plugins.yml b/docs/source/_data/plugins.yml
index a5621b0d6..35d88cb14 100644
--- a/docs/source/_data/plugins.yml
+++ b/docs/source/_data/plugins.yml
@@ -3,7 +3,12 @@
   tags:
     - moderation
 - name: talk-plugin-auth
-  description: Enables internal authentication from Coral.
+  description: Enables internal sign-in authentication.
+  tags:
+    - default
+    - auth
+- name: talk-plugin-local-auth
+  description: Enables email and password based authentication.
   tags:
     - default
     - auth

From 94710261622363b4d3bdaa2531a59d7490793f3e Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 20 Apr 2018 13:20:55 -0600
Subject: [PATCH 008/160] Referenced new plugin

---
 docs/source/plugin/talk-plugin-local-auth.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 120000 docs/source/plugin/talk-plugin-local-auth.md

diff --git a/docs/source/plugin/talk-plugin-local-auth.md b/docs/source/plugin/talk-plugin-local-auth.md
new file mode 120000
index 000000000..918f29118
--- /dev/null
+++ b/docs/source/plugin/talk-plugin-local-auth.md
@@ -0,0 +1 @@
+../../../plugins/talk-plugin-local-auth/README.md
\ No newline at end of file

From c27c60346e62482c1c303737c97c77d16dccd417 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 20 Apr 2018 13:27:03 -0600
Subject: [PATCH 009/160] fixed client building

---
 plugins/talk-plugin-local-auth/client/.eslintrc.json | 3 +++
 plugins/talk-plugin-local-auth/client/index.js       | 1 +
 2 files changed, 4 insertions(+)
 create mode 100644 plugins/talk-plugin-local-auth/client/.eslintrc.json
 create mode 100644 plugins/talk-plugin-local-auth/client/index.js

diff --git a/plugins/talk-plugin-local-auth/client/.eslintrc.json b/plugins/talk-plugin-local-auth/client/.eslintrc.json
new file mode 100644
index 000000000..c8a6db18a
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/.eslintrc.json
@@ -0,0 +1,3 @@
+{
+  "extends": "@coralproject/eslint-config-talk/client"
+}
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
new file mode 100644
index 000000000..ff8b4c563
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -0,0 +1 @@
+export default {};

From b8d435fb07df7c57ee0bf693ff51525a5e513a6e Mon Sep 17 00:00:00 2001
From: Jero <jero@daneel.net>
Date: Thu, 26 Apr 2018 18:29:25 -0300
Subject: [PATCH 010/160] Added missing spanish translations

---
 locales/es.yml | 123 +++++++++++++++++++++++++------------------------
 1 file changed, 62 insertions(+), 61 deletions(-)

diff --git a/locales/es.yml b/locales/es.yml
index dd85b588e..702f6b9e0 100644
--- a/locales/es.yml
+++ b/locales/es.yml
@@ -16,26 +16,27 @@ es:
     send: "Enviar"
     notify_ban_headline: "Notificar al usuario de la suspensión"
     notify_ban_description: "Esto notificará al usuario por email que fueron suspendidos de la comunidad"
-    email_message_ban: "Dear {0},\n\nSomeone with access to your account has violated our community guidelines. As a result, your account has been banned. You will no longer be able to comment, like or report comments. if you think this has been done in error, please contact our community team."
+    email_message_ban: "Estimado/a {0},\n\nUsted o alguien con acceso a su cuenta a violado los lineamientos de nuestra comunidad. Como consecuencia de esto, su cuenta fue bloqueada. No podrá realizar ni reportar más comentarios. Si usted piensa que esto ha sido un error, por favor contáctese con nosotros."
   bio_offensive: "Esta biografia es ofensiva"
   cancel: Cancelar
   confirm_email:
-    click_to_confirm: "Click below to confirm your email address"
-    confirm: "Confirm"
+    click_to_confirm: "Haga click debajo para confirmar su dirección de email"
+    confirm: "Confirmar"
   password_reset:
-    set_new_password: "Change Your Password"
-    new_password: "New Password"
-    new_password_help: "Password must be at least 8 characters"
-    confirm_new_password: "Confirm New Password"
-    change_password: "Change Password"
-  characters_remaining: "carácteres restantes"
+    mail_sent: 'Si tiene una cuenta registrada, un enlace para resetear su clave ha sido enviado a esa dirección de correo.'
+    set_new_password: "Cambie su contraseña"
+    new_password: "Nueva contraseña"
+    new_password_help: "La contraseña debe tener al menos 8 caracteres"
+    confirm_new_password: "Confirme su nueva contraseña"
+    change_password: "Cambio de contraseña"
+  characters_remaining: "caracteres restantes"
   comment:
     anon: Anónimo
-    undo_reject: "Undo"
+    undo_reject: "Deshacer"
     ban_user: "Usuario Suspendido"
     comment: "Publicar un comentario"
     edited: Editado
-    flagged: reportado
+    flagged: Reportado
     view_context: "Ver contexto"
   comment_box:
     post: "Publicar"
@@ -62,16 +63,16 @@ es:
     reactions: 'reacciones'
     story: 'Artículo'
   flagged_usernames:
-    notify_approved: '{0} approved username {1}'
-    notify_rejected: '{0} rejected username {1}'
-    notify_flagged: '{0} reported username {1}'
-    notify_changed: 'user {0} changed their username to {1}'
+    notify_approved: '{0} nombre de usuario aprobado {1}'
+    notify_rejected: '{0} nombre de usuario rechazado {1}'
+    notify_flagged: '{0} nombre de usuario reportado {1}'
+    notify_changed: 'El usuario {0} cambio su nombre de usuario por {1}'
   community:
     account_creation_date: "Fecha de creación de la cuenta"
     active: Activa
     admin: Administrator
-    ads_marketing: "This looks like an ad/marketing"
-    are_you_sure: "¿Estas segura que quieres suspender a {0}?"
+    ads_marketing: "Esto parece ser un ad/marketing"
+    are_you_sure: "¿Estás segura que quieres suspender a {0}?"
     ban_user: "¿Quieres suspender al Usuario?"
     banned: Suspendido
     banned_user: "Usuario Suspendido"
@@ -193,10 +194,10 @@ es:
     minutes_plural: "minutos"
   email:
     suspended:
-      subject: "Your account has been suspended"
+      subject: "Su cuenta fue suspendida"
     banned:
-      subject: "Your account has been banned"
-      body: "In accordance with The Coral Project’s community guidelines, your account has been banned. You are now longer allowed to comment, flag or engage with our community."
+      subject: "Su cuenta fue bloqueada"
+      body: "De acuerdo con las guías de comunidad de The Coral Project, su cuenta a sido bloqueada. No podrá hacer comentarios, reportar o entrar en contacto con nuestra comunidad."
     confirm:
       has_been_requested: "Un correo de confirmación ha sido pedido para la siguiente cuenta:"
       to_confirm: "Para confirmar la cuenta, por favor visitar el siguiente enlace:"
@@ -211,8 +212,8 @@ es:
     copy: "Copiar al portapapeles"
   error:
     COMMENT_PARENT_NOT_VISIBLE: "El comentario a la que estás contestando ha sido eliminado o no existe."
-    EMAIL_VERIFICATION_TOKEN_INVALID: "Email verification token is invalid."
-    PASSWORD_RESET_TOKEN_INVALID: "Your password reset link is invalid."
+    EMAIL_VERIFICATION_TOKEN_INVALID: "El token de verificación de su cuenta de correo es inválido."
+    PASSWORD_RESET_TOKEN_INVALID: "El enlace para resetear su clave es inválido."
     COMMENT_TOO_SHORT: "Tu comentario debe tener algo escrito"
     NOT_AUTHORIZED: "Acción no autorizada."
     NO_SPECIAL_CHARACTERS: "Los nombres pueden contener letras números y _"
@@ -221,19 +222,19 @@ es:
     RATE_LIMIT_EXCEEDED: "Rate limit exceeded"
     USERNAME_IN_USE: "Este nombre ya está siendo usado."
     USERNAME_REQUIRED: "Debe ingresar un nombre"
-    EMAIL_NOT_VERIFIED: "E-mail address not verified"
-    EDIT_WINDOW_ENDED:: "No puedes editar este comentario. El tiempo de edición ha expirado."
+    EMAIL_NOT_VERIFIED: "La cuenta de email no ha sido verificada."
+    EDIT_WINDOW_ENDED: "No puedes editar este comentario. El tiempo de edición ha expirado."
     EDIT_USERNAME_NOT_AUTHORIZED: "No tiene permiso para editar el nombre de usuario."
-    SAME_USERNAME_PROVIDED: "You must submit a different username."
+    SAME_USERNAME_PROVIDED: "Debe proporcinar un nombre de usuario diferente."
     EMAIL_IN_USE: "Este correo se encuentra en uso"
     EMAIL_REQUIRED: "Se requiere un correo"
     LOGIN_MAXIMUM_EXCEEDED: "Ha realizado demasiados intentos fallidos de usar la contraseña. Por favor espere."
     PASSWORD_REQUIRED: "Debe ingresar la contraseña"
     COMMENTING_CLOSED: "Los comentarios ya estan cerrados"
     NOT_FOUND: "Recurso no encontrado"
-    ALREADY_EXISTS: "Resource already exists"
+    ALREADY_EXISTS: "El recurso ya existe"
     INVALID_ASSET_URL: "La URL del articulo no es valida"
-    CANNOT_IGNORE_STAFF: "Cannot ignore Staff members."
+    CANNOT_IGNORE_STAFF: "No puede ignorar a miembros del Staff."
     email: "No es un correo válido"
     confirm_password: "Las contraseñas no coinciden. Inténtelo nuevamente"
     network_error: "Error al conectar con el servidor. Compruebe su conexión a Internet y vuelva a intentarlo."
@@ -243,8 +244,8 @@ es:
     password: "La contraseña debe tener por lo menos 8 caracteres"
     username: "Los nombres pueden contener letras números y _"
     required_field: "Este campo es requerido"
-    unexpected: "Lo siento. Ha habido un error no previsto."
-    temporarily_suspended: "Your account is currently suspended. It will be reactivated {0}. Please contact us if you have any questions."
+    unexpected: "Lo siento. Ha ocurrido un error no previsto."
+    temporarily_suspended: "Su cuenta fue suspendida. Será reactivada {0}. Si tiene preguntas, por favor contáctese con nosotros."
   flag_comment: "Reportar este comentario"
   flag_reason: "Razón por la que hacer este reporte (Opcional)"
   flag_username: "Reportar el nombre de usuario"
@@ -264,7 +265,7 @@ es:
       label: "Nuevo Nombre"
       msg: "Tu cuenta está suspendida porque tu nombre de usuario ha sido considerado no apropiado para el espacio. Para recuperar la cuenta, por favor ingresar un nuevo nombre de usuario. Contáctanos si tienes alguna pregunta."
     changed_name:
-      msg: "Your username change is under review by our moderation team."
+      msg: "El cambio en su nombre de usuario está siendo revisado por nuestro equipo de moderación."
     my_comments: "Mis Comentarios"
     my_profile: "Mi perfil"
     new_count: "Ver {0} más {1} "
@@ -295,9 +296,9 @@ es:
          comment_spam: "Contiene spam"
          comment_noagree: "No está de acuerdo"
          comment_other: "Otra razón"
-         suspect_word: "Suspect Word"
-         banned_word: "Banned Word"
-         body_count: "Body exceeds max length"
+         suspect_word: "Palabra sospechosa"
+         banned_word: "Palabra prohibida"
+         body_count: "El texto exede el límite permitido"
          trust: "Trust"
          links: "Link"
   modqueue:
@@ -305,14 +306,14 @@ es:
     actions: Acciones
     all: todos
     all_streams: "Todos los Hilos"
-    notify_edited: '{0} edited comment "{1}"'
-    notify_accepted: '{0} accepted comment "{1}"'
-    notify_rejected: '{0} rejected comment "{1}"'
-    notify_flagged: '{0} flagged comment "{1}"'
-    notify_reset: '{0} reset status of comment "{1}"'
+    notify_edited: '{0} comentarios editados "{1}"'
+    notify_accepted: '{0} comentarios aceptados "{1}"'
+    notify_rejected: '{0} comentarios rechazados "{1}"'
+    notify_flagged: '{0} comentarios reportados "{1}"'
+    notify_reset: '{0} resetear el status de comentarios "{1}"'
     approve: "Aprobar"
     approved: "Aprobado"
-    ban_user: "Ban"
+    ban_user: "Bloquear"
     billion: B
     close: Cerrar
     empty_queue: "¡No hay más comentarios para moderar! Tiempo para un ☕️"
@@ -352,7 +353,7 @@ es:
   no_agree_comment: "No estoy de acuerdo con este comentario"
   no_like_bio: "No me gusta esta biografia"
   no_like_username: "No me gusta este nombre de usuario"
-  already_flagged_username: "You have already flagged this username."
+  already_flagged_username: "Usted ya reportó a este usuario."
   other: Otro
   permalink: Compartir
   personal_info: "Este comentario muestra información personal"
@@ -428,28 +429,28 @@ es:
     user_bio: "Bio de Usuario"
     username_flags: "reportes para este nombre de usuario"
   user_detail:
-    remove_suspension: "Remove Suspension"
-    suspend: "Suspend User"
-    remove_ban: "Remove Ban"
-    ban: "Ban User"
-    member_since: "Member Since"
+    remove_suspension: "Cancelar suspensión"
+    suspend: "Suspender usuario"
+    remove_ban: "Cancelar bloqueo"
+    ban: "Bloquear usuario"
+    member_since: "Miembro desde"
     email: "Email"
-    total_comments: "Total Comments"
+    total_comments: "Comentarios totales"
     reject_rate: "Reject Rate"
-    reports: "Reports"
-    all: "All"
-    rejected: "Rejected"
-    user_history: "User History"
+    reports: "Reportes"
+    all: "Todo"
+    rejected: "Rechazar"
+    user_history: "Historial del usuario"
   user_history:
-    user_banned: "User banned"
-    ban_removed: "Ban removed"
-    username_status: "Username {0}"
-    suspended: "Suspended, {0}"
-    suspension_removed: "Suspension removed"
-    system: "System"
-    date: "Date"
-    action: "Action"
-    taken_by: "Taken By"
+    user_banned: "Usuario bloqueado"
+    ban_removed: "Bloqueo cancelado"
+    username_status: "Nombre de usuario {0}"
+    suspended: "Suspendido, {0}"
+    suspension_removed: "Suspensión cancelada"
+    system: "Sistema"
+    date: "Fecha"
+    action: "Acción"
+    taken_by: "Está en uso"
   user_impersonating: "Este usuario suplanta a alguien"
   user_no_comment: "No has dejado aún ningún comentario. ¡Únete a la conversación!"
   username_offensive: "Este nombre de usuario es ofensivo"
@@ -477,5 +478,5 @@ es:
       launch: "Iniciar Talk"
       close: "Cerrar este instalador"
   admin_sidebar:
-    view_options: "View Options"
-    sort_comments: "Sort Comments"
+    view_options: "Ver opciones"
+    sort_comments: "Ordenar comentarios"

From e67d68267c6791d1f7d98f489ddb7612edfac202 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Sun, 29 Apr 2018 22:00:42 -0300
Subject: [PATCH 011/160] Adding Change Email

---
 .../components/ChangeEmailDialog.css          | 77 +++++++++++++++
 .../components/ChangeEmailDialog.js           | 98 +++++++++++++++++++
 .../components/ChangeUsername.js              | 96 ++++++++++++++----
 .../talk-plugin-auth/client/translations.yml  | 11 +++
 4 files changed, 264 insertions(+), 18 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css
new file mode 100644
index 000000000..a57c3662b
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css
@@ -0,0 +1,77 @@
+.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;
+}
+
+.bottomActions {
+  text-align: right;
+}
+
+.emailChange {
+  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;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js
new file mode 100644
index 000000000..844b900e7
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js
@@ -0,0 +1,98 @@
+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 ChangeEmailDialog extends React.Component {
+  state = {
+    showError: false,
+    errors: {
+      passowrd: '',
+    },
+  };
+
+  showError = () => {
+    this.setState({
+      showError: true,
+    });
+  };
+
+  confirmChanges = async () => {
+    if (this.formHasError()) {
+      this.showError();
+    } else {
+      await this.props.saveChanges();
+      this.props.closeDialog();
+    }
+  };
+
+  render() {
+    return (
+      <Dialog
+        open={this.props.showDialog}
+        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
+      >
+        <span className={styles.close} onClick={this.props.closeDialog}>
+          ×
+        </span>
+        <h1 className={styles.title}>
+          {t('talk-plugin-auth.change_email.confirm_email_change')}
+        </h1>
+        <div className={styles.content}>
+          <p className={styles.description}>
+            {t('talk-plugin-auth.change_email.description')}
+          </p>
+          <div className={styles.emailChange}>
+            <span className={styles.item}>
+              {t('talk-plugin-auth.change_email.old_email')}: {this.props.email}
+            </span>
+            <span className={styles.item}>
+              {t('talk-plugin-auth.change_email.new_email')}:{' '}
+              {this.props.formData.newEmail}
+            </span>
+          </div>
+          <form>
+            <InputField
+              id="password"
+              label={t('talk-plugin-auth.change_email.enter_password')}
+              name="password"
+              type="password"
+              onChange={this.props.onChange}
+              defaultValue=""
+              hasError={this.state.errors.password && this.state.showError}
+              errorMsg={t('talk-plugin-auth.change_email.incorrect_password')}
+              showError={this.state.showError}
+              columnDisplay
+              showSuccess={false}
+            />
+          </form>
+          <div className={styles.bottomActions}>
+            <Button className={styles.cancel}>
+              {t('talk-plugin-auth.change_email.cancel')}
+            </Button>
+            <Button
+              className={styles.confirmChanges}
+              onClick={this.confirmChanges}
+            >
+              {t('talk-plugin-auth.change_email.confirm_change')}
+            </Button>
+          </div>
+        </div>
+      </Dialog>
+    );
+  }
+}
+
+ChangeEmailDialog.propTypes = {
+  saveChanges: PropTypes.func,
+  closeDialog: PropTypes.func,
+  showDialog: PropTypes.bool,
+  onChange: PropTypes.func,
+  email: PropTypes.string,
+  formData: PropTypes.object,
+};
+
+export default ChangeEmailDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
index df8b3a641..d9f020491 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
@@ -4,14 +4,18 @@ import PropTypes from 'prop-types';
 import styles from './ChangeUsername.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import ChangeUsernameDialog from './ChangeUsernameDialog';
+import ChangeEmailDialog from './ChangeEmailDialog';
 import { t } from 'plugin-api/beta/client/services';
 import InputField from './InputField';
 import { getErrorMessages } from 'coral-framework/utils';
+import validate from 'coral-framework/helpers/validate';
+import errorMsj from 'coral-framework/helpers/error';
 
 const initialState = {
   editing: false,
   showDialog: false,
   formData: {},
+  errors: {},
 };
 
 class ChangeUsername extends React.Component {
@@ -69,23 +73,72 @@ class ChangeUsername extends React.Component {
     this.disableEditing();
   };
 
-  onChange = e => {
-    const { name, value } = e.target;
-
-    this.setState(state => ({
-      formData: {
-        ...state.formData,
-        [name]: value,
-      },
+  addError = err => {
+    this.setState(({ errors }) => ({
+      errors: { ...errors, ...err },
     }));
   };
 
+  removeError = errKey => {
+    this.setState(state => {
+      const { [errKey]: _, ...errors } = state.errors;
+      return {
+        errors,
+      };
+    });
+  };
+
+  fieldValidation = (value, type, name) => {
+    if (!value.length) {
+      this.addError({
+        [name]: t('talk-plugin-auth.change_password.required_field'),
+      });
+    } else if (!validate[type](value)) {
+      this.addError({ [name]: errorMsj[type] });
+    } else {
+      this.removeError(name);
+    }
+  };
+
+  onChange = e => {
+    const { name, value, type, dataset } = e.target;
+    const validationType = dataset.validationType || type;
+
+    this.setState(
+      state => ({
+        formData: {
+          ...state.formData,
+          [name]: value,
+        },
+      }),
+      () => {
+        this.fieldValidation(value, validationType, name);
+      }
+    );
+  };
+
   closeDialog = () => {
     this.setState({
       showDialog: false,
     });
   };
 
+  hasError = err => {
+    return Object.keys(this.state.errors).indexOf(err) !== -1;
+  };
+
+  isSaveEnabled = () => {
+    const formHasErrors = !!Object.keys(this.state.errors).length;
+    const validUsername =
+      this.state.formData.newUsername &&
+      this.state.formData.newUsername !== this.props.username;
+    const validEmail =
+      this.state.formData.newEmail &&
+      this.state.formData.newEmail !== this.props.emailAddress;
+
+    return !formHasErrors && (validUsername || validEmail);
+  };
+
   render() {
     const { username, emailAddress } = this.props;
     const { editing } = this.state;
@@ -105,6 +158,15 @@ class ChangeUsername extends React.Component {
           saveChanges={this.saveChanges}
         />
 
+        <ChangeEmailDialog
+          showDialog={this.state.showDialog}
+          onChange={this.onChange}
+          formData={this.state.formData}
+          username={username}
+          closeDialog={this.closeDialog}
+          saveChanges={this.saveChanges}
+        />
+
         {editing ? (
           <div className={styles.content}>
             <div className={styles.detailList}>
@@ -114,8 +176,8 @@ class ChangeUsername extends React.Component {
                 name="newUsername"
                 onChange={this.onChange}
                 defaultValue={username}
-                columnDisplay
                 validationType="username"
+                columnDisplay
               >
                 <span className={styles.bottomText}>
                   {t('talk-plugin-auth.change_username.change_username_note')}
@@ -123,11 +185,12 @@ class ChangeUsername extends React.Component {
               </InputField>
               <InputField
                 icon="email"
-                id="email"
-                name="email"
-                value={emailAddress}
-                validationType="username"
-                disabled
+                id="newEmail"
+                name="newEmail"
+                onChange={this.onChange}
+                defaultValue={emailAddress}
+                validationType="email"
+                columnDisplay
               />
             </div>
           </div>
@@ -145,10 +208,7 @@ class ChangeUsername extends React.Component {
               className={cn(styles.button, styles.saveButton)}
               icon="save"
               onClick={this.onSave}
-              disabled={
-                !this.state.formData.newUsername ||
-                this.state.formData.newUsername === username
-              }
+              disabled={!this.isSaveEnabled()}
             >
               {t('talk-plugin-auth.change_username.save')}
             </Button>
diff --git a/plugins/talk-plugin-auth/client/translations.yml b/plugins/talk-plugin-auth/client/translations.yml
index 3cfb46a95..4ac5ae4e6 100644
--- a/plugins/talk-plugin-auth/client/translations.yml
+++ b/plugins/talk-plugin-auth/client/translations.yml
@@ -152,6 +152,17 @@ en:
       bottom_note: "Note: You will not be able to change your username again for 14 days"
       confirm_changes: "Confirm Changes"
       username_does_not_match: "Username does not match"
+      cant_be_equal: "Your new {0} must be different to your current one"
+    change_email:
+      confirm_email_change: "Confirm Email Address Change"
+      description: "You are attempting to change your email address. Your new email address will be used for your login and to receive account notifications."
+      old_email: "Old Email Address" 
+      new_email: "New Email Address"
+      enter_password: "Enter Password"
+      incorrect_password: "Incorrect Password"
+      confirm_change: "Confirm Change"
+      cancel: "Cancel"
+      change_email_msg: "Email Address Changed - Your email address has been successfully changed. This email address will now be used for signing in and email notifications"
 de:
   talk-plugin-auth:
     login:

From 8df9a1e66e37b904fe90aa7ab04ae23b631c0a9f Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 13:47:15 -0300
Subject: [PATCH 012/160] wip

---
 plugins/talk-plugin-auth/client/index.js      |  4 +--
 ...ialog.css => ChangeEmailContentDialog.css} |  0
 ...lDialog.js => ChangeEmailContentDialog.js} | 22 ++++++-------
 ...og.css => ChangeUsernameContentDialog.css} | 11 -------
 ...alog.js => ChangeUsernameContentDialog.js} | 18 +++++------
 .../components/ConfirmChangesDialog.css       | 10 ++++++
 .../components/ConfirmChangesDialog.js        | 22 +++++++++++++
 .../{ChangeUsername.css => Profile.css}       |  0
 .../{ChangeUsername.js => Profile.js}         | 31 +++++++++----------
 .../{ChangeUsername.js => Profile.js}         |  4 +--
 10 files changed, 67 insertions(+), 55 deletions(-)
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeEmailDialog.css => ChangeEmailContentDialog.css} (100%)
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeEmailDialog.js => ChangeEmailContentDialog.js} (83%)
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeUsernameDialog.css => ChangeUsernameContentDialog.css} (75%)
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeUsernameDialog.js => ChangeUsernameContentDialog.js} (86%)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeUsername.css => Profile.css} (100%)
 rename plugins/talk-plugin-auth/client/profile-settings/components/{ChangeUsername.js => Profile.js} (90%)
 rename plugins/talk-plugin-auth/client/profile-settings/containers/{ChangeUsername.js => Profile.js} (85%)

diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index 8fedb8033..6341dc7c9 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -5,7 +5,7 @@ import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
 import ChangePassword from './profile-settings/containers/ChangePassword';
-import ChangeUsername from './profile-settings/containers/ChangeUsername';
+import Profile from './profile-settings/containers/Profile';
 
 export default {
   reducer,
@@ -13,7 +13,7 @@ export default {
   slots: {
     stream: [UserBox, SignInButton, SetUsernameDialog],
     login: [Login],
-    profileHeader: [ChangeUsername],
+    profileHeader: [Profile],
     profileSettings: [ChangePassword],
   },
 };
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.css
rename to plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
similarity index 83%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js
rename to plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
index 844b900e7..1bb8f7410 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
@@ -1,12 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import cn from 'classnames';
-import styles from './ChangeUsernameDialog.css';
+import styles from './ChangeEmailContentDialog.css';
 import InputField from './InputField';
-import { Button, Dialog } from 'plugin-api/beta/client/components/ui';
+import { Button } from 'plugin-api/beta/client/components/ui';
 import { t } from 'plugin-api/beta/client/services';
 
-class ChangeEmailDialog extends React.Component {
+class ChangeEmailContentDialog extends React.Component {
   state = {
     showError: false,
     errors: {
@@ -31,10 +30,7 @@ class ChangeEmailDialog extends React.Component {
 
   render() {
     return (
-      <Dialog
-        open={this.props.showDialog}
-        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
-      >
+      <div>
         <span className={styles.close} onClick={this.props.closeDialog}>
           ×
         </span>
@@ -56,9 +52,9 @@ class ChangeEmailDialog extends React.Component {
           </div>
           <form>
             <InputField
-              id="password"
+              id="confirmPassword"
               label={t('talk-plugin-auth.change_email.enter_password')}
-              name="password"
+              name="confirmPassword"
               type="password"
               onChange={this.props.onChange}
               defaultValue=""
@@ -81,12 +77,12 @@ class ChangeEmailDialog extends React.Component {
             </Button>
           </div>
         </div>
-      </Dialog>
+      </div>
     );
   }
 }
 
-ChangeEmailDialog.propTypes = {
+ChangeEmailContentDialog.propTypes = {
   saveChanges: PropTypes.func,
   closeDialog: PropTypes.func,
   showDialog: PropTypes.bool,
@@ -95,4 +91,4 @@ ChangeEmailDialog.propTypes = {
   formData: PropTypes.object,
 };
 
-export default ChangeEmailDialog;
+export default ChangeEmailContentDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.css
similarity index 75%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
rename to plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.css
index af681d596..2f3cdd14d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.css
@@ -1,14 +1,3 @@
-.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;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
similarity index 86%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
rename to plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
index 3ebf6ff02..4cf75a8a7 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
@@ -1,12 +1,11 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import cn from 'classnames';
-import styles from './ChangeUsernameDialog.css';
+import styles from './ChangeUsernameContentDialog.css';
 import InputField from './InputField';
-import { Button, Dialog } from 'plugin-api/beta/client/components/ui';
+import { Button } from 'plugin-api/beta/client/components/ui';
 import { t } from 'plugin-api/beta/client/services';
 
-class ChangeUsernameDialog extends React.Component {
+class ChangeUsernameContentDialog extends React.Component {
   state = {
     showError: false,
   };
@@ -31,10 +30,7 @@ class ChangeUsernameDialog extends React.Component {
 
   render() {
     return (
-      <Dialog
-        open={this.props.showDialog}
-        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
-      >
+      <div>
         <span className={styles.close} onClick={this.props.closeDialog}>
           ×
         </span>
@@ -89,12 +85,12 @@ class ChangeUsernameDialog extends React.Component {
             </Button>
           </div>
         </div>
-      </Dialog>
+      </div>
     );
   }
 }
 
-ChangeUsernameDialog.propTypes = {
+ChangeUsernameContentDialog.propTypes = {
   saveChanges: PropTypes.func,
   closeDialog: PropTypes.func,
   showDialog: PropTypes.bool,
@@ -103,4 +99,4 @@ ChangeUsernameDialog.propTypes = {
   formData: PropTypes.object,
 };
 
-export default ChangeUsernameDialog;
+export default ChangeUsernameContentDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css
new file mode 100644
index 000000000..daa884404
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css
@@ -0,0 +1,10 @@
+.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;
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
new file mode 100644
index 000000000..4b6fa8221
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -0,0 +1,22 @@
+import React from 'react';
+import cn from 'classnames';
+import styles from './ConfirmChangesDialog.css';
+import { Dialog } from 'plugin-api/beta/client/components/ui';
+import ChangeUsernameContentDialog from './ChangeUsernameContentDialog';
+import ChangeEmailContentDialog from './ChangeEmailContentDialog';
+
+class ConfirmChangesDialog extends React.Component {
+  render() {
+    return (
+      <Dialog
+        open={this.props.showDialog}
+        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
+      >
+        <ChangeUsernameContentDialog {...this.props} />
+        <ChangeEmailContentDialog {...this.props} />
+      </Dialog>
+    );
+  }
+}
+
+export default ConfirmChangesDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
rename to plugins/talk-plugin-auth/client/profile-settings/components/Profile.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
similarity index 90%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
rename to plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index d9f020491..642917f00 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -1,15 +1,14 @@
 import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
-import styles from './ChangeUsername.css';
+import styles from './Profile.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
-import ChangeUsernameDialog from './ChangeUsernameDialog';
-import ChangeEmailDialog from './ChangeEmailDialog';
 import { t } from 'plugin-api/beta/client/services';
 import InputField from './InputField';
 import { getErrorMessages } from 'coral-framework/utils';
 import validate from 'coral-framework/helpers/validate';
 import errorMsj from 'coral-framework/helpers/error';
+import ConfirmChangesDialog from './ConfirmChangesDialog';
 
 const initialState = {
   editing: false,
@@ -18,7 +17,7 @@ const initialState = {
   errors: {},
 };
 
-class ChangeUsername extends React.Component {
+class Profile extends React.Component {
   state = initialState;
 
   clearForm = () => {
@@ -89,6 +88,7 @@ class ChangeUsername extends React.Component {
   };
 
   fieldValidation = (value, type, name) => {
+    console.log(value, type, name);
     if (!value.length) {
       this.addError({
         [name]: t('talk-plugin-auth.change_password.required_field'),
@@ -136,6 +136,13 @@ class ChangeUsername extends React.Component {
       this.state.formData.newEmail &&
       this.state.formData.newEmail !== this.props.emailAddress;
 
+    // const res = !formHasErrors && (!!validUsername || !!validEmail);
+    // console.log('formHasErrors:', formHasErrors);
+    // console.log('validUsername:', validUsername);
+    // console.log('validEmail:', validEmail);
+    // console.log('res:', res);
+    // console.log(this.state.errors);
+
     return !formHasErrors && (validUsername || validEmail);
   };
 
@@ -149,20 +156,12 @@ class ChangeUsername extends React.Component {
           [styles.editing]: editing,
         })}
       >
-        <ChangeUsernameDialog
-          showDialog={this.state.showDialog}
-          onChange={this.onChange}
-          formData={this.state.formData}
-          username={username}
-          closeDialog={this.closeDialog}
-          saveChanges={this.saveChanges}
-        />
-
-        <ChangeEmailDialog
+        <ConfirmChangesDialog
           showDialog={this.state.showDialog}
           onChange={this.onChange}
           formData={this.state.formData}
           username={username}
+          emailAddress={emailAddress}
           closeDialog={this.closeDialog}
           saveChanges={this.saveChanges}
         />
@@ -232,11 +231,11 @@ class ChangeUsername extends React.Component {
   }
 }
 
-ChangeUsername.propTypes = {
+Profile.propTypes = {
   changeUsername: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
   username: PropTypes.string,
   emailAddress: PropTypes.string,
 };
 
-export default ChangeUsername;
+export default Profile;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
similarity index 85%
rename from plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
rename to plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
index 87e1e18b5..5495888b0 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
@@ -1,12 +1,12 @@
 import { compose } from 'react-apollo';
 import { bindActionCreators } from 'redux';
 import { connect } from 'plugin-api/beta/client/hocs';
-import ChangeUsername from '../components/ChangeUsername';
+import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
 import { withChangeUsername } from 'plugin-api/beta/client/hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
 export default compose(connect(null, mapDispatchToProps), withChangeUsername)(
-  ChangeUsername
+  Profile
 );

From be86b70b24cdbb896d634d97f8c7625987a886dc Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 16:01:35 -0300
Subject: [PATCH 013/160] WIP: Steps

---
 .../components/ChangeEmailContentDialog.js    | 23 +++-----
 .../components/ChangeUsernameContentDialog.js | 10 ++--
 .../components/ConfirmChangesDialog.js        | 56 +++++++++++++++++--
 .../profile-settings/components/Profile.js    | 24 ++++----
 4 files changed, 74 insertions(+), 39 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
index 1bb8f7410..e0452601a 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
@@ -8,9 +8,7 @@ import { t } from 'plugin-api/beta/client/services';
 class ChangeEmailContentDialog extends React.Component {
   state = {
     showError: false,
-    errors: {
-      passowrd: '',
-    },
+    errors: {},
   };
 
   showError = () => {
@@ -20,18 +18,13 @@ class ChangeEmailContentDialog extends React.Component {
   };
 
   confirmChanges = async () => {
-    if (this.formHasError()) {
-      this.showError();
-    } else {
-      await this.props.saveChanges();
-      this.props.closeDialog();
-    }
+    await this.props.saveChanges();
   };
 
   render() {
     return (
       <div>
-        <span className={styles.close} onClick={this.props.closeDialog}>
+        <span className={styles.close} onClick={this.props.cancel}>
           ×
         </span>
         <h1 className={styles.title}>
@@ -43,7 +36,8 @@ class ChangeEmailContentDialog extends React.Component {
           </p>
           <div className={styles.emailChange}>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_email.old_email')}: {this.props.email}
+              {t('talk-plugin-auth.change_email.old_email')}:{' '}
+              {this.props.emailAddress}
             </span>
             <span className={styles.item}>
               {t('talk-plugin-auth.change_email.new_email')}:{' '}
@@ -66,7 +60,7 @@ class ChangeEmailContentDialog extends React.Component {
             />
           </form>
           <div className={styles.bottomActions}>
-            <Button className={styles.cancel}>
+            <Button className={styles.cancel} onClick={this.props.cancel}>
               {t('talk-plugin-auth.change_email.cancel')}
             </Button>
             <Button
@@ -84,11 +78,10 @@ class ChangeEmailContentDialog extends React.Component {
 
 ChangeEmailContentDialog.propTypes = {
   saveChanges: PropTypes.func,
-  closeDialog: PropTypes.func,
-  showDialog: PropTypes.bool,
+  cancel: PropTypes.func,
   onChange: PropTypes.func,
-  email: PropTypes.string,
   formData: PropTypes.object,
+  emailAddress: PropTypes.string,
 };
 
 export default ChangeEmailContentDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
index 4cf75a8a7..dac12c470 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
@@ -21,7 +21,6 @@ class ChangeUsernameContentDialog extends React.Component {
       this.showError();
     } else {
       await this.props.saveChanges();
-      this.props.closeDialog();
     }
   };
 
@@ -31,7 +30,7 @@ class ChangeUsernameContentDialog extends React.Component {
   render() {
     return (
       <div>
-        <span className={styles.close} onClick={this.props.closeDialog}>
+        <span className={styles.close} onClick={this.props.cancel}>
           ×
         </span>
         <h1 className={styles.title}>
@@ -74,7 +73,7 @@ class ChangeUsernameContentDialog extends React.Component {
             </InputField>
           </form>
           <div className={styles.bottomActions}>
-            <Button className={styles.cancel}>
+            <Button className={styles.cancel} onClick={this.props.cancel}>
               {t('talk-plugin-auth.change_username.cancel')}
             </Button>
             <Button
@@ -92,11 +91,10 @@ class ChangeUsernameContentDialog extends React.Component {
 
 ChangeUsernameContentDialog.propTypes = {
   saveChanges: PropTypes.func,
-  closeDialog: PropTypes.func,
-  showDialog: PropTypes.bool,
+  cancel: PropTypes.func,
   onChange: PropTypes.func,
-  username: PropTypes.string,
   formData: PropTypes.object,
+  username: PropTypes.string,
 };
 
 export default ChangeUsernameContentDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
index 4b6fa8221..0f7ddcbed 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -1,22 +1,70 @@
 import React from 'react';
 import cn from 'classnames';
+import PropTypes from 'prop-types';
 import styles from './ConfirmChangesDialog.css';
 import { Dialog } from 'plugin-api/beta/client/components/ui';
-import ChangeUsernameContentDialog from './ChangeUsernameContentDialog';
-import ChangeEmailContentDialog from './ChangeEmailContentDialog';
+
+const initialState = { step: 0 };
 
 class ConfirmChangesDialog extends React.Component {
+  state = initialState;
+
+  goToNextStep = () => {
+    this.setState(({ step }) => ({
+      step: step + 1,
+    }));
+  };
+
+  saveAndContinue = async () => {
+    await this.props.saveChanges();
+    this.goToNextStep();
+  };
+
+  saveAndFinish = async () => {
+    await this.props.saveChanges();
+    this.clear();
+    this.closeDialog();
+  };
+
+  clear = () => {
+    this.setState(initialState);
+  };
+
+  cancel = async () => {
+    this.clear();
+    this.closeDialog();
+  };
+
   render() {
     return (
       <Dialog
         open={this.props.showDialog}
         className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
       >
-        <ChangeUsernameContentDialog {...this.props} />
-        <ChangeEmailContentDialog {...this.props} />
+        {React.Children.map(this.props.children, (child, i) => {
+          const totalSteps = React.Children.count(this.props.children);
+          if (i !== this.state.step) return;
+          return React.cloneElement(child, {
+            ...this.props,
+            cancel: this.cancel,
+            saveChanges:
+              i === totalSteps - 1 ? this.saveAndFinish : this.saveAndContinue,
+          });
+        })}
       </Dialog>
     );
   }
 }
 
+ConfirmChangesDialog.propTypes = {
+  children: PropTypes.node,
+  saveChanges: PropTypes.func,
+  closeDialog: PropTypes.func,
+  showDialog: PropTypes.bool,
+  onChange: PropTypes.func,
+  emailAddress: PropTypes.string,
+  username: PropTypes.string,
+  formData: PropTypes.object,
+};
+
 export default ConfirmChangesDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index 642917f00..c13722f3b 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -9,6 +9,8 @@ import { getErrorMessages } from 'coral-framework/utils';
 import validate from 'coral-framework/helpers/validate';
 import errorMsj from 'coral-framework/helpers/error';
 import ConfirmChangesDialog from './ConfirmChangesDialog';
+import ChangeUsernameContentDialog from './ChangeUsernameContentDialog';
+import ChangeEmailContentDialog from './ChangeEmailContentDialog';
 
 const initialState = {
   editing: false,
@@ -88,7 +90,6 @@ class Profile extends React.Component {
   };
 
   fieldValidation = (value, type, name) => {
-    console.log(value, type, name);
     if (!value.length) {
       this.addError({
         [name]: t('talk-plugin-auth.change_password.required_field'),
@@ -128,20 +129,12 @@ class Profile extends React.Component {
   };
 
   isSaveEnabled = () => {
+    const { formData } = this.state;
+    const { emailAddress, username } = this.props;
     const formHasErrors = !!Object.keys(this.state.errors).length;
     const validUsername =
-      this.state.formData.newUsername &&
-      this.state.formData.newUsername !== this.props.username;
-    const validEmail =
-      this.state.formData.newEmail &&
-      this.state.formData.newEmail !== this.props.emailAddress;
-
-    // const res = !formHasErrors && (!!validUsername || !!validEmail);
-    // console.log('formHasErrors:', formHasErrors);
-    // console.log('validUsername:', validUsername);
-    // console.log('validEmail:', validEmail);
-    // console.log('res:', res);
-    // console.log(this.state.errors);
+      formData.newUsername && formData.newUsername !== username;
+    const validEmail = formData.newEmail && formData.newEmail !== emailAddress;
 
     return !formHasErrors && (validUsername || validEmail);
   };
@@ -164,7 +157,10 @@ class Profile extends React.Component {
           emailAddress={emailAddress}
           closeDialog={this.closeDialog}
           saveChanges={this.saveChanges}
-        />
+        >
+          <ChangeEmailContentDialog />
+          <ChangeUsernameContentDialog />
+        </ConfirmChangesDialog>
 
         {editing ? (
           <div className={styles.content}>

From 35e8c005f34191d889a136ed8bb498068ff417c0 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 16:20:09 -0300
Subject: [PATCH 014/160] WIP: Steps

---
 .../components/ChangeEmailContentDialog.js    |  6 +-
 .../components/ChangeUsernameContentDialog.js |  6 +-
 .../components/ConfirmChangesDialog.js        | 32 ++++----
 .../profile-settings/components/Profile.js    | 81 ++++++++++++-------
 4 files changed, 77 insertions(+), 48 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
index e0452601a..6e4b9f07d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
@@ -18,7 +18,8 @@ class ChangeEmailContentDialog extends React.Component {
   };
 
   confirmChanges = async () => {
-    await this.props.saveChanges();
+    await this.props.save();
+    this.props.next();
   };
 
   render() {
@@ -77,7 +78,8 @@ class ChangeEmailContentDialog extends React.Component {
 }
 
 ChangeEmailContentDialog.propTypes = {
-  saveChanges: PropTypes.func,
+  save: PropTypes.func,
+  next: PropTypes.func,
   cancel: PropTypes.func,
   onChange: PropTypes.func,
   formData: PropTypes.object,
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
index dac12c470..36edd7a59 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
@@ -20,7 +20,8 @@ class ChangeUsernameContentDialog extends React.Component {
     if (this.formHasError()) {
       this.showError();
     } else {
-      await this.props.saveChanges();
+      await this.props.save();
+      this.props.next();
     }
   };
 
@@ -90,7 +91,8 @@ class ChangeUsernameContentDialog extends React.Component {
 }
 
 ChangeUsernameContentDialog.propTypes = {
-  saveChanges: PropTypes.func,
+  save: PropTypes.func,
+  next: PropTypes.func,
   cancel: PropTypes.func,
   onChange: PropTypes.func,
   formData: PropTypes.object,
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
index 0f7ddcbed..817c9e842 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -15,24 +15,22 @@ class ConfirmChangesDialog extends React.Component {
     }));
   };
 
-  saveAndContinue = async () => {
-    await this.props.saveChanges();
-    this.goToNextStep();
-  };
-
-  saveAndFinish = async () => {
-    await this.props.saveChanges();
-    this.clear();
-    this.closeDialog();
-  };
-
   clear = () => {
     this.setState(initialState);
   };
 
-  cancel = async () => {
+  cancel = () => {
     this.clear();
-    this.closeDialog();
+    this.props.closeDialog();
+  };
+
+  continue = () => {
+    this.goToNextStep();
+  };
+
+  finish = () => {
+    this.clear();
+    this.props.closeDialog();
   };
 
   render() {
@@ -45,10 +43,12 @@ class ConfirmChangesDialog extends React.Component {
           const totalSteps = React.Children.count(this.props.children);
           if (i !== this.state.step) return;
           return React.cloneElement(child, {
-            ...this.props,
+            onChange: this.props.onChange,
+            goToNextStep: this.goToNextStep,
+            clear: this.clear,
             cancel: this.cancel,
-            saveChanges:
-              i === totalSteps - 1 ? this.saveAndFinish : this.saveAndContinue,
+            next:
+              this.state.step === totalSteps - 1 ? this.finish : this.continue,
           });
         })}
       </Dialog>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index c13722f3b..e8d1bd7a4 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -53,27 +53,6 @@ class Profile extends React.Component {
     this.showDialog();
   };
 
-  saveChanges = async () => {
-    const { newUsername } = this.state.formData;
-    const { id } = this.props;
-
-    try {
-      await this.props.changeUsername({
-        id,
-        username: newUsername,
-      });
-      this.props.notify(
-        'success',
-        t('talk-plugin-auth.change_username.changed_username_success_msg')
-      );
-    } catch (err) {
-      this.props.notify('error', getErrorMessages(err));
-    }
-
-    this.clearForm();
-    this.disableEditing();
-  };
-
   addError = err => {
     this.setState(({ errors }) => ({
       errors: { ...errors, ...err },
@@ -139,6 +118,47 @@ class Profile extends React.Component {
     return !formHasErrors && (validUsername || validEmail);
   };
 
+  saveUsername = async () => {
+    const { newUsername } = this.state.formData;
+    const { id } = this.props;
+
+    try {
+      await this.props.changeUsername({
+        id,
+        username: newUsername,
+      });
+      this.props.notify(
+        'success',
+        t('talk-plugin-auth.change_username.changed_username_success_msg')
+      );
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+  };
+
+  saveEmail = async () => {
+    const { newUsername } = this.state.formData;
+    const { id } = this.props;
+
+    try {
+      await this.props.changeUsername({
+        id,
+        username: newUsername,
+      });
+      this.props.notify(
+        'success',
+        t('talk-plugin-auth.change_username.changed_username_success_msg')
+      );
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+  };
+
+  finish = () => {
+    this.clearForm();
+    this.disableEditing();
+  };
+
   render() {
     const { username, emailAddress } = this.props;
     const { editing } = this.state;
@@ -151,15 +171,20 @@ class Profile extends React.Component {
       >
         <ConfirmChangesDialog
           showDialog={this.state.showDialog}
-          onChange={this.onChange}
-          formData={this.state.formData}
-          username={username}
-          emailAddress={emailAddress}
           closeDialog={this.closeDialog}
-          saveChanges={this.saveChanges}
         >
-          <ChangeEmailContentDialog />
-          <ChangeUsernameContentDialog />
+          <ChangeEmailContentDialog
+            save={this.saveEmail}
+            onChange={this.onChange}
+            formData={this.state.formData}
+            emailAddress={emailAddress}
+          />
+          <ChangeUsernameContentDialog
+            save={this.saveUsername}
+            onChange={this.onChange}
+            formData={this.state.formData}
+            username={username}
+          />
         </ConfirmChangesDialog>
 
         {editing ? (

From 58108f257f0599b88b2755bee635bd7e04b8c489 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 16:28:08 -0300
Subject: [PATCH 015/160]  Addin g withUpdateEmailAddress

---
 client/coral-framework/graphql/fragments.js   |  3 ++-
 client/coral-framework/graphql/mutations.js   | 21 +++++++++++++++++++
 plugin-api/beta/client/hocs/index.js          |  1 +
 .../profile-settings/containers/Profile.js    | 13 ++++++++----
 4 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/client/coral-framework/graphql/fragments.js b/client/coral-framework/graphql/fragments.js
index c5704f719..bf75fa1a8 100644
--- a/client/coral-framework/graphql/fragments.js
+++ b/client/coral-framework/graphql/fragments.js
@@ -26,6 +26,7 @@ export default {
     'UpdateAssetSettingsResponse',
     'UpdateAssetStatusResponse',
     'UpdateSettingsResponse',
-    'ChangePasswordResponse'
+    'ChangePasswordResponse',
+    'UpdateEmailAddressResponse'
   ),
 };
diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 228911d4a..fe9ee4ac4 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -321,6 +321,27 @@ const SetUsernameFragment = gql`
   }
 `;
 
+export const withUpdateEmailAddress = withMutation(
+  gql`
+    mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
+      updateEmailAddress(input: $input) {
+        ...UpdateEmailAddressResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      updateEmailAdress: input => {
+        return mutate({
+          variables: {
+            input,
+          },
+        });
+      },
+    }),
+  }
+);
+
 export const withChangeUsername = withMutation(
   gql`
     mutation ChangeUsername($id: ID!, $username: String!) {
diff --git a/plugin-api/beta/client/hocs/index.js b/plugin-api/beta/client/hocs/index.js
index d7ca5fce9..d33e7acc9 100644
--- a/plugin-api/beta/client/hocs/index.js
+++ b/plugin-api/beta/client/hocs/index.js
@@ -27,5 +27,6 @@ export {
   withSetCommentStatus,
   withChangePassword,
   withChangeUsername,
+  withUpdateEmailAddress,
 } from 'coral-framework/graphql/mutations';
 export { compose } from 'recompose';
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
index 5495888b0..d47f4af38 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
@@ -3,10 +3,15 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
-import { withChangeUsername } from 'plugin-api/beta/client/hocs';
+import {
+  withChangeUsername,
+  withUpdateEmailAddress,
+} from 'plugin-api/beta/client/hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
-export default compose(connect(null, mapDispatchToProps), withChangeUsername)(
-  Profile
-);
+export default compose(
+  connect(null, mapDispatchToProps),
+  withChangeUsername,
+  withUpdateEmailAddress
+)(Profile);

From 691bfa4e302c7ebda73e49595ce0e8de2bd35fab Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 16:53:05 -0300
Subject: [PATCH 016/160] Passing Dialog content

---
 client/coral-framework/graphql/mutations.js   |  2 +-
 .../components/ChangeEmailContentDialog.js    |  5 ++-
 .../components/ConfirmChangesDialog.js        |  8 +---
 .../profile-settings/components/Profile.js    | 44 +++++++++++--------
 4 files changed, 31 insertions(+), 28 deletions(-)

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index fe9ee4ac4..15596e9a7 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -331,7 +331,7 @@ export const withUpdateEmailAddress = withMutation(
   `,
   {
     props: ({ mutate }) => ({
-      updateEmailAdress: input => {
+      updateEmailAddress: input => {
         return mutate({
           variables: {
             input,
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
index 6e4b9f07d..e3796f80e 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
@@ -8,7 +8,6 @@ import { t } from 'plugin-api/beta/client/services';
 class ChangeEmailContentDialog extends React.Component {
   state = {
     showError: false,
-    errors: {},
   };
 
   showError = () => {
@@ -53,7 +52,9 @@ class ChangeEmailContentDialog extends React.Component {
               type="password"
               onChange={this.props.onChange}
               defaultValue=""
-              hasError={this.state.errors.password && this.state.showError}
+              hasError={
+                !this.props.formData.confirmPassword && this.state.showError
+              }
               errorMsg={t('talk-plugin-auth.change_email.incorrect_password')}
               showError={this.state.showError}
               columnDisplay
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
index 817c9e842..d3f5ee60d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -31,6 +31,7 @@ class ConfirmChangesDialog extends React.Component {
   finish = () => {
     this.clear();
     this.props.closeDialog();
+    this.props.finish();
   };
 
   render() {
@@ -43,7 +44,6 @@ class ConfirmChangesDialog extends React.Component {
           const totalSteps = React.Children.count(this.props.children);
           if (i !== this.state.step) return;
           return React.cloneElement(child, {
-            onChange: this.props.onChange,
             goToNextStep: this.goToNextStep,
             clear: this.clear,
             cancel: this.cancel,
@@ -58,13 +58,9 @@ class ConfirmChangesDialog extends React.Component {
 
 ConfirmChangesDialog.propTypes = {
   children: PropTypes.node,
-  saveChanges: PropTypes.func,
   closeDialog: PropTypes.func,
   showDialog: PropTypes.bool,
-  onChange: PropTypes.func,
-  emailAddress: PropTypes.string,
-  username: PropTypes.string,
-  formData: PropTypes.object,
+  finish: PropTypes.func,
 };
 
 export default ConfirmChangesDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index e8d1bd7a4..9ce3b0498 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -137,17 +137,16 @@ class Profile extends React.Component {
   };
 
   saveEmail = async () => {
-    const { newUsername } = this.state.formData;
-    const { id } = this.props;
+    const { newEmail, confirmPassword } = this.state.formData;
 
     try {
-      await this.props.changeUsername({
-        id,
-        username: newUsername,
+      await this.props.updateEmailAddress({
+        email: newEmail,
+        confirmPassword,
       });
       this.props.notify(
         'success',
-        t('talk-plugin-auth.change_username.changed_username_success_msg')
+        t('talk-plugin-auth.change_email.change_email_msg')
       );
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
@@ -161,7 +160,7 @@ class Profile extends React.Component {
 
   render() {
     const { username, emailAddress } = this.props;
-    const { editing } = this.state;
+    const { editing, formData } = this.state;
 
     return (
       <section
@@ -172,19 +171,25 @@ class Profile extends React.Component {
         <ConfirmChangesDialog
           showDialog={this.state.showDialog}
           closeDialog={this.closeDialog}
+          finish={this.finish}
         >
-          <ChangeEmailContentDialog
-            save={this.saveEmail}
-            onChange={this.onChange}
-            formData={this.state.formData}
-            emailAddress={emailAddress}
-          />
-          <ChangeUsernameContentDialog
-            save={this.saveUsername}
-            onChange={this.onChange}
-            formData={this.state.formData}
-            username={username}
-          />
+          {username !== formData.newUsername && (
+            <ChangeUsernameContentDialog
+              save={this.saveUsername}
+              onChange={this.onChange}
+              formData={this.state.formData}
+              username={username}
+            />
+          )}
+
+          {emailAddress !== formData.newEmail && (
+            <ChangeEmailContentDialog
+              save={this.saveEmail}
+              onChange={this.onChange}
+              formData={this.state.formData}
+              emailAddress={emailAddress}
+            />
+          )}
         </ConfirmChangesDialog>
 
         {editing ? (
@@ -253,6 +258,7 @@ class Profile extends React.Component {
 }
 
 Profile.propTypes = {
+  updateEmailAddress: PropTypes.func.isRequired,
   changeUsername: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
   username: PropTypes.string,

From bbd02dda810427d69255fd3ab64dc2d18a685f1a Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 23:14:47 -0300
Subject: [PATCH 017/160] Finished with crossed steps

---
 .../components/ChangeUsernameContentDialog.js |  1 -
 .../components/ConfirmChangesDialog.js        | 31 ++++++++--------
 .../profile-settings/components/Profile.js    | 35 +++++++++----------
 .../talk-plugin-auth/client/translations.yml  |  2 +-
 4 files changed, 33 insertions(+), 36 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
index f06fe5acd..408f3d836 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
@@ -32,7 +32,6 @@ class ChangeUsernameContentDialog extends React.Component {
 
     await this.props.save();
     this.props.next();
-    this.props.closeDialog();
   };
 
   formHasError = () =>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
index a69a869ab..59eac894f 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -34,27 +34,28 @@ class ConfirmChangesDialog extends React.Component {
     this.props.finish();
   };
 
+  renderSteps = () => {
+    const steps = React.Children.toArray(this.props.children)
+      .filter(child => child.props.enable)
+      .filter((_, i) => i === this.state.step);
+
+    return steps.map(child => {
+      return React.cloneElement(child, {
+        goToNextStep: this.goToNextStep,
+        clear: this.clear,
+        cancel: this.cancel,
+        next: this.state.step === steps.length ? this.finish : this.continue,
+      });
+    });
+  };
+
   render() {
-    const totalSteps = React.Children.count(this.props.children);
-
-    if (!totalSteps) return null;
-
     return (
       <Dialog
         open={this.props.showDialog}
         className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
       >
-        {React.Children.map(this.props.children, (child, i) => {
-          const totalSteps = React.Children.count(this.props.children);
-          if (i !== this.state.step) return;
-          return React.cloneElement(child, {
-            goToNextStep: this.goToNextStep,
-            clear: this.clear,
-            cancel: this.cancel,
-            next:
-              this.state.step === totalSteps - 1 ? this.finish : this.continue,
-          });
-        })}
+        {this.renderSteps()}
       </Dialog>
     );
   }
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index 536fd0d8a..c40494506 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -176,25 +176,22 @@ class Profile extends React.Component {
           closeDialog={this.closeDialog}
           finish={this.finish}
         >
-          {username !== formData.newUsername && (
-            <ChangeUsernameContentDialog
-              notify={notify}
-              canUsernameBeUpdated={canUsernameBeUpdated(status)}
-              save={this.saveUsername}
-              onChange={this.onChange}
-              formData={this.state.formData}
-              username={username}
-            />
-          )}
-
-          {emailAddress !== formData.newEmail && (
-            <ChangeEmailContentDialog
-              save={this.saveEmail}
-              onChange={this.onChange}
-              formData={this.state.formData}
-              emailAddress={emailAddress}
-            />
-          )}
+          <ChangeUsernameContentDialog
+            notify={notify}
+            canUsernameBeUpdated={canUsernameBeUpdated(status)}
+            save={this.saveUsername}
+            onChange={this.onChange}
+            formData={this.state.formData}
+            username={username}
+            enable={formData.newUsername && username !== formData.newUsername}
+          />
+          <ChangeEmailContentDialog
+            save={this.saveEmail}
+            onChange={this.onChange}
+            formData={this.state.formData}
+            emailAddress={emailAddress}
+            enable={formData.newEmail && emailAddress !== formData.newEmail}
+          />
         </ConfirmChangesDialog>
 
         {editing ? (
diff --git a/plugins/talk-plugin-auth/client/translations.yml b/plugins/talk-plugin-auth/client/translations.yml
index d8d140a34..17fba29c8 100644
--- a/plugins/talk-plugin-auth/client/translations.yml
+++ b/plugins/talk-plugin-auth/client/translations.yml
@@ -155,6 +155,7 @@ en:
       confirm_changes: "Confirm Changes"
       username_does_not_match: "Username does not match"
       cant_be_equal: "Your new {0} must be different to your current one"
+      change_username_attempt: "Username can't be updated. Usernames can be changed every 14 days"
     change_email:
       confirm_email_change: "Confirm Email Address Change"
       description: "You are attempting to change your email address. Your new email address will be used for your login and to receive account notifications."
@@ -166,7 +167,6 @@ en:
       cancel: "Cancel"
       change_email_msg: "Email Address Changed - Your email address has been successfully changed. This email address will now be used for signing in and email notifications"
       changed_username_success_msg: "Username Changed - Your username has been successfully changed. You will not be able to change your user name for 14 days."
-      change_username_attempt: "Username can't be updated. Usernames can be changed every 14 days"
 de:
   talk-plugin-auth:
     login:

From 720089d3c2377ee3c84ab11a0fd1b5cb55c404d8 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Mon, 30 Apr 2018 23:45:13 -0300
Subject: [PATCH 018/160] Initial Delete

---
 plugins/talk-plugin-auth/client/index.js      |  2 +
 .../components/DeleteMyAccount.css            | 13 +++++
 .../components/DeleteMyAccount.js             | 57 +++++++++++++++++++
 .../components/DeleteMyAccountDialog.css      |  0
 .../components/DeleteMyAccountDialog.js       | 10 ++++
 5 files changed, 82 insertions(+)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js

diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index 13abce1d9..fd6843958 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -4,6 +4,7 @@ import SetUsernameDialog from './stream/containers/SetUsernameDialog';
 import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
+import DeleteMyAccount from './profile-settings/components/DeleteMyAccount';
 
 export default {
   reducer,
@@ -11,5 +12,6 @@ export default {
   slots: {
     stream: [UserBox, SignInButton, SetUsernameDialog],
     login: [Login],
+    profileSettings: [DeleteMyAccount],
   },
 };
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
new file mode 100644
index 000000000..2fe139d52
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
@@ -0,0 +1,13 @@
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  border: 1px solid #787d80;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
new file mode 100644
index 000000000..4b48e15ce
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
@@ -0,0 +1,57 @@
+import React from 'react';
+import cn from 'classnames';
+import styles from './DeleteMyAccount.css';
+import { Button } from 'plugin-api/beta/client/components/ui';
+import DeleteMyAccountDialog from './DeleteMyAccountDialog';
+
+const initialState = { showDialog: false };
+
+class DeleteMyAccount extends React.Component {
+  state = initialState;
+
+  showDialog = () => {
+    this.setState({
+      showDialog: true,
+    });
+  };
+
+  closeDialog = () => {
+    this.setState({
+      showDialog: false,
+    });
+  };
+
+  render() {
+    return (
+      <div className="talk-plugin-auth--delete-my-account">
+        <DeleteMyAccountDialog />
+        <h3
+          className={cn(
+            styles.title,
+            'talk-plugin-auth--delete-my-account-description'
+          )}
+        >
+          Delete My Account
+        </h3>
+        <p
+          className={cn(
+            styles.description,
+            'talk-plugin-auth--delete-my-account-description'
+          )}
+        >
+          Deleting your account will permanently erase your profile and remove
+          all your comments from this site.
+        </p>
+        <Button
+          className={cn(styles.button)}
+          icon="delete"
+          onClick={this.onSave}
+        >
+          Delete My Account
+        </Button>
+      </div>
+    );
+  }
+}
+
+export default DeleteMyAccount;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
new file mode 100644
index 000000000..2f64a3e2e
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import { Dialog } from 'plugin-api/beta/client/components/ui';
+
+class DeleteMyAccount extends React.Component {
+  render() {
+    return <Dialog open={false}>Holaa</Dialog>;
+  }
+}
+
+export default DeleteMyAccount;

From 876eb1e413d0048996388ad72d54aae52f7a482a Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 00:17:57 -0300
Subject: [PATCH 019/160] wip

---
 .../components/DeleteMyAccount.js             |  2 +-
 .../components/DeleteMyAccountDialog.css      | 95 +++++++++++++++++++
 .../components/DeleteMyAccountDialog.js       | 67 ++++++++++++-
 .../components/StepProgress.css               |  9 ++
 .../components/StepProgress.js                | 17 ++++
 5 files changed, 185 insertions(+), 5 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
index 4b48e15ce..95b11ab49 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
@@ -24,7 +24,7 @@ class DeleteMyAccount extends React.Component {
   render() {
     return (
       <div className="talk-plugin-auth--delete-my-account">
-        <DeleteMyAccountDialog />
+        <DeleteMyAccountDialog closeDialog={this.closeDialog} />
         <h3
           className={cn(
             styles.title,
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
index e69de29bb..802b63197 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
@@ -0,0 +1,95 @@
+.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;
+}
+
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+
+  &.cancel {
+    background-color: transparent;
+    color: #787D80;
+  }
+
+  &.proceed {
+    background-color: #3498DB;
+    color: white;
+  }
+}
+
+.actions {
+  text-align: right;
+}
+
+.list {
+  padding: 0;
+  margin: 10px 0;
+  list-style: none;
+}
+
+.item {
+  display: flex;
+  margin-bottom: 10px;
+
+  .itemIcon {
+    flex-grow: 0;
+  }
+
+  .text {
+    flex-grow: 1;
+    padding-left: 10px;
+  }
+
+  > i.itemIcon {
+    font-size: 1.3em;
+  }
+}
+
+
+
+
+
+/** Step **/
+
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index 2f64a3e2e..fd0b1e255 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -1,10 +1,69 @@
 import React from 'react';
-import { Dialog } from 'plugin-api/beta/client/components/ui';
+import cn from 'classnames';
+import PropTypes from 'prop-types';
+import styles from './DeleteMyAccountDialog.css';
+import { Button, Dialog, Icon } from 'plugin-api/beta/client/components/ui';
+import StepProgress from './StepProgress';
+
+const initialState = { step: 0 };
+
+class DeleteMyAccountDialog extends React.Component {
+  state = initialState;
+
+  goToNextStep = () => {
+    this.setState(state => ({
+      step: state.step + 1,
+    }));
+  };
+
+  clear = () => {
+    this.setState(initialState);
+  };
 
-class DeleteMyAccount extends React.Component {
   render() {
-    return <Dialog open={false}>Holaa</Dialog>;
+    return (
+      <Dialog open={true} className={styles.dialog}>
+        <span className={styles.close} onClick={this.props.closeDialog}>
+          ×
+        </span>
+        <h3 className={styles.title}>Delete My Account</h3>
+        <StepProgress currentStep={this.state.step} totalSteps={4} />
+        <div className={styles.step}>
+          <p className={styles.description}>
+            You are attempting to delete your account. This means:
+          </p>
+          <ul className={styles.list}>
+            <li className={styles.item}>
+              <Icon name="done" className={styles.itemIcon} />
+              <span className={styles.text}>
+                All of your comments are removed from this site
+              </span>
+            </li>
+            <li className={styles.item}>
+              <Icon name="done" className={styles.itemIcon} />
+              <span className={styles.text}>
+                All of your comments are deleted from our database
+              </span>
+            </li>
+            <li className={styles.item}>
+              <Icon name="done" className={styles.itemIcon} />
+              <span className={styles.text}>
+                Your username and email address are removed from our system
+              </span>
+            </li>
+          </ul>
+        </div>
+        <div className={cn(styles.actions)}>
+          <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+          <Button className={cn(styles.button, styles.proceed)}>Proceed</Button>
+        </div>
+      </Dialog>
+    );
   }
 }
 
-export default DeleteMyAccount;
+DeleteMyAccountDialog.propTypes = {
+  closeDialog: PropTypes.func.isRequired,
+};
+
+export default DeleteMyAccountDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
new file mode 100644
index 000000000..90a8a558c
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
@@ -0,0 +1,9 @@
+.step {
+  &.current {
+    color: rgba(0, 205, 115, 0.3);
+  }
+
+  &.completed {
+    color: #00CD73;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
new file mode 100644
index 000000000..c0c2d9712
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import styles from './StepProgress.css';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+class StepProgress extends React.Component {
+  render() {
+    return (
+      <div>
+        <span className={styles.step}>
+          <Icon name="done" />
+        </span>
+      </div>
+    );
+  }
+}
+
+export default StepProgress;

From b2988e540e4a8370839e31bffcd67cf7559170fc Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Tue, 1 May 2018 16:48:52 +0200
Subject: [PATCH 020/160] Move mutation logic to coral-admin

---
 client/coral-admin/src/graphql/index.js     | 31 +++++++++++++++++++++
 client/coral-framework/graphql/mutations.js | 31 ---------------------
 2 files changed, 31 insertions(+), 31 deletions(-)

diff --git a/client/coral-admin/src/graphql/index.js b/client/coral-admin/src/graphql/index.js
index 95595c265..3874e6c94 100644
--- a/client/coral-admin/src/graphql/index.js
+++ b/client/coral-admin/src/graphql/index.js
@@ -291,5 +291,36 @@ export default {
         },
       },
     }),
+    SetCommentStatus: ({ variables: { status } }) => ({
+      updateQueries: {
+        CoralAdmin_UserDetail: prev => {
+          const increment = {
+            rejectedComments: {
+              $apply: count => (count < prev.totalComments ? count + 1 : count),
+            },
+          };
+
+          const decrement = {
+            rejectedComments: {
+              $apply: count => (count > 0 ? count - 1 : 0),
+            },
+          };
+
+          // If rejected then increment rejectedComments by one
+          if (status === 'REJECTED') {
+            const updated = update(prev, increment);
+            return updated;
+          }
+
+          // If approved then decrement rejectedComments by one
+          if (status === 'ACCEPTED') {
+            const updated = update(prev, decrement);
+            return updated;
+          }
+
+          return prev;
+        },
+      },
+    }),
   },
 };
diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 228911d4a..995ca1720 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -1,6 +1,5 @@
 import { gql } from 'react-apollo';
 import withMutation from '../hocs/withMutation';
-import update from 'immutability-helper';
 
 function convertItemType(item_type) {
   switch (item_type) {
@@ -168,36 +167,6 @@ export const withSetCommentStatus = withMutation(
               errors: null,
             },
           },
-          updateQueries: {
-            CoralAdmin_UserDetail: prev => {
-              const increment = {
-                rejectedComments: {
-                  $apply: count =>
-                    count < prev.totalComments ? count + 1 : count,
-                },
-              };
-
-              const decrement = {
-                rejectedComments: {
-                  $apply: count => (count > 0 ? count - 1 : 0),
-                },
-              };
-
-              // If rejected then increment rejectedComments by one
-              if (status === 'REJECTED') {
-                const updated = update(prev, increment);
-                return updated;
-              }
-
-              // If approved then decrement rejectedComments by one
-              if (status === 'ACCEPTED') {
-                const updated = update(prev, decrement);
-                return updated;
-              }
-
-              return prev;
-            },
-          },
           update: proxy => {
             const fragment = gql`
               fragment Talk_SetCommentStatus_Comment on Comment {

From d07b77b8f7ab6e07cf1e53ef43c0140eb0f3f29c Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Tue, 1 May 2018 16:49:44 +0200
Subject: [PATCH 021/160] Remove forgotten console.log

---
 client/coral-admin/src/components/UserDetail.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/client/coral-admin/src/components/UserDetail.js b/client/coral-admin/src/components/UserDetail.js
index e45e3f095..5dabc5b6f 100644
--- a/client/coral-admin/src/components/UserDetail.js
+++ b/client/coral-admin/src/components/UserDetail.js
@@ -96,8 +96,6 @@ class UserDetail extends React.Component {
       bulkReject,
     } = this.props;
 
-    console.log(rejectedComments, totalComments);
-
     // if totalComments is 0, you're dividing by zero
     let rejectedPercent = rejectedComments / totalComments * 100;
 

From 867523140c3f70a9cf2161113948f90559f1665c Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 14:09:43 -0300
Subject: [PATCH 022/160] Adding StepProgress component, and all the steps

---
 .../components/DeleteMyAccountDialog.css      | 60 +-----------------
 .../components/DeleteMyAccountDialog.js       | 51 ++++++----------
 .../components/DeleteMyAccountFinalStep.js    | 40 ++++++++++++
 .../components/DeleteMyAccountStep.css        | 61 +++++++++++++++++++
 .../components/DeleteMyAccountStep0.js        | 43 +++++++++++++
 .../components/DeleteMyAccountStep1.js        | 30 +++++++++
 .../components/DeleteMyAccountStep2.js        | 27 ++++++++
 .../components/DeleteMyAccountStep3.js        | 31 ++++++++++
 .../components/StepProgress.css               | 23 +++++++
 .../components/StepProgress.js                | 39 ++++++++++--
 10 files changed, 312 insertions(+), 93 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
index 802b63197..db44ebf6d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
@@ -1,7 +1,7 @@
 .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;
+  width: 380px;
   top: 10px;
   font-family: Helvetica, 'Helvetica Neue', Verdana, sans-serif;
   font-size: 14px;
@@ -26,7 +26,7 @@
 }
 
 .title {
-  font-size: 1.3em;
+  font-size: 1.2em;
   margin-bottom: 8px;
 }
 
@@ -36,60 +36,4 @@
   margin: 0;
 }
 
-.button {
-  color: #787D80;
-  border-radius: 2px;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-
-  &:hover {
-    background-color: #eaeaea;
-  }
-
-  &.cancel {
-    background-color: transparent;
-    color: #787D80;
-  }
-
-  &.proceed {
-    background-color: #3498DB;
-    color: white;
-  }
-}
-
-.actions {
-  text-align: right;
-}
-
-.list {
-  padding: 0;
-  margin: 10px 0;
-  list-style: none;
-}
-
-.item {
-  display: flex;
-  margin-bottom: 10px;
-
-  .itemIcon {
-    flex-grow: 0;
-  }
-
-  .text {
-    flex-grow: 1;
-    padding-left: 10px;
-  }
-
-  > i.itemIcon {
-    font-size: 1.3em;
-  }
-}
-
-
-
-
-
-/** Step **/
 
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index fd0b1e255..599816e2d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -1,9 +1,13 @@
 import React from 'react';
-import cn from 'classnames';
 import PropTypes from 'prop-types';
 import styles from './DeleteMyAccountDialog.css';
-import { Button, Dialog, Icon } from 'plugin-api/beta/client/components/ui';
+import { Dialog } from 'plugin-api/beta/client/components/ui';
 import StepProgress from './StepProgress';
+import DeleteMyAccountStep0 from './DeleteMyAccountStep0';
+import DeleteMyAccountStep1 from './DeleteMyAccountStep1';
+import DeleteMyAccountStep2 from './DeleteMyAccountStep2';
+import DeleteMyAccountStep3 from './DeleteMyAccountStep3';
+import DeleteMyAccountFinalStep from './DeleteMyAccountFinalStep';
 
 const initialState = { step: 0 };
 
@@ -21,6 +25,7 @@ class DeleteMyAccountDialog extends React.Component {
   };
 
   render() {
+    const { step } = this.state;
     return (
       <Dialog open={true} className={styles.dialog}>
         <span className={styles.close} onClick={this.props.closeDialog}>
@@ -28,35 +33,19 @@ class DeleteMyAccountDialog extends React.Component {
         </span>
         <h3 className={styles.title}>Delete My Account</h3>
         <StepProgress currentStep={this.state.step} totalSteps={4} />
-        <div className={styles.step}>
-          <p className={styles.description}>
-            You are attempting to delete your account. This means:
-          </p>
-          <ul className={styles.list}>
-            <li className={styles.item}>
-              <Icon name="done" className={styles.itemIcon} />
-              <span className={styles.text}>
-                All of your comments are removed from this site
-              </span>
-            </li>
-            <li className={styles.item}>
-              <Icon name="done" className={styles.itemIcon} />
-              <span className={styles.text}>
-                All of your comments are deleted from our database
-              </span>
-            </li>
-            <li className={styles.item}>
-              <Icon name="done" className={styles.itemIcon} />
-              <span className={styles.text}>
-                Your username and email address are removed from our system
-              </span>
-            </li>
-          </ul>
-        </div>
-        <div className={cn(styles.actions)}>
-          <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
-          <Button className={cn(styles.button, styles.proceed)}>Proceed</Button>
-        </div>
+        {step === 0 && (
+          <DeleteMyAccountStep0 goToNextStep={this.goToNextStep} />
+        )}
+        {step === 1 && (
+          <DeleteMyAccountStep1 goToNextStep={this.goToNextStep} />
+        )}
+        {step === 2 && (
+          <DeleteMyAccountStep2 goToNextStep={this.goToNextStep} />
+        )}
+        {step === 3 && (
+          <DeleteMyAccountStep3 goToNextStep={this.goToNextStep} />
+        )}
+        {step === 4 && <DeleteMyAccountFinalStep />}
       </Dialog>
     );
   }
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
new file mode 100644
index 000000000..004270f4d
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import styles from './DeleteMyAccountStep.css';
+
+const DeleteMyAccountFinalStep = () => (
+  <div className={styles.step}>
+    <p className={styles.description}>
+      Your request has been submitted and confirmation has been sent to the
+      email address associated with your account.
+    </p>
+    <strong> Your account is scheduled to be deleted at:</strong>
+    <strong>
+      <Icon name="clock" />Account Deletion Date and Time
+    </strong>
+    <p className={styles.description}>
+      <strong>Changed your mind?</strong> Simply sign in to your account again
+      before this time and click “<strong>
+        Cancel Account Deletion Request.
+      </strong>”
+    </p>
+    <p className={styles.description}>
+      <strong>Tell us why.</strong> Wed like to know why you chose to delete
+      your account. Send us feedback on our comment system by emailing.
+    </p>
+    <div className={cn(styles.actions)}>
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        onClick={this.closeDialog}
+      >
+        Done
+      </Button>
+      <small className={styles.note}>
+        Note: You will be immediately signed out of your account.
+      </small>
+    </div>
+  </div>
+);
+
+export default DeleteMyAccountFinalStep;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
new file mode 100644
index 000000000..8984bf7ac
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
@@ -0,0 +1,61 @@
+.list {
+  padding: 0;
+  margin: 20px 0;
+  list-style: none;
+}
+
+.item {
+  display: flex;
+  margin-bottom: 20px;
+
+  .itemIcon {
+    flex-grow: 0;
+  }
+
+  .text {
+    flex-grow: 1;
+    padding-left: 10px;
+  }
+
+  > i.itemIcon {
+    font-size: 1.3em;
+  }
+}
+
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+
+  &.cancel {
+    background-color: transparent;
+    color: #787D80;
+  }
+
+  &.proceed {
+    background-color: #3498DB;
+    color: white;
+  }
+}
+
+.actions {
+  text-align: right;
+}
+
+.title {
+  font-size: 1.2em;
+  margin-bottom: 8px;
+}
+
+.description {
+  font-size: 1em;
+  line-height: 20px;
+  margin: 0;
+}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
new file mode 100644
index 000000000..ddddf7141
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
@@ -0,0 +1,43 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import styles from './DeleteMyAccountStep.css';
+
+const DeleteMyAccountStep0 = () => (
+  <div className={styles.step}>
+    <p className={styles.description}>
+      You are attempting to delete your account. This means:
+    </p>
+    <ul className={styles.list}>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          All of your comments are removed from this site
+        </span>
+      </li>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          All of your comments are deleted from our database
+        </span>
+      </li>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          Your username and email address are removed from our system
+        </span>
+      </li>
+    </ul>
+    <div className={cn(styles.actions)}>
+      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        onClick={this.goToNextStep}
+      >
+        Proceed
+      </Button>
+    </div>
+  </div>
+);
+
+export default DeleteMyAccountStep0;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
new file mode 100644
index 000000000..602bb33b7
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
@@ -0,0 +1,30 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button } from 'plugin-api/beta/client/components/ui';
+import styles from './DeleteMyAccountStep.css';
+
+const DeleteMyAccountStep1 = () => (
+  <div className={styles.step}>
+    <h4>When will my account be deleted?</h4>
+    <p className={styles.description}>
+      Your account will be deleted 24 hours after your request has been
+      submitted.
+    </p>
+    <h4>Can I still write comments until my account is deleted? </h4>
+    <p className={styles.description}>
+      No. Once youve requested account deletion, you can no longer write
+      comments, reply to comments, or select reactions.
+    </p>
+    <div className={cn(styles.actions)}>
+      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        onClick={this.goToNextStep}
+      >
+        Proceed
+      </Button>
+    </div>
+  </div>
+);
+
+export default DeleteMyAccountStep1;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
new file mode 100644
index 000000000..7b069ca3d
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
@@ -0,0 +1,27 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button } from 'plugin-api/beta/client/components/ui';
+import styles from './DeleteMyAccountStep.css';
+
+const DeleteMyAccountStep1 = () => (
+  <div className={styles.step}>
+    <p className={styles.description}>
+      Before your account is deleted, we recommend you download your comment
+      history for your records. After your account is deleted, you will be
+      unable to request your comment history.
+    </p>
+    <p>To download your comment history go to:</p>
+    <strong>My Profile Download My Comment History</strong>
+    <div className={cn(styles.actions)}>
+      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        onClick={this.goToNextStep}
+      >
+        Proceed
+      </Button>
+    </div>
+  </div>
+);
+
+export default DeleteMyAccountStep1;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
new file mode 100644
index 000000000..bf3dea674
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -0,0 +1,31 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button } from 'plugin-api/beta/client/components/ui';
+import styles from './DeleteMyAccountStep.css';
+
+const DeleteMyAccountStep1 = () => (
+  <div className={styles.step}>
+    <h4>Are you sure you want to delete your account?</h4>
+    <p className={styles.description}>
+      To confirm you would like to delete your account please type in the
+      following phrase into the text box below:
+    </p>
+    <input
+      className={styles.textBox}
+      disabled={true}
+      readOnly={true}
+      value="delete"
+    />
+    <div className={cn(styles.actions)}>
+      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        onClick={this.goToNextStep}
+      >
+        Delete My Account
+      </Button>
+    </div>
+  </div>
+);
+
+export default DeleteMyAccountStep1;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
index 90a8a558c..68fab06a9 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
@@ -1,4 +1,9 @@
 .step {
+  color: #BBBEBF;
+  background-color: white;
+  padding: 6px;
+  z-index: 10;
+
   &.current {
     color: rgba(0, 205, 115, 0.3);
   }
@@ -6,4 +11,22 @@
   &.completed {
     color: #00CD73;
   }
+}
+
+.line {
+  position: absolute;
+  border: solid 2px #BBBEBF;
+  width: 100%;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.container {
+  display: flex;
+  position: relative;
+  justify-content: space-between;
+  align-items: center;
+  height: 50px;
+  margin: 0 20px;
 }
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
index c0c2d9712..e11bf46d5 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
@@ -1,17 +1,48 @@
 import React from 'react';
+import cn from 'classnames';
+import PropTypes from 'prop-types';
 import styles from './StepProgress.css';
 import { Icon } from 'plugin-api/beta/client/components/ui';
 
+const CheckItem = ({ current = false, completed = false }) => (
+  <span
+    className={cn(styles.step, {
+      [styles.current]: current,
+      [styles.completed]: completed,
+    })}
+  >
+    <Icon name="check_circle" />
+  </span>
+);
+
+CheckItem.propTypes = {
+  current: PropTypes.bool.isRequired,
+  completed: PropTypes.bool.isRequired,
+};
+
+const Line = () => <hr className={styles.line} />;
+
 class StepProgress extends React.Component {
   render() {
+    const { currentStep, totalSteps } = this.props;
     return (
-      <div>
-        <span className={styles.step}>
-          <Icon name="done" />
-        </span>
+      <div className={styles.container}>
+        {Array.from({ length: totalSteps }).map((_, i) => (
+          <CheckItem
+            key={`step_${i}`}
+            completed={i < currentStep}
+            current={currentStep === i}
+          />
+        ))}
+        <Line />
       </div>
     );
   }
 }
 
+StepProgress.propTypes = {
+  currentStep: PropTypes.number.isRequired,
+  totalSteps: PropTypes.number.isRequired,
+};
+
 export default StepProgress;

From f4cb16e56eb7bdf681f68f35c2af3a853ca1e625 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 14:14:43 -0300
Subject: [PATCH 023/160] styles wip

---
 .../profile-settings/components/DeleteMyAccountStep0.js       | 4 ++--
 .../profile-settings/components/DeleteMyAccountStep1.js       | 4 ++--
 .../profile-settings/components/DeleteMyAccountStep2.js       | 4 ++--
 .../profile-settings/components/DeleteMyAccountStep3.js       | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
index ddddf7141..f81d912ea 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep0 = () => (
+const DeleteMyAccountStep0 = props => (
   <div className={styles.step}>
     <p className={styles.description}>
       You are attempting to delete your account. This means:
@@ -32,7 +32,7 @@ const DeleteMyAccountStep0 = () => (
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
         className={cn(styles.button, styles.proceed)}
-        onClick={this.goToNextStep}
+        onClick={props.goToNextStep}
       >
         Proceed
       </Button>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
index 602bb33b7..d3b399f44 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep1 = () => (
+const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
     <h4>When will my account be deleted?</h4>
     <p className={styles.description}>
@@ -19,7 +19,7 @@ const DeleteMyAccountStep1 = () => (
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
         className={cn(styles.button, styles.proceed)}
-        onClick={this.goToNextStep}
+        onClick={props.goToNextStep}
       >
         Proceed
       </Button>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
index 7b069ca3d..47c89e4c1 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep1 = () => (
+const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
     <p className={styles.description}>
       Before your account is deleted, we recommend you download your comment
@@ -16,7 +16,7 @@ const DeleteMyAccountStep1 = () => (
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
         className={cn(styles.button, styles.proceed)}
-        onClick={this.goToNextStep}
+        onClick={props.goToNextStep}
       >
         Proceed
       </Button>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index bf3dea674..534ea9db8 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep1 = () => (
+const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
     <h4>Are you sure you want to delete your account?</h4>
     <p className={styles.description}>
@@ -20,7 +20,7 @@ const DeleteMyAccountStep1 = () => (
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
         className={cn(styles.button, styles.proceed)}
-        onClick={this.goToNextStep}
+        onClick={props.goToNextStep}
       >
         Delete My Account
       </Button>

From bd21d9a1a14a2febf10115f8f5d1be4aa6fdc8a0 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 14:19:43 -0300
Subject: [PATCH 024/160] fix b

---
 .../client/profile-settings/components/ConfirmChangesDialog.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
index 59eac894f..0031bcb71 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
@@ -44,7 +44,8 @@ class ConfirmChangesDialog extends React.Component {
         goToNextStep: this.goToNextStep,
         clear: this.clear,
         cancel: this.cancel,
-        next: this.state.step === steps.length ? this.finish : this.continue,
+        next:
+          this.state.step === steps.length - 1 ? this.finish : this.continue,
       });
     });
   };

From 3bb91f683320f706af312edb7863258c35dbdabd Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 15:43:10 -0300
Subject: [PATCH 025/160] Adding withRequestAccountDeletion,
 withRequestDownloadLink,  withCancelAccountDeletion

---
 client/coral-framework/graphql/fragments.js   |  5 +-
 client/coral-framework/graphql/mutations.js   | 51 +++++++++++++++++++
 .../components/DeleteMyAccountDialog.css      |  4 +-
 .../components/DeleteMyAccountFinalStep.js    | 24 ++++++---
 .../components/DeleteMyAccountStep.css        | 47 +++++++++++++++++
 .../components/DeleteMyAccountStep1.js        |  6 ++-
 .../components/DeleteMyAccountStep2.js        |  8 ++-
 .../components/DeleteMyAccountStep3.js        |  6 ++-
 8 files changed, 134 insertions(+), 17 deletions(-)

diff --git a/client/coral-framework/graphql/fragments.js b/client/coral-framework/graphql/fragments.js
index a62fd6d92..f30cb1e63 100644
--- a/client/coral-framework/graphql/fragments.js
+++ b/client/coral-framework/graphql/fragments.js
@@ -25,6 +25,9 @@ export default {
     'UnsuspendUserResponse',
     'UpdateAssetSettingsResponse',
     'UpdateAssetStatusResponse',
-    'UpdateSettingsResponse'
+    'UpdateSettingsResponse',
+    'RequestAccountDeletionResponse',
+    'RequestDownloadLinkResponse',
+    'CancelAccountDeletionResponse'
   ),
 };
diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index bd31be630..bf412b189 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -623,6 +623,57 @@ export const withUpdateSettings = withMutation(
   }
 );
 
+export const withRequestAccountDeletion = withMutation(
+  gql`
+    mutation RequestAccountDeletion {
+      requestAccountDeletion {
+        ...RequestAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      requestAccountDeletion: () => {
+        return mutate();
+      },
+    }),
+  }
+);
+
+export const withRequestDownloadLink = withMutation(
+  gql`
+    mutation RequestDownloadLink {
+      requestDownloadLink {
+        ...RequestDownloadLinkResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      requestDownloadLink: () => {
+        return mutate();
+      },
+    }),
+  }
+);
+
+export const withCancelAccountDeletion = withMutation(
+  gql`
+    mutation RequestDownloadLink {
+      cancelAccountDeletion {
+        ...CancelAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      cancelAccountDeletion: () => {
+        return mutate();
+      },
+    }),
+  }
+);
+
 export const withUpdateAssetSettings = withMutation(
   gql`
     mutation UpdateAssetSettings($id: ID!, $input: AssetSettingsInput!) {
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
index db44ebf6d..44dcad0cf 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
@@ -34,6 +34,4 @@
   font-size: 1em;
   line-height: 20px;
   margin: 0;
-}
-
-
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
index 004270f4d..22cf476e5 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
@@ -9,30 +9,40 @@ const DeleteMyAccountFinalStep = () => (
       Your request has been submitted and confirmation has been sent to the
       email address associated with your account.
     </p>
-    <strong> Your account is scheduled to be deleted at:</strong>
-    <strong>
-      <Icon name="clock" />Account Deletion Date and Time
-    </strong>
+
+    <div className={styles.box}>
+      <strong className={styles.block}>
+        Your account is scheduled to be deleted at:
+      </strong>
+      <strong className={styles.block}>
+        <Icon name="access_time" />
+        <span>Account Deletion Date and Time</span>
+      </strong>
+    </div>
+
     <p className={styles.description}>
       <strong>Changed your mind?</strong> Simply sign in to your account again
       before this time and click “<strong>
         Cancel Account Deletion Request.
       </strong>”
     </p>
+
     <p className={styles.description}>
       <strong>Tell us why.</strong> Wed like to know why you chose to delete
       your account. Send us feedback on our comment system by emailing.
     </p>
-    <div className={cn(styles.actions)}>
+
+    <div className={cn(styles.actions, styles.columnView)}>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={this.closeDialog}
+        full
       >
         Done
       </Button>
-      <small className={styles.note}>
+      <span className={styles.note}>
         Note: You will be immediately signed out of your account.
-      </small>
+      </span>
     </div>
   </div>
 );
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
index 8984bf7ac..98b73f376 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
@@ -43,10 +43,22 @@
     background-color: #3498DB;
     color: white;
   }
+
+  &.danger {
+    background-color: #FA4643;
+    color: white;
+  }
 }
 
 .actions {
   text-align: right;
+  padding-top: 20px;
+
+  &.columnView {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  } 
 }
 
 .title {
@@ -58,4 +70,39 @@
   font-size: 1em;
   line-height: 20px;
   margin: 0;
+  margin-bottom: 15px;
+}
+
+.box {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 15px;
+}
+
+.note {
+  margin: 10px 0;
+}
+
+.subTitle {
+  font-size: 1em;
+  margin-bottom: 8px;
+}
+
+.textBox {
+  background-color: #F1F2F2;
+  border: none;
+  width: 100%;
+  padding: 15px;
+  box-sizing: border-box;
+  color: #3B4A53;
+  font-size: 1em;
+}
+
+.block {
+  display: block;
+  margin-top: 2px;
+}
+
+.step {
+  padding-top: 20px;
 }
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
index d3b399f44..1d26190bc 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
@@ -5,12 +5,14 @@ import styles from './DeleteMyAccountStep.css';
 
 const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
-    <h4>When will my account be deleted?</h4>
+    <h4 className={styles.subTitle}>When will my account be deleted?</h4>
     <p className={styles.description}>
       Your account will be deleted 24 hours after your request has been
       submitted.
     </p>
-    <h4>Can I still write comments until my account is deleted? </h4>
+    <h4 className={styles.subTitle}>
+      Can I still write comments until my account is deleted?{' '}
+    </h4>
     <p className={styles.description}>
       No. Once youve requested account deletion, you can no longer write
       comments, reply to comments, or select reactions.
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
index 47c89e4c1..3337c0b94 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
@@ -10,8 +10,12 @@ const DeleteMyAccountStep1 = props => (
       history for your records. After your account is deleted, you will be
       unable to request your comment history.
     </p>
-    <p>To download your comment history go to:</p>
-    <strong>My Profile Download My Comment History</strong>
+    <p className={styles.description}>
+      To download your comment history go to:
+      <strong className={styles.block}>
+        My Profile {`>`} Download My Comment History
+      </strong>
+    </p>
     <div className={cn(styles.actions)}>
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index 534ea9db8..8cff542c1 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -5,7 +5,9 @@ import styles from './DeleteMyAccountStep.css';
 
 const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
-    <h4>Are you sure you want to delete your account?</h4>
+    <h4 className={styles.subTitle}>
+      Are you sure you want to delete your account?
+    </h4>
     <p className={styles.description}>
       To confirm you would like to delete your account please type in the
       following phrase into the text box below:
@@ -19,7 +21,7 @@ const DeleteMyAccountStep1 = props => (
     <div className={cn(styles.actions)}>
       <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
       <Button
-        className={cn(styles.button, styles.proceed)}
+        className={cn(styles.button, styles.danger)}
         onClick={props.goToNextStep}
       >
         Delete My Account

From 5c806174bb06c7878b6208ccfd4678a3f3144328 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 15:51:56 -0300
Subject: [PATCH 026/160] Adding withRequestAccountDeletion,
 withRequestDownloadLink,  withCancelAccountDeletion

---
 plugin-api/beta/client/hocs/index.js          |  3 ++
 plugins/talk-plugin-auth/client/index.js      |  2 +-
 .../components/DeleteMyAccount.js             | 13 ++++++++-
 .../containers/DeleteMyAccount.js             | 28 +++++++++++++++++++
 4 files changed, 44 insertions(+), 2 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js

diff --git a/plugin-api/beta/client/hocs/index.js b/plugin-api/beta/client/hocs/index.js
index 215641f32..da667bced 100644
--- a/plugin-api/beta/client/hocs/index.js
+++ b/plugin-api/beta/client/hocs/index.js
@@ -25,5 +25,8 @@ export {
   withUnbanUser,
   withStopIgnoringUser,
   withSetCommentStatus,
+  withRequestAccountDeletion,
+  withRequestDownloadLink,
+  withCancelAccountDeletion,
 } from 'coral-framework/graphql/mutations';
 export { compose } from 'recompose';
diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index fd6843958..b432b05b2 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -4,7 +4,7 @@ import SetUsernameDialog from './stream/containers/SetUsernameDialog';
 import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
-import DeleteMyAccount from './profile-settings/components/DeleteMyAccount';
+import DeleteMyAccount from './profile-settings/containers/DeleteMyAccount';
 
 export default {
   reducer,
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
index 95b11ab49..5643ed0e8 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import styles from './DeleteMyAccount.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
@@ -24,7 +25,11 @@ class DeleteMyAccount extends React.Component {
   render() {
     return (
       <div className="talk-plugin-auth--delete-my-account">
-        <DeleteMyAccountDialog closeDialog={this.closeDialog} />
+        <DeleteMyAccountDialog
+          requestAccountDeletion={this.props.requestAccountDeletion}
+          cancelAccountDeletion={this.props.cancelAccountDeletion}
+          closeDialog={this.closeDialog}
+        />
         <h3
           className={cn(
             styles.title,
@@ -54,4 +59,10 @@ class DeleteMyAccount extends React.Component {
   }
 }
 
+DeleteMyAccount.propTypes = {
+  requestAccountDeletion: PropTypes.func.isRequired,
+  cancelAccountDeletion: PropTypes.func.isRequired,
+  notify: PropTypes.func.isRequired,
+};
+
 export default DeleteMyAccount;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
new file mode 100644
index 000000000..b88780f1f
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
@@ -0,0 +1,28 @@
+import { compose, gql } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { connect, withFragments } from 'plugin-api/beta/client/hocs';
+import DeleteMyAccount from '../components/DeleteMyAccount';
+import { notify } from 'coral-framework/actions/notification';
+import {
+  withRequestAccountDeletion,
+  withCancelAccountDeletion,
+} from 'plugin-api/beta/client/hocs';
+
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
+const withData = withFragments({
+  root: gql`
+    fragment TalkIgnoreUser_IgnoredUserSection_root on RootQuery {
+      me {
+        scheduledDeletionDate
+      }
+    }
+  `,
+});
+
+export default compose(
+  connect(null, mapDispatchToProps),
+  withRequestAccountDeletion,
+  withCancelAccountDeletion,
+  withData
+)(DeleteMyAccount);

From 9b4d650427657b86fc7853680454de568fae74d4 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 16:18:37 -0300
Subject: [PATCH 027/160] Wip: mutations, styles and functionality

---
 .../components/DeleteMyAccount.js             | 58 +++++++++++++++----
 .../components/DeleteMyAccountDialog.js       | 29 ++++++++--
 .../components/DeleteMyAccountFinalStep.js    |  9 ++-
 .../components/DeleteMyAccountStep0.js        | 13 ++++-
 .../components/DeleteMyAccountStep1.js        | 13 ++++-
 .../components/DeleteMyAccountStep2.js        | 17 +++++-
 .../components/DeleteMyAccountStep3.js        | 17 +++++-
 .../containers/DeleteMyAccount.js             |  2 +-
 8 files changed, 130 insertions(+), 28 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
index 5643ed0e8..0fc06f326 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
@@ -4,6 +4,7 @@ import cn from 'classnames';
 import styles from './DeleteMyAccount.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import DeleteMyAccountDialog from './DeleteMyAccountDialog';
+import { getErrorMessages } from 'coral-framework/utils';
 
 const initialState = { showDialog: false };
 
@@ -22,12 +23,35 @@ class DeleteMyAccount extends React.Component {
     });
   };
 
+  cancelAccountDeletion = async () => {
+    const { cancelAccountDeletion, notify } = this.props;
+    try {
+      await cancelAccountDeletion();
+      notify(
+        'success',
+        'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+      );
+    } catch (err) {
+      notify('error', getErrorMessages(err));
+    }
+  };
+
+  requestAccountDeletion = async () => {
+    const { requestAccountDeletion, notify } = this.props;
+    try {
+      await requestAccountDeletion();
+      notify('success', 'Account Deletion Requested');
+    } catch (err) {
+      notify('error', getErrorMessages(err));
+    }
+  };
+
   render() {
+    const { me: { scheduledDeletionDate } } = this.props.root;
     return (
       <div className="talk-plugin-auth--delete-my-account">
         <DeleteMyAccountDialog
-          requestAccountDeletion={this.props.requestAccountDeletion}
-          cancelAccountDeletion={this.props.cancelAccountDeletion}
+          requestAccountDeletion={this.requestAccountDeletion}
           closeDialog={this.closeDialog}
         />
         <h3
@@ -44,16 +68,27 @@ class DeleteMyAccount extends React.Component {
             'talk-plugin-auth--delete-my-account-description'
           )}
         >
-          Deleting your account will permanently erase your profile and remove
-          all your comments from this site.
+          {scheduledDeletionDate &&
+            `You have already submitted a request to delete your account.
+          Your account will be deleted on ${scheduledDeletionDate}. You may
+          cancel the request until that time`}
         </p>
-        <Button
-          className={cn(styles.button)}
-          icon="delete"
-          onClick={this.onSave}
-        >
-          Delete My Account
-        </Button>
+        {scheduledDeletionDate ? (
+          <Button
+            className={cn(styles.button)}
+            onClick={this.cancelAccountDeletion}
+          >
+            Cancel Account Deletion Request
+          </Button>
+        ) : (
+          <Button
+            className={cn(styles.button)}
+            icon="delete"
+            onClick={this.showDialog}
+          >
+            Delete My Account
+          </Button>
+        )}
       </div>
     );
   }
@@ -63,6 +98,7 @@ DeleteMyAccount.propTypes = {
   requestAccountDeletion: PropTypes.func.isRequired,
   cancelAccountDeletion: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
+  root: PropTypes.object.isRequired,
 };
 
 export default DeleteMyAccount;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index 599816e2d..7c7c47d0b 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -24,28 +24,45 @@ class DeleteMyAccountDialog extends React.Component {
     this.setState(initialState);
   };
 
+  cancel = () => {
+    this.clear();
+    this.closeDialog();
+  };
+
   render() {
     const { step } = this.state;
     return (
       <Dialog open={true} className={styles.dialog}>
-        <span className={styles.close} onClick={this.props.closeDialog}>
+        <span className={styles.close} onClick={this.cancel}>
           ×
         </span>
         <h3 className={styles.title}>Delete My Account</h3>
         <StepProgress currentStep={this.state.step} totalSteps={4} />
         {step === 0 && (
-          <DeleteMyAccountStep0 goToNextStep={this.goToNextStep} />
+          <DeleteMyAccountStep0
+            goToNextStep={this.goToNextStep}
+            cancel={this.cancel}
+          />
         )}
         {step === 1 && (
-          <DeleteMyAccountStep1 goToNextStep={this.goToNextStep} />
+          <DeleteMyAccountStep1
+            goToNextStep={this.goToNextStep}
+            cancel={this.cancel}
+          />
         )}
         {step === 2 && (
-          <DeleteMyAccountStep2 goToNextStep={this.goToNextStep} />
+          <DeleteMyAccountStep2
+            goToNextStep={this.goToNextStep}
+            cancel={this.cancel}
+          />
         )}
         {step === 3 && (
-          <DeleteMyAccountStep3 goToNextStep={this.goToNextStep} />
+          <DeleteMyAccountStep3
+            goToNextStep={this.goToNextStep}
+            cancel={this.cancel}
+          />
         )}
-        {step === 4 && <DeleteMyAccountFinalStep />}
+        {step === 4 && <DeleteMyAccountFinalStep finish={this.cancel} />}
       </Dialog>
     );
   }
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
index 22cf476e5..764dae302 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
@@ -1,9 +1,10 @@
 import React from 'react';
 import cn from 'classnames';
+import PropTypes from 'prop-types';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountFinalStep = () => (
+const DeleteMyAccountFinalStep = props => (
   <div className={styles.step}>
     <p className={styles.description}>
       Your request has been submitted and confirmation has been sent to the
@@ -35,7 +36,7 @@ const DeleteMyAccountFinalStep = () => (
     <div className={cn(styles.actions, styles.columnView)}>
       <Button
         className={cn(styles.button, styles.proceed)}
-        onClick={this.closeDialog}
+        onClick={props.finish}
         full
       >
         Done
@@ -47,4 +48,8 @@ const DeleteMyAccountFinalStep = () => (
   </div>
 );
 
+DeleteMyAccountFinalStep.propTypes = {
+  finish: PropTypes.func.isRequired,
+};
+
 export default DeleteMyAccountFinalStep;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
index f81d912ea..901466d3b 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
@@ -29,7 +30,12 @@ const DeleteMyAccountStep0 = props => (
       </li>
     </ul>
     <div className={cn(styles.actions)}>
-      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.cancel)}
+        onClick={props.cancel}
+      >
+        Cancel
+      </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
@@ -40,4 +46,9 @@ const DeleteMyAccountStep0 = props => (
   </div>
 );
 
+DeleteMyAccountStep0.propTypes = {
+  goToNextStep: PropTypes.func.isRequired,
+  cancel: PropTypes.func.isRequired,
+};
+
 export default DeleteMyAccountStep0;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
index 1d26190bc..e74611b05 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
@@ -18,7 +19,12 @@ const DeleteMyAccountStep1 = props => (
       comments, reply to comments, or select reactions.
     </p>
     <div className={cn(styles.actions)}>
-      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.cancel)}
+        onClick={props.cancel}
+      >
+        Cancel
+      </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
@@ -29,4 +35,9 @@ const DeleteMyAccountStep1 = props => (
   </div>
 );
 
+DeleteMyAccountStep1.propTypes = {
+  goToNextStep: PropTypes.func.isRequired,
+  cancel: PropTypes.func.isRequired,
+};
+
 export default DeleteMyAccountStep1;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
index 3337c0b94..8ef14445e 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
@@ -1,9 +1,10 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep1 = props => (
+const DeleteMyAccountStep2 = props => (
   <div className={styles.step}>
     <p className={styles.description}>
       Before your account is deleted, we recommend you download your comment
@@ -17,7 +18,12 @@ const DeleteMyAccountStep1 = props => (
       </strong>
     </p>
     <div className={cn(styles.actions)}>
-      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.cancel)}
+        onClick={props.cancel}
+      >
+        Cancel
+      </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
@@ -28,4 +34,9 @@ const DeleteMyAccountStep1 = props => (
   </div>
 );
 
-export default DeleteMyAccountStep1;
+DeleteMyAccountStep2.propTypes = {
+  goToNextStep: PropTypes.func.isRequired,
+  cancel: PropTypes.func.isRequired,
+};
+
+export default DeleteMyAccountStep2;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index 8cff542c1..f91ca42c7 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -1,9 +1,10 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep1 = props => (
+const DeleteMyAccountStep3 = props => (
   <div className={styles.step}>
     <h4 className={styles.subTitle}>
       Are you sure you want to delete your account?
@@ -19,7 +20,12 @@ const DeleteMyAccountStep1 = props => (
       value="delete"
     />
     <div className={cn(styles.actions)}>
-      <Button className={cn(styles.button, styles.cancel)}>Cancel</Button>
+      <Button
+        className={cn(styles.button, styles.cancel)}
+        onClick={props.cancel}
+      >
+        Cancel
+      </Button>
       <Button
         className={cn(styles.button, styles.danger)}
         onClick={props.goToNextStep}
@@ -30,4 +36,9 @@ const DeleteMyAccountStep1 = props => (
   </div>
 );
 
-export default DeleteMyAccountStep1;
+DeleteMyAccountStep3.propTypes = {
+  goToNextStep: PropTypes.func.isRequired,
+  cancel: PropTypes.func.isRequired,
+};
+
+export default DeleteMyAccountStep3;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
index b88780f1f..a9c033853 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
@@ -12,7 +12,7 @@ const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
 const withData = withFragments({
   root: gql`
-    fragment TalkIgnoreUser_IgnoredUserSection_root on RootQuery {
+    fragment Talk_DeleteMyAccount_root on RootQuery {
       me {
         scheduledDeletionDate
       }

From 5eead8b7ee0edb3545b9940284252085bbaa0d97 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 16:32:42 -0300
Subject: [PATCH 028/160] Adding AccountDeletionRequestedSign.js

---
 .../AccountDeletionRequestedSign.css          | 23 ++++++
 .../AccountDeletionRequestedSign.js           | 26 +++++++
 .../components/DeleteMyAccountDialog.js       |  2 +
 .../components/DeleteMyAccountFinalStep.js    |  4 +-
 .../components/DeleteMyAccountStep.css        |  7 ++
 .../components/DeleteMyAccountStep3.js        | 72 +++++++++++--------
 6 files changed, 101 insertions(+), 33 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
new file mode 100644
index 000000000..413a3852b
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
@@ -0,0 +1,23 @@
+.container {
+  border : solid 1px #F26563;
+  border-radius: 2px;
+  color: #3B4A53; 
+}
+
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+
+  &.secondary {
+    background-color: #787D80;
+    color: white;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js
new file mode 100644
index 000000000..7d1941fa7
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import cn from 'classnames';
+import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import styles from './AccountDeletionRequestedSign.css';
+
+class AccountDeletionRequestedSign extends React.Component {
+  render() {
+    return (
+      <div className={styles.container}>
+        <h3>
+          <Icon name="warning" />Account Deletion Requested
+        </h3>
+        <p>
+          A request to delete your account was received on. If you would like to
+          continue leaving comments, replies or reactions, you may cancel your
+          request to delete your account below before
+        </p>
+        <Button className={cn(styles.button, styles.secondary)}>
+          Cancel Account Deletion Request
+        </Button>
+      </div>
+    );
+  }
+}
+
+export default AccountDeletionRequestedSign;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index 7c7c47d0b..4e3a1aa99 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -60,6 +60,7 @@ class DeleteMyAccountDialog extends React.Component {
           <DeleteMyAccountStep3
             goToNextStep={this.goToNextStep}
             cancel={this.cancel}
+            requestAccountDeletion={this.props.requestAccountDeletion}
           />
         )}
         {step === 4 && <DeleteMyAccountFinalStep finish={this.cancel} />}
@@ -70,6 +71,7 @@ class DeleteMyAccountDialog extends React.Component {
 
 DeleteMyAccountDialog.propTypes = {
   closeDialog: PropTypes.func.isRequired,
+  requestAccountDeletion: PropTypes.func.isRequired,
 };
 
 export default DeleteMyAccountDialog;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
index 764dae302..ccbbf61fa 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
@@ -11,12 +11,12 @@ const DeleteMyAccountFinalStep = props => (
       email address associated with your account.
     </p>
 
-    <div className={styles.box}>
+    <div className={cn(styles.box, styles.scheduledDeletion)}>
       <strong className={styles.block}>
         Your account is scheduled to be deleted at:
       </strong>
       <strong className={styles.block}>
-        <Icon name="access_time" />
+        <Icon name="access_time" className={styles.timeIcon} />
         <span>Account Deletion Date and Time</span>
       </strong>
     </div>
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
index 98b73f376..53d8ecef8 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
@@ -106,3 +106,10 @@
 .step {
   padding-top: 20px;
 }
+
+.scheduledDeletion {
+  i.timeIcon {
+    font-size: 1.2em;
+    padding: 4px;
+  }
+}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index f91ca42c7..54f49f375 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -4,40 +4,50 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 
-const DeleteMyAccountStep3 = props => (
-  <div className={styles.step}>
-    <h4 className={styles.subTitle}>
-      Are you sure you want to delete your account?
-    </h4>
-    <p className={styles.description}>
-      To confirm you would like to delete your account please type in the
-      following phrase into the text box below:
-    </p>
-    <input
-      className={styles.textBox}
-      disabled={true}
-      readOnly={true}
-      value="delete"
-    />
-    <div className={cn(styles.actions)}>
-      <Button
-        className={cn(styles.button, styles.cancel)}
-        onClick={props.cancel}
-      >
-        Cancel
-      </Button>
-      <Button
-        className={cn(styles.button, styles.danger)}
-        onClick={props.goToNextStep}
-      >
-        Delete My Account
-      </Button>
-    </div>
-  </div>
-);
+class DeleteMyAccountStep3 extends React.Component {
+  deleteAndContinue = () => {
+    this.props.requestAccountDeletion();
+    this.props.goToNextStep();
+  };
+
+  render() {
+    return (
+      <div className={styles.step}>
+        <h4 className={styles.subTitle}>
+          Are you sure you want to delete your account?
+        </h4>
+        <p className={styles.description}>
+          To confirm you would like to delete your account please type in the
+          following phrase into the text box below:
+        </p>
+        <input
+          className={styles.textBox}
+          disabled={true}
+          readOnly={true}
+          value="delete"
+        />
+        <div className={cn(styles.actions)}>
+          <Button
+            className={cn(styles.button, styles.cancel)}
+            onClick={this.props.cancel}
+          >
+            Cancel
+          </Button>
+          <Button
+            className={cn(styles.button, styles.danger)}
+            onClicsk={this.deleteAndContinue}
+          >
+            Delete My Account
+          </Button>
+        </div>
+      </div>
+    );
+  }
+}
 
 DeleteMyAccountStep3.propTypes = {
   goToNextStep: PropTypes.func.isRequired,
+  requestAccountDeletion: PropTypes.func.isRequired,
   cancel: PropTypes.func.isRequired,
 };
 

From ff7ee2aefc61522cbef173e4e5d3a31fcf7ff3fa Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 17:18:58 -0300
Subject: [PATCH 029/160] Updating cache

---
 client/coral-framework/graphql/mutations.js   | 58 ++++++++++++++++++-
 locales/en.yml                                |  1 +
 plugins/talk-plugin-auth/client/index.js      |  8 ++-
 .../AccountDeletionRequestedSign.css          | 23 --------
 .../AccountDeletionRequestedSign.js           | 26 ---------
 .../components/DeleteMyAccount.css            | 10 ++++
 .../components/DeleteMyAccount.js             | 17 +++++-
 .../components/DeleteMyAccountDialog.js       |  5 +-
 .../components/DeleteMyAccountStep3.js        |  2 +-
 .../AccountDeletionRequestedSign.css          | 44 ++++++++++++++
 .../AccountDeletionRequestedSign.js           | 55 ++++++++++++++++++
 .../AccountDeletionRequestedSign.js           | 25 ++++++++
 12 files changed, 216 insertions(+), 58 deletions(-)
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js
 create mode 100644 plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css
 create mode 100644 plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js
 create mode 100644 plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index bf412b189..89ffd1130 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -634,7 +634,32 @@ export const withRequestAccountDeletion = withMutation(
   {
     props: ({ mutate }) => ({
       requestAccountDeletion: () => {
-        return mutate();
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const CancelAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: new Date() },
+              },
+            });
+
+            proxy.writeQuery({
+              query: CancelAccountDeletionQuery,
+              data,
+            });
+          },
+        });
       },
     }),
   }
@@ -651,7 +676,9 @@ export const withRequestDownloadLink = withMutation(
   {
     props: ({ mutate }) => ({
       requestDownloadLink: () => {
-        return mutate();
+        return mutate({
+          variables: {},
+        });
       },
     }),
   }
@@ -668,7 +695,32 @@ export const withCancelAccountDeletion = withMutation(
   {
     props: ({ mutate }) => ({
       cancelAccountDeletion: () => {
-        return mutate();
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const CancelAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: null },
+              },
+            });
+
+            proxy.writeQuery({
+              query: CancelAccountDeletionQuery,
+              data,
+            });
+          },
+        });
       },
     }),
   }
diff --git a/locales/en.yml b/locales/en.yml
index 04fbc0bcb..5806976a4 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -246,6 +246,7 @@ en:
     ALREADY_EXISTS: "Resource already exists"
     INVALID_ASSET_URL: "Assert URL is invalid"
     CANNOT_IGNORE_STAFF: "Cannot ignore Staff members."
+    DELETION_NOT_SCHEDULED: "Deletion was not scheduled"
     email: "Not a valid E-Mail"
     confirm_password: "Passwords don't match. Please check again"
     network_error: "Failed to connect to server. Check your internet connection and try again."
diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index b432b05b2..98da589f8 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -5,12 +5,18 @@ import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
 import DeleteMyAccount from './profile-settings/containers/DeleteMyAccount';
+import AccountDeletionRequestedSign from './stream/containers/AccountDeletionRequestedSign';
 
 export default {
   reducer,
   translations,
   slots: {
-    stream: [UserBox, SignInButton, SetUsernameDialog],
+    stream: [
+      AccountDeletionRequestedSign,
+      UserBox,
+      SignInButton,
+      SetUsernameDialog,
+    ],
     login: [Login],
     profileSettings: [DeleteMyAccount],
   },
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
deleted file mode 100644
index 413a3852b..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.container {
-  border : solid 1px #F26563;
-  border-radius: 2px;
-  color: #3B4A53; 
-}
-
-.button {
-  color: #787D80;
-  border-radius: 2px;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-
-  &:hover {
-    background-color: #eaeaea;
-  }
-
-  &.secondary {
-    background-color: #787D80;
-    color: white;
-  }
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js
deleted file mode 100644
index 7d1941fa7..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/AccountDeletionRequestedSign.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react';
-import cn from 'classnames';
-import { Button, Icon } from 'plugin-api/beta/client/components/ui';
-import styles from './AccountDeletionRequestedSign.css';
-
-class AccountDeletionRequestedSign extends React.Component {
-  render() {
-    return (
-      <div className={styles.container}>
-        <h3>
-          <Icon name="warning" />Account Deletion Requested
-        </h3>
-        <p>
-          A request to delete your account was received on. If you would like to
-          continue leaving comments, replies or reactions, you may cancel your
-          request to delete your account below before
-        </p>
-        <Button className={cn(styles.button, styles.secondary)}>
-          Cancel Account Deletion Request
-        </Button>
-      </div>
-    );
-  }
-}
-
-export default AccountDeletionRequestedSign;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
index 2fe139d52..e524d990a 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
@@ -10,4 +10,14 @@
   &:hover {
     background-color: #eaeaea;
   }
+
+  &.secondary {
+    background-color: #787D80;
+    color: white;
+  }
+
+  > i { 
+    font-size: 1.2em;
+    vertical-align: middle;
+  }
 }
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
index 0fc06f326..9bc5573a1 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
+import moment from 'moment';
 import styles from './DeleteMyAccount.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import DeleteMyAccountDialog from './DeleteMyAccountDialog';
@@ -52,6 +53,7 @@ class DeleteMyAccount extends React.Component {
       <div className="talk-plugin-auth--delete-my-account">
         <DeleteMyAccountDialog
           requestAccountDeletion={this.requestAccountDeletion}
+          showDialog={this.state.showDialog}
           closeDialog={this.closeDialog}
         />
         <h3
@@ -62,6 +64,15 @@ class DeleteMyAccount extends React.Component {
         >
           Delete My Account
         </h3>
+        <p
+          className={cn(
+            styles.description,
+            'talk-plugin-auth--delete-my-account-description'
+          )}
+        >
+          Deleting your account will permanently erase your profile and remove
+          all your comments from this site.
+        </p>
         <p
           className={cn(
             styles.description,
@@ -70,12 +81,14 @@ class DeleteMyAccount extends React.Component {
         >
           {scheduledDeletionDate &&
             `You have already submitted a request to delete your account.
-          Your account will be deleted on ${scheduledDeletionDate}. You may
+          Your account will be deleted on ${moment(
+            scheduledDeletionDate
+          ).format('MMM Do YYYY, h:mm:ss a')}. You may
           cancel the request until that time`}
         </p>
         {scheduledDeletionDate ? (
           <Button
-            className={cn(styles.button)}
+            className={cn(styles.button, styles.secondary)}
             onClick={this.cancelAccountDeletion}
           >
             Cancel Account Deletion Request
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index 4e3a1aa99..b9a1bfc9d 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -26,13 +26,13 @@ class DeleteMyAccountDialog extends React.Component {
 
   cancel = () => {
     this.clear();
-    this.closeDialog();
+    this.props.closeDialog();
   };
 
   render() {
     const { step } = this.state;
     return (
-      <Dialog open={true} className={styles.dialog}>
+      <Dialog open={this.props.showDialog} className={styles.dialog}>
         <span className={styles.close} onClick={this.cancel}>
           ×
         </span>
@@ -70,6 +70,7 @@ class DeleteMyAccountDialog extends React.Component {
 }
 
 DeleteMyAccountDialog.propTypes = {
+  showDialog: PropTypes.bool.isRequired,
   closeDialog: PropTypes.func.isRequired,
   requestAccountDeletion: PropTypes.func.isRequired,
 };
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index 54f49f375..63a00243b 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -35,7 +35,7 @@ class DeleteMyAccountStep3 extends React.Component {
           </Button>
           <Button
             className={cn(styles.button, styles.danger)}
-            onClicsk={this.deleteAndContinue}
+            onClick={this.deleteAndContinue}
           >
             Delete My Account
           </Button>
diff --git a/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css b/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css
new file mode 100644
index 000000000..0dada08b5
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css
@@ -0,0 +1,44 @@
+.container {
+  border: 1px solid #f26563;
+  border-radius: 2px;
+  color: #3b4a53;
+  padding: 20px 10px;
+  background-color: rgba(242, 101, 99, 0.1);
+  margin: 20px 0;
+}
+
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+
+  &.secondary {
+    background-color: #787D80;
+    color: white;
+  }
+}
+
+.title {
+  margin: 0;
+  i.icon {
+    font-size: 1em;
+    padding: 4px;
+  }
+}
+
+.description {
+  margin: 0;
+  padding-left: 22px;
+  padding-bottom: 15px;
+}
+
+.actions {
+  text-align: center;
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js
new file mode 100644
index 000000000..a26d28d21
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js
@@ -0,0 +1,55 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import styles from './AccountDeletionRequestedSign.css';
+import { getErrorMessages } from 'coral-framework/utils';
+
+class AccountDeletionRequestedSign extends React.Component {
+  cancelAccountDeletion = async () => {
+    const { cancelAccountDeletion, notify } = this.props;
+    try {
+      await cancelAccountDeletion();
+      notify(
+        'success',
+        'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+      );
+    } catch (err) {
+      notify('error', getErrorMessages(err));
+    }
+  };
+
+  render() {
+    return (
+      <div className={styles.container}>
+        <h4 className={styles.title}>
+          <Icon name="warning" className={styles.icon} />Account Deletion
+          Requested
+        </h4>
+        <p className={styles.description}>
+          A request to delete your account was received on.
+        </p>
+        <p className={styles.description}>
+          If you would like to continue leaving comments, replies or reactions,
+          you may cancel your request to delete your account below before
+        </p>
+        <div className={styles.actions}>
+          <Button
+            className={cn(styles.button, styles.secondary)}
+            onClick={this.cancelAccountDeletion}
+          >
+            Cancel Account Deletion Request
+          </Button>
+        </div>
+      </div>
+    );
+  }
+}
+
+AccountDeletionRequestedSign.propTypes = {
+  cancelAccountDeletion: PropTypes.func.isRequired,
+  notify: PropTypes.func.isRequired,
+  root: PropTypes.object.isRequired,
+};
+
+export default AccountDeletionRequestedSign;
diff --git a/plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js b/plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js
new file mode 100644
index 000000000..d842ec43f
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js
@@ -0,0 +1,25 @@
+import { compose, gql } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { connect, withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
+import AccountDeletionRequestedSign from '../components/AccountDeletionRequestedSign';
+import { notify } from 'coral-framework/actions/notification';
+import { withCancelAccountDeletion } from 'plugin-api/beta/client/hocs';
+
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
+const withData = withFragments({
+  root: gql`
+    fragment Talk_AccountDeletionRequestedSignIn_root on RootQuery {
+      me {
+        scheduledDeletionDate
+      }
+    }
+  `,
+});
+
+export default compose(
+  connect(null, mapDispatchToProps),
+  withCancelAccountDeletion,
+  withData,
+  excludeIf(props => !props.root.me.scheduledDeletionDate)
+)(AccountDeletionRequestedSign);

From 49fcc1ea43ab948480ed70919ef60110f57fe97c Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 17:30:57 -0300
Subject: [PATCH 030/160] Adding missing slot

---
 client/coral-embed-stream/src/tabs/stream/containers/Stream.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
index 0a7a1951c..17d3132ea 100644
--- a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
+++ b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
@@ -372,6 +372,7 @@ const slots = [
   'streamTabsPrepend',
   'streamTabPanes',
   'streamFilter',
+  'stream',
 ];
 
 const fragments = {

From d5fa7455e5d905aff4126d7fa6b2902ee6fd547e Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 17:55:01 -0300
Subject: [PATCH 031/160] Adding InputField

---
 .../client/components/ErrorMessage.css        |   8 +
 .../client/components/ErrorMessage.js         |  17 ++
 .../client/components/InputField.css          |  80 +++++++
 .../client/components/InputField.js           |  94 ++++++++
 .../components/ChangePassword.css             |  87 +++++++
 .../components/ChangePassword.js              | 223 ++++++++++++++++++
 .../components/ChangeUsername.css             | 122 ++++++++++
 .../components/ChangeUsername.js              | 188 +++++++++++++++
 .../components/ChangeUsernameDialog.css       |  84 +++++++
 .../components/ChangeUsernameDialog.js        | 117 +++++++++
 .../components/DeleteMyAccountDialog.js       |  15 +-
 .../components/DeleteMyAccountStep3.js        |  48 +++-
 .../components/ErrorMessage.css               |   8 +
 .../components/ErrorMessage.js                |  17 ++
 .../components/InputField.css                 |  80 +++++++
 .../profile-settings/components/InputField.js |  94 ++++++++
 .../containers/ChangePassword.js              |  12 +
 .../containers/ChangeUsername.js              |  12 +
 18 files changed, 1302 insertions(+), 4 deletions(-)
 create mode 100644 plugins/talk-plugin-auth/client/components/ErrorMessage.css
 create mode 100644 plugins/talk-plugin-auth/client/components/ErrorMessage.js
 create mode 100644 plugins/talk-plugin-auth/client/components/InputField.css
 create mode 100644 plugins/talk-plugin-auth/client/components/InputField.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
 create mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js

diff --git a/plugins/talk-plugin-auth/client/components/ErrorMessage.css b/plugins/talk-plugin-auth/client/components/ErrorMessage.css
new file mode 100644
index 000000000..039ffae30
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/components/ErrorMessage.css
@@ -0,0 +1,8 @@
+.errorMsg {
+  color: #FA4643;
+  font-size: 0.9em;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
diff --git a/plugins/talk-plugin-auth/client/components/ErrorMessage.js b/plugins/talk-plugin-auth/client/components/ErrorMessage.js
new file mode 100644
index 000000000..f39a8fc08
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/components/ErrorMessage.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styles from './ErrorMessage.css';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const ErrorMessage = ({ children }) => (
+  <div className={styles.errorMsg}>
+    <Icon className={styles.warningIcon} name="warning" />
+    <span>{children}</span>
+  </div>
+);
+
+ErrorMessage.propTypes = {
+  children: PropTypes.node,
+};
+
+export default ErrorMessage;
diff --git a/plugins/talk-plugin-auth/client/components/InputField.css b/plugins/talk-plugin-auth/client/components/InputField.css
new file mode 100644
index 000000000..3442befde
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/components/InputField.css
@@ -0,0 +1,80 @@
+  
+.detailItem {
+  margin-bottom: 12px;
+}
+
+.detailItemContainer {
+  display: flex;
+}
+
+.columnDisplay {
+  flex-direction: column;
+
+  .detailItemMessage {
+    padding: 4px 0 0;
+  }
+}
+
+.detailItemContent {
+  border: solid 1px #787D80;
+  border-radius: 2px;
+  background-color: white;
+  height: 30px;
+  display: inline-block;
+  width: 230px;
+  display: flex;  
+  box-sizing: border-box;
+
+  > .detailIcon {
+    font-size: 1.2em;
+    padding: 0 5px;
+    color: #787D80;
+    line-height: 30px; 
+  }
+
+  &.error {
+    border: solid 2px #FA4643;
+  }
+
+  &.disabled {
+    background-color: #E0E0E0;
+  }
+}
+
+.detailLabel {
+  color: #4C4C4D;
+  font-size: 1em;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.detailValue {
+  background: transparent;
+  border: none;
+  font-size: 1em;
+  color: #000;
+  outline: none;
+  flex: 1;
+  height: 100%;
+  box-sizing: border-box;
+}
+
+.detailItemMessage {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  padding-left: 6px;
+  padding-top: 16px;
+
+  .warningIcon, .checkIcon {
+    font-size: 17px;
+  }
+}
+
+.checkIcon {
+  color: #00CD73;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
diff --git a/plugins/talk-plugin-auth/client/components/InputField.js b/plugins/talk-plugin-auth/client/components/InputField.js
new file mode 100644
index 000000000..26937d5b9
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/components/InputField.js
@@ -0,0 +1,94 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './InputField.css';
+import ErrorMessage from './ErrorMessage';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const InputField = ({
+  id = '',
+  label = '',
+  type = 'text',
+  name = '',
+  onChange = () => {},
+  showError = true,
+  hasError = false,
+  errorMsg = '',
+  children,
+  columnDisplay = false,
+  showSuccess = false,
+  validationType = '',
+  icon = '',
+  value = '',
+  defaultValue = '',
+  disabled = false,
+}) => {
+  const inputValue = {
+    ...(value ? { value } : {}),
+    ...(defaultValue ? { defaultValue } : {}),
+  };
+
+  return (
+    <div className={styles.detailItem}>
+      <div
+        className={cn(styles.detailItemContainer, {
+          [styles.columnDisplay]: columnDisplay,
+        })}
+      >
+        {label && (
+          <label className={styles.detailLabel} id={id}>
+            {label}
+          </label>
+        )}
+        <div
+          className={cn(
+            styles.detailItemContent,
+            { [styles.error]: hasError && showError },
+            { [styles.disabled]: disabled }
+          )}
+        >
+          {icon && <Icon name={icon} className={styles.detailIcon} />}
+          <input
+            id={id}
+            type={type}
+            name={name}
+            className={styles.detailValue}
+            onChange={onChange}
+            autoComplete="off"
+            data-validation-type={validationType}
+            disabled={disabled}
+            {...inputValue}
+          />
+        </div>
+        <div className={styles.detailItemMessage}>
+          {!hasError &&
+            showSuccess &&
+            value && <Icon className={styles.checkIcon} name="check_circle" />}
+          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+        </div>
+      </div>
+      {children}
+    </div>
+  );
+};
+
+InputField.propTypes = {
+  id: PropTypes.string,
+  disabled: PropTypes.bool,
+  label: PropTypes.string,
+  type: PropTypes.string,
+  name: PropTypes.string.isRequired,
+  onChange: PropTypes.func,
+  value: PropTypes.string,
+  defaultValue: PropTypes.string,
+  icon: PropTypes.string,
+  showError: PropTypes.bool,
+  hasError: PropTypes.bool,
+  errorMsg: PropTypes.string,
+  children: PropTypes.node,
+  columnDisplay: PropTypes.bool,
+  showSuccess: PropTypes.bool,
+  validationType: PropTypes.string,
+};
+
+export default InputField;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
new file mode 100644
index 000000000..6c7f9ae41
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
@@ -0,0 +1,87 @@
+.container {
+  position: relative;
+  color: #202020;
+  padding: 10px;
+  border-radius: 2px;
+  border: solid 1px transparent;
+  box-sizing: border-box;
+  justify-content: space-between;
+  
+  &.editing {
+    border-color: #979797;
+    background-color: #EDEDED;
+  }
+}
+
+.actions {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.title {
+  color: #202020;
+  margin: 0 0 20px;
+}
+
+.detailBottomBox {
+  display: block;
+  padding-top: 4px;
+  text-align: right;
+  width: 280px;
+}
+
+.detailLink {
+  color: #00538A;  
+  text-decoration: none;
+  font-size: 0.9em;
+  &:hover {
+    cursor: pointer;
+  }
+}
+
+.button {
+  border: 1px solid #787d80;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+}
+
+.saveButton {
+  background-color: #3498DB;
+  border-color: #3498DB;
+  color: white;
+
+  > i {
+    font-size: 17px;
+  }
+    
+  &:hover {
+    background-color: #399ee2;
+    color: white;
+  }
+
+  &:disabled {
+    border-color: #e0e0e0;
+
+    &:hover {
+      background-color: #e0e0e0;
+      color: #4f5c67;
+      cursor: default;
+    }
+  }
+}
+
+.cancelButton {
+  color:#787D80;
+  margin-top: 6px;
+  font-size: 0.9em;
+
+  &:hover {
+    cursor: pointer;
+  }
+}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
new file mode 100644
index 000000000..90940728d
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
@@ -0,0 +1,223 @@
+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 validate from 'coral-framework/helpers/validate';
+import errorMsj from 'coral-framework/helpers/error';
+import isEqual from 'lodash/isEqual';
+import { t } from 'plugin-api/beta/client/services';
+import InputField from './InputField';
+import { getErrorMessages } from 'coral-framework/utils';
+
+const initialState = {
+  editing: false,
+  showErrors: true,
+  errors: {},
+  formData: {},
+};
+
+class ChangePassword extends React.Component {
+  state = initialState;
+  validKeys = ['oldPassword', 'newPassword', 'confirmNewPassword'];
+
+  onChange = e => {
+    const { name, value, type } = e.target;
+    this.setState(
+      state => ({
+        formData: {
+          ...state.formData,
+          [name]: value,
+        },
+      }),
+      () => {
+        this.fieldValidation(value, type, name);
+
+        // Perform equality validation if password fields have changed
+        if (name === 'newPassword' || name === 'confirmNewPassword') {
+          this.equalityValidation('newPassword', 'confirmNewPassword');
+        }
+      }
+    );
+  };
+
+  equalityValidation = (field, field2) => {
+    const cond = this.state.formData[field] === this.state.formData[field2];
+    if (!cond) {
+      this.addError({
+        [field2]: t('talk-plugin-auth.change_password.passwords_dont_match'),
+      });
+    } else {
+      this.removeError(field2);
+    }
+    return cond;
+  };
+
+  fieldValidation = (value, type, name) => {
+    if (!value.length) {
+      this.addError({
+        [name]: t('talk-plugin-auth.change_password.required_field'),
+      });
+    } else if (!validate[type](value)) {
+      this.addError({ [name]: errorMsj[type] });
+    } else {
+      this.removeError(name);
+    }
+  };
+
+  hasError = err => {
+    return Object.keys(this.state.errors).indexOf(err) !== -1;
+  };
+
+  addError = err => {
+    this.setState(({ errors }) => ({
+      errors: { ...errors, ...err },
+    }));
+  };
+
+  removeError = errKey => {
+    this.setState(state => {
+      const { [errKey]: _, ...errors } = state.errors;
+      return {
+        errors,
+      };
+    });
+  };
+
+  enableEditing = () => {
+    this.setState({
+      editing: true,
+    });
+  };
+
+  isSubmitBlocked = () => {
+    const formHasErrors = !!Object.keys(this.state.errors).length;
+    const formIncomplete = !isEqual(
+      Object.keys(this.state.formData),
+      this.validKeys
+    );
+    return formHasErrors || formIncomplete;
+  };
+
+  clearForm = () => {
+    this.setState(initialState);
+  };
+
+  onSave = async () => {
+    const { oldPassword, newPassword } = this.state.formData;
+
+    try {
+      await this.props.changePassword({
+        oldPassword,
+        newPassword,
+      });
+      this.props.notify(
+        'success',
+        t('talk-plugin-auth.change_password.changed_password_msg')
+      );
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+
+    this.clearForm();
+    this.disableEditing();
+  };
+
+  disableEditing = () => {
+    this.setState({
+      editing: false,
+    });
+  };
+
+  cancel = () => {
+    this.clearForm();
+    this.disableEditing();
+  };
+
+  render() {
+    const { editing, errors } = this.state;
+
+    return (
+      <section
+        className={cn('talk-plugin-auth--change-password', styles.container, {
+          [styles.editing]: editing,
+        })}
+      >
+        <h3 className={styles.title}>
+          {t('talk-plugin-auth.change_password.change_password')}
+        </h3>
+        {editing && (
+          <form className="talk-plugin-auth--change-password-form">
+            <InputField
+              id="oldPassword"
+              label="Old Password"
+              name="oldPassword"
+              type="password"
+              onChange={this.onChange}
+              value={this.state.formData.oldPassword}
+              hasError={this.hasError('oldPassword')}
+              errorMsg={errors['oldPassword']}
+              showErrors
+            >
+              <span className={styles.detailBottomBox}>
+                <a className={styles.detailLink}>
+                  {t('talk-plugin-auth.change_password.forgot_password')}
+                </a>
+              </span>
+            </InputField>
+            <InputField
+              id="newPassword"
+              label="New Password"
+              name="newPassword"
+              type="password"
+              onChange={this.onChange}
+              value={this.state.formData.newPassword}
+              hasError={this.hasError('newPassword')}
+              errorMsg={errors['newPassword']}
+              showErrors
+            />
+            <InputField
+              id="confirmNewPassword"
+              label="Confirm New Password"
+              name="confirmNewPassword"
+              type="password"
+              onChange={this.onChange}
+              value={this.state.formData.confirmNewPassword}
+              hasError={this.hasError('confirmNewPassword')}
+              errorMsg={errors['confirmNewPassword']}
+              showErrors
+            />
+          </form>
+        )}
+        {editing ? (
+          <div className={styles.actions}>
+            <Button
+              className={cn(styles.button, styles.saveButton)}
+              icon="save"
+              onClick={this.onSave}
+              disabled={this.isSubmitBlocked()}
+            >
+              {t('talk-plugin-auth.change_password.save')}
+            </Button>
+            <a className={styles.cancelButton} onClick={this.cancel}>
+              {t('talk-plugin-auth.change_password.cancel')}
+            </a>
+          </div>
+        ) : (
+          <div className={styles.actions}>
+            <Button className={styles.button} onClick={this.enableEditing}>
+              {t('talk-plugin-auth.change_password.edit')}
+            </Button>
+          </div>
+        )}
+      </section>
+    );
+  }
+}
+
+ChangePassword.propTypes = {
+  changePassword: PropTypes.func.isRequired,
+  notify: PropTypes.func.isRequired,
+};
+
+export default ChangePassword;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
new file mode 100644
index 000000000..5b4631ecf
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
@@ -0,0 +1,122 @@
+.container {
+  margin-bottom: 20px;
+  display: flex;
+  position: relative;
+  color: #202020;
+  padding: 10px;
+  border-radius: 2px;
+  box-sizing: border-box;
+  justify-content: space-between;
+  
+  &.editing { 
+    background-color: #EDEDED;
+  }
+}
+
+.content {
+  flex-grow: 1;
+} 
+
+.actions {
+  flex-grow: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}                                                                       
+
+.email {
+  margin: 0;
+}
+
+.username {   
+  margin-bottom: 4px;
+}         
+
+.button {
+  border: 1px solid #787d80;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+}
+
+.saveButton {
+  background-color: #3498DB;
+  border-color: #3498DB;
+  color: white;
+
+  > i {
+    font-size: 17px;
+  }
+    
+  &:hover {
+    background-color: #399ee2;
+    color: white;
+  }
+
+  &:disabled {
+    border-color: #e0e0e0;
+
+    &:hover {
+      background-color: #e0e0e0;
+      color: #4f5c67;
+      cursor: default;
+    }
+  }
+}
+
+.cancelButton {
+  color:#787D80;
+  margin-top: 6px;
+  font-size: 0.9em;
+
+  &:hover {
+    cursor: pointer;
+  }
+}
+
+.detailLabel {
+  border: solid 1px #787D80;
+  border-radius: 2px;
+  background-color: white;
+  height: 30px;
+  display: inline-block;
+  width: 230px;
+  display: flex;  
+
+  > .detailLabelIcon {
+    font-size: 1.2em;
+    padding: 0 5px;
+    color: #787D80;
+    line-height: 30px; 
+  }
+
+  &.disabled {
+    background-color: #E0E0E0;
+  }
+}
+
+.detailValue {
+  background: transparent;
+  border: none;
+  font-size: 1em;
+  color: #000;
+  height: 30px;
+  outline: none;
+  flex: 1;
+}
+
+.bottomText {
+  color: #474747;
+  font-size: 0.9em;
+}
+
+.detailList {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+} 
+
+.detailItem {
+  margin-bottom: 12px;
+}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
new file mode 100644
index 000000000..8188bdfbe
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
@@ -0,0 +1,188 @@
+import React from 'react';
+import cn from 'classnames';
+import PropTypes from 'prop-types';
+import styles from './ChangeUsername.css';
+import { Button } from 'plugin-api/beta/client/components/ui';
+import ChangeUsernameDialog from './ChangeUsernameDialog';
+import { t } from 'plugin-api/beta/client/services';
+import InputField from './InputField';
+import { getErrorMessages } from 'coral-framework/utils';
+import { canUsernameBeUpdated } from 'coral-framework/utils/user';
+
+const initialState = {
+  editing: false,
+  showDialog: false,
+  formData: {},
+};
+
+class ChangeUsername extends React.Component {
+  state = initialState;
+
+  clearForm = () => {
+    this.setState(initialState);
+  };
+
+  enableEditing = () => {
+    this.setState({
+      editing: true,
+    });
+  };
+
+  disableEditing = () => {
+    this.setState({
+      editing: false,
+    });
+  };
+
+  cancel = () => {
+    this.clearForm();
+    this.disableEditing();
+  };
+
+  showDialog = () => {
+    this.setState({
+      showDialog: true,
+    });
+  };
+
+  onSave = async () => {
+    this.showDialog();
+  };
+
+  saveChanges = async () => {
+    const { newUsername } = this.state.formData;
+    const { changeUsername } = this.props;
+
+    try {
+      await changeUsername(newUsername);
+      this.props.notify(
+        'success',
+        t('talk-plugin-auth.change_username.changed_username_success_msg')
+      );
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+
+    this.clearForm();
+    this.disableEditing();
+  };
+
+  onChange = e => {
+    const { name, value } = e.target;
+
+    this.setState(state => ({
+      formData: {
+        ...state.formData,
+        [name]: value,
+      },
+    }));
+  };
+
+  closeDialog = () => {
+    this.setState({
+      showDialog: false,
+    });
+  };
+
+  render() {
+    const {
+      username,
+      emailAddress,
+      root: { me: { state: { status } } },
+      notify,
+    } = this.props;
+    const { editing, formData, showDialog } = this.state;
+
+    return (
+      <section
+        className={cn('talk-plugin-auth--edit-profile', styles.container, {
+          [styles.editing]: editing,
+        })}
+      >
+        <ChangeUsernameDialog
+          canUsernameBeUpdated={canUsernameBeUpdated(status)}
+          showDialog={showDialog}
+          onChange={this.onChange}
+          formData={formData}
+          username={username}
+          closeDialog={this.closeDialog}
+          saveChanges={this.saveChanges}
+          notify={notify}
+        />
+
+        {editing ? (
+          <div className={styles.content}>
+            <div className={styles.detailList}>
+              <InputField
+                icon="person"
+                id="newUsername"
+                name="newUsername"
+                onChange={this.onChange}
+                defaultValue={username}
+                columnDisplay
+                validationType="username"
+              >
+                <span className={styles.bottomText}>
+                  {t('talk-plugin-auth.change_username.change_username_note')}
+                </span>
+              </InputField>
+              <InputField
+                icon="email"
+                id="email"
+                name="email"
+                value={emailAddress}
+                validationType="username"
+                disabled
+              />
+            </div>
+          </div>
+        ) : (
+          <div className={styles.content}>
+            <h2 className={styles.username}>{username}</h2>
+            {emailAddress ? (
+              <p className={styles.email}>{emailAddress}</p>
+            ) : null}
+          </div>
+        )}
+        {editing ? (
+          <div className={styles.actions}>
+            <Button
+              className={cn(styles.button, styles.saveButton)}
+              icon="save"
+              onClick={this.onSave}
+              disabled={
+                !this.state.formData.newUsername ||
+                this.state.formData.newUsername === username
+              }
+            >
+              {t('talk-plugin-auth.change_username.save')}
+            </Button>
+            <a className={styles.cancelButton} onClick={this.cancel}>
+              {t('talk-plugin-auth.change_username.cancel')}
+            </a>
+          </div>
+        ) : (
+          <div className={styles.actions}>
+            <Button
+              className={styles.button}
+              icon="settings"
+              onClick={this.enableEditing}
+            >
+              {t('talk-plugin-auth.change_username.edit_profile')}
+            </Button>
+          </div>
+        )}
+      </section>
+    );
+  }
+}
+
+ChangeUsername.propTypes = {
+  root: PropTypes.object.isRequired,
+  changeUsername: PropTypes.func.isRequired,
+  notify: PropTypes.func.isRequired,
+  username: PropTypes.string,
+  emailAddress: PropTypes.string,
+};
+
+export default ChangeUsername;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
new file mode 100644
index 000000000..af681d596
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
@@ -0,0 +1,84 @@
+.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;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
new file mode 100644
index 000000000..321b36926
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
@@ -0,0 +1,117 @@
+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-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-auth--edit-profile-dialog')}
+      >
+        <span className={styles.close} onClick={this.props.closeDialog}>
+          ×
+        </span>
+        <h1 className={styles.title}>
+          {t('talk-plugin-auth.change_username.confirm_username_change')}
+        </h1>
+        <div className={styles.content}>
+          <p className={styles.description}>
+            {t('talk-plugin-auth.change_username.description')}
+          </p>
+          <div className={styles.usernamesChange}>
+            <span className={styles.item}>
+              {t('talk-plugin-auth.change_username.old_username')}:{' '}
+              {this.props.username}
+            </span>
+            <span className={styles.item}>
+              {t('talk-plugin-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-auth.change_username.username_does_not_match'
+              )}
+              showError={this.state.showError}
+              columnDisplay
+              showSuccess={false}
+              validationType="username"
+            >
+              <span className={styles.bottomNote}>
+                {t('talk-plugin-auth.change_username.bottom_note')}
+              </span>
+            </InputField>
+          </form>
+          <div className={styles.bottomActions}>
+            <Button className={styles.cancel}>
+              {t('talk-plugin-auth.change_username.cancel')}
+            </Button>
+            <Button
+              className={styles.confirmChanges}
+              onClick={this.confirmChanges}
+            >
+              {t('talk-plugin-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;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
index b9a1bfc9d..35069384c 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
@@ -9,7 +9,7 @@ import DeleteMyAccountStep2 from './DeleteMyAccountStep2';
 import DeleteMyAccountStep3 from './DeleteMyAccountStep3';
 import DeleteMyAccountFinalStep from './DeleteMyAccountFinalStep';
 
-const initialState = { step: 0 };
+const initialState = { step: 0, formData: {} };
 
 class DeleteMyAccountDialog extends React.Component {
   state = initialState;
@@ -29,6 +29,17 @@ class DeleteMyAccountDialog extends React.Component {
     this.props.closeDialog();
   };
 
+  onChange = e => {
+    const { name, value } = e.target;
+
+    this.setState(state => ({
+      formData: {
+        ...state.formData,
+        [name]: value,
+      },
+    }));
+  };
+
   render() {
     const { step } = this.state;
     return (
@@ -58,9 +69,11 @@ class DeleteMyAccountDialog extends React.Component {
         )}
         {step === 3 && (
           <DeleteMyAccountStep3
+            formData={this.state.formData}
             goToNextStep={this.goToNextStep}
             cancel={this.cancel}
             requestAccountDeletion={this.props.requestAccountDeletion}
+            onChange={this.onChange}
           />
         )}
         {step === 4 && <DeleteMyAccountFinalStep finish={this.cancel} />}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
index 63a00243b..45dca8f97 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
@@ -3,13 +3,41 @@ import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import InputField from '../../components/InputField';
+
+const initialState = {
+  showError: false,
+};
 
 class DeleteMyAccountStep3 extends React.Component {
-  deleteAndContinue = () => {
-    this.props.requestAccountDeletion();
+  state = initialState;
+  phrase = 'delete';
+
+  showError = () => {
+    this.setState({
+      showError: true,
+    });
+  };
+
+  clear = () => {
+    this.setState(initialState);
+  };
+
+  deleteAndContinue = async () => {
+    if (this.formHasError()) {
+      this.showError();
+      return;
+    }
+
+    await this.props.requestAccountDeletion();
+    this.clear();
     this.props.goToNextStep();
   };
 
+  formHasError = () =>
+    !this.props.formData.confirmPhrase ||
+    this.props.formData.confirmPhrase !== this.phrase;
+
   render() {
     return (
       <div className={styles.step}>
@@ -24,7 +52,19 @@ class DeleteMyAccountStep3 extends React.Component {
           className={styles.textBox}
           disabled={true}
           readOnly={true}
-          value="delete"
+          value={this.phrase}
+        />
+        <InputField
+          id="confirmPhrase"
+          label={'Type phrase bellow to confirm'}
+          name="confirmPhrase"
+          type="text"
+          onChange={this.props.onChange}
+          defaultValue=""
+          hasError={this.formHasError()}
+          errorMsg={'The input is not correct'}
+          showError={this.state.showError}
+          columnDisplay
         />
         <div className={cn(styles.actions)}>
           <Button
@@ -49,6 +89,8 @@ DeleteMyAccountStep3.propTypes = {
   goToNextStep: PropTypes.func.isRequired,
   requestAccountDeletion: PropTypes.func.isRequired,
   cancel: PropTypes.func.isRequired,
+  onChange: PropTypes.func.isRequired,
+  formData: PropTypes.object.isRequired,
 };
 
 export default DeleteMyAccountStep3;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
new file mode 100644
index 000000000..abcf692fe
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
@@ -0,0 +1,8 @@
+.errorMsg {
+  color: #FA4643;
+  font-size: 0.9em;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
new file mode 100644
index 000000000..f39a8fc08
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styles from './ErrorMessage.css';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const ErrorMessage = ({ children }) => (
+  <div className={styles.errorMsg}>
+    <Icon className={styles.warningIcon} name="warning" />
+    <span>{children}</span>
+  </div>
+);
+
+ErrorMessage.propTypes = {
+  children: PropTypes.node,
+};
+
+export default ErrorMessage;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
new file mode 100644
index 000000000..cd6015e47
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
@@ -0,0 +1,80 @@
+  
+.detailItem {
+  margin-bottom: 12px;
+}
+
+.detailItemContainer {
+  display: flex;
+}
+
+.columnDisplay {
+  flex-direction: column;
+
+  .detailItemMessage {
+    padding: 4px 0 0;
+  }
+}
+
+.detailItemContent {
+  border: solid 1px #787D80;
+  border-radius: 2px;
+  background-color: white;
+  height: 30px;
+  display: inline-block;
+  width: 230px;
+  display: flex;  
+  box-sizing: border-box;
+
+  > .detailIcon {
+    font-size: 1.2em;
+    padding: 0 5px;
+    color: #787D80;
+    line-height: 30px; 
+  }
+
+  &.error {
+    border: solid 2px #FA4643;
+  }
+
+  &.disabled {
+    background-color: #E0E0E0;
+  }
+}
+
+.detailLabel {
+  color: #4C4C4D;
+  font-size: 1em;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.detailValue {
+  background: transparent;
+  border: none;
+  font-size: 1em;
+  color: #000;
+  outline: none;
+  flex: 1;
+  height: 100%;
+  box-sizing: border-box;
+}
+
+.detailItemMessage {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  padding-left: 6px;
+  padding-top: 16px;
+
+  .warningIcon, .checkIcon {
+    font-size: 17px;
+  }
+}
+
+.checkIcon {
+  color: #00CD73;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
new file mode 100644
index 000000000..34c314c20
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
@@ -0,0 +1,94 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './InputField.css';
+import ErrorMessage from './ErrorMessage';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const InputField = ({
+  id = '',
+  label = '',
+  type = 'text',
+  name = '',
+  onChange = () => {},
+  showError = true,
+  hasError = false,
+  errorMsg = '',
+  children,
+  columnDisplay = false,
+  showSuccess = false,
+  validationType = '',
+  icon = '',
+  value = '',
+  defaultValue = '',
+  disabled = false,
+}) => {
+  const inputValue = {
+    ...(value ? { value } : {}),
+    ...(defaultValue ? { defaultValue } : {}),
+  };
+
+  return (
+    <div className={styles.detailItem}>
+      <div
+        className={cn(styles.detailItemContainer, {
+          [styles.columnDisplay]: columnDisplay,
+        })}
+      >
+        {label && (
+          <label className={styles.detailLabel} id={id}>
+            {label}
+          </label>
+        )}
+        <div
+          className={cn(
+            styles.detailItemContent,
+            { [styles.error]: hasError },
+            { [styles.disabled]: disabled }
+          )}
+        >
+          {icon && <Icon name={icon} className={styles.detailIcon} />}
+          <input
+            id={id}
+            type={type}
+            name={name}
+            className={styles.detailValue}
+            onChange={onChange}
+            autoComplete="off"
+            data-validation-type={validationType}
+            disabled={disabled}
+            {...inputValue}
+          />
+        </div>
+        <div className={styles.detailItemMessage}>
+          {!hasError &&
+            showSuccess &&
+            value && <Icon className={styles.checkIcon} name="check_circle" />}
+          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+        </div>
+      </div>
+      {children}
+    </div>
+  );
+};
+
+InputField.propTypes = {
+  id: PropTypes.string,
+  disabled: PropTypes.bool,
+  label: PropTypes.string,
+  type: PropTypes.string,
+  name: PropTypes.string.isRequired,
+  onChange: PropTypes.func,
+  value: PropTypes.string,
+  defaultValue: PropTypes.string,
+  icon: PropTypes.string,
+  showError: PropTypes.bool,
+  hasError: PropTypes.bool,
+  errorMsg: PropTypes.string,
+  children: PropTypes.node,
+  columnDisplay: PropTypes.bool,
+  showSuccess: PropTypes.bool,
+  validationType: PropTypes.string,
+};
+
+export default InputField;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
new file mode 100644
index 000000000..1322a2940
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
@@ -0,0 +1,12 @@
+import { compose } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { connect } from 'plugin-api/beta/client/hocs';
+import ChangePassword from '../components/ChangePassword';
+import { notify } from 'coral-framework/actions/notification';
+import { withChangePassword } from 'plugin-api/beta/client/hocs';
+
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
+export default compose(connect(null, mapDispatchToProps), withChangePassword)(
+  ChangePassword
+);
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
new file mode 100644
index 000000000..87e1e18b5
--- /dev/null
+++ b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
@@ -0,0 +1,12 @@
+import { compose } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { connect } from 'plugin-api/beta/client/hocs';
+import ChangeUsername from '../components/ChangeUsername';
+import { notify } from 'coral-framework/actions/notification';
+import { withChangeUsername } from 'plugin-api/beta/client/hocs';
+
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
+export default compose(connect(null, mapDispatchToProps), withChangeUsername)(
+  ChangeUsername
+);

From 864e06222ccaa1f7fc861939548d731c7f927941 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 1 May 2018 17:59:31 -0300
Subject: [PATCH 032/160] Adding input

---
 plugins/talk-plugin-auth/client/components/ErrorMessage.css   | 4 ++++
 .../profile-settings/components/DeleteMyAccountStep.css       | 1 +
 2 files changed, 5 insertions(+)

diff --git a/plugins/talk-plugin-auth/client/components/ErrorMessage.css b/plugins/talk-plugin-auth/client/components/ErrorMessage.css
index 039ffae30..19f6940b1 100644
--- a/plugins/talk-plugin-auth/client/components/ErrorMessage.css
+++ b/plugins/talk-plugin-auth/client/components/ErrorMessage.css
@@ -1,6 +1,10 @@
 .errorMsg {
   color: #FA4643;
   font-size: 0.9em;
+
+  i.warningIcon {
+    font-size: 17px;
+  }
 }
 
 .warningIcon {
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
index 53d8ecef8..7d02b4e6f 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
@@ -96,6 +96,7 @@
   box-sizing: border-box;
   color: #3B4A53;
   font-size: 1em;
+  margin-bottom: 15px;
 }
 
 .block {

From d6828c5ef4736ed75d6c5757a921b98b6a002003 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 1 May 2018 16:27:47 -0600
Subject: [PATCH 033/160] cli fixes

---
 bin/cli          | 29 +++++------------------------
 bin/cli-settings |  8 ++++++++
 bin/util.js      |  5 +++--
 package.json     |  3 +--
 yarn.lock        | 13 +------------
 5 files changed, 18 insertions(+), 40 deletions(-)

diff --git a/bin/cli b/bin/cli
index df2253261..9713d6f40 100755
--- a/bin/cli
+++ b/bin/cli
@@ -1,14 +1,12 @@
 #!/usr/bin/env node
 
-/**
- * Module dependencies.
- */
-
-require('./util');
 const program = require('commander');
-const { head, map } = require('lodash');
-const Matcher = require('did-you-mean');
 
+// We're requiring this here so it'll setup some promise rejection hooks to log
+// out.
+require('./util');
+
+// Setup the program.
 program
   .command('serve', 'serve the application')
   .command('db', 'run database commands')
@@ -24,20 +22,3 @@ program
     'provides utilities for interacting with the plugin system'
   )
   .parse(process.argv);
-
-// If the command wasn't found, output help.
-const commands = map(program.commands, '_name');
-const command = head(program.args);
-if (!commands.includes(command)) {
-  const m = new Matcher(commands);
-  const similarCommands = m.list(command);
-
-  console.error(
-    `cli '${command}' is not a talk cli command. See 'cli --help'.`
-  );
-  if (similarCommands.length > 0) {
-    const sc = similarCommands.map(({ value }) => `\t${value}\n`).join('');
-    console.error(`\nThe most similar commands are\n${sc}`);
-  }
-  process.exit(1);
-}
diff --git a/bin/cli-settings b/bin/cli-settings
index 7f449e0d5..d4ff3480e 100755
--- a/bin/cli-settings
+++ b/bin/cli-settings
@@ -5,6 +5,7 @@ const program = require('commander');
 const inquirer = require('inquirer');
 const mongoose = require('../services/mongoose');
 const SettingsService = require('../services/settings');
+const cache = require('../services/cache');
 
 // Register the shutdown criteria.
 util.onshutdown([() => mongoose.disconnect()]);
@@ -13,6 +14,13 @@ util.onshutdown([() => mongoose.disconnect()]);
  * Change the organization name
  */
 async function changeOrgName() {
+  try {
+    await cache.init();
+  } catch (err) {
+    console.error(err);
+    util.shutdown(1);
+  }
+
   try {
     let settings = await SettingsService.retrieve();
 
diff --git a/bin/util.js b/bin/util.js
index 648c79bcc..3b07f31bf 100644
--- a/bin/util.js
+++ b/bin/util.js
@@ -4,7 +4,8 @@ require('../services/env');
 const debug = require('debug')('talk:util');
 const { uniq } = require('lodash');
 
-const util = (module.exports = {});
+// Setup the utilities.
+const util = {};
 
 /**
  * Stores an array of functions that should be executed in the event that the
@@ -15,7 +16,7 @@ util.toshutdown = [];
 
 /**
  * Calls all the shutdown functions and then ends the process.
- * @param  {Number} [defaultCode=0] default return code upon sucesfull shutdown.
+ * @param  {Number} [defaultCode=0] default return code upon successful shutdown.
  */
 util.shutdown = (defaultCode = 0, signal = null) => {
   if (signal) {
diff --git a/package.json b/package.json
index c7e9a78c1..80e11cde8 100644
--- a/package.json
+++ b/package.json
@@ -79,11 +79,11 @@
     "babel-polyfill": "^6.26.0",
     "babel-preset-es2015": "6.24.1",
     "babel-preset-react": "^6.23.0",
-    "bunyan-debug-stream": "^1.0.8",
     "bcryptjs": "^2.4.3",
     "bowser": "^1.7.2",
     "brotli-webpack-plugin": "^0.5.0",
     "bunyan": "^1.8.12",
+    "bunyan-debug-stream": "^1.0.8",
     "cli-table": "^0.3.1",
     "clipboard": "^1.7.1",
     "colors": "^1.1.2",
@@ -98,7 +98,6 @@
     "dataloader": "^1.3.0",
     "debug": "3.1.0",
     "dialog-polyfill": "^0.4.9",
-    "did-you-mean": "^0.0.1",
     "dotenv": "^4.0.0",
     "ejs": "^2.5.7",
     "env-rewrite": "^1.0.2",
diff --git a/yarn.lock b/yarn.lock
index 74659a4b0..9a455a9a6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2982,13 +2982,6 @@ dialog-polyfill@^0.4.9:
   version "0.4.9"
   resolved "https://registry.yarnpkg.com/dialog-polyfill/-/dialog-polyfill-0.4.9.tgz#c690b3727c3d82e0f947bd5b910b32af8a2ef57d"
 
-did-you-mean@^0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/did-you-mean/-/did-you-mean-0.0.1.tgz#8851ce82407903cb62c12cb6ad4f676921ccdec3"
-  dependencies:
-    levenshtein "*"
-    underscore "*"
-
 diff@1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/diff/-/diff-1.4.0.tgz#7f28d2eb9ee7b15a97efd89ce63dcfdaa3ccbabf"
@@ -6487,10 +6480,6 @@ leven@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/leven/-/leven-2.1.0.tgz#c2e7a9f772094dee9d34202ae8acce4687875580"
 
-levenshtein@*:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/levenshtein/-/levenshtein-1.0.5.tgz#3911737a9cb56da345d008f55782c6f138979ba3"
-
 levn@^0.3.0, levn@~0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee"
@@ -11503,7 +11492,7 @@ undefsafe@^2.0.1:
   dependencies:
     debug "^2.2.0"
 
-underscore@*, underscore@>=1.3.1:
+underscore@>=1.3.1:
   version "1.8.3"
   resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.8.3.tgz#4f3fb53b106e6097fcf9cb4109f2a5e9bdfa5022"
 

From c3d01be0df2e4f20f43b57e02845dcbe14ce4b29 Mon Sep 17 00:00:00 2001
From: Mendel Konikov <mkonikov@gmail.com>
Date: Tue, 1 May 2018 20:34:42 -0400
Subject: [PATCH 034/160] Add note explaining possible plugin conflict

---
 plugins/talk-plugin-rich-text/README.md | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-rich-text/README.md b/plugins/talk-plugin-rich-text/README.md
index a69e5c8dc..6de13a66f 100644
--- a/plugins/talk-plugin-rich-text/README.md
+++ b/plugins/talk-plugin-rich-text/README.md
@@ -16,6 +16,9 @@ Enables secure rich text support server-side.
 Add `"talk-plugin-rich-text"` to the `plugins.json` in your Talk installation.
 This plugin provides a server and a client side implementation.
 
+###### Note: Possible plugin conflict
+The plugin `talk-plugin-comment-content` will prevent this plugin from rendering comments with rich text styling and is not needed if this plugin is enabled.
+
 ## Server implementation
 
 ### How does this work?
@@ -47,7 +50,7 @@ Rules to sanitize html input.  We use [DOMPurify] (https://github.com/cure53/DOM
 
 #### `jsdom`
 
-In order to run html in the server we need [jsdom](https://github.com/jsdom/jsdom). Usually you wouldn’t need to modify this settings. 
+In order to run html in the server we need [jsdom](https://github.com/jsdom/jsdom). Usually you wouldn’t need to modify this settings.
 
 ## Client implementation
 
@@ -58,10 +61,10 @@ This plugin contains 2 important components:
 - The Editor (`./components/Editor.js`)
 - The Comment Content Renderer (`./components/CommentContent.js`)
 
-The editor component utilizes the [contentEditable](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Editable_content) and execCommand API. 
+The editor component utilizes the [contentEditable](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Editable_content) and execCommand API.
 
 If you check our `index.js` you will notice that we inject this editor in the
-`commentBox` slot. We do this to replace the core comment box with this one. 
+`commentBox` slot. We do this to replace the core comment box with this one.
 
 Now, in order to render the new styled comments we need a comment renderer. For
 this task we will have to replace our core comment renderer by using the

From 018addc6ad84b59777a75ea7914c64daf36e6ca2 Mon Sep 17 00:00:00 2001
From: Mendel Konikov <mkonikov@gmail.com>
Date: Tue, 1 May 2018 20:37:42 -0400
Subject: [PATCH 035/160] Remove space to correct markdown link formatting

---
 plugins/talk-plugin-rich-text/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-rich-text/README.md b/plugins/talk-plugin-rich-text/README.md
index 6de13a66f..cac44438e 100644
--- a/plugins/talk-plugin-rich-text/README.md
+++ b/plugins/talk-plugin-rich-text/README.md
@@ -46,7 +46,7 @@ Settings for highlighting links. These will only apply if `higlightLinks` is set
 
 #### `dompurify`
 
-Rules to sanitize html input.  We use [DOMPurify] (https://github.com/cure53/DOMPurify) to prevent web attacks and XSS. Here is the complete list of [settings] (https://github.com/cure53/DOMPurify)
+Rules to sanitize html input.  We use [DOMPurify](https://github.com/cure53/DOMPurify) to prevent web attacks and XSS. Here is the complete list of [settings](https://github.com/cure53/DOMPurify)
 
 #### `jsdom`
 

From 26438d0b9002b86772a94c95488a648ec0834cb1 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 2 May 2018 09:59:10 -0600
Subject: [PATCH 036/160] patched json

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index c7e9a78c1..3d0501e82 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "lint:js": "eslint bin/cli* .",
     "lint": "npm-run-all lint:*",
     "plugins:reconcile": "./bin/cli plugins reconcile",
-    "test": "npm-run-all test:jest test:mocha",
+    "test": "npm-run-all test:jest test:server:mocha",
     "test:jest": "NODE_ENV=test jest --runInBand",
     "test:client": "NODE_ENV=test jest --projects client",
     "test:server": "npm-run-all test:server:jest test:server:mocha",

From 7c16ae222002457430ef7288901958f64426d55c Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 2 May 2018 10:17:41 -0600
Subject: [PATCH 037/160] cli fix

---
 bin/util.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/bin/util.js b/bin/util.js
index 3b07f31bf..78664daa3 100644
--- a/bin/util.js
+++ b/bin/util.js
@@ -64,3 +64,5 @@ process.on('unhandledRejection', err => {
   console.error(err);
   process.exit(1);
 });
+
+module.exports = util;

From 6c0c76328f8bf0f977b6681f6bba3e9fbb19198c Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 13:28:03 -0300
Subject: [PATCH 038/160] merge conflict

---
 plugins/talk-plugin-auth/client/index.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index aa591dd68..6341dc7c9 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -6,7 +6,6 @@ import Login from './login/containers/Main';
 import reducer from './login/reducer';
 import ChangePassword from './profile-settings/containers/ChangePassword';
 import Profile from './profile-settings/containers/Profile';
-import ChangeUsername from './profile-settings/containers/ChangeUsername';
 
 export default {
   reducer,
@@ -15,7 +14,6 @@ export default {
     stream: [UserBox, SignInButton, SetUsernameDialog],
     login: [Login],
     profileHeader: [Profile],
-    profileHeader: [ChangeUsername],
     profileSettings: [ChangePassword],
   },
 };

From b2f37733e877d178a7585e0675f80aee1a5faef1 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 13:39:08 -0300
Subject: [PATCH 039/160] Sending correct parameters

---
 .../client/profile-settings/components/Profile.js               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
index c40494506..3d8f10698 100644
--- a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
+++ b/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
@@ -124,7 +124,7 @@ class Profile extends React.Component {
     const { changeUsername } = this.props;
 
     try {
-      await changeUsername(newUsername);
+      await changeUsername(this.props.root.me.id, newUsername);
       this.props.notify(
         'success',
         t('talk-plugin-auth.change_username.changed_username_success_msg')

From 780bd42ceb8d5cb5fb037108e1cc5194ce034f62 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 13:49:23 -0300
Subject: [PATCH 040/160] Moving gdpr to `talk-plugin-local-auth`

---
 plugins/talk-plugin-auth/client/index.js      |   4 -
 .../components/ChangeUsername.css             | 122 ------------
 .../components/ChangeUsername.js              | 188 ------------------
 .../containers/ChangeUsername.js              |  12 --
 .../components/ChangeEmailContentDialog.css   |   0
 .../components/ChangeEmailContentDialog.js    |   0
 .../client}/components/ChangePassword.css     |   0
 .../client}/components/ChangePassword.js      |   0
 .../ChangeUsernameContentDialog.css           |   0
 .../components/ChangeUsernameContentDialog.js |   0
 .../components/ChangeUsernameDialog.css       |   0
 .../components/ChangeUsernameDialog.js        |   0
 .../components/ConfirmChangesDialog.css       |   0
 .../components/ConfirmChangesDialog.js        |   0
 .../client}/components/ErrorMessage.css       |   0
 .../client}/components/ErrorMessage.js        |   0
 .../client}/components/InputField.css         |   0
 .../client}/components/InputField.js          |   0
 .../client}/components/Profile.css            |   0
 .../client}/components/Profile.js             |   0
 .../client}/containers/ChangePassword.js      |   0
 .../client}/containers/Profile.js             |   0
 .../talk-plugin-local-auth/client/index.js    |  10 +-
 23 files changed, 9 insertions(+), 327 deletions(-)
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeEmailContentDialog.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeEmailContentDialog.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangePassword.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangePassword.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeUsernameContentDialog.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeUsernameContentDialog.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeUsernameDialog.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ChangeUsernameDialog.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ConfirmChangesDialog.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ConfirmChangesDialog.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ErrorMessage.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/ErrorMessage.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/InputField.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/InputField.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/Profile.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/components/Profile.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/containers/ChangePassword.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-local-auth/client}/containers/Profile.js (100%)

diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index 6341dc7c9..13abce1d9 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -4,8 +4,6 @@ import SetUsernameDialog from './stream/containers/SetUsernameDialog';
 import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
-import ChangePassword from './profile-settings/containers/ChangePassword';
-import Profile from './profile-settings/containers/Profile';
 
 export default {
   reducer,
@@ -13,7 +11,5 @@ export default {
   slots: {
     stream: [UserBox, SignInButton, SetUsernameDialog],
     login: [Login],
-    profileHeader: [Profile],
-    profileSettings: [ChangePassword],
   },
 };
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
deleted file mode 100644
index 5b4631ecf..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
+++ /dev/null
@@ -1,122 +0,0 @@
-.container {
-  margin-bottom: 20px;
-  display: flex;
-  position: relative;
-  color: #202020;
-  padding: 10px;
-  border-radius: 2px;
-  box-sizing: border-box;
-  justify-content: space-between;
-  
-  &.editing { 
-    background-color: #EDEDED;
-  }
-}
-
-.content {
-  flex-grow: 1;
-} 
-
-.actions {
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}                                                                       
-
-.email {
-  margin: 0;
-}
-
-.username {   
-  margin-bottom: 4px;
-}         
-
-.button {
-  border: 1px solid #787d80;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-}
-
-.saveButton {
-  background-color: #3498DB;
-  border-color: #3498DB;
-  color: white;
-
-  > i {
-    font-size: 17px;
-  }
-    
-  &:hover {
-    background-color: #399ee2;
-    color: white;
-  }
-
-  &:disabled {
-    border-color: #e0e0e0;
-
-    &:hover {
-      background-color: #e0e0e0;
-      color: #4f5c67;
-      cursor: default;
-    }
-  }
-}
-
-.cancelButton {
-  color:#787D80;
-  margin-top: 6px;
-  font-size: 0.9em;
-
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.detailLabel {
-  border: solid 1px #787D80;
-  border-radius: 2px;
-  background-color: white;
-  height: 30px;
-  display: inline-block;
-  width: 230px;
-  display: flex;  
-
-  > .detailLabelIcon {
-    font-size: 1.2em;
-    padding: 0 5px;
-    color: #787D80;
-    line-height: 30px; 
-  }
-
-  &.disabled {
-    background-color: #E0E0E0;
-  }
-}
-
-.detailValue {
-  background: transparent;
-  border: none;
-  font-size: 1em;
-  color: #000;
-  height: 30px;
-  outline: none;
-  flex: 1;
-}
-
-.bottomText {
-  color: #474747;
-  font-size: 0.9em;
-}
-
-.detailList {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-} 
-
-.detailItem {
-  margin-bottom: 12px;
-}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
deleted file mode 100644
index 8188bdfbe..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
+++ /dev/null
@@ -1,188 +0,0 @@
-import React from 'react';
-import cn from 'classnames';
-import PropTypes from 'prop-types';
-import styles from './ChangeUsername.css';
-import { Button } from 'plugin-api/beta/client/components/ui';
-import ChangeUsernameDialog from './ChangeUsernameDialog';
-import { t } from 'plugin-api/beta/client/services';
-import InputField from './InputField';
-import { getErrorMessages } from 'coral-framework/utils';
-import { canUsernameBeUpdated } from 'coral-framework/utils/user';
-
-const initialState = {
-  editing: false,
-  showDialog: false,
-  formData: {},
-};
-
-class ChangeUsername extends React.Component {
-  state = initialState;
-
-  clearForm = () => {
-    this.setState(initialState);
-  };
-
-  enableEditing = () => {
-    this.setState({
-      editing: true,
-    });
-  };
-
-  disableEditing = () => {
-    this.setState({
-      editing: false,
-    });
-  };
-
-  cancel = () => {
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  showDialog = () => {
-    this.setState({
-      showDialog: true,
-    });
-  };
-
-  onSave = async () => {
-    this.showDialog();
-  };
-
-  saveChanges = async () => {
-    const { newUsername } = this.state.formData;
-    const { changeUsername } = this.props;
-
-    try {
-      await changeUsername(newUsername);
-      this.props.notify(
-        'success',
-        t('talk-plugin-auth.change_username.changed_username_success_msg')
-      );
-    } catch (err) {
-      this.props.notify('error', getErrorMessages(err));
-    }
-
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  onChange = e => {
-    const { name, value } = e.target;
-
-    this.setState(state => ({
-      formData: {
-        ...state.formData,
-        [name]: value,
-      },
-    }));
-  };
-
-  closeDialog = () => {
-    this.setState({
-      showDialog: false,
-    });
-  };
-
-  render() {
-    const {
-      username,
-      emailAddress,
-      root: { me: { state: { status } } },
-      notify,
-    } = this.props;
-    const { editing, formData, showDialog } = this.state;
-
-    return (
-      <section
-        className={cn('talk-plugin-auth--edit-profile', styles.container, {
-          [styles.editing]: editing,
-        })}
-      >
-        <ChangeUsernameDialog
-          canUsernameBeUpdated={canUsernameBeUpdated(status)}
-          showDialog={showDialog}
-          onChange={this.onChange}
-          formData={formData}
-          username={username}
-          closeDialog={this.closeDialog}
-          saveChanges={this.saveChanges}
-          notify={notify}
-        />
-
-        {editing ? (
-          <div className={styles.content}>
-            <div className={styles.detailList}>
-              <InputField
-                icon="person"
-                id="newUsername"
-                name="newUsername"
-                onChange={this.onChange}
-                defaultValue={username}
-                columnDisplay
-                validationType="username"
-              >
-                <span className={styles.bottomText}>
-                  {t('talk-plugin-auth.change_username.change_username_note')}
-                </span>
-              </InputField>
-              <InputField
-                icon="email"
-                id="email"
-                name="email"
-                value={emailAddress}
-                validationType="username"
-                disabled
-              />
-            </div>
-          </div>
-        ) : (
-          <div className={styles.content}>
-            <h2 className={styles.username}>{username}</h2>
-            {emailAddress ? (
-              <p className={styles.email}>{emailAddress}</p>
-            ) : null}
-          </div>
-        )}
-        {editing ? (
-          <div className={styles.actions}>
-            <Button
-              className={cn(styles.button, styles.saveButton)}
-              icon="save"
-              onClick={this.onSave}
-              disabled={
-                !this.state.formData.newUsername ||
-                this.state.formData.newUsername === username
-              }
-            >
-              {t('talk-plugin-auth.change_username.save')}
-            </Button>
-            <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
-            </a>
-          </div>
-        ) : (
-          <div className={styles.actions}>
-            <Button
-              className={styles.button}
-              icon="settings"
-              onClick={this.enableEditing}
-            >
-              {t('talk-plugin-auth.change_username.edit_profile')}
-            </Button>
-          </div>
-        )}
-      </section>
-    );
-  }
-}
-
-ChangeUsername.propTypes = {
-  root: PropTypes.object.isRequired,
-  changeUsername: PropTypes.func.isRequired,
-  notify: PropTypes.func.isRequired,
-  username: PropTypes.string,
-  emailAddress: PropTypes.string,
-};
-
-export default ChangeUsername;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
deleted file mode 100644
index 87e1e18b5..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { compose } from 'react-apollo';
-import { bindActionCreators } from 'redux';
-import { connect } from 'plugin-api/beta/client/hocs';
-import ChangeUsername from '../components/ChangeUsername';
-import { notify } from 'coral-framework/actions/notification';
-import { withChangeUsername } from 'plugin-api/beta/client/hocs';
-
-const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
-
-export default compose(connect(null, mapDispatchToProps), withChangeUsername)(
-  ChangeUsername
-);
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.css
rename to plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeEmailContentDialog.js
rename to plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
rename to plugins/talk-plugin-local-auth/client/components/ChangePassword.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
rename to plugins/talk-plugin-local-auth/client/components/ChangePassword.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.css
rename to plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameContentDialog.js
rename to plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
rename to plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
rename to plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css b/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.css
rename to plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js b/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ConfirmChangesDialog.js
rename to plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css b/plugins/talk-plugin-local-auth/client/components/ErrorMessage.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
rename to plugins/talk-plugin-local-auth/client/components/ErrorMessage.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js b/plugins/talk-plugin-local-auth/client/components/ErrorMessage.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
rename to plugins/talk-plugin-local-auth/client/components/ErrorMessage.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css b/plugins/talk-plugin-local-auth/client/components/InputField.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
rename to plugins/talk-plugin-local-auth/client/components/InputField.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js b/plugins/talk-plugin-local-auth/client/components/InputField.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
rename to plugins/talk-plugin-local-auth/client/components/InputField.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.css b/plugins/talk-plugin-local-auth/client/components/Profile.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/Profile.css
rename to plugins/talk-plugin-local-auth/client/components/Profile.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/Profile.js
rename to plugins/talk-plugin-local-auth/client/components/Profile.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js b/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
rename to plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/containers/Profile.js
rename to plugins/talk-plugin-local-auth/client/containers/Profile.js
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index ff8b4c563..01f3f7123 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -1 +1,9 @@
-export default {};
+import ChangePassword from './containers/ChangePassword';
+import Profile from './containers/Profile';
+
+export default {
+  slots: {
+    profileHeader: [Profile],
+    profileSettings: [ChangePassword],
+  },
+};

From c57acddfc01547a1fc3d7842a0366d272022e78c Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 14:01:03 -0300
Subject: [PATCH 041/160] Moving gdpr to `talk-plugin-profile-data`

---
 plugins/talk-plugin-auth/client/index.js      |  13 +-
 .../components/ChangePassword.css             |  87 -------
 .../components/ChangePassword.js              | 223 ------------------
 .../components/ChangeUsername.css             | 122 ----------
 .../components/ChangeUsername.js              | 188 ---------------
 .../components/ChangeUsernameDialog.css       |  84 -------
 .../components/ChangeUsernameDialog.js        | 117 ---------
 .../components/ErrorMessage.css               |   8 -
 .../components/ErrorMessage.js                |  17 --
 .../components/InputField.css                 |  80 -------
 .../profile-settings/components/InputField.js |  94 --------
 .../containers/ChangePassword.js              |  12 -
 .../containers/ChangeUsername.js              |  12 -
 .../AccountDeletionRequestedSign.css          |   0
 .../AccountDeletionRequestedSign.js           |   0
 .../client}/components/DeleteMyAccount.css    |   0
 .../client}/components/DeleteMyAccount.js     |   0
 .../components/DeleteMyAccountDialog.css      |   0
 .../components/DeleteMyAccountDialog.js       |   0
 .../components/DeleteMyAccountFinalStep.js    |   0
 .../components/DeleteMyAccountStep.css        |   0
 .../components/DeleteMyAccountStep0.js        |   0
 .../components/DeleteMyAccountStep1.js        |   0
 .../components/DeleteMyAccountStep2.js        |   0
 .../components/DeleteMyAccountStep3.js        |   0
 .../client/components/ErrorMessage.css        |   0
 .../client/components/ErrorMessage.js         |   0
 .../client/components/InputField.css          |   0
 .../client/components/InputField.js           |   0
 .../client}/components/StepProgress.css       |   0
 .../client}/components/StepProgress.js        |   0
 .../AccountDeletionRequestedSign.js           |   0
 .../client}/containers/DeleteMyAccount.js     |   0
 .../talk-plugin-profile-data/client/index.js  |   5 +-
 34 files changed, 5 insertions(+), 1057 deletions(-)
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
 delete mode 100644 plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
 rename plugins/{talk-plugin-auth/client/stream => talk-plugin-profile-data/client}/components/AccountDeletionRequestedSign.css (100%)
 rename plugins/{talk-plugin-auth/client/stream => talk-plugin-profile-data/client}/components/AccountDeletionRequestedSign.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccount.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccount.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountDialog.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountDialog.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountFinalStep.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountStep.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountStep0.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountStep1.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountStep2.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/DeleteMyAccountStep3.js (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-profile-data}/client/components/ErrorMessage.css (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-profile-data}/client/components/ErrorMessage.js (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-profile-data}/client/components/InputField.css (100%)
 rename plugins/{talk-plugin-auth => talk-plugin-profile-data}/client/components/InputField.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/StepProgress.css (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/components/StepProgress.js (100%)
 rename plugins/{talk-plugin-auth/client/stream => talk-plugin-profile-data/client}/containers/AccountDeletionRequestedSign.js (100%)
 rename plugins/{talk-plugin-auth/client/profile-settings => talk-plugin-profile-data/client}/containers/DeleteMyAccount.js (100%)

diff --git a/plugins/talk-plugin-auth/client/index.js b/plugins/talk-plugin-auth/client/index.js
index 0567497ae..13abce1d9 100644
--- a/plugins/talk-plugin-auth/client/index.js
+++ b/plugins/talk-plugin-auth/client/index.js
@@ -4,23 +4,12 @@ import SetUsernameDialog from './stream/containers/SetUsernameDialog';
 import translations from './translations.yml';
 import Login from './login/containers/Main';
 import reducer from './login/reducer';
-import DeleteMyAccount from './profile-settings/containers/DeleteMyAccount';
-import AccountDeletionRequestedSign from './stream/containers/AccountDeletionRequestedSign';
-import ChangePassword from './profile-settings/containers/ChangePassword';
-import ChangeUsername from './profile-settings/containers/ChangeUsername';
 
 export default {
   reducer,
   translations,
   slots: {
-    stream: [
-      AccountDeletionRequestedSign,
-      UserBox,
-      SignInButton,
-      SetUsernameDialog,
-    ],
+    stream: [UserBox, SignInButton, SetUsernameDialog],
     login: [Login],
-    profileHeader: [ChangeUsername],
-    profileSettings: [ChangePassword, DeleteMyAccount],
   },
 };
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
deleted file mode 100644
index 6c7f9ae41..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.css
+++ /dev/null
@@ -1,87 +0,0 @@
-.container {
-  position: relative;
-  color: #202020;
-  padding: 10px;
-  border-radius: 2px;
-  border: solid 1px transparent;
-  box-sizing: border-box;
-  justify-content: space-between;
-  
-  &.editing {
-    border-color: #979797;
-    background-color: #EDEDED;
-  }
-}
-
-.actions {
-  position: absolute;
-  top: 10px;
-  right: 10px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.title {
-  color: #202020;
-  margin: 0 0 20px;
-}
-
-.detailBottomBox {
-  display: block;
-  padding-top: 4px;
-  text-align: right;
-  width: 280px;
-}
-
-.detailLink {
-  color: #00538A;  
-  text-decoration: none;
-  font-size: 0.9em;
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.button {
-  border: 1px solid #787d80;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-}
-
-.saveButton {
-  background-color: #3498DB;
-  border-color: #3498DB;
-  color: white;
-
-  > i {
-    font-size: 17px;
-  }
-    
-  &:hover {
-    background-color: #399ee2;
-    color: white;
-  }
-
-  &:disabled {
-    border-color: #e0e0e0;
-
-    &:hover {
-      background-color: #e0e0e0;
-      color: #4f5c67;
-      cursor: default;
-    }
-  }
-}
-
-.cancelButton {
-  color:#787D80;
-  margin-top: 6px;
-  font-size: 0.9em;
-
-  &:hover {
-    cursor: pointer;
-  }
-}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
deleted file mode 100644
index 90940728d..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangePassword.js
+++ /dev/null
@@ -1,223 +0,0 @@
-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 validate from 'coral-framework/helpers/validate';
-import errorMsj from 'coral-framework/helpers/error';
-import isEqual from 'lodash/isEqual';
-import { t } from 'plugin-api/beta/client/services';
-import InputField from './InputField';
-import { getErrorMessages } from 'coral-framework/utils';
-
-const initialState = {
-  editing: false,
-  showErrors: true,
-  errors: {},
-  formData: {},
-};
-
-class ChangePassword extends React.Component {
-  state = initialState;
-  validKeys = ['oldPassword', 'newPassword', 'confirmNewPassword'];
-
-  onChange = e => {
-    const { name, value, type } = e.target;
-    this.setState(
-      state => ({
-        formData: {
-          ...state.formData,
-          [name]: value,
-        },
-      }),
-      () => {
-        this.fieldValidation(value, type, name);
-
-        // Perform equality validation if password fields have changed
-        if (name === 'newPassword' || name === 'confirmNewPassword') {
-          this.equalityValidation('newPassword', 'confirmNewPassword');
-        }
-      }
-    );
-  };
-
-  equalityValidation = (field, field2) => {
-    const cond = this.state.formData[field] === this.state.formData[field2];
-    if (!cond) {
-      this.addError({
-        [field2]: t('talk-plugin-auth.change_password.passwords_dont_match'),
-      });
-    } else {
-      this.removeError(field2);
-    }
-    return cond;
-  };
-
-  fieldValidation = (value, type, name) => {
-    if (!value.length) {
-      this.addError({
-        [name]: t('talk-plugin-auth.change_password.required_field'),
-      });
-    } else if (!validate[type](value)) {
-      this.addError({ [name]: errorMsj[type] });
-    } else {
-      this.removeError(name);
-    }
-  };
-
-  hasError = err => {
-    return Object.keys(this.state.errors).indexOf(err) !== -1;
-  };
-
-  addError = err => {
-    this.setState(({ errors }) => ({
-      errors: { ...errors, ...err },
-    }));
-  };
-
-  removeError = errKey => {
-    this.setState(state => {
-      const { [errKey]: _, ...errors } = state.errors;
-      return {
-        errors,
-      };
-    });
-  };
-
-  enableEditing = () => {
-    this.setState({
-      editing: true,
-    });
-  };
-
-  isSubmitBlocked = () => {
-    const formHasErrors = !!Object.keys(this.state.errors).length;
-    const formIncomplete = !isEqual(
-      Object.keys(this.state.formData),
-      this.validKeys
-    );
-    return formHasErrors || formIncomplete;
-  };
-
-  clearForm = () => {
-    this.setState(initialState);
-  };
-
-  onSave = async () => {
-    const { oldPassword, newPassword } = this.state.formData;
-
-    try {
-      await this.props.changePassword({
-        oldPassword,
-        newPassword,
-      });
-      this.props.notify(
-        'success',
-        t('talk-plugin-auth.change_password.changed_password_msg')
-      );
-    } catch (err) {
-      this.props.notify('error', getErrorMessages(err));
-    }
-
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  disableEditing = () => {
-    this.setState({
-      editing: false,
-    });
-  };
-
-  cancel = () => {
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  render() {
-    const { editing, errors } = this.state;
-
-    return (
-      <section
-        className={cn('talk-plugin-auth--change-password', styles.container, {
-          [styles.editing]: editing,
-        })}
-      >
-        <h3 className={styles.title}>
-          {t('talk-plugin-auth.change_password.change_password')}
-        </h3>
-        {editing && (
-          <form className="talk-plugin-auth--change-password-form">
-            <InputField
-              id="oldPassword"
-              label="Old Password"
-              name="oldPassword"
-              type="password"
-              onChange={this.onChange}
-              value={this.state.formData.oldPassword}
-              hasError={this.hasError('oldPassword')}
-              errorMsg={errors['oldPassword']}
-              showErrors
-            >
-              <span className={styles.detailBottomBox}>
-                <a className={styles.detailLink}>
-                  {t('talk-plugin-auth.change_password.forgot_password')}
-                </a>
-              </span>
-            </InputField>
-            <InputField
-              id="newPassword"
-              label="New Password"
-              name="newPassword"
-              type="password"
-              onChange={this.onChange}
-              value={this.state.formData.newPassword}
-              hasError={this.hasError('newPassword')}
-              errorMsg={errors['newPassword']}
-              showErrors
-            />
-            <InputField
-              id="confirmNewPassword"
-              label="Confirm New Password"
-              name="confirmNewPassword"
-              type="password"
-              onChange={this.onChange}
-              value={this.state.formData.confirmNewPassword}
-              hasError={this.hasError('confirmNewPassword')}
-              errorMsg={errors['confirmNewPassword']}
-              showErrors
-            />
-          </form>
-        )}
-        {editing ? (
-          <div className={styles.actions}>
-            <Button
-              className={cn(styles.button, styles.saveButton)}
-              icon="save"
-              onClick={this.onSave}
-              disabled={this.isSubmitBlocked()}
-            >
-              {t('talk-plugin-auth.change_password.save')}
-            </Button>
-            <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-auth.change_password.cancel')}
-            </a>
-          </div>
-        ) : (
-          <div className={styles.actions}>
-            <Button className={styles.button} onClick={this.enableEditing}>
-              {t('talk-plugin-auth.change_password.edit')}
-            </Button>
-          </div>
-        )}
-      </section>
-    );
-  }
-}
-
-ChangePassword.propTypes = {
-  changePassword: PropTypes.func.isRequired,
-  notify: PropTypes.func.isRequired,
-};
-
-export default ChangePassword;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
deleted file mode 100644
index 5b4631ecf..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.css
+++ /dev/null
@@ -1,122 +0,0 @@
-.container {
-  margin-bottom: 20px;
-  display: flex;
-  position: relative;
-  color: #202020;
-  padding: 10px;
-  border-radius: 2px;
-  box-sizing: border-box;
-  justify-content: space-between;
-  
-  &.editing { 
-    background-color: #EDEDED;
-  }
-}
-
-.content {
-  flex-grow: 1;
-} 
-
-.actions {
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}                                                                       
-
-.email {
-  margin: 0;
-}
-
-.username {   
-  margin-bottom: 4px;
-}         
-
-.button {
-  border: 1px solid #787d80;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-}
-
-.saveButton {
-  background-color: #3498DB;
-  border-color: #3498DB;
-  color: white;
-
-  > i {
-    font-size: 17px;
-  }
-    
-  &:hover {
-    background-color: #399ee2;
-    color: white;
-  }
-
-  &:disabled {
-    border-color: #e0e0e0;
-
-    &:hover {
-      background-color: #e0e0e0;
-      color: #4f5c67;
-      cursor: default;
-    }
-  }
-}
-
-.cancelButton {
-  color:#787D80;
-  margin-top: 6px;
-  font-size: 0.9em;
-
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.detailLabel {
-  border: solid 1px #787D80;
-  border-radius: 2px;
-  background-color: white;
-  height: 30px;
-  display: inline-block;
-  width: 230px;
-  display: flex;  
-
-  > .detailLabelIcon {
-    font-size: 1.2em;
-    padding: 0 5px;
-    color: #787D80;
-    line-height: 30px; 
-  }
-
-  &.disabled {
-    background-color: #E0E0E0;
-  }
-}
-
-.detailValue {
-  background: transparent;
-  border: none;
-  font-size: 1em;
-  color: #000;
-  height: 30px;
-  outline: none;
-  flex: 1;
-}
-
-.bottomText {
-  color: #474747;
-  font-size: 0.9em;
-}
-
-.detailList {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-} 
-
-.detailItem {
-  margin-bottom: 12px;
-}
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
deleted file mode 100644
index 8188bdfbe..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsername.js
+++ /dev/null
@@ -1,188 +0,0 @@
-import React from 'react';
-import cn from 'classnames';
-import PropTypes from 'prop-types';
-import styles from './ChangeUsername.css';
-import { Button } from 'plugin-api/beta/client/components/ui';
-import ChangeUsernameDialog from './ChangeUsernameDialog';
-import { t } from 'plugin-api/beta/client/services';
-import InputField from './InputField';
-import { getErrorMessages } from 'coral-framework/utils';
-import { canUsernameBeUpdated } from 'coral-framework/utils/user';
-
-const initialState = {
-  editing: false,
-  showDialog: false,
-  formData: {},
-};
-
-class ChangeUsername extends React.Component {
-  state = initialState;
-
-  clearForm = () => {
-    this.setState(initialState);
-  };
-
-  enableEditing = () => {
-    this.setState({
-      editing: true,
-    });
-  };
-
-  disableEditing = () => {
-    this.setState({
-      editing: false,
-    });
-  };
-
-  cancel = () => {
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  showDialog = () => {
-    this.setState({
-      showDialog: true,
-    });
-  };
-
-  onSave = async () => {
-    this.showDialog();
-  };
-
-  saveChanges = async () => {
-    const { newUsername } = this.state.formData;
-    const { changeUsername } = this.props;
-
-    try {
-      await changeUsername(newUsername);
-      this.props.notify(
-        'success',
-        t('talk-plugin-auth.change_username.changed_username_success_msg')
-      );
-    } catch (err) {
-      this.props.notify('error', getErrorMessages(err));
-    }
-
-    this.clearForm();
-    this.disableEditing();
-  };
-
-  onChange = e => {
-    const { name, value } = e.target;
-
-    this.setState(state => ({
-      formData: {
-        ...state.formData,
-        [name]: value,
-      },
-    }));
-  };
-
-  closeDialog = () => {
-    this.setState({
-      showDialog: false,
-    });
-  };
-
-  render() {
-    const {
-      username,
-      emailAddress,
-      root: { me: { state: { status } } },
-      notify,
-    } = this.props;
-    const { editing, formData, showDialog } = this.state;
-
-    return (
-      <section
-        className={cn('talk-plugin-auth--edit-profile', styles.container, {
-          [styles.editing]: editing,
-        })}
-      >
-        <ChangeUsernameDialog
-          canUsernameBeUpdated={canUsernameBeUpdated(status)}
-          showDialog={showDialog}
-          onChange={this.onChange}
-          formData={formData}
-          username={username}
-          closeDialog={this.closeDialog}
-          saveChanges={this.saveChanges}
-          notify={notify}
-        />
-
-        {editing ? (
-          <div className={styles.content}>
-            <div className={styles.detailList}>
-              <InputField
-                icon="person"
-                id="newUsername"
-                name="newUsername"
-                onChange={this.onChange}
-                defaultValue={username}
-                columnDisplay
-                validationType="username"
-              >
-                <span className={styles.bottomText}>
-                  {t('talk-plugin-auth.change_username.change_username_note')}
-                </span>
-              </InputField>
-              <InputField
-                icon="email"
-                id="email"
-                name="email"
-                value={emailAddress}
-                validationType="username"
-                disabled
-              />
-            </div>
-          </div>
-        ) : (
-          <div className={styles.content}>
-            <h2 className={styles.username}>{username}</h2>
-            {emailAddress ? (
-              <p className={styles.email}>{emailAddress}</p>
-            ) : null}
-          </div>
-        )}
-        {editing ? (
-          <div className={styles.actions}>
-            <Button
-              className={cn(styles.button, styles.saveButton)}
-              icon="save"
-              onClick={this.onSave}
-              disabled={
-                !this.state.formData.newUsername ||
-                this.state.formData.newUsername === username
-              }
-            >
-              {t('talk-plugin-auth.change_username.save')}
-            </Button>
-            <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
-            </a>
-          </div>
-        ) : (
-          <div className={styles.actions}>
-            <Button
-              className={styles.button}
-              icon="settings"
-              onClick={this.enableEditing}
-            >
-              {t('talk-plugin-auth.change_username.edit_profile')}
-            </Button>
-          </div>
-        )}
-      </section>
-    );
-  }
-}
-
-ChangeUsername.propTypes = {
-  root: PropTypes.object.isRequired,
-  changeUsername: PropTypes.func.isRequired,
-  notify: PropTypes.func.isRequired,
-  username: PropTypes.string,
-  emailAddress: PropTypes.string,
-};
-
-export default ChangeUsername;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
deleted file mode 100644
index af681d596..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.css
+++ /dev/null
@@ -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;
-  }
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js b/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
deleted file mode 100644
index 321b36926..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ChangeUsernameDialog.js
+++ /dev/null
@@ -1,117 +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-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-auth--edit-profile-dialog')}
-      >
-        <span className={styles.close} onClick={this.props.closeDialog}>
-          ×
-        </span>
-        <h1 className={styles.title}>
-          {t('talk-plugin-auth.change_username.confirm_username_change')}
-        </h1>
-        <div className={styles.content}>
-          <p className={styles.description}>
-            {t('talk-plugin-auth.change_username.description')}
-          </p>
-          <div className={styles.usernamesChange}>
-            <span className={styles.item}>
-              {t('talk-plugin-auth.change_username.old_username')}:{' '}
-              {this.props.username}
-            </span>
-            <span className={styles.item}>
-              {t('talk-plugin-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-auth.change_username.username_does_not_match'
-              )}
-              showError={this.state.showError}
-              columnDisplay
-              showSuccess={false}
-              validationType="username"
-            >
-              <span className={styles.bottomNote}>
-                {t('talk-plugin-auth.change_username.bottom_note')}
-              </span>
-            </InputField>
-          </form>
-          <div className={styles.bottomActions}>
-            <Button className={styles.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
-            </Button>
-            <Button
-              className={styles.confirmChanges}
-              onClick={this.confirmChanges}
-            >
-              {t('talk-plugin-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;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
deleted file mode 100644
index abcf692fe..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.css
+++ /dev/null
@@ -1,8 +0,0 @@
-.errorMsg {
-  color: #FA4643;
-  font-size: 0.9em;
-}
-
-.warningIcon {
-  color: #FA4643;
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js b/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
deleted file mode 100644
index f39a8fc08..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/ErrorMessage.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import styles from './ErrorMessage.css';
-import { Icon } from 'plugin-api/beta/client/components/ui';
-
-const ErrorMessage = ({ children }) => (
-  <div className={styles.errorMsg}>
-    <Icon className={styles.warningIcon} name="warning" />
-    <span>{children}</span>
-  </div>
-);
-
-ErrorMessage.propTypes = {
-  children: PropTypes.node,
-};
-
-export default ErrorMessage;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
deleted file mode 100644
index cd6015e47..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.css
+++ /dev/null
@@ -1,80 +0,0 @@
-  
-.detailItem {
-  margin-bottom: 12px;
-}
-
-.detailItemContainer {
-  display: flex;
-}
-
-.columnDisplay {
-  flex-direction: column;
-
-  .detailItemMessage {
-    padding: 4px 0 0;
-  }
-}
-
-.detailItemContent {
-  border: solid 1px #787D80;
-  border-radius: 2px;
-  background-color: white;
-  height: 30px;
-  display: inline-block;
-  width: 230px;
-  display: flex;  
-  box-sizing: border-box;
-
-  > .detailIcon {
-    font-size: 1.2em;
-    padding: 0 5px;
-    color: #787D80;
-    line-height: 30px; 
-  }
-
-  &.error {
-    border: solid 2px #FA4643;
-  }
-
-  &.disabled {
-    background-color: #E0E0E0;
-  }
-}
-
-.detailLabel {
-  color: #4C4C4D;
-  font-size: 1em;
-  display: block;
-  margin-bottom: 4px;
-}
-
-.detailValue {
-  background: transparent;
-  border: none;
-  font-size: 1em;
-  color: #000;
-  outline: none;
-  flex: 1;
-  height: 100%;
-  box-sizing: border-box;
-}
-
-.detailItemMessage {
-  flex-grow: 1;
-  display: flex;
-  align-items: center;
-  padding-left: 6px;
-  padding-top: 16px;
-
-  .warningIcon, .checkIcon {
-    font-size: 17px;
-  }
-}
-
-.checkIcon {
-  color: #00CD73;
-}
-
-.warningIcon {
-  color: #FA4643;
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js b/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
deleted file mode 100644
index 34c314c20..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/components/InputField.js
+++ /dev/null
@@ -1,94 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import cn from 'classnames';
-import styles from './InputField.css';
-import ErrorMessage from './ErrorMessage';
-import { Icon } from 'plugin-api/beta/client/components/ui';
-
-const InputField = ({
-  id = '',
-  label = '',
-  type = 'text',
-  name = '',
-  onChange = () => {},
-  showError = true,
-  hasError = false,
-  errorMsg = '',
-  children,
-  columnDisplay = false,
-  showSuccess = false,
-  validationType = '',
-  icon = '',
-  value = '',
-  defaultValue = '',
-  disabled = false,
-}) => {
-  const inputValue = {
-    ...(value ? { value } : {}),
-    ...(defaultValue ? { defaultValue } : {}),
-  };
-
-  return (
-    <div className={styles.detailItem}>
-      <div
-        className={cn(styles.detailItemContainer, {
-          [styles.columnDisplay]: columnDisplay,
-        })}
-      >
-        {label && (
-          <label className={styles.detailLabel} id={id}>
-            {label}
-          </label>
-        )}
-        <div
-          className={cn(
-            styles.detailItemContent,
-            { [styles.error]: hasError },
-            { [styles.disabled]: disabled }
-          )}
-        >
-          {icon && <Icon name={icon} className={styles.detailIcon} />}
-          <input
-            id={id}
-            type={type}
-            name={name}
-            className={styles.detailValue}
-            onChange={onChange}
-            autoComplete="off"
-            data-validation-type={validationType}
-            disabled={disabled}
-            {...inputValue}
-          />
-        </div>
-        <div className={styles.detailItemMessage}>
-          {!hasError &&
-            showSuccess &&
-            value && <Icon className={styles.checkIcon} name="check_circle" />}
-          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
-        </div>
-      </div>
-      {children}
-    </div>
-  );
-};
-
-InputField.propTypes = {
-  id: PropTypes.string,
-  disabled: PropTypes.bool,
-  label: PropTypes.string,
-  type: PropTypes.string,
-  name: PropTypes.string.isRequired,
-  onChange: PropTypes.func,
-  value: PropTypes.string,
-  defaultValue: PropTypes.string,
-  icon: PropTypes.string,
-  showError: PropTypes.bool,
-  hasError: PropTypes.bool,
-  errorMsg: PropTypes.string,
-  children: PropTypes.node,
-  columnDisplay: PropTypes.bool,
-  showSuccess: PropTypes.bool,
-  validationType: PropTypes.string,
-};
-
-export default InputField;
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
deleted file mode 100644
index 1322a2940..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangePassword.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { compose } from 'react-apollo';
-import { bindActionCreators } from 'redux';
-import { connect } from 'plugin-api/beta/client/hocs';
-import ChangePassword from '../components/ChangePassword';
-import { notify } from 'coral-framework/actions/notification';
-import { withChangePassword } from 'plugin-api/beta/client/hocs';
-
-const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
-
-export default compose(connect(null, mapDispatchToProps), withChangePassword)(
-  ChangePassword
-);
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js b/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
deleted file mode 100644
index 87e1e18b5..000000000
--- a/plugins/talk-plugin-auth/client/profile-settings/containers/ChangeUsername.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { compose } from 'react-apollo';
-import { bindActionCreators } from 'redux';
-import { connect } from 'plugin-api/beta/client/hocs';
-import ChangeUsername from '../components/ChangeUsername';
-import { notify } from 'coral-framework/actions/notification';
-import { withChangeUsername } from 'plugin-api/beta/client/hocs';
-
-const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
-
-export default compose(connect(null, mapDispatchToProps), withChangeUsername)(
-  ChangeUsername
-);
diff --git a/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.css
rename to plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.css
diff --git a/plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/stream/components/AccountDeletionRequestedSign.js
rename to plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.css
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccount.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.css
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountDialog.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountFinalStep.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep.css
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep0.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep1.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep2.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/DeleteMyAccountStep3.js
rename to plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
diff --git a/plugins/talk-plugin-auth/client/components/ErrorMessage.css b/plugins/talk-plugin-profile-data/client/components/ErrorMessage.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/components/ErrorMessage.css
rename to plugins/talk-plugin-profile-data/client/components/ErrorMessage.css
diff --git a/plugins/talk-plugin-auth/client/components/ErrorMessage.js b/plugins/talk-plugin-profile-data/client/components/ErrorMessage.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/components/ErrorMessage.js
rename to plugins/talk-plugin-profile-data/client/components/ErrorMessage.js
diff --git a/plugins/talk-plugin-auth/client/components/InputField.css b/plugins/talk-plugin-profile-data/client/components/InputField.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/components/InputField.css
rename to plugins/talk-plugin-profile-data/client/components/InputField.css
diff --git a/plugins/talk-plugin-auth/client/components/InputField.js b/plugins/talk-plugin-profile-data/client/components/InputField.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/components/InputField.js
rename to plugins/talk-plugin-profile-data/client/components/InputField.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css b/plugins/talk-plugin-profile-data/client/components/StepProgress.css
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.css
rename to plugins/talk-plugin-profile-data/client/components/StepProgress.css
diff --git a/plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js b/plugins/talk-plugin-profile-data/client/components/StepProgress.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/components/StepProgress.js
rename to plugins/talk-plugin-profile-data/client/components/StepProgress.js
diff --git a/plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/stream/containers/AccountDeletionRequestedSign.js
rename to plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
diff --git a/plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
similarity index 100%
rename from plugins/talk-plugin-auth/client/profile-settings/containers/DeleteMyAccount.js
rename to plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
diff --git a/plugins/talk-plugin-profile-data/client/index.js b/plugins/talk-plugin-profile-data/client/index.js
index fee9f2129..91664ac23 100644
--- a/plugins/talk-plugin-profile-data/client/index.js
+++ b/plugins/talk-plugin-profile-data/client/index.js
@@ -1,10 +1,13 @@
 import DownloadCommentHistory from './containers/DownloadCommentHistory';
+import DeleteMyAccount from './containers/DeleteMyAccount';
+import AccountDeletionRequestedSign from './AccountDeletionRequestedSign';
 import translations from './translations.yml';
 import graphql from './graphql';
 
 export default {
   slots: {
-    profileSettings: [DownloadCommentHistory],
+    stream: [AccountDeletionRequestedSign],
+    profileSettings: [DownloadCommentHistory, DeleteMyAccount],
   },
   translations,
   ...graphql,

From 58cc078d256c8e6242f61490b888a99ae18c0549 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 14:03:21 -0300
Subject: [PATCH 042/160] Moving gdpr to `talk-plugin-profile-data`

---
 .../client/components/DeleteMyAccountStep3.js                   | 2 +-
 plugins/talk-plugin-profile-data/client/index.js                | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
index 45dca8f97..3205cd225 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
-import InputField from '../../components/InputField';
+import InputField from './InputField';
 
 const initialState = {
   showError: false,
diff --git a/plugins/talk-plugin-profile-data/client/index.js b/plugins/talk-plugin-profile-data/client/index.js
index 91664ac23..bbd30b660 100644
--- a/plugins/talk-plugin-profile-data/client/index.js
+++ b/plugins/talk-plugin-profile-data/client/index.js
@@ -1,6 +1,6 @@
 import DownloadCommentHistory from './containers/DownloadCommentHistory';
 import DeleteMyAccount from './containers/DeleteMyAccount';
-import AccountDeletionRequestedSign from './AccountDeletionRequestedSign';
+import AccountDeletionRequestedSign from './containers/AccountDeletionRequestedSign';
 import translations from './translations.yml';
 import graphql from './graphql';
 

From 8dcaf8ea4caf34dcad7eb065032f702dfa229f97 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 14:08:29 -0300
Subject: [PATCH 043/160] Moving the translations too

---
 .../components/ChangeEmailContentDialog.js    | 18 +++---
 .../client/components/ChangePassword.js       | 30 +++++----
 .../components/ChangeUsernameContentDialog.js | 18 +++---
 .../client/components/ChangeUsernameDialog.js | 23 ++++---
 .../client/components/ConfirmChangesDialog.js |  5 +-
 .../client/components/Profile.js              | 26 +++++---
 .../client/translations.yml                   | 62 +++++++++++++++++++
 7 files changed, 132 insertions(+), 50 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/translations.yml

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index e3796f80e..02d02680e 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
@@ -28,26 +28,26 @@ class ChangeEmailContentDialog extends React.Component {
           ×
         </span>
         <h1 className={styles.title}>
-          {t('talk-plugin-auth.change_email.confirm_email_change')}
+          {t('talk-plugin-local-auth.change_email.confirm_email_change')}
         </h1>
         <div className={styles.content}>
           <p className={styles.description}>
-            {t('talk-plugin-auth.change_email.description')}
+            {t('talk-plugin-local-auth.change_email.description')}
           </p>
           <div className={styles.emailChange}>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_email.old_email')}:{' '}
+              {t('talk-plugin-local-auth.change_email.old_email')}:{' '}
               {this.props.emailAddress}
             </span>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_email.new_email')}:{' '}
+              {t('talk-plugin-local-auth.change_email.new_email')}:{' '}
               {this.props.formData.newEmail}
             </span>
           </div>
           <form>
             <InputField
               id="confirmPassword"
-              label={t('talk-plugin-auth.change_email.enter_password')}
+              label={t('talk-plugin-local-auth.change_email.enter_password')}
               name="confirmPassword"
               type="password"
               onChange={this.props.onChange}
@@ -55,7 +55,9 @@ class ChangeEmailContentDialog extends React.Component {
               hasError={
                 !this.props.formData.confirmPassword && this.state.showError
               }
-              errorMsg={t('talk-plugin-auth.change_email.incorrect_password')}
+              errorMsg={t(
+                'talk-plugin-local-auth.change_email.incorrect_password'
+              )}
               showError={this.state.showError}
               columnDisplay
               showSuccess={false}
@@ -63,13 +65,13 @@ class ChangeEmailContentDialog extends React.Component {
           </form>
           <div className={styles.bottomActions}>
             <Button className={styles.cancel} onClick={this.props.cancel}>
-              {t('talk-plugin-auth.change_email.cancel')}
+              {t('talk-plugin-local-auth.change_email.cancel')}
             </Button>
             <Button
               className={styles.confirmChanges}
               onClick={this.confirmChanges}
             >
-              {t('talk-plugin-auth.change_email.confirm_change')}
+              {t('talk-plugin-local-auth.change_email.confirm_change')}
             </Button>
           </div>
         </div>
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 90940728d..e5535b8ba 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -45,7 +45,9 @@ class ChangePassword extends React.Component {
     const cond = this.state.formData[field] === this.state.formData[field2];
     if (!cond) {
       this.addError({
-        [field2]: t('talk-plugin-auth.change_password.passwords_dont_match'),
+        [field2]: t(
+          'talk-plugin-local-auth.change_password.passwords_dont_match'
+        ),
       });
     } else {
       this.removeError(field2);
@@ -56,7 +58,7 @@ class ChangePassword extends React.Component {
   fieldValidation = (value, type, name) => {
     if (!value.length) {
       this.addError({
-        [name]: t('talk-plugin-auth.change_password.required_field'),
+        [name]: t('talk-plugin-local-auth.change_password.required_field'),
       });
     } else if (!validate[type](value)) {
       this.addError({ [name]: errorMsj[type] });
@@ -113,7 +115,7 @@ class ChangePassword extends React.Component {
       });
       this.props.notify(
         'success',
-        t('talk-plugin-auth.change_password.changed_password_msg')
+        t('talk-plugin-local-auth.change_password.changed_password_msg')
       );
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
@@ -139,15 +141,19 @@ class ChangePassword extends React.Component {
 
     return (
       <section
-        className={cn('talk-plugin-auth--change-password', styles.container, {
-          [styles.editing]: editing,
-        })}
+        className={cn(
+          'talk-plugin-local-auth--change-password',
+          styles.container,
+          {
+            [styles.editing]: editing,
+          }
+        )}
       >
         <h3 className={styles.title}>
-          {t('talk-plugin-auth.change_password.change_password')}
+          {t('talk-plugin-local-auth.change_password.change_password')}
         </h3>
         {editing && (
-          <form className="talk-plugin-auth--change-password-form">
+          <form className="talk-plugin-local-auth--change-password-form">
             <InputField
               id="oldPassword"
               label="Old Password"
@@ -161,7 +167,7 @@ class ChangePassword extends React.Component {
             >
               <span className={styles.detailBottomBox}>
                 <a className={styles.detailLink}>
-                  {t('talk-plugin-auth.change_password.forgot_password')}
+                  {t('talk-plugin-local-auth.change_password.forgot_password')}
                 </a>
               </span>
             </InputField>
@@ -197,16 +203,16 @@ class ChangePassword extends React.Component {
               onClick={this.onSave}
               disabled={this.isSubmitBlocked()}
             >
-              {t('talk-plugin-auth.change_password.save')}
+              {t('talk-plugin-local-auth.change_password.save')}
             </Button>
             <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-auth.change_password.cancel')}
+              {t('talk-plugin-local-auth.change_password.cancel')}
             </a>
           </div>
         ) : (
           <div className={styles.actions}>
             <Button className={styles.button} onClick={this.enableEditing}>
-              {t('talk-plugin-auth.change_password.edit')}
+              {t('talk-plugin-local-auth.change_password.edit')}
             </Button>
           </div>
         )}
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
index 408f3d836..894bdcbd6 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
@@ -25,7 +25,7 @@ class ChangeUsernameContentDialog extends React.Component {
     if (!this.props.canUsernameBeUpdated) {
       this.props.notify(
         'error',
-        t('talk-plugin-auth.change_username.change_username_attempt')
+        t('talk-plugin-local-auth.change_username.change_username_attempt')
       );
       return;
     }
@@ -44,19 +44,19 @@ class ChangeUsernameContentDialog extends React.Component {
           ×
         </span>
         <h1 className={styles.title}>
-          {t('talk-plugin-auth.change_username.confirm_username_change')}
+          {t('talk-plugin-local-auth.change_username.confirm_username_change')}
         </h1>
         <div className={styles.content}>
           <p className={styles.description}>
-            {t('talk-plugin-auth.change_username.description')}
+            {t('talk-plugin-local-auth.change_username.description')}
           </p>
           <div className={styles.usernamesChange}>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_username.old_username')}:{' '}
+              {t('talk-plugin-local-auth.change_username.old_username')}:{' '}
               {this.props.username}
             </span>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_username.new_username')}:{' '}
+              {t('talk-plugin-local-auth.change_username.new_username')}:{' '}
               {this.props.formData.newUsername}
             </span>
           </div>
@@ -70,7 +70,7 @@ class ChangeUsernameContentDialog extends React.Component {
               defaultValue=""
               hasError={this.formHasError() && this.state.showError}
               errorMsg={t(
-                'talk-plugin-auth.change_username.username_does_not_match'
+                'talk-plugin-local-auth.change_username.username_does_not_match'
               )}
               showError={this.state.showError}
               columnDisplay
@@ -78,19 +78,19 @@ class ChangeUsernameContentDialog extends React.Component {
               validationType="username"
             >
               <span className={styles.bottomNote}>
-                {t('talk-plugin-auth.change_username.bottom_note')}
+                {t('talk-plugin-local-auth.change_username.bottom_note')}
               </span>
             </InputField>
           </form>
           <div className={styles.bottomActions}>
             <Button className={styles.cancel} onClick={this.props.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
+              {t('talk-plugin-local-auth.change_username.cancel')}
             </Button>
             <Button
               className={styles.confirmChanges}
               onClick={this.confirmChanges}
             >
-              {t('talk-plugin-auth.change_username.confirm_changes')}
+              {t('talk-plugin-local-auth.change_username.confirm_changes')}
             </Button>
           </div>
         </div>
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
index 321b36926..097168b06 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
@@ -26,7 +26,7 @@ class ChangeUsernameDialog extends React.Component {
     if (!this.props.canUsernameBeUpdated) {
       this.props.notify(
         'error',
-        t('talk-plugin-auth.change_username.change_username_attempt')
+        t('talk-plugin-local-auth.change_username.change_username_attempt')
       );
       return;
     }
@@ -42,25 +42,28 @@ class ChangeUsernameDialog extends React.Component {
     return (
       <Dialog
         open={this.props.showDialog}
-        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
+        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-auth.change_username.confirm_username_change')}
+          {t('talk-plugin-local-auth.change_username.confirm_username_change')}
         </h1>
         <div className={styles.content}>
           <p className={styles.description}>
-            {t('talk-plugin-auth.change_username.description')}
+            {t('talk-plugin-local-auth.change_username.description')}
           </p>
           <div className={styles.usernamesChange}>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_username.old_username')}:{' '}
+              {t('talk-plugin-local-auth.change_username.old_username')}:{' '}
               {this.props.username}
             </span>
             <span className={styles.item}>
-              {t('talk-plugin-auth.change_username.new_username')}:{' '}
+              {t('talk-plugin-local-auth.change_username.new_username')}:{' '}
               {this.props.formData.newUsername}
             </span>
           </div>
@@ -74,7 +77,7 @@ class ChangeUsernameDialog extends React.Component {
               defaultValue=""
               hasError={this.formHasError() && this.state.showError}
               errorMsg={t(
-                'talk-plugin-auth.change_username.username_does_not_match'
+                'talk-plugin-local-auth.change_username.username_does_not_match'
               )}
               showError={this.state.showError}
               columnDisplay
@@ -82,19 +85,19 @@ class ChangeUsernameDialog extends React.Component {
               validationType="username"
             >
               <span className={styles.bottomNote}>
-                {t('talk-plugin-auth.change_username.bottom_note')}
+                {t('talk-plugin-local-auth.change_username.bottom_note')}
               </span>
             </InputField>
           </form>
           <div className={styles.bottomActions}>
             <Button className={styles.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
+              {t('talk-plugin-local-auth.change_username.cancel')}
             </Button>
             <Button
               className={styles.confirmChanges}
               onClick={this.confirmChanges}
             >
-              {t('talk-plugin-auth.change_username.confirm_changes')}
+              {t('talk-plugin-local-auth.change_username.confirm_changes')}
             </Button>
           </div>
         </div>
diff --git a/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js b/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js
index 0031bcb71..35995f654 100644
--- a/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ConfirmChangesDialog.js
@@ -54,7 +54,10 @@ class ConfirmChangesDialog extends React.Component {
     return (
       <Dialog
         open={this.props.showDialog}
-        className={cn(styles.dialog, 'talk-plugin-auth--edit-profile-dialog')}
+        className={cn(
+          styles.dialog,
+          'talk-plugin-local-auth--edit-profile-dialog'
+        )}
       >
         {this.renderSteps()}
       </Dialog>
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 3d8f10698..84474dbe3 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.js
@@ -72,7 +72,7 @@ class Profile extends React.Component {
   fieldValidation = (value, type, name) => {
     if (!value.length) {
       this.addError({
-        [name]: t('talk-plugin-auth.change_password.required_field'),
+        [name]: t('talk-plugin-local-auth.change_password.required_field'),
       });
     } else if (!validate[type](value)) {
       this.addError({ [name]: errorMsj[type] });
@@ -127,7 +127,7 @@ class Profile extends React.Component {
       await changeUsername(this.props.root.me.id, newUsername);
       this.props.notify(
         'success',
-        t('talk-plugin-auth.change_username.changed_username_success_msg')
+        t('talk-plugin-local-auth.change_username.changed_username_success_msg')
       );
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
@@ -144,7 +144,7 @@ class Profile extends React.Component {
       });
       this.props.notify(
         'success',
-        t('talk-plugin-auth.change_email.change_email_msg')
+        t('talk-plugin-local-auth.change_email.change_email_msg')
       );
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
@@ -167,9 +167,13 @@ class Profile extends React.Component {
 
     return (
       <section
-        className={cn('talk-plugin-auth--edit-profile', styles.container, {
-          [styles.editing]: editing,
-        })}
+        className={cn(
+          'talk-plugin-local-auth--edit-profile',
+          styles.container,
+          {
+            [styles.editing]: editing,
+          }
+        )}
       >
         <ConfirmChangesDialog
           showDialog={showDialog}
@@ -207,7 +211,9 @@ class Profile extends React.Component {
                 columnDisplay
               >
                 <span className={styles.bottomText}>
-                  {t('talk-plugin-auth.change_username.change_username_note')}
+                  {t(
+                    'talk-plugin-local-auth.change_username.change_username_note'
+                  )}
                 </span>
               </InputField>
               <InputField
@@ -237,10 +243,10 @@ class Profile extends React.Component {
               onClick={this.onSave}
               disabled={!this.isSaveEnabled()}
             >
-              {t('talk-plugin-auth.change_username.save')}
+              {t('talk-plugin-local-auth.change_username.save')}
             </Button>
             <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-auth.change_username.cancel')}
+              {t('talk-plugin-local-auth.change_username.cancel')}
             </a>
           </div>
         ) : (
@@ -250,7 +256,7 @@ class Profile extends React.Component {
               icon="settings"
               onClick={this.enableEditing}
             >
-              {t('talk-plugin-auth.change_username.edit_profile')}
+              {t('talk-plugin-local-auth.change_username.edit_profile')}
             </Button>
           </div>
         )}
diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
new file mode 100644
index 000000000..d3b323f54
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/translations.yml
@@ -0,0 +1,62 @@
+en:
+  talk-plugin-local-auth:
+    change_password:
+      change_password: "Change Password"
+      passwords_dont_match: "Passwords don`t match"
+      required_field: "This field is required"
+      forgot_password: "Forgot your password?"
+      save: "Save"
+      cancel: "Cancel"
+      edit: "Edit"
+      changed_password_msg: "Changed Password - Your password has been successfully changed"
+    change_username:
+      change_username_note: "Usernames can be changed every 14 days"
+      save: "Save"
+      edit_profile: "Edit Profile"
+      cancel: "Cancel"
+      confirm_username_change: "Confirm Username Change"
+      description: "You are attempting to change your username. Your new username will appear on all of your past and future comments."
+      old_username: "Old Username"
+      new_username: "New Username"
+      bottom_note: "Note: You will not be able to change your username again for 14 days"
+      confirm_changes: "Confirm Changes"
+      username_does_not_match: "Username does not match"
+      cant_be_equal: "Your new {0} must be different to your current one"
+      change_username_attempt: "Username can't be updated. Usernames can be changed every 14 days"
+    change_email:
+      confirm_email_change: "Confirm Email Address Change"
+      description: "You are attempting to change your email address. Your new email address will be used for your login and to receive account notifications."
+      old_email: "Old Email Address" 
+      new_email: "New Email Address"
+      enter_password: "Enter Password"
+      incorrect_password: "Incorrect Password"
+      confirm_change: "Confirm Change"
+      cancel: "Cancel"
+      change_email_msg: "Email Address Changed - Your email address has been successfully changed. This email address will now be used for signing in and email notifications."
+      changed_username_success_msg: "Username Changed - Your username has been successfully changed. You will not be able to change your user name for 14 days."
+      change_username_attempt: "Username can't be updated. Usernames can only be changed every 14 days."
+es:
+  talk-plugin-local-auth:
+    change_password:
+      change_password: "Cambiar Contraseña"
+      passwords_dont_match: "Las contraseñas no coinciden"
+      required_field: "Este campo es requerido"
+      forgot_password: "Olvidaste tu contraseña?"
+      save: "Guardar"
+      cancel: "Cancelar"
+      edit: "Editar"
+      changed_password_msg: "Contraseña Actualizada - Tu contraseña ha sido exitosamente actualizada"
+    change_username:
+      change_username_note: "El usuario puede ser cambiado cada 14 días"
+      save: "Guardar"
+      edit_profile: "Editar Perfil"
+      cancel: "Cancelar"
+      confirm_username_change: "Confirmar Cambio de Usuario"
+      description: "Estás intentando cambiar tu usuario. Tu nuevo usuario aparecerá en todos tus pasados y futuros comentarios."
+      old_username: "Usuario viejo"
+      new_username: "Usuario nuevo"
+      bottom_note: "Nota: No podrás cambiar tu usuario por 14 días"
+      confirm_changes: "Confirmar Cambios"
+      username_does_not_match: "El usuario no coincide"
+      changed_username_success_msg: "Usuario Actualizado - Tu usuario ha sido exitosamente actualizado. No podrás cambiar el usuario por 14 días."
+      change_username_attempt: "El usuario no puede ser actualizado. Los usuarios pueden ser cambiados cada 14 días."
\ No newline at end of file

From 48a78735bd4d099a40fdb33a7dc531d9d9390014 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 14:11:11 -0300
Subject: [PATCH 044/160] Importing translations

---
 plugins/talk-plugin-local-auth/client/index.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index 01f3f7123..c669effaa 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -1,7 +1,9 @@
 import ChangePassword from './containers/ChangePassword';
 import Profile from './containers/Profile';
+import translations from './translations.yml';
 
 export default {
+  translations,
   slots: {
     profileHeader: [Profile],
     profileSettings: [ChangePassword],

From c8e5678c9c7eb4d67d64a8a958ddf3af62127bc8 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 14:18:40 -0300
Subject: [PATCH 045/160] Using fragments :)

---
 .../client/containers/Profile.js              | 28 +++++++++++++++++--
 1 file changed, 25 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index d47f4af38..bebf127fd 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -1,6 +1,6 @@
-import { compose } from 'react-apollo';
+import { compose, gql } from 'react-apollo';
 import { bindActionCreators } from 'redux';
-import { connect } from 'plugin-api/beta/client/hocs';
+import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
 import {
@@ -10,8 +10,30 @@ import {
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
+const withData = withFragments({
+  root: gql`
+    fragment TalkPluginLocalAuth_Profile_root on RootQuery {
+      me {
+        id
+        state {
+          status {
+            username {
+              status
+              history {
+                status
+                created_at
+              }
+            }
+          }
+        }
+      }
+    }
+  `,
+});
+
 export default compose(
   connect(null, mapDispatchToProps),
   withChangeUsername,
-  withUpdateEmailAddress
+  withUpdateEmailAddress,
+  withData
 )(Profile);

From cb9b02c1801e73109da40454c33850646363c7f7 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Wed, 2 May 2018 14:20:19 -0400
Subject: [PATCH 046/160] remove profile-settings from gitignore

---
 .gitignore | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index 9373b1893..24022b9d7 100644
--- a/.gitignore
+++ b/.gitignore
@@ -52,7 +52,6 @@ plugins/*
 !plugins/talk-plugin-offtopic
 !plugins/talk-plugin-permalink
 !plugins/talk-plugin-profile-data
-!plugins/talk-plugin-profile-settings
 !plugins/talk-plugin-remember-sort
 !plugins/talk-plugin-respect
 !plugins/talk-plugin-rich-text

From 0159918049790875f727d0541a5155ab00bf6cad Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 2 May 2018 13:03:59 -0600
Subject: [PATCH 047/160] docs updates

---
 docs/_config.yml                            |  4 +-
 docs/source/03-08-gdpr.md                   | 43 +++++++++++++++++++++
 docs/source/_data/plugins.yml               |  2 +
 docs/source/plugins/overview.md             | 19 +++++++--
 docs/source/plugins/plugins-directory.md    |  3 +-
 docs/themes/coral/layout/plugins.swig       |  9 +++--
 docs/themes/coral/source/css/talk.scss      | 14 +++++++
 docs/themes/coral/source/js/plugins.js      | 17 ++++++++
 plugins/talk-plugin-auth/README.md          |  6 +++
 plugins/talk-plugin-facebook-auth/README.md |  8 +++-
 plugins/talk-plugin-google-auth/README.md   |  6 +++
 plugins/talk-plugin-local-auth/README.md    |  6 +++
 plugins/talk-plugin-profile-data/README.md  | 11 +++++-
 13 files changed, 136 insertions(+), 12 deletions(-)
 create mode 100644 docs/source/03-08-gdpr.md

diff --git a/docs/_config.yml b/docs/_config.yml
index 6c0da733b..ac90dbc96 100644
--- a/docs/_config.yml
+++ b/docs/_config.yml
@@ -41,7 +41,7 @@ relative_link: false
 future: true
 highlight:
   enable: false
-  
+
 # Home page setting
 # path: Root path for your blogs index page. (default = '')
 # per_page: Posts displayed per page. (0 = disable pagination)
@@ -114,6 +114,8 @@ sidebar:
           url: /integrating/styling-css/
         - title: Translations and i18n
           url: /integrating/translations-i18n/
+        - title: GDPR Compliance
+          url: /integrating/gdpr/
     - title: Product Guide
       children:
         - title: How Talk Works
diff --git a/docs/source/03-08-gdpr.md b/docs/source/03-08-gdpr.md
new file mode 100644
index 000000000..187920bbc
--- /dev/null
+++ b/docs/source/03-08-gdpr.md
@@ -0,0 +1,43 @@
+---
+title: GDPR Compliance
+permalink: /integrating/gdpr/
+---
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+can enable the following plugins:
+
+- [talk-plugin-auth](/talk/plugin/talk-plugin-auth) - to facilitate username and password changes
+- [talk-plugin-local-auth](/talk/plugin/talk-plugin-local-auth) - to facilitate email changes and email association
+- [talk-plugin-profile-data](/talk/plugin/talk-plugin-profile-data) - to facilitate account download and deletion
+
+Even if you don't reside in a location where GDPR will apply, it is recommended
+to enable these features anyways to provide your users with control over their
+own data.
+
+## Custom Authentication Solutions
+
+As many of the newsrooms who have integrated Talk have followed our guides on
+[Integrating Authentication](/talk/integrating/authentication/), we have also
+provided tools for those newsrooms to integrate GDPR features into their
+existing workflows.
+
+### Account Data
+
+Through the [talk-plugin-profile-data](/talk/plugin/talk-plugin-profile-data)
+plugin we allow users to download and delete their account data easily. For
+custom integrations, this isn't always possible, so we instead provide some
+GraphQL mutations designed to allow you to integrate it into your existing user
+interfaces or exports.
+
+- `downloadUser(id: ID!)` - lets you grab the direct link to download a users
+  account in a zip format. From there, you can integrate it into your existing
+  data export or simply proxy it to the user to allow them to download it
+  elsewhere in your UI.
+- `delUser(id: ID!)` - lets you delete the specified user
+
+**Note: These mutations require an administrative token**
+
+If you would prefer to write your own user interfaces or integrate it into your
+own, you can disable the client plugin for [talk-plugin-profile-data](/talk/plugin/talk-plugin-profile-data)
+but keep the server side plugin active (See [Server and Client Plugins](/talk/plugins/#server-and-client-plugins) for more information).
diff --git a/docs/source/_data/plugins.yml b/docs/source/_data/plugins.yml
index 35d88cb14..0e09de210 100644
--- a/docs/source/_data/plugins.yml
+++ b/docs/source/_data/plugins.yml
@@ -7,11 +7,13 @@
   tags:
     - default
     - auth
+    - gdpr
 - name: talk-plugin-local-auth
   description: Enables email and password based authentication.
   tags:
     - default
     - auth
+    - gdpr
 - name: talk-plugin-author-menu
   description: Enables the comment author name plugin area.
   tags:
diff --git a/docs/source/plugins/overview.md b/docs/source/plugins/overview.md
index 26230dc00..046f4db87 100644
--- a/docs/source/plugins/overview.md
+++ b/docs/source/plugins/overview.md
@@ -9,11 +9,16 @@ functionality. We provide methods to inject behavior into the server side and
 the client side application to affect different parts of the application
 life cycle.
 
-## Recipes
+## Server and Client Plugins
 
-Recipes are plugin templates provided by the Coral Core team. Developers can use
-these recipes to build their own plugins. You can find all the Talk recipes
-here: [github.com/coralproject/talk-recipes](https://github.com/coralproject/talk-recipes/).
+When you're adding a plugin to Talk, you can specify it in the `client` and/or
+the `server` section. If you only want to enable the server side component of a
+plugin, you simply only specify the plugin in the `server` section. If you only
+want the client side plugin, the `client` section.
+
+Plugins listed in the [Plugins Directory](/talk/plugins-directory/) will
+indicate if they have/support a client/server plugin, and should be activated
+accordingly.
 
 ## Plugin Registration
 
@@ -117,3 +122,9 @@ assets inside the image as well.
 
 For more information on the onbuild image, refer to the
 [Installation from Docker](/talk/installation-from-docker/) documentation.
+
+## Recipes
+
+Recipes are plugin templates provided by the Coral Core team. Developers can use
+these recipes to build their own plugins. You can find all the Talk recipes
+here: [github.com/coralproject/talk-recipes](https://github.com/coralproject/talk-recipes/).
diff --git a/docs/source/plugins/plugins-directory.md b/docs/source/plugins/plugins-directory.md
index ca9b26734..9161d0d68 100644
--- a/docs/source/plugins/plugins-directory.md
+++ b/docs/source/plugins/plugins-directory.md
@@ -3,8 +3,9 @@ title: Plugins Directory
 permalink: /plugins-directory/
 layout: plugins
 data: plugins
+class: plugins
 ---
 
 Talk provides a growing ecosystem of plugins that interact with our extensive
 Server and Client API's. Below you can search for a plugin to use with Talk and
-discover what their requirements and configuration are.
\ No newline at end of file
+discover what their requirements and configuration are.
diff --git a/docs/themes/coral/layout/plugins.swig b/docs/themes/coral/layout/plugins.swig
index 959908105..adb60be30 100644
--- a/docs/themes/coral/layout/plugins.swig
+++ b/docs/themes/coral/layout/plugins.swig
@@ -4,9 +4,9 @@
         <h1>{{ page.title }}</h1>
         <hr/>
     {% endif %}
-    
+
     {{ page.content }}
-    
+
     <div class="form-group mt-5">
         <div class="clearfix">
             <label for="exampleInputEmail1">Plugin Search</label>
@@ -15,6 +15,7 @@
         <input type="text" class="form-control" id="plugin-search-input" aria-describedby="pluginSearchHelp">
         <small id="pluginSearchHelp" class="form-text text-muted">Enter a few keywords about the plugin to filter the list</small>
     </div>
+
     <div class="row plugins">
         {% for plugin in _.sortBy(site.data[page.data], 'name') %}
             <div class="col-sm-6 plugin d-block">
@@ -25,7 +26,7 @@
                         {% if plugin.tags %}
                             <p class="card-text">
                                 {% for tag in plugin.tags %}
-                                    <span class="badge badge-{% if tag == "default" %}success{% else %}light{% endif %}">{{ tag }}</span>
+                                    <a class="plain-link" title="Search for plugins with the {{ tag }} tag" href="?q={{ tag }}"><span class="badge badge-light badge-tag badge-tag-{{ _.kebabCase(tag) }}">{{ tag }}</span></a>
                                 {% endfor %}
                             </p>
                         {% endif %}
@@ -35,4 +36,4 @@
         {% endfor %}
     </ul>
 </article>
-<script>window.SEARCH_INDEX = {{ lunr_index(site.data[page.data]) }}</script>
\ No newline at end of file
+<script>window.SEARCH_INDEX = {{ lunr_index(site.data[page.data]) }}</script>
diff --git a/docs/themes/coral/source/css/talk.scss b/docs/themes/coral/source/css/talk.scss
index 391337876..afbd6f3af 100644
--- a/docs/themes/coral/source/css/talk.scss
+++ b/docs/themes/coral/source/css/talk.scss
@@ -448,3 +448,17 @@ a.brand {
 .plugin {
   display: none;
 }
+
+.badge-tag {
+  font-family: monospace;
+}
+
+.badge-tag-default {
+  background: #28a745;
+  color: #fff;
+}
+
+.badge-tag-gdpr {
+  background: rgb(0, 102, 176);
+  color: #fff;
+}
diff --git a/docs/themes/coral/source/js/plugins.js b/docs/themes/coral/source/js/plugins.js
index 83f14d356..26f7707c3 100644
--- a/docs/themes/coral/source/js/plugins.js
+++ b/docs/themes/coral/source/js/plugins.js
@@ -1,6 +1,17 @@
 /* global lunr */
 /* eslint-env browser */
 
+// Sourced from https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
+function getParameterByName(name, url) {
+  if (!url) url = window.location.href;
+  name = name.replace(/[\[\]]/g, '\\$&');
+  var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
+    results = regex.exec(url);
+  if (!results) return null;
+  if (!results[2]) return '';
+  return decodeURIComponent(results[2].replace(/\+/g, ' '));
+}
+
 // Sourced from https://github.com/hexojs/site/blob/8e8ed4901769abbf76263125f82832df76ced58b/themes/navy/source/js/plugins.js.
 (function() {
   'use strict';
@@ -60,6 +71,12 @@
     updateCount(elements.length);
   }
 
+  var searchParam = getParameterByName('q');
+  if (searchParam && searchParam.length > 0) {
+    $input.value = searchParam;
+    search(searchParam);
+  }
+
   $input.addEventListener('input', function() {
     var value = this.value;
 
diff --git a/plugins/talk-plugin-auth/README.md b/plugins/talk-plugin-auth/README.md
index fd5218365..c09dc218b 100644
--- a/plugins/talk-plugin-auth/README.md
+++ b/plugins/talk-plugin-auth/README.md
@@ -14,3 +14,9 @@ utilize our internal authentication system.
 
 To sync Talk auth with your own auth systems, you can use this plugin as a
 template.
+
+## GDPR Compliance
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+should review our [GDPR Compliance](/talk/integrating/gdpr/) guidelines.
diff --git a/plugins/talk-plugin-facebook-auth/README.md b/plugins/talk-plugin-facebook-auth/README.md
index 19d003150..08780adda 100644
--- a/plugins/talk-plugin-facebook-auth/README.md
+++ b/plugins/talk-plugin-facebook-auth/README.md
@@ -27,4 +27,10 @@ Configuration:
   or by visiting the
   [Creating an App ID](https://developers.facebook.com/docs/apps/register)
   guide. This is only required while the `talk-plugin-facebook-auth` plugin is
-  enabled.
\ No newline at end of file
+  enabled.
+
+## GDPR Compliance
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+should review our [GDPR Compliance](/talk/integrating/gdpr/) guidelines.
diff --git a/plugins/talk-plugin-google-auth/README.md b/plugins/talk-plugin-google-auth/README.md
index f68b56c32..15eb5cef7 100644
--- a/plugins/talk-plugin-google-auth/README.md
+++ b/plugins/talk-plugin-google-auth/README.md
@@ -27,3 +27,9 @@ Configuration:
 - `TALK_GOOGLE_CLIENT_SECRET` (**required**) - The Google OAuth2 client ID for
   your Google login web app. You can learn more about getting a Google Client
   ID at the [Google API Console](https://console.developers.google.com/apis/).
+
+## GDPR Compliance
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+should review our [GDPR Compliance](/talk/integrating/gdpr/) guidelines.
diff --git a/plugins/talk-plugin-local-auth/README.md b/plugins/talk-plugin-local-auth/README.md
index ee5a6b880..5fabe0d71 100644
--- a/plugins/talk-plugin-local-auth/README.md
+++ b/plugins/talk-plugin-local-auth/README.md
@@ -18,3 +18,9 @@ through an email and password based login.
 
 - *Email Change*: Allows users to change their existing email address on their account.
 - *Local Account Association*: Allows users that have signed up with an external auth strategy (such as Google) the ability to associate a email address and password for login. **Note: Existing users with external authentication will be prompted to setup a local account when they sign in and when new users create an account.**
+
+## GDPR Compliance
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+should review our [GDPR Compliance](/talk/integrating/gdpr/) guidelines.
diff --git a/plugins/talk-plugin-profile-data/README.md b/plugins/talk-plugin-profile-data/README.md
index 1d019a79b..c4fcbb456 100644
--- a/plugins/talk-plugin-profile-data/README.md
+++ b/plugins/talk-plugin-profile-data/README.md
@@ -21,4 +21,13 @@ that contains a download link. Only one link can be generated every 7 days, and
 the link will be valid for 24 hours.
 
 The downloaded zip file will contain all the users comments in a CSV format
-including those that have been rejected, withheld, or still in premod.
+including those that have been rejected, withheld, or still in pre-moderation.
+
+## GDPR Compliance
+
+In order to facilitate compliance with the
+[EU General Data Protection Regulation (GDPR)](https://www.eugdpr.org/), you
+should review our [GDPR Compliance](/talk/integrating/gdpr/) guidelines. This
+plugin can work with its client plugin disabled and then directly integrated
+with existing workflows for an organization of any size through use of the API
+that this plugin provides.

From c1492d10658d1dad16b2f2409006e5ad6a9966eb Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 2 May 2018 13:22:15 -0600
Subject: [PATCH 048/160] Added incorrect password error

---
 plugins/talk-plugin-local-auth/server/errors.js      | 12 +++++++++++-
 plugins/talk-plugin-local-auth/server/mutators.js    |  8 ++++++--
 .../talk-plugin-local-auth/server/translations.yml   |  1 +
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/server/errors.js b/plugins/talk-plugin-local-auth/server/errors.js
index 808ceb3a6..0f0653c19 100644
--- a/plugins/talk-plugin-local-auth/server/errors.js
+++ b/plugins/talk-plugin-local-auth/server/errors.js
@@ -22,4 +22,14 @@ class ErrLocalProfile extends TalkError {
   }
 }
 
-module.exports = { ErrLocalProfile, ErrNoLocalProfile };
+// ErrIncorrectPassword is returned when the password passed was incorrect.
+class ErrIncorrectPassword extends TalkError {
+  constructor() {
+    super('Password was incorrect', {
+      translation_key: 'INCORRECT_PASSWORD',
+      status: 400,
+    });
+  }
+}
+
+module.exports = { ErrLocalProfile, ErrNoLocalProfile, ErrIncorrectPassword };
diff --git a/plugins/talk-plugin-local-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
index fb866b92c..cb34bed7a 100644
--- a/plugins/talk-plugin-local-auth/server/mutators.js
+++ b/plugins/talk-plugin-local-auth/server/mutators.js
@@ -1,5 +1,9 @@
 const { ErrNotAuthorized, ErrNotFound, ErrEmailTaken } = require('errors');
-const { ErrNoLocalProfile, ErrLocalProfile } = require('./errors');
+const {
+  ErrNoLocalProfile,
+  ErrLocalProfile,
+  ErrIncorrectPassword,
+} = require('./errors');
 const { get } = require('lodash');
 const bcrypt = require('bcryptjs');
 
@@ -25,7 +29,7 @@ async function updateUserEmailAddress(ctx, email, confirmPassword) {
 
   // Ensure that the password provided matches what we have on file.
   if (!await user.verifyPassword(confirmPassword)) {
-    throw new ErrNotAuthorized();
+    throw new ErrIncorrectPassword();
   }
 
   // Cleanup the email address.
diff --git a/plugins/talk-plugin-local-auth/server/translations.yml b/plugins/talk-plugin-local-auth/server/translations.yml
index 7df3d7b88..d81de6c6d 100644
--- a/plugins/talk-plugin-local-auth/server/translations.yml
+++ b/plugins/talk-plugin-local-auth/server/translations.yml
@@ -6,3 +6,4 @@ en:
   error:
     NO_LOCAL_PROFILE: No existing email address is associated with this account.
     LOCAL_PROFILE: An email address is already associated with this account.
+    INCORRECT_PASSWORD: Provided password was incorrect.

From 45c75f3c48ded2b393cfa7453e95e0362cad5084 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Wed, 2 May 2018 15:22:17 -0400
Subject: [PATCH 049/160] Update version to 4.4.0

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index c7e9a78c1..9fe31aa39 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "talk",
-  "version": "4.3.2",
+  "version": "4.4.0",
   "description": "A better commenting experience from Mozilla, The New York Times, and the Washington Post. https://coralproject.net",
   "main": "app.js",
   "private": true,

From c7db780582a3c2fc9af25ec0138ab5bbce5b58ab Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 16:46:20 -0300
Subject: [PATCH 050/160] Updating the cache with data from the fragment

---
 .../src/tabs/profile/containers/Profile.js    |  2 +-
 client/coral-framework/graphql/mutations.js   | 23 +++++++++++++++++++
 .../components/ChangeEmailContentDialog.js    |  4 ++--
 .../client/components/Profile.js              | 14 ++++-------
 .../client/containers/Profile.js              |  2 ++
 5 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/client/coral-embed-stream/src/tabs/profile/containers/Profile.js b/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
index 0272c1535..4a84f1810 100644
--- a/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
+++ b/client/coral-embed-stream/src/tabs/profile/containers/Profile.js
@@ -46,7 +46,7 @@ ProfileContainer.propTypes = {
   currentUser: PropTypes.object,
 };
 
-const slots = ['profileSections'];
+const slots = ['profileSections', 'profileSettings', 'profileHeader'];
 
 const withProfileQuery = withQuery(
   gql`
diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 15596e9a7..29ec3fc96 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -336,6 +336,29 @@ export const withUpdateEmailAddress = withMutation(
           variables: {
             input,
           },
+          update: proxy => {
+            const UpdateEmailAddressQuery = gql`
+              query Talk_UpdateEmailAddress {
+                me {
+                  id
+                  email
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: UpdateEmailAddressQuery });
+
+            const data = update(prev, {
+              me: {
+                email: { $set: input.email },
+              },
+            });
+
+            proxy.writeQuery({
+              query: UpdateEmailAddressQuery,
+              data,
+            });
+          },
         });
       },
     }),
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index 02d02680e..4bc15757e 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
@@ -37,7 +37,7 @@ class ChangeEmailContentDialog extends React.Component {
           <div className={styles.emailChange}>
             <span className={styles.item}>
               {t('talk-plugin-local-auth.change_email.old_email')}:{' '}
-              {this.props.emailAddress}
+              {this.props.email}
             </span>
             <span className={styles.item}>
               {t('talk-plugin-local-auth.change_email.new_email')}:{' '}
@@ -86,7 +86,7 @@ ChangeEmailContentDialog.propTypes = {
   cancel: PropTypes.func,
   onChange: PropTypes.func,
   formData: PropTypes.object,
-  emailAddress: PropTypes.string,
+  email: PropTypes.string,
 };
 
 export default ChangeEmailContentDialog;
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 84474dbe3..949923e77 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.js
@@ -158,9 +158,7 @@ class Profile extends React.Component {
 
   render() {
     const {
-      username,
-      emailAddress,
-      root: { me: { state: { status } } },
+      root: { me: { username, email, state: { status } } },
       notify,
     } = this.props;
     const { editing, formData, showDialog } = this.state;
@@ -193,8 +191,8 @@ class Profile extends React.Component {
             save={this.saveEmail}
             onChange={this.onChange}
             formData={this.state.formData}
-            emailAddress={emailAddress}
-            enable={formData.newEmail && emailAddress !== formData.newEmail}
+            email={email}
+            enable={formData.newEmail && email !== formData.newEmail}
           />
         </ConfirmChangesDialog>
 
@@ -221,7 +219,7 @@ class Profile extends React.Component {
                 id="newEmail"
                 name="newEmail"
                 onChange={this.onChange}
-                defaultValue={emailAddress}
+                defaultValue={email}
                 validationType="email"
                 columnDisplay
               />
@@ -230,9 +228,7 @@ class Profile extends React.Component {
         ) : (
           <div className={styles.content}>
             <h2 className={styles.username}>{username}</h2>
-            {emailAddress ? (
-              <p className={styles.email}>{emailAddress}</p>
-            ) : null}
+            {email ? <p className={styles.email}>{email}</p> : null}
           </div>
         )}
         {editing ? (
diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index bebf127fd..239304535 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -15,6 +15,8 @@ const withData = withFragments({
     fragment TalkPluginLocalAuth_Profile_root on RootQuery {
       me {
         id
+        email
+        username
         state {
           status {
             username {

From bfb4b790d42b166a15c57f4a46021c5b3fa4ad75 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 16:49:56 -0300
Subject: [PATCH 051/160] Adding error

---
 locales/en.yml | 1 +
 locales/es.yml | 1 +
 2 files changed, 2 insertions(+)

diff --git a/locales/en.yml b/locales/en.yml
index 393d01e23..045d37c46 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -250,6 +250,7 @@ en:
     ALREADY_EXISTS: "Resource already exists"
     INVALID_ASSET_URL: "Assert URL is invalid"
     CANNOT_IGNORE_STAFF: "Cannot ignore Staff members."
+    INCORRECT_PASSWORD: "Incorrect Password"
     email: "Please enter a valid email."
     confirm_password: "Passwords don't match. Please check again"
     network_error: "Failed to connect to server. Check your internet connection and try again."
diff --git a/locales/es.yml b/locales/es.yml
index 628dd8faa..41e337df8 100644
--- a/locales/es.yml
+++ b/locales/es.yml
@@ -243,6 +243,7 @@ es:
     ALREADY_EXISTS: "Resource already exists"
     INVALID_ASSET_URL: "La URL del articulo no es valida"
     CANNOT_IGNORE_STAFF: "Cannot ignore Staff members."
+    INCORRECT_PASSWORD: "Contraseña Incorrecta"
     email: "No es un correo válido"
     confirm_password: "Las contraseñas no coinciden. Inténtelo nuevamente"
     network_error: "Error al conectar con el servidor. Compruebe su conexión a Internet y vuelva a intentarlo."

From b04fc1faf896242ea128f78d731850d885908694 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 18:15:04 -0300
Subject: [PATCH 052/160] wip

---
 client/coral-framework/graphql/mutations.js   |  44 +++++
 plugin-api/beta/client/hocs/index.js          |   1 +
 .../client/components/ErrorMessage.css        |   8 +
 .../client/components/ErrorMessage.js         |  17 ++
 .../client/components/InputField.css          |  80 ++++++++
 .../client/components/InputField.js           |  94 ++++++++++
 .../components/AddEmailAddressDialog.css      |  74 ++++++++
 .../components/AddEmailAddressDialog.js       | 177 ++++++++++++++++++
 .../containers/AddEmailAddressDialog.js       |  26 +++
 .../talk-plugin-local-auth/client/index.js    |   2 +
 10 files changed, 523 insertions(+)
 create mode 100644 plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.css
 create mode 100644 plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.js
 create mode 100644 plugins/talk-plugin-facebook-auth/client/components/InputField.css
 create mode 100644 plugins/talk-plugin-facebook-auth/client/components/InputField.js
 create mode 100644 plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
 create mode 100644 plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
 create mode 100644 plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 29ec3fc96..dd54d0438 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -321,6 +321,50 @@ const SetUsernameFragment = gql`
   }
 `;
 
+export const withAttachLocalAuth = withMutation(
+  gql`
+    mutation AttachLocalAuth($input: AttachLocalAuthInput!) {
+      attachLocalAuth(input: $input) {
+        ...AttachLocalAuthResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      attachLocalAuth: input => {
+        return mutate({
+          variables: {
+            input,
+          },
+          update: proxy => {
+            const AttachLocalAuthQuery = gql`
+              query Talk_AttachLocalAuth {
+                me {
+                  id
+                  email
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: AttachLocalAuthQuery });
+
+            const data = update(prev, {
+              me: {
+                email: { $set: input.email },
+              },
+            });
+
+            proxy.writeQuery({
+              query: AttachLocalAuthQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);
+
 export const withUpdateEmailAddress = withMutation(
   gql`
     mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
diff --git a/plugin-api/beta/client/hocs/index.js b/plugin-api/beta/client/hocs/index.js
index d33e7acc9..910969227 100644
--- a/plugin-api/beta/client/hocs/index.js
+++ b/plugin-api/beta/client/hocs/index.js
@@ -28,5 +28,6 @@ export {
   withChangePassword,
   withChangeUsername,
   withUpdateEmailAddress,
+  withAttachLocalAuth,
 } from 'coral-framework/graphql/mutations';
 export { compose } from 'recompose';
diff --git a/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.css b/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.css
new file mode 100644
index 000000000..039ffae30
--- /dev/null
+++ b/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.css
@@ -0,0 +1,8 @@
+.errorMsg {
+  color: #FA4643;
+  font-size: 0.9em;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
diff --git a/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.js b/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.js
new file mode 100644
index 000000000..f39a8fc08
--- /dev/null
+++ b/plugins/talk-plugin-facebook-auth/client/components/ErrorMessage.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styles from './ErrorMessage.css';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const ErrorMessage = ({ children }) => (
+  <div className={styles.errorMsg}>
+    <Icon className={styles.warningIcon} name="warning" />
+    <span>{children}</span>
+  </div>
+);
+
+ErrorMessage.propTypes = {
+  children: PropTypes.node,
+};
+
+export default ErrorMessage;
diff --git a/plugins/talk-plugin-facebook-auth/client/components/InputField.css b/plugins/talk-plugin-facebook-auth/client/components/InputField.css
new file mode 100644
index 000000000..3442befde
--- /dev/null
+++ b/plugins/talk-plugin-facebook-auth/client/components/InputField.css
@@ -0,0 +1,80 @@
+  
+.detailItem {
+  margin-bottom: 12px;
+}
+
+.detailItemContainer {
+  display: flex;
+}
+
+.columnDisplay {
+  flex-direction: column;
+
+  .detailItemMessage {
+    padding: 4px 0 0;
+  }
+}
+
+.detailItemContent {
+  border: solid 1px #787D80;
+  border-radius: 2px;
+  background-color: white;
+  height: 30px;
+  display: inline-block;
+  width: 230px;
+  display: flex;  
+  box-sizing: border-box;
+
+  > .detailIcon {
+    font-size: 1.2em;
+    padding: 0 5px;
+    color: #787D80;
+    line-height: 30px; 
+  }
+
+  &.error {
+    border: solid 2px #FA4643;
+  }
+
+  &.disabled {
+    background-color: #E0E0E0;
+  }
+}
+
+.detailLabel {
+  color: #4C4C4D;
+  font-size: 1em;
+  display: block;
+  margin-bottom: 4px;
+}
+
+.detailValue {
+  background: transparent;
+  border: none;
+  font-size: 1em;
+  color: #000;
+  outline: none;
+  flex: 1;
+  height: 100%;
+  box-sizing: border-box;
+}
+
+.detailItemMessage {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+  padding-left: 6px;
+  padding-top: 16px;
+
+  .warningIcon, .checkIcon {
+    font-size: 17px;
+  }
+}
+
+.checkIcon {
+  color: #00CD73;
+}
+
+.warningIcon {
+  color: #FA4643;
+}
diff --git a/plugins/talk-plugin-facebook-auth/client/components/InputField.js b/plugins/talk-plugin-facebook-auth/client/components/InputField.js
new file mode 100644
index 000000000..26937d5b9
--- /dev/null
+++ b/plugins/talk-plugin-facebook-auth/client/components/InputField.js
@@ -0,0 +1,94 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './InputField.css';
+import ErrorMessage from './ErrorMessage';
+import { Icon } from 'plugin-api/beta/client/components/ui';
+
+const InputField = ({
+  id = '',
+  label = '',
+  type = 'text',
+  name = '',
+  onChange = () => {},
+  showError = true,
+  hasError = false,
+  errorMsg = '',
+  children,
+  columnDisplay = false,
+  showSuccess = false,
+  validationType = '',
+  icon = '',
+  value = '',
+  defaultValue = '',
+  disabled = false,
+}) => {
+  const inputValue = {
+    ...(value ? { value } : {}),
+    ...(defaultValue ? { defaultValue } : {}),
+  };
+
+  return (
+    <div className={styles.detailItem}>
+      <div
+        className={cn(styles.detailItemContainer, {
+          [styles.columnDisplay]: columnDisplay,
+        })}
+      >
+        {label && (
+          <label className={styles.detailLabel} id={id}>
+            {label}
+          </label>
+        )}
+        <div
+          className={cn(
+            styles.detailItemContent,
+            { [styles.error]: hasError && showError },
+            { [styles.disabled]: disabled }
+          )}
+        >
+          {icon && <Icon name={icon} className={styles.detailIcon} />}
+          <input
+            id={id}
+            type={type}
+            name={name}
+            className={styles.detailValue}
+            onChange={onChange}
+            autoComplete="off"
+            data-validation-type={validationType}
+            disabled={disabled}
+            {...inputValue}
+          />
+        </div>
+        <div className={styles.detailItemMessage}>
+          {!hasError &&
+            showSuccess &&
+            value && <Icon className={styles.checkIcon} name="check_circle" />}
+          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+        </div>
+      </div>
+      {children}
+    </div>
+  );
+};
+
+InputField.propTypes = {
+  id: PropTypes.string,
+  disabled: PropTypes.bool,
+  label: PropTypes.string,
+  type: PropTypes.string,
+  name: PropTypes.string.isRequired,
+  onChange: PropTypes.func,
+  value: PropTypes.string,
+  defaultValue: PropTypes.string,
+  icon: PropTypes.string,
+  showError: PropTypes.bool,
+  hasError: PropTypes.bool,
+  errorMsg: PropTypes.string,
+  children: PropTypes.node,
+  columnDisplay: PropTypes.bool,
+  showSuccess: PropTypes.bool,
+  validationType: PropTypes.string,
+};
+
+export default InputField;
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
new file mode 100644
index 000000000..7fa3ce78c
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
@@ -0,0 +1,74 @@
+.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: 400px;
+  top: 50%;
+  transform: translateY(-50%);
+  padding: 20px;
+  border-radius: 4px;
+  font-family: Helvetica,Helvetica Neue,Verdana,sans-serif;
+}
+
+.title {
+  font-size: 1.2em;
+  margin-bottom: 8px;
+}
+
+.description {
+  font-size: 1em;
+  line-height: 20px;
+  margin: 0;
+  margin-bottom: 15px;
+}
+
+.list {
+  padding: 0;
+  margin: 20px 0;
+  list-style: none;
+}
+  
+.item {
+  display: flex;
+  margin-bottom: 20px;
+
+  .itemIcon {
+    flex-grow: 0;
+  }
+
+  .text {
+    flex-grow: 1;
+    padding-left: 10px;
+  }
+
+  > i.itemIcon {
+    font-size: 1.3em;
+  }
+}
+  
+.button {
+  color: #787D80;
+  border-radius: 2px;
+  background-color: transparent;
+  height: 30px;
+  font-size: 0.9em;
+  line-height: normal;
+
+  &:hover {
+    background-color: #eaeaea;
+  }
+
+  &.cancel {
+    background-color: transparent;
+    color: #787D80;
+  }
+
+  &.proceed {
+    background-color: #3498DB;
+    color: white;
+  }
+
+  &.danger {
+    background-color: #FA4643;
+    color: white;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
new file mode 100644
index 000000000..4468d7865
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -0,0 +1,177 @@
+import React from 'react';
+import isEqual from 'lodash/isEqual';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import styles from './AddEmailAddressDialog.css';
+import { Button, Dialog, Icon } from 'plugin-api/beta/client/components/ui';
+import validate from 'coral-framework/helpers/validate';
+import errorMsj from 'coral-framework/helpers/error';
+import InputField from './InputField';
+import { getErrorMessages } from 'coral-framework/utils';
+
+const initialState = {
+  showErrors: false,
+  errors: {},
+  formData: {},
+};
+
+class AddEmailAddressDialog extends React.Component {
+  state = initialState;
+  validKeys = ['emailAddress', 'confirmEmailAddress'];
+
+  onChange = e => {
+    const { name, value, type } = e.target;
+    this.setState(
+      state => ({
+        formData: {
+          ...state.formData,
+          [name]: value,
+        },
+      }),
+      () => {
+        this.fieldValidation(value, type, name);
+      }
+    );
+  };
+
+  fieldValidation = (value, type, name) => {
+    if (!value.length) {
+      this.addError({
+        [name]: 'Field is required',
+      });
+    } else if (!validate[type](value)) {
+      this.addError({ [name]: errorMsj[type] });
+    } else {
+      this.removeError(name);
+    }
+  };
+
+  addError = err => {
+    this.setState(({ errors }) => ({
+      errors: { ...errors, ...err },
+    }));
+  };
+
+  removeError = errKey => {
+    this.setState(state => {
+      const { [errKey]: _, ...errors } = state.errors;
+      return {
+        errors,
+      };
+    });
+  };
+
+  hasError = err => {
+    return Object.keys(this.state.errors).indexOf(err) !== -1;
+  };
+
+  formHasError = () => {
+    const formHasErrors = !!Object.keys(this.state.errors).length;
+    const formIncomplete = !isEqual(
+      Object.keys(this.state.formData),
+      this.validKeys
+    );
+    return formHasErrors || formIncomplete;
+  };
+
+  showError = () => {
+    this.setState({
+      showError: true,
+    });
+  };
+
+  confirmChanges = async () => {
+    if (this.formHasError()) {
+      this.showError();
+      return;
+    }
+
+    const { emailAddress } = this.state.formData;
+    const { attachLocalAuth } = this.props;
+
+    try {
+      await attachLocalAuth({
+        email: emailAddress,
+      });
+      this.props.notify('success', 'Email Added!');
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+  };
+
+  render() {
+    const { errors, formData, showErrors } = this.state;
+    return (
+      <Dialog className={styles.dialog} open={true}>
+        <h4 className={styles.title}>Add an Email Address</h4>
+        <p className={styles.description}>
+          For your added security, we require users to add an email address to
+          their accounts. Your email address will be used to:
+        </p>
+        <ul className={styles.list}>
+          <li className={styles.item}>
+            <Icon name="done" className={styles.itemIcon} />
+            <span className={styles.text}>
+              Receive updates regarding any changes to your account (email
+              address, username, password, etc.)
+            </span>
+          </li>
+          <li className={styles.item}>
+            <Icon name="done" className={styles.itemIcon} />
+            <span className={styles.text}>
+              Allow you to download your comments.
+            </span>
+          </li>
+          <li className={styles.item}>
+            <Icon name="done" className={styles.itemIcon} />
+            <span className={styles.text}>
+              Send comment notifications that you have chosen to receive.
+            </span>
+          </li>
+        </ul>
+        <InputField
+          id="emailAddress"
+          label="Enter Email Address:"
+          name="emailAddress"
+          type="email"
+          onChange={this.onChange}
+          defaultValue=""
+          hasError={
+            (!formData.emailAddress || errors.emailAddress) && showErrors
+          }
+          errorMsg={errors.emailAddress}
+          showError={this.state.showError}
+          columnDisplay
+          showSuccess={false}
+        />
+        <InputField
+          id="confirmEmailAddress"
+          label="Confirm Email Address:"
+          name="confirmEmailAddress"
+          type="email"
+          onChange={this.onChange}
+          defaultValue=""
+          hasError={
+            (!formData.emailAddress ||
+              formData.emailAddress !== formData.confirmEmailAddress) &&
+            showErrors
+          }
+          errorMsg={'Email address does not match'}
+          showError={this.state.showError}
+          columnDisplay
+          showSuccess={false}
+        />
+        <Button className={cn(styles.button, styles.proceed)} full>
+          Add Email Address
+        </Button>
+      </Dialog>
+    );
+  }
+}
+
+AddEmailAddressDialog.propTypes = {
+  attachLocalAuth: PropTypes.func.isRequired,
+  notify: PropTypes.func.isRequired,
+};
+
+export default AddEmailAddressDialog;
diff --git a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
new file mode 100644
index 000000000..639236ea5
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
@@ -0,0 +1,26 @@
+import { compose, gql } from 'react-apollo';
+import { bindActionCreators } from 'redux';
+import { connect, withFragments } from 'plugin-api/beta/client/hocs';
+import AddEmailAddressDialog from '../components/AddEmailAddressDialog';
+import { notify } from 'coral-framework/actions/notification';
+
+import { withAttachLocalAuth } from 'plugin-api/beta/client/hocs';
+
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
+const withData = withFragments({
+  root: gql`
+    fragment TalkPluginLocalAuth_AddEmailAddressDialog_root on RootQuery {
+      me {
+        id
+        email
+      }
+    }
+  `,
+});
+
+export default compose(
+  connect(null, mapDispatchToProps),
+  withAttachLocalAuth,
+  withData
+)(AddEmailAddressDialog);
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index c669effaa..ce5816583 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -1,4 +1,5 @@
 import ChangePassword from './containers/ChangePassword';
+import AddEmailAddressDialog from './containers/AddEmailAddressDialog';
 import Profile from './containers/Profile';
 import translations from './translations.yml';
 
@@ -7,5 +8,6 @@ export default {
   slots: {
     profileHeader: [Profile],
     profileSettings: [ChangePassword],
+    stream: [AddEmailAddressDialog],
   },
 };

From 3b2deeb00772611a75bb37e23d51d70b4bbca8d2 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 18:35:15 -0300
Subject: [PATCH 053/160] Checking if email verification is required

---
 .../components/AddEmailAddressDialog.js       | 106 ++++++------------
 .../client/components/AddEmailContent.js      |  84 ++++++++++++++
 .../client/components/EmailAddressAdded.js    |  18 +++
 .../client/components/VerifyEmailAddress.js   |  20 ++++
 .../containers/AddEmailAddressDialog.js       |   3 +
 5 files changed, 160 insertions(+), 71 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
 create mode 100644 plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
 create mode 100644 plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index 4468d7865..b801a70da 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -1,15 +1,18 @@
 import React from 'react';
 import isEqual from 'lodash/isEqual';
 import PropTypes from 'prop-types';
-import cn from 'classnames';
-import styles from './AddEmailAddressDialog.css';
-import { Button, Dialog, Icon } from 'plugin-api/beta/client/components/ui';
+import { Dialog } from 'plugin-api/beta/client/components/ui';
 import validate from 'coral-framework/helpers/validate';
 import errorMsj from 'coral-framework/helpers/error';
-import InputField from './InputField';
 import { getErrorMessages } from 'coral-framework/utils';
+import styles from './AddEmailAddressDialog.css';
+
+import AddEmailContent from './AddEmailContent';
+import VerifyEmailAddress from './VerifyEmailAddress';
+import EmailAddressAdded from './EmailAddressAdded';
 
 const initialState = {
+  step: 0,
   showErrors: false,
   errors: {},
   formData: {},
@@ -17,7 +20,7 @@ const initialState = {
 
 class AddEmailAddressDialog extends React.Component {
   state = initialState;
-  validKeys = ['emailAddress', 'confirmEmailAddress'];
+  validKeys = ['emailAddress', 'confirmEmailAddress', 'confirmPassword'];
 
   onChange = e => {
     const { name, value, type } = e.target;
@@ -74,96 +77,56 @@ class AddEmailAddressDialog extends React.Component {
     return formHasErrors || formIncomplete;
   };
 
-  showError = () => {
+  showErrors = () => {
     this.setState({
-      showError: true,
+      showErrors: true,
     });
   };
 
   confirmChanges = async () => {
     if (this.formHasError()) {
-      this.showError();
+      this.showErrors();
       return;
     }
 
-    const { emailAddress } = this.state.formData;
+    const { emailAddress, confirmPassword } = this.state.formData;
     const { attachLocalAuth } = this.props;
 
     try {
       await attachLocalAuth({
         email: emailAddress,
+        password: confirmPassword,
       });
       this.props.notify('success', 'Email Added!');
+      this.goToNextStep();
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
     }
   };
 
+  goToNextStep = () => {
+    this.setState(({ step }) => ({
+      step: step + 1,
+    }));
+  };
+
   render() {
-    const { errors, formData, showErrors } = this.state;
+    const { errors, formData, showErrors, step } = this.state;
+    const { root: { settings } } = this.props;
     return (
       <Dialog className={styles.dialog} open={true}>
-        <h4 className={styles.title}>Add an Email Address</h4>
-        <p className={styles.description}>
-          For your added security, we require users to add an email address to
-          their accounts. Your email address will be used to:
-        </p>
-        <ul className={styles.list}>
-          <li className={styles.item}>
-            <Icon name="done" className={styles.itemIcon} />
-            <span className={styles.text}>
-              Receive updates regarding any changes to your account (email
-              address, username, password, etc.)
-            </span>
-          </li>
-          <li className={styles.item}>
-            <Icon name="done" className={styles.itemIcon} />
-            <span className={styles.text}>
-              Allow you to download your comments.
-            </span>
-          </li>
-          <li className={styles.item}>
-            <Icon name="done" className={styles.itemIcon} />
-            <span className={styles.text}>
-              Send comment notifications that you have chosen to receive.
-            </span>
-          </li>
-        </ul>
-        <InputField
-          id="emailAddress"
-          label="Enter Email Address:"
-          name="emailAddress"
-          type="email"
-          onChange={this.onChange}
-          defaultValue=""
-          hasError={
-            (!formData.emailAddress || errors.emailAddress) && showErrors
-          }
-          errorMsg={errors.emailAddress}
-          showError={this.state.showError}
-          columnDisplay
-          showSuccess={false}
-        />
-        <InputField
-          id="confirmEmailAddress"
-          label="Confirm Email Address:"
-          name="confirmEmailAddress"
-          type="email"
-          onChange={this.onChange}
-          defaultValue=""
-          hasError={
-            (!formData.emailAddress ||
-              formData.emailAddress !== formData.confirmEmailAddress) &&
-            showErrors
-          }
-          errorMsg={'Email address does not match'}
-          showError={this.state.showError}
-          columnDisplay
-          showSuccess={false}
-        />
-        <Button className={cn(styles.button, styles.proceed)} full>
-          Add Email Address
-        </Button>
+        {step === 0 && (
+          <AddEmailContent
+            formData={formData}
+            errors={errors}
+            showErrors={showErrors}
+          />
+        )}
+        {step === 1 && !settings.requireEmailConfirmation ? (
+          <EmailAddressAdded />
+        ) : (
+          <VerifyEmailAddress emailAddress={formData.emailAddress} />
+        )}
       </Dialog>
     );
   }
@@ -172,6 +135,7 @@ class AddEmailAddressDialog extends React.Component {
 AddEmailAddressDialog.propTypes = {
   attachLocalAuth: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
+  root: PropTypes.func.isRequired,
 };
 
 export default AddEmailAddressDialog;
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
new file mode 100644
index 000000000..a2b14c5fd
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -0,0 +1,84 @@
+import React from 'react';
+import styles from './AddEmailAddressDialog.css';
+import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import cn from 'classnames';
+import InputField from './InputField';
+
+const AddEmailContent = ({ formData, errors, showErrors }) => (
+  <div>
+    <h4 className={styles.title}>Add an Email Address</h4>
+    <p className={styles.description}>
+      For your added security, we require users to add an email address to their
+      accounts. Your email address will be used to:
+    </p>
+    <ul className={styles.list}>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          Receive updates regarding any changes to your account (email address,
+          username, password, etc.)
+        </span>
+      </li>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          Allow you to download your comments.
+        </span>
+      </li>
+      <li className={styles.item}>
+        <Icon name="done" className={styles.itemIcon} />
+        <span className={styles.text}>
+          Send comment notifications that you have chosen to receive.
+        </span>
+      </li>
+    </ul>
+    <InputField
+      id="emailAddress"
+      label="Enter Email Address:"
+      name="emailAddress"
+      type="email"
+      onChange={this.onChange}
+      defaultValue=""
+      hasError={(!formData.emailAddress || errors.emailAddress) && showErrors}
+      errorMsg={errors.emailAddress}
+      showError={this.state.showError}
+      columnDisplay
+      showSuccess={false}
+    />
+    <InputField
+      id="confirmEmailAddress"
+      label="Confirm Email Address:"
+      name="confirmEmailAddress"
+      type="email"
+      onChange={this.onChange}
+      defaultValue=""
+      hasError={
+        (!formData.emailAddress ||
+          formData.emailAddress !== formData.confirmEmailAddress) &&
+        showErrors
+      }
+      errorMsg={'Email address does not match'}
+      showError={this.state.showError}
+      columnDisplay
+      showSuccess={false}
+    />
+    <InputField
+      id="confirmPassword"
+      label="Insert Password"
+      name="confirmPassword"
+      type="password"
+      onChange={this.onChange}
+      defaultValue=""
+      hasError={!formData.confirmPassword && showErrors}
+      errorMsg={'Confirm Password'}
+      showError={this.state.showError}
+      columnDisplay
+      showSuccess={false}
+    />
+    <Button className={cn(styles.button, styles.proceed)} full>
+      Add Email Address
+    </Button>
+  </div>
+);
+
+export default AddEmailContent;
diff --git a/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
new file mode 100644
index 000000000..9d3e875d5
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import styles from './AddEmailAddressDialog.css';
+
+const EmailAddressAdded = () => (
+  <div>
+    <h4 className={styles.title}>Email Address Added</h4>
+    <p className={styles.description}>
+      Your email address has been added to your account.
+    </p>
+    <strong>Need to change your email address?</strong>
+    <p className={styles.description}>
+      You can change your account settings by visiting{' '}
+      <strong>My Profile {'>'} Settings</strong>.
+    </p>
+  </div>
+);
+
+export default EmailAddressAdded;
diff --git a/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
new file mode 100644
index 000000000..8d9d207b7
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
@@ -0,0 +1,20 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styles from './AddEmailAddressDialog.css';
+
+const VerifyEmailAddress = ({ emailAddress }) => (
+  <div>
+    <h4 className={styles.title}>Verify Your Email Address</h4>
+    <p className={styles.description}>
+      We’ve sent an email to {emailAddress} to verify your account. You must
+      verify your email address so that it can be used for account change
+      confirmations and notifications.
+    </p>
+  </div>
+);
+
+VerifyEmailAddress.propTypes = {
+  emailAddress: PropTypes.string,
+};
+
+export default VerifyEmailAddress;
diff --git a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
index 639236ea5..9732383ce 100644
--- a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
@@ -15,6 +15,9 @@ const withData = withFragments({
         id
         email
       }
+      settings {
+        requireEmailConfirmation
+      }
     }
   `,
 });

From 1bf440c4a6f0f652682ae6cd1ea01079525bec19 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 18:43:06 -0300
Subject: [PATCH 054/160] Changes

---
 .../components/AddEmailAddressDialog.js       |  14 ++-
 .../client/components/AddEmailContent.js      | 107 ++++++++++--------
 2 files changed, 68 insertions(+), 53 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index b801a70da..e5226eae0 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -120,13 +120,15 @@ class AddEmailAddressDialog extends React.Component {
             formData={formData}
             errors={errors}
             showErrors={showErrors}
+            confirmChanges={this.confirmChanges}
           />
         )}
-        {step === 1 && !settings.requireEmailConfirmation ? (
-          <EmailAddressAdded />
-        ) : (
-          <VerifyEmailAddress emailAddress={formData.emailAddress} />
-        )}
+        {step === 1 &&
+          !settings.requireEmailConfirmation && <EmailAddressAdded />}
+        {step === 1 &&
+          settings.requireEmailConfirmation && (
+            <VerifyEmailAddress emailAddress={formData.emailAddress} />
+          )}
       </Dialog>
     );
   }
@@ -135,7 +137,7 @@ class AddEmailAddressDialog extends React.Component {
 AddEmailAddressDialog.propTypes = {
   attachLocalAuth: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
-  root: PropTypes.func.isRequired,
+  root: PropTypes.object.isRequired,
 };
 
 export default AddEmailAddressDialog;
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index a2b14c5fd..cb127520f 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -1,10 +1,11 @@
 import React from 'react';
+import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import cn from 'classnames';
 import InputField from './InputField';
 
-const AddEmailContent = ({ formData, errors, showErrors }) => (
+const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
   <div>
     <h4 className={styles.title}>Add an Email Address</h4>
     <p className={styles.description}>
@@ -32,53 +33,65 @@ const AddEmailContent = ({ formData, errors, showErrors }) => (
         </span>
       </li>
     </ul>
-    <InputField
-      id="emailAddress"
-      label="Enter Email Address:"
-      name="emailAddress"
-      type="email"
-      onChange={this.onChange}
-      defaultValue=""
-      hasError={(!formData.emailAddress || errors.emailAddress) && showErrors}
-      errorMsg={errors.emailAddress}
-      showError={this.state.showError}
-      columnDisplay
-      showSuccess={false}
-    />
-    <InputField
-      id="confirmEmailAddress"
-      label="Confirm Email Address:"
-      name="confirmEmailAddress"
-      type="email"
-      onChange={this.onChange}
-      defaultValue=""
-      hasError={
-        (!formData.emailAddress ||
-          formData.emailAddress !== formData.confirmEmailAddress) &&
-        showErrors
-      }
-      errorMsg={'Email address does not match'}
-      showError={this.state.showError}
-      columnDisplay
-      showSuccess={false}
-    />
-    <InputField
-      id="confirmPassword"
-      label="Insert Password"
-      name="confirmPassword"
-      type="password"
-      onChange={this.onChange}
-      defaultValue=""
-      hasError={!formData.confirmPassword && showErrors}
-      errorMsg={'Confirm Password'}
-      showError={this.state.showError}
-      columnDisplay
-      showSuccess={false}
-    />
-    <Button className={cn(styles.button, styles.proceed)} full>
-      Add Email Address
-    </Button>
+    <form>
+      <InputField
+        id="emailAddress"
+        label="Enter Email Address:"
+        name="emailAddress"
+        type="email"
+        onChange={this.onChange}
+        defaultValue=""
+        hasError={!formData.emailAddress || errors.emailAddress}
+        errorMsg={errors.emailAddress}
+        showError={showErrors}
+        columnDisplay
+        showSuccess={false}
+      />
+      <InputField
+        id="confirmEmailAddress"
+        label="Confirm Email Address:"
+        name="confirmEmailAddress"
+        type="email"
+        onChange={this.onChange}
+        defaultValue=""
+        hasError={
+          !formData.emailAddress ||
+          formData.emailAddress !== formData.confirmEmailAddress
+        }
+        errorMsg={'Email address does not match'}
+        showError={showErrors}
+        columnDisplay
+        showSuccess={false}
+      />
+      <InputField
+        id="confirmPassword"
+        label="Insert Password"
+        name="confirmPassword"
+        type="password"
+        onChange={this.onChange}
+        defaultValue=""
+        hasError={!formData.confirmPassword}
+        errorMsg={'Confirm Password'}
+        showError={showErrors}
+        columnDisplay
+        showSuccess={false}
+      />
+      <Button
+        className={cn(styles.button, styles.proceed)}
+        full
+        onClick={confirmChanges}
+      >
+        Add Email Address
+      </Button>
+    </form>
   </div>
 );
 
+AddEmailContent.propTypes = {
+  formData: PropTypes.object.isRequired,
+  errors: PropTypes.object.isRequired,
+  showErrors: PropTypes.bool.isRequired,
+  confirmChanges: PropTypes.func.isRequired,
+};
+
 export default AddEmailContent;

From 09d20257acc71172d8cd727dfaf23a447758eaae Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 18:46:41 -0300
Subject: [PATCH 055/160] Changes

---
 .../client/components/AddEmailAddressDialog.css        |  6 ++++++
 .../client/components/AddEmailContent.js               | 10 +++-------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
index 7fa3ce78c..1e711f5cb 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
@@ -52,9 +52,15 @@
   height: 30px;
   font-size: 0.9em;
   line-height: normal;
+  width: 100%;
+  display: inline-block;
+  text-align: center;
+  line-height: 30px;
+  font-size: 1em;
 
   &:hover {
     background-color: #eaeaea;
+    cursor: pointer;
   }
 
   &.cancel {
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index cb127520f..dcd0d9496 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
-import { Button, Icon } from 'plugin-api/beta/client/components/ui';
+import { Icon } from 'plugin-api/beta/client/components/ui';
 import cn from 'classnames';
 import InputField from './InputField';
 
@@ -76,13 +76,9 @@ const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
         columnDisplay
         showSuccess={false}
       />
-      <Button
-        className={cn(styles.button, styles.proceed)}
-        full
-        onClick={confirmChanges}
-      >
+      <a className={cn(styles.button, styles.proceed)} onClick={confirmChanges}>
         Add Email Address
-      </Button>
+      </a>
     </form>
   </div>
 );

From cdae2796a5dcfa61fe2e06ba1039f0b74548337a Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 18:48:52 -0300
Subject: [PATCH 056/160] Changes

---
 .../talk-plugin-local-auth/client/components/AddEmailContent.js | 2 +-
 plugins/talk-plugin-local-auth/client/components/InputField.js  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index dcd0d9496..8ff5db689 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -42,7 +42,7 @@ const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
         onChange={this.onChange}
         defaultValue=""
         hasError={!formData.emailAddress || errors.emailAddress}
-        errorMsg={errors.emailAddress}
+        errorMsg={'Invalid email address'}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.js b/plugins/talk-plugin-local-auth/client/components/InputField.js
index 34c314c20..26937d5b9 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.js
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.js
@@ -43,7 +43,7 @@ const InputField = ({
         <div
           className={cn(
             styles.detailItemContent,
-            { [styles.error]: hasError },
+            { [styles.error]: hasError && showError },
             { [styles.disabled]: disabled }
           )}
         >

From ccb62263c190432135a9878ea55de60415cee099 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 20:08:29 -0300
Subject: [PATCH 057/160] checking me null

---
 .../client/containers/AccountDeletionRequestedSign.js           | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
index d842ec43f..9ac152743 100644
--- a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
@@ -21,5 +21,5 @@ export default compose(
   connect(null, mapDispatchToProps),
   withCancelAccountDeletion,
   withData,
-  excludeIf(props => !props.root.me.scheduledDeletionDate)
+  excludeIf(({ root: { me } }) => !me || !me.scheduledDeletionDate)
 )(AccountDeletionRequestedSign);

From 478770f6c6a0c1836a0b8eef8fb2819337aef7b1 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 20:41:32 -0300
Subject: [PATCH 058/160] Changes

---
 client/coral-framework/graphql/fragments.js    |  3 ++-
 .../client/components/AddEmailAddressDialog.js | 13 +++++++++----
 .../client/components/AddEmailContent.js       | 18 +++++++++++++-----
 3 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/client/coral-framework/graphql/fragments.js b/client/coral-framework/graphql/fragments.js
index bf75fa1a8..778214b8b 100644
--- a/client/coral-framework/graphql/fragments.js
+++ b/client/coral-framework/graphql/fragments.js
@@ -27,6 +27,7 @@ export default {
     'UpdateAssetStatusResponse',
     'UpdateSettingsResponse',
     'ChangePasswordResponse',
-    'UpdateEmailAddressResponse'
+    'UpdateEmailAddressResponse',
+    'AttachLocalAuthResponse'
   ),
 };
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index e5226eae0..c5b816e85 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -1,5 +1,6 @@
 import React from 'react';
-import isEqual from 'lodash/isEqual';
+import isMatch from 'lodash/isEqual';
+import isEqualWith from 'lodash/isEqual';
 import PropTypes from 'prop-types';
 import { Dialog } from 'plugin-api/beta/client/components/ui';
 import validate from 'coral-framework/helpers/validate';
@@ -20,7 +21,7 @@ const initialState = {
 
 class AddEmailAddressDialog extends React.Component {
   state = initialState;
-  validKeys = ['emailAddress', 'confirmEmailAddress', 'confirmPassword'];
+  validKeys = ['emailAddress', 'confirmPassword', 'confirmEmailAddress'];
 
   onChange = e => {
     const { name, value, type } = e.target;
@@ -70,10 +71,12 @@ class AddEmailAddressDialog extends React.Component {
 
   formHasError = () => {
     const formHasErrors = !!Object.keys(this.state.errors).length;
-    const formIncomplete = !isEqual(
+    const formIncomplete = !isEqualWith(
       Object.keys(this.state.formData),
-      this.validKeys
+      this.validKeys,
+      isMatch
     );
+
     return formHasErrors || formIncomplete;
   };
 
@@ -113,6 +116,7 @@ class AddEmailAddressDialog extends React.Component {
   render() {
     const { errors, formData, showErrors, step } = this.state;
     const { root: { settings } } = this.props;
+
     return (
       <Dialog className={styles.dialog} open={true}>
         {step === 0 && (
@@ -121,6 +125,7 @@ class AddEmailAddressDialog extends React.Component {
             errors={errors}
             showErrors={showErrors}
             confirmChanges={this.confirmChanges}
+            onChange={this.onChange}
           />
         )}
         {step === 1 &&
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index 8ff5db689..40edeea2a 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -5,7 +5,13 @@ import { Icon } from 'plugin-api/beta/client/components/ui';
 import cn from 'classnames';
 import InputField from './InputField';
 
-const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
+const AddEmailContent = ({
+  formData,
+  errors,
+  showErrors,
+  confirmChanges,
+  onChange,
+}) => (
   <div>
     <h4 className={styles.title}>Add an Email Address</h4>
     <p className={styles.description}>
@@ -33,13 +39,14 @@ const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
         </span>
       </li>
     </ul>
-    <form>
+
+    <form autoComplete="off">
       <InputField
         id="emailAddress"
         label="Enter Email Address:"
         name="emailAddress"
         type="email"
-        onChange={this.onChange}
+        onChange={onChange}
         defaultValue=""
         hasError={!formData.emailAddress || errors.emailAddress}
         errorMsg={'Invalid email address'}
@@ -52,7 +59,7 @@ const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
         label="Confirm Email Address:"
         name="confirmEmailAddress"
         type="email"
-        onChange={this.onChange}
+        onChange={onChange}
         defaultValue=""
         hasError={
           !formData.emailAddress ||
@@ -68,7 +75,7 @@ const AddEmailContent = ({ formData, errors, showErrors, confirmChanges }) => (
         label="Insert Password"
         name="confirmPassword"
         type="password"
-        onChange={this.onChange}
+        onChange={onChange}
         defaultValue=""
         hasError={!formData.confirmPassword}
         errorMsg={'Confirm Password'}
@@ -88,6 +95,7 @@ AddEmailContent.propTypes = {
   errors: PropTypes.object.isRequired,
   showErrors: PropTypes.bool.isRequired,
   confirmChanges: PropTypes.func.isRequired,
+  onChange: PropTypes.func.isRequired,
 };
 
 export default AddEmailContent;

From 59cac9db8b3c08791354722f18c4af6e3389688e Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 20:58:34 -0300
Subject: [PATCH 059/160] Adding reducer

---
 .../talk-plugin-local-auth/client/actions.js  |  9 ++++++++
 .../components/AddEmailAddressDialog.css      |  8 ++++---
 .../components/AddEmailAddressDialog.js       | 14 ++++++++----
 .../client/components/AddEmailContent.js      | 13 +++++++----
 .../client/components/EmailAddressAdded.js    | 13 ++++++++++-
 .../client/components/InputField.css          |  3 ++-
 .../client/components/VerifyEmailAddress.js   | 11 ++++++++--
 .../client/constants.js                       |  4 ++++
 .../containers/AddEmailAddressDialog.js       |  6 ++++-
 .../talk-plugin-local-auth/client/index.js    |  2 ++
 .../talk-plugin-local-auth/client/reducer.js  | 22 +++++++++++++++++++
 11 files changed, 89 insertions(+), 16 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/actions.js
 create mode 100644 plugins/talk-plugin-local-auth/client/constants.js
 create mode 100644 plugins/talk-plugin-local-auth/client/reducer.js

diff --git a/plugins/talk-plugin-local-auth/client/actions.js b/plugins/talk-plugin-local-auth/client/actions.js
new file mode 100644
index 000000000..4786b92c8
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/actions.js
@@ -0,0 +1,9 @@
+import * as actions from './constants';
+
+export const showAddEmailDialog = () => ({
+  type: actions.SHOW_ADD_EMAIL_DIALOG,
+});
+
+export const hideAddEmailDialog = () => ({
+  type: actions.HIDE_ADD_EMAIL_DIALOG,
+});
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
index 1e711f5cb..41b531147 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.css
@@ -1,17 +1,19 @@
 .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: 400px;
+  width: 320px;
   top: 50%;
   transform: translateY(-50%);
   padding: 20px;
   border-radius: 4px;
   font-family: Helvetica,Helvetica Neue,Verdana,sans-serif;
+  color:#3B4A53;
 }
 
 .title {
-  font-size: 1.2em;
-  margin-bottom: 8px;
+  font-size: 1.3em;
+  margin: 15px 0;
+  text-align: center;
 }
 
 .description {
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index c5b816e85..253e3ac62 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -115,10 +115,10 @@ class AddEmailAddressDialog extends React.Component {
 
   render() {
     const { errors, formData, showErrors, step } = this.state;
-    const { root: { settings } } = this.props;
+    const { root: { settings }, showAddEmailDialog } = this.props;
 
     return (
-      <Dialog className={styles.dialog} open={true}>
+      <Dialog className={styles.dialog} open={showAddEmailDialog}>
         {step === 0 && (
           <AddEmailContent
             formData={formData}
@@ -129,10 +129,15 @@ class AddEmailAddressDialog extends React.Component {
           />
         )}
         {step === 1 &&
-          !settings.requireEmailConfirmation && <EmailAddressAdded />}
+          !settings.requireEmailConfirmation && (
+            <EmailAddressAdded done={() => {}} />
+          )}
         {step === 1 &&
           settings.requireEmailConfirmation && (
-            <VerifyEmailAddress emailAddress={formData.emailAddress} />
+            <VerifyEmailAddress
+              emailAddress={formData.emailAddress}
+              done={() => {}}
+            />
           )}
       </Dialog>
     );
@@ -143,6 +148,7 @@ AddEmailAddressDialog.propTypes = {
   attachLocalAuth: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
   root: PropTypes.object.isRequired,
+  showAddEmailDialog: PropTypes.bool.isRequired,
 };
 
 export default AddEmailAddressDialog;
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index 40edeea2a..0d3411ff3 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -72,7 +72,7 @@ const AddEmailContent = ({
       />
       <InputField
         id="confirmPassword"
-        label="Insert Password"
+        label="Insert Password:"
         name="confirmPassword"
         type="password"
         onChange={onChange}
@@ -83,9 +83,14 @@ const AddEmailContent = ({
         columnDisplay
         showSuccess={false}
       />
-      <a className={cn(styles.button, styles.proceed)} onClick={confirmChanges}>
-        Add Email Address
-      </a>
+      <div className={styles.actions}>
+        <a
+          className={cn(styles.button, styles.proceed)}
+          onClick={confirmChanges}
+        >
+          Add Email Address
+        </a>
+      </div>
     </form>
   </div>
 );
diff --git a/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
index 9d3e875d5..ef74f4b8b 100644
--- a/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
+++ b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
@@ -1,7 +1,9 @@
 import React from 'react';
+import cn from 'classnames';
+import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
 
-const EmailAddressAdded = () => (
+const EmailAddressAdded = ({ done }) => (
   <div>
     <h4 className={styles.title}>Email Address Added</h4>
     <p className={styles.description}>
@@ -12,7 +14,16 @@ const EmailAddressAdded = () => (
       You can change your account settings by visiting{' '}
       <strong>My Profile {'>'} Settings</strong>.
     </p>
+    <div className={styles.actions}>
+      <a className={cn(styles.button, styles.proceed)} onClick={done}>
+        Done
+      </a>
+    </div>
   </div>
 );
 
+EmailAddressAdded.propTypes = {
+  done: PropTypes.func.isRequired,
+};
+
 export default EmailAddressAdded;
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.css b/plugins/talk-plugin-local-auth/client/components/InputField.css
index cd6015e47..befc94f18 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.css
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.css
@@ -42,10 +42,11 @@
 }
 
 .detailLabel {
-  color: #4C4C4D;
+  color: #4c4c4d;
   font-size: 1em;
   display: block;
   margin-bottom: 4px;
+  font-weight: bold;
 }
 
 .detailValue {
diff --git a/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
index 8d9d207b7..9a3e6ae89 100644
--- a/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
+++ b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
@@ -1,8 +1,9 @@
 import React from 'react';
+import cn from 'classnames';
 import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
 
-const VerifyEmailAddress = ({ emailAddress }) => (
+const VerifyEmailAddress = ({ emailAddress, done }) => (
   <div>
     <h4 className={styles.title}>Verify Your Email Address</h4>
     <p className={styles.description}>
@@ -10,11 +11,17 @@ const VerifyEmailAddress = ({ emailAddress }) => (
       verify your email address so that it can be used for account change
       confirmations and notifications.
     </p>
+    <div className={styles.actions}>
+      <a className={cn(styles.button, styles.proceed)} onClick={done}>
+        Done
+      </a>
+    </div>
   </div>
 );
 
 VerifyEmailAddress.propTypes = {
-  emailAddress: PropTypes.string,
+  emailAddress: PropTypes.string.isRequired,
+  done: PropTypes.func.isRequired,
 };
 
 export default VerifyEmailAddress;
diff --git a/plugins/talk-plugin-local-auth/client/constants.js b/plugins/talk-plugin-local-auth/client/constants.js
new file mode 100644
index 000000000..927816e0e
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/constants.js
@@ -0,0 +1,4 @@
+const prefix = 'TALK_AUTH_LOCAL';
+
+export const SHOW_ADD_EMAIL_DIALOG = `${prefix}_SHOW_ADD_EMAIL_DIALOG`;
+export const HIDE_ADD_EMAIL_DIALOG = `${prefix}_HIDE_ADD_EMAIL_DIALOG`;
diff --git a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
index 9732383ce..62c637d71 100644
--- a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
@@ -22,8 +22,12 @@ const withData = withFragments({
   `,
 });
 
+const mapStateToProps = ({ talkPluginLocalAuth: state }) => ({
+  showAddEmailDialog: state.showAddEmailDialog,
+});
+
 export default compose(
-  connect(null, mapDispatchToProps),
+  connect(mapStateToProps, mapDispatchToProps),
   withAttachLocalAuth,
   withData
 )(AddEmailAddressDialog);
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index ce5816583..126ea72c6 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -2,8 +2,10 @@ import ChangePassword from './containers/ChangePassword';
 import AddEmailAddressDialog from './containers/AddEmailAddressDialog';
 import Profile from './containers/Profile';
 import translations from './translations.yml';
+import reducer from './reducer';
 
 export default {
+  reducer,
   translations,
   slots: {
     profileHeader: [Profile],
diff --git a/plugins/talk-plugin-local-auth/client/reducer.js b/plugins/talk-plugin-local-auth/client/reducer.js
new file mode 100644
index 000000000..586bbf759
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/reducer.js
@@ -0,0 +1,22 @@
+import * as actions from './constants';
+
+const initialState = {
+  showAddEmailDialog: true,
+};
+
+export default function reducer(state = initialState, action) {
+  switch (action.type) {
+    case actions.SHOW_ADD_EMAIL_DIALOG:
+      return {
+        ...state,
+        showAddEmailDialog: true,
+      };
+    case actions.HIDE_ADD_EMAIL_DIALOG:
+      return {
+        ...state,
+        showAddEmailDialog: false,
+      };
+    default:
+      return state;
+  }
+}

From a649bd8252528472985b0d35ae073928ee7fb008 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 2 May 2018 21:01:08 -0300
Subject: [PATCH 060/160] done - but translations

---
 .../talk-plugin-local-auth/client/actions.js  |  9 --------
 .../client/constants.js                       |  4 ----
 .../containers/AddEmailAddressDialog.js       | 11 ++++------
 .../talk-plugin-local-auth/client/index.js    |  2 --
 .../talk-plugin-local-auth/client/reducer.js  | 22 -------------------
 5 files changed, 4 insertions(+), 44 deletions(-)
 delete mode 100644 plugins/talk-plugin-local-auth/client/actions.js
 delete mode 100644 plugins/talk-plugin-local-auth/client/constants.js
 delete mode 100644 plugins/talk-plugin-local-auth/client/reducer.js

diff --git a/plugins/talk-plugin-local-auth/client/actions.js b/plugins/talk-plugin-local-auth/client/actions.js
deleted file mode 100644
index 4786b92c8..000000000
--- a/plugins/talk-plugin-local-auth/client/actions.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import * as actions from './constants';
-
-export const showAddEmailDialog = () => ({
-  type: actions.SHOW_ADD_EMAIL_DIALOG,
-});
-
-export const hideAddEmailDialog = () => ({
-  type: actions.HIDE_ADD_EMAIL_DIALOG,
-});
diff --git a/plugins/talk-plugin-local-auth/client/constants.js b/plugins/talk-plugin-local-auth/client/constants.js
deleted file mode 100644
index 927816e0e..000000000
--- a/plugins/talk-plugin-local-auth/client/constants.js
+++ /dev/null
@@ -1,4 +0,0 @@
-const prefix = 'TALK_AUTH_LOCAL';
-
-export const SHOW_ADD_EMAIL_DIALOG = `${prefix}_SHOW_ADD_EMAIL_DIALOG`;
-export const HIDE_ADD_EMAIL_DIALOG = `${prefix}_HIDE_ADD_EMAIL_DIALOG`;
diff --git a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
index 62c637d71..7ab887183 100644
--- a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
@@ -1,6 +1,6 @@
 import { compose, gql } from 'react-apollo';
 import { bindActionCreators } from 'redux';
-import { connect, withFragments } from 'plugin-api/beta/client/hocs';
+import { connect, withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
 import AddEmailAddressDialog from '../components/AddEmailAddressDialog';
 import { notify } from 'coral-framework/actions/notification';
 
@@ -22,12 +22,9 @@ const withData = withFragments({
   `,
 });
 
-const mapStateToProps = ({ talkPluginLocalAuth: state }) => ({
-  showAddEmailDialog: state.showAddEmailDialog,
-});
-
 export default compose(
-  connect(mapStateToProps, mapDispatchToProps),
+  connect(null, mapDispatchToProps),
   withAttachLocalAuth,
-  withData
+  withData,
+  excludeIf(({ root: { me } }) => !me || me.email)
 )(AddEmailAddressDialog);
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index 126ea72c6..ce5816583 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -2,10 +2,8 @@ import ChangePassword from './containers/ChangePassword';
 import AddEmailAddressDialog from './containers/AddEmailAddressDialog';
 import Profile from './containers/Profile';
 import translations from './translations.yml';
-import reducer from './reducer';
 
 export default {
-  reducer,
   translations,
   slots: {
     profileHeader: [Profile],
diff --git a/plugins/talk-plugin-local-auth/client/reducer.js b/plugins/talk-plugin-local-auth/client/reducer.js
deleted file mode 100644
index 586bbf759..000000000
--- a/plugins/talk-plugin-local-auth/client/reducer.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as actions from './constants';
-
-const initialState = {
-  showAddEmailDialog: true,
-};
-
-export default function reducer(state = initialState, action) {
-  switch (action.type) {
-    case actions.SHOW_ADD_EMAIL_DIALOG:
-      return {
-        ...state,
-        showAddEmailDialog: true,
-      };
-    case actions.HIDE_ADD_EMAIL_DIALOG:
-      return {
-        ...state,
-        showAddEmailDialog: false,
-      };
-    default:
-      return state;
-  }
-}

From fff6e1c2317e581befdb1c252fde1ba56022ef5f Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 10:24:43 -0300
Subject: [PATCH 061/160] Review changes

---
 client/coral-framework/graphql/mutations.js | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 19d133872..cc6b35fa6 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -1,6 +1,7 @@
 import { gql } from 'react-apollo';
 import withMutation from '../hocs/withMutation';
 import update from 'immutability-helper';
+import moment from 'moment';
 
 function convertItemType(item_type) {
   switch (item_type) {
@@ -658,7 +659,7 @@ export const withRequestAccountDeletion = withMutation(
         return mutate({
           variables: {},
           update: proxy => {
-            const CancelAccountDeletionQuery = gql`
+            const RequestAccountDeletionQuery = gql`
               query Talk_CancelAccountDeletion {
                 me {
                   id
@@ -667,16 +668,22 @@ export const withRequestAccountDeletion = withMutation(
               }
             `;
 
-            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
+            const prev = proxy.readQuery({
+              query: RequestAccountDeletionQuery,
+            });
+
+            const scheduledDeletionDate = moment()
+              .add(12, 'hours')
+              .toDate();
 
             const data = update(prev, {
               me: {
-                scheduledDeletionDate: { $set: new Date() },
+                scheduledDeletionDate: { $set: scheduledDeletionDate },
               },
             });
 
             proxy.writeQuery({
-              query: CancelAccountDeletionQuery,
+              query: RequestAccountDeletionQuery,
               data,
             });
           },

From a9132c13539dc6ef2c6f401970ed5ea7865c2d26 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 11:07:58 -0300
Subject: [PATCH 062/160] stream fragment

---
 .../coral-embed-stream/src/tabs/stream/containers/Stream.js  | 1 +
 .../client/components/AddEmailAddressDialog.js               | 5 ++---
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
index 0a7a1951c..17d3132ea 100644
--- a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
+++ b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
@@ -372,6 +372,7 @@ const slots = [
   'streamTabsPrepend',
   'streamTabPanes',
   'streamFilter',
+  'stream',
 ];
 
 const fragments = {
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index 253e3ac62..691915c0f 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -115,10 +115,10 @@ class AddEmailAddressDialog extends React.Component {
 
   render() {
     const { errors, formData, showErrors, step } = this.state;
-    const { root: { settings }, showAddEmailDialog } = this.props;
+    const { root: { settings } } = this.props;
 
     return (
-      <Dialog className={styles.dialog} open={showAddEmailDialog}>
+      <Dialog className={styles.dialog} open={true}>
         {step === 0 && (
           <AddEmailContent
             formData={formData}
@@ -148,7 +148,6 @@ AddEmailAddressDialog.propTypes = {
   attachLocalAuth: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
   root: PropTypes.object.isRequired,
-  showAddEmailDialog: PropTypes.bool.isRequired,
 };
 
 export default AddEmailAddressDialog;

From a42135c3bb6067e44264833283bf0219c6b5e822 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 08:39:34 -0600
Subject: [PATCH 063/160] merge bug

---
 .../server/mutators.js                        | 30 ++++++++-----------
 1 file changed, 13 insertions(+), 17 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index b1756a34b..d3785c951 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -129,6 +129,17 @@ async function cancelDeletion({ user, connectors: { models: { User } } }) {
   );
 }
 
+// downloadUser will return the download file url that can be used to directly
+// download the archive.
+async function downloadUser(ctx, userID) {
+  if (ctx.user.role !== 'ADMIN') {
+    throw new ErrNotAuthorized();
+  }
+
+  const { downloadFileURL } = await generateDownloadLinks(ctx, userID);
+  return downloadFileURL;
+}
+
 module.exports = ctx =>
   ctx.user
     ? {
@@ -136,6 +147,7 @@ module.exports = ctx =>
           requestDownloadLink: () => sendDownloadLink(ctx),
           requestDeletion: () => requestDeletion(ctx),
           cancelDeletion: () => cancelDeletion(ctx),
+          download: userID => downloadUser(ctx, userID),
         },
       }
     : {
@@ -143,22 +155,6 @@ module.exports = ctx =>
           requestDownloadLink: () => Promise.reject(new ErrNotAuthorized()),
           requestDeletion: () => Promise.reject(new ErrNotAuthorized()),
           cancelDeletion: () => Promise.reject(new ErrNotAuthorized()),
+          download: () => Promise.reject(new ErrNotAuthorized()),
         },
       };
-// downloadUser will return the download file url that can be used to directly
-// download the archive.
-async function downloadUser(ctx, userID) {
-  const { downloadFileURL } = await generateDownloadLinks(ctx, userID);
-  return downloadFileURL;
-}
-
-module.exports = ctx => ({
-  User: {
-    requestDownloadLink: () => sendDownloadLink(ctx),
-    download:
-      // Only ADMIN users can execute an account download.
-      ctx.user && ctx.user.role === 'ADMIN'
-        ? userID => downloadUser(ctx, userID)
-        : () => Promise.reject(new ErrNotAuthorized()),
-  },
-});

From 225a04fed1473c60e98e37d68a67de4556da2f94 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 10:53:16 -0400
Subject: [PATCH 064/160] Copy fixes

---
 .../client/components/DeleteMyAccountFinalStep.js        | 9 ++-------
 .../client/components/DeleteMyAccountStep1.js            | 2 +-
 .../client/components/DeleteMyAccountStep3.js            | 2 +-
 3 files changed, 4 insertions(+), 9 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index ccbbf61fa..4cda90347 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -22,10 +22,8 @@ const DeleteMyAccountFinalStep = props => (
     </div>
 
     <p className={styles.description}>
-      <strong>Changed your mind?</strong> Simply sign in to your account again
-      before this time and click “<strong>
-        Cancel Account Deletion Request.
-      </strong>”
+      <strong>Changed your mind?</strong> Simply go to your account again before
+      this time and click “<strong>Cancel Account Deletion Request.</strong>”
     </p>
 
     <p className={styles.description}>
@@ -41,9 +39,6 @@ const DeleteMyAccountFinalStep = props => (
       >
         Done
       </Button>
-      <span className={styles.note}>
-        Note: You will be immediately signed out of your account.
-      </span>
     </div>
   </div>
 );
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
index e74611b05..ace020c65 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
@@ -15,7 +15,7 @@ const DeleteMyAccountStep1 = props => (
       Can I still write comments until my account is deleted?{' '}
     </h4>
     <p className={styles.description}>
-      No. Once youve requested account deletion, you can no longer write
+      No. Once you have requested account deletion, you can no longer write
       comments, reply to comments, or select reactions.
     </p>
     <div className={cn(styles.actions)}>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
index 3205cd225..4c87bbcf2 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
@@ -56,7 +56,7 @@ class DeleteMyAccountStep3 extends React.Component {
         />
         <InputField
           id="confirmPhrase"
-          label={'Type phrase bellow to confirm'}
+          label={'Type phrase below to confirm'}
           name="confirmPhrase"
           type="text"
           onChange={this.props.onChange}

From 87d0c99558039994220a12c6b6040e45e1525454 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 08:59:26 -0600
Subject: [PATCH 065/160] moved hoc's into plugin

---
 client/coral-framework/graphql/mutations.js   | 110 ------------------
 plugin-api/beta/client/hocs/index.js          |   3 -
 .../AccountDeletionRequestedSign.js           |   2 +-
 .../client/containers/DeleteMyAccount.js      |   2 +-
 .../client/mutations.js                       | 104 ++++++++++++++++-
 5 files changed, 101 insertions(+), 120 deletions(-)

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index cc6b35fa6..228911d4a 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -1,7 +1,6 @@
 import { gql } from 'react-apollo';
 import withMutation from '../hocs/withMutation';
 import update from 'immutability-helper';
-import moment from 'moment';
 
 function convertItemType(item_type) {
   switch (item_type) {
@@ -645,115 +644,6 @@ export const withChangePassword = withMutation(
   }
 );
 
-export const withRequestAccountDeletion = withMutation(
-  gql`
-    mutation RequestAccountDeletion {
-      requestAccountDeletion {
-        ...RequestAccountDeletionResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      requestAccountDeletion: () => {
-        return mutate({
-          variables: {},
-          update: proxy => {
-            const RequestAccountDeletionQuery = gql`
-              query Talk_CancelAccountDeletion {
-                me {
-                  id
-                  scheduledDeletionDate
-                }
-              }
-            `;
-
-            const prev = proxy.readQuery({
-              query: RequestAccountDeletionQuery,
-            });
-
-            const scheduledDeletionDate = moment()
-              .add(12, 'hours')
-              .toDate();
-
-            const data = update(prev, {
-              me: {
-                scheduledDeletionDate: { $set: scheduledDeletionDate },
-              },
-            });
-
-            proxy.writeQuery({
-              query: RequestAccountDeletionQuery,
-              data,
-            });
-          },
-        });
-      },
-    }),
-  }
-);
-
-export const withRequestDownloadLink = withMutation(
-  gql`
-    mutation RequestDownloadLink {
-      requestDownloadLink {
-        ...RequestDownloadLinkResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      requestDownloadLink: () => {
-        return mutate({
-          variables: {},
-        });
-      },
-    }),
-  }
-);
-
-export const withCancelAccountDeletion = withMutation(
-  gql`
-    mutation RequestDownloadLink {
-      cancelAccountDeletion {
-        ...CancelAccountDeletionResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      cancelAccountDeletion: () => {
-        return mutate({
-          variables: {},
-          update: proxy => {
-            const CancelAccountDeletionQuery = gql`
-              query Talk_CancelAccountDeletion {
-                me {
-                  id
-                  scheduledDeletionDate
-                }
-              }
-            `;
-
-            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
-
-            const data = update(prev, {
-              me: {
-                scheduledDeletionDate: { $set: null },
-              },
-            });
-
-            proxy.writeQuery({
-              query: CancelAccountDeletionQuery,
-              data,
-            });
-          },
-        });
-      },
-    }),
-  }
-);
-
 export const withUpdateAssetSettings = withMutation(
   gql`
     mutation UpdateAssetSettings($id: ID!, $input: AssetSettingsInput!) {
diff --git a/plugin-api/beta/client/hocs/index.js b/plugin-api/beta/client/hocs/index.js
index e86c96606..d7ca5fce9 100644
--- a/plugin-api/beta/client/hocs/index.js
+++ b/plugin-api/beta/client/hocs/index.js
@@ -25,9 +25,6 @@ export {
   withUnbanUser,
   withStopIgnoringUser,
   withSetCommentStatus,
-  withRequestAccountDeletion,
-  withRequestDownloadLink,
-  withCancelAccountDeletion,
   withChangePassword,
   withChangeUsername,
 } from 'coral-framework/graphql/mutations';
diff --git a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
index 9ac152743..9866045a3 100644
--- a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
@@ -3,7 +3,7 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
 import AccountDeletionRequestedSign from '../components/AccountDeletionRequestedSign';
 import { notify } from 'coral-framework/actions/notification';
-import { withCancelAccountDeletion } from 'plugin-api/beta/client/hocs';
+import { withCancelAccountDeletion } from '../mutations';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
index a9c033853..84d0b9a5c 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
@@ -6,7 +6,7 @@ import { notify } from 'coral-framework/actions/notification';
 import {
   withRequestAccountDeletion,
   withCancelAccountDeletion,
-} from 'plugin-api/beta/client/hocs';
+} from '../mutations';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/mutations.js
index a370c9ff0..d39802808 100644
--- a/plugins/talk-plugin-profile-data/client/mutations.js
+++ b/plugins/talk-plugin-profile-data/client/mutations.js
@@ -1,19 +1,113 @@
 import { withMutation } from 'plugin-api/beta/client/hocs';
 import { gql } from 'react-apollo';
+import update from 'immutability-helper';
+import moment from 'moment';
 
 export const withRequestDownloadLink = withMutation(
   gql`
-    mutation DownloadCommentHistory {
+    mutation RequestDownloadLink {
       requestDownloadLink {
-        errors {
-          translation_key
-        }
+        ...RequestDownloadLinkResponse
       }
     }
   `,
   {
     props: ({ mutate }) => ({
-      requestDownloadLink: () => mutate({ variables: {} }),
+      requestDownloadLink: () => {
+        return mutate({
+          variables: {},
+        });
+      },
+    }),
+  }
+);
+
+export const withRequestAccountDeletion = withMutation(
+  gql`
+    mutation RequestAccountDeletion {
+      requestAccountDeletion {
+        ...RequestAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      requestAccountDeletion: () => {
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const RequestAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({
+              query: RequestAccountDeletionQuery,
+            });
+
+            const scheduledDeletionDate = moment()
+              .add(12, 'hours')
+              .toDate();
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: scheduledDeletionDate },
+              },
+            });
+
+            proxy.writeQuery({
+              query: RequestAccountDeletionQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);
+
+export const withCancelAccountDeletion = withMutation(
+  gql`
+    mutation RequestDownloadLink {
+      cancelAccountDeletion {
+        ...CancelAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      cancelAccountDeletion: () => {
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const CancelAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: null },
+              },
+            });
+
+            proxy.writeQuery({
+              query: CancelAccountDeletionQuery,
+              data,
+            });
+          },
+        });
+      },
     }),
   }
 );

From ee0f734705b1c423088457b85b0ecd7073667fea Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 09:13:44 -0600
Subject: [PATCH 066/160] cleaned up download mutations

---
 client/coral-framework/graphql/fragments.js   |  3 ---
 plugin-api/beta/client/utils/index.js         |  1 +
 .../components/DownloadCommentHistory.js      | 22 ++++++++++++++-----
 .../containers/DownloadCommentHistory.js      |  9 +++++++-
 .../client/graphql.js                         | 10 ++++++++-
 .../client/mutations.js                       |  6 +----
 6 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/client/coral-framework/graphql/fragments.js b/client/coral-framework/graphql/fragments.js
index 94021d133..c5704f719 100644
--- a/client/coral-framework/graphql/fragments.js
+++ b/client/coral-framework/graphql/fragments.js
@@ -26,9 +26,6 @@ export default {
     'UpdateAssetSettingsResponse',
     'UpdateAssetStatusResponse',
     'UpdateSettingsResponse',
-    'RequestAccountDeletionResponse',
-    'RequestDownloadLinkResponse',
-    'CancelAccountDeletionResponse',
     'ChangePasswordResponse'
   ),
 };
diff --git a/plugin-api/beta/client/utils/index.js b/plugin-api/beta/client/utils/index.js
index 3fe742569..aeb9841f9 100644
--- a/plugin-api/beta/client/utils/index.js
+++ b/plugin-api/beta/client/utils/index.js
@@ -8,4 +8,5 @@ export {
   getErrorMessages,
   getDefinitionName,
   getShallowChanges,
+  createDefaultResponseFragments,
 } from 'coral-framework/utils';
diff --git a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
index 06fa1fa89..398e2a640 100644
--- a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { t } from 'plugin-api/beta/client/services';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DownloadCommentHistory.css';
+import { getErrorMessages } from 'coral-framework/utils';
 
 export const readableDuration = durAsHours => {
   const durAsDays = Math.ceil(durAsHours / 24);
@@ -19,14 +20,25 @@ export const readableDuration = durAsHours => {
 class DownloadCommentHistory extends Component {
   static propTypes = {
     requestDownloadLink: PropTypes.func.isRequired,
+    notify: PropTypes.func.isRequired,
     root: PropTypes.object.isRequired,
   };
 
+  requestDownloadLink = async () => {
+    const { requestDownloadLink, notify } = this.props;
+    try {
+      await requestDownloadLink();
+      notify(
+        'success',
+        'Account Download Preparing - Check your email shortly for a download link'
+      );
+    } catch (err) {
+      notify('error', getErrorMessages(err));
+    }
+  };
+
   render() {
-    const {
-      root: { me: { lastAccountDownload } },
-      requestDownloadLink,
-    } = this.props;
+    const { root: { me: { lastAccountDownload } } } = this.props;
 
     const now = new Date();
     const lastAccountDownloadDate =
@@ -52,7 +64,7 @@ class DownloadCommentHistory extends Component {
           </p>
         )}
         {canRequestDownload ? (
-          <Button className={styles.button} onClick={requestDownloadLink}>
+          <Button className={styles.button} onClick={this.requestDownloadLink}>
             <i className="material-icons" aria-hidden={true}>
               file_download
             </i>{' '}
diff --git a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
index 96dbf6975..f4b69b8fd 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
@@ -1,27 +1,34 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import { bindActionCreators } from 'redux';
 import { compose, gql } from 'react-apollo';
 import DownloadCommentHistory from '../components/DownloadCommentHistory';
-import { withFragments } from 'plugin-api/beta/client/hocs';
+import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import { withRequestDownloadLink } from '../mutations';
+import { notify } from 'coral-framework/actions/notification';
 
 class DownloadCommentHistoryContainer extends Component {
   static propTypes = {
     requestDownloadLink: PropTypes.func.isRequired,
     root: PropTypes.object.isRequired,
+    notify: PropTypes.func.isRequired,
   };
 
   render() {
     return (
       <DownloadCommentHistory
         root={this.props.root}
+        notify={this.props.notify}
         requestDownloadLink={this.props.requestDownloadLink}
       />
     );
   }
 }
 
+const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
+
 const enhance = compose(
+  connect(null, mapDispatchToProps),
   withFragments({
     root: gql`
       fragment TalkDownloadCommentHistory_DownloadCommentHistorySection_root on RootQuery {
diff --git a/plugins/talk-plugin-profile-data/client/graphql.js b/plugins/talk-plugin-profile-data/client/graphql.js
index b24c31568..e0c459f7e 100644
--- a/plugins/talk-plugin-profile-data/client/graphql.js
+++ b/plugins/talk-plugin-profile-data/client/graphql.js
@@ -1,8 +1,16 @@
 import update from 'immutability-helper';
+import { createDefaultResponseFragments } from 'coral-framework/utils';
 
 export default {
+  fragments: {
+    ...createDefaultResponseFragments(
+      'RequestAccountDeletionResponse',
+      'RequestDownloadLinkResponse',
+      'CancelAccountDeletionResponse'
+    ),
+  },
   mutations: {
-    DownloadCommentHistory: () => ({
+    RequestDownloadLink: () => ({
       updateQueries: {
         CoralEmbedStream_Profile: previousData =>
           update(previousData, {
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/mutations.js
index d39802808..3ae0d88f7 100644
--- a/plugins/talk-plugin-profile-data/client/mutations.js
+++ b/plugins/talk-plugin-profile-data/client/mutations.js
@@ -13,11 +13,7 @@ export const withRequestDownloadLink = withMutation(
   `,
   {
     props: ({ mutate }) => ({
-      requestDownloadLink: () => {
-        return mutate({
-          variables: {},
-        });
-      },
+      requestDownloadLink: () => mutate({}),
     }),
   }
 );

From 51847cf955015c088f250580d68a93fffc72fd85 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 09:26:48 -0600
Subject: [PATCH 067/160] Updated copy for delete

---
 .../components/AccountDeletionRequestedSign.js   | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index a26d28d21..2e07dc28b 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
+import moment from 'moment';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './AccountDeletionRequestedSign.css';
 import { getErrorMessages } from 'coral-framework/utils';
@@ -20,6 +21,15 @@ class AccountDeletionRequestedSign extends React.Component {
   };
 
   render() {
+    const { me: { scheduledDeletionDate } } = this.props.root;
+
+    const deletionScheduledFor = moment(scheduledDeletionDate).format(
+      'MMM Do YYYY, h:mm:ss a'
+    );
+    const deletionScheduledOn = moment(scheduledDeletionDate)
+      .subtract(12, 'hours')
+      .format('MMM Do YYYY, h:mm:ss a');
+
     return (
       <div className={styles.container}>
         <h4 className={styles.title}>
@@ -27,11 +37,13 @@ class AccountDeletionRequestedSign extends React.Component {
           Requested
         </h4>
         <p className={styles.description}>
-          A request to delete your account was received on.
+          A request to delete your account was received on{' '}
+          {deletionScheduledFor}.
         </p>
         <p className={styles.description}>
           If you would like to continue leaving comments, replies or reactions,
-          you may cancel your request to delete your account below before
+          you may cancel your request to delete your account{' '}
+          <b>below before {deletionScheduledOn}</b>.
         </p>
         <div className={styles.actions}>
           <Button

From b995da8301c2ed0b7015ce80a2f357afd4c0da56 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 11:37:48 -0400
Subject: [PATCH 068/160] Unbold a word

---
 .../client/components/AccountDeletionRequestedSign.js         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 2e07dc28b..7da172a31 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -42,8 +42,8 @@ class AccountDeletionRequestedSign extends React.Component {
         </p>
         <p className={styles.description}>
           If you would like to continue leaving comments, replies or reactions,
-          you may cancel your request to delete your account{' '}
-          <b>below before {deletionScheduledOn}</b>.
+          you may cancel your request to delete your account below{' '}
+          <b>before {deletionScheduledOn}</b>.
         </p>
         <div className={styles.actions}>
           <Button

From bab9347d0647ae51ad492eda502afb98ac7ba124 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 09:53:13 -0600
Subject: [PATCH 069/160] adjusted copy

---
 .../client/components/AccountDeletionRequestedSign.js  |  2 +-
 .../client/components/DeleteMyAccount.js               |  1 +
 .../client/components/DeleteMyAccountDialog.js         | 10 +++++++++-
 .../client/components/DeleteMyAccountFinalStep.js      |  6 +++++-
 plugins/talk-plugin-profile-data/client/mutations.js   |  3 ++-
 plugins/talk-plugin-profile-data/server/mutators.js    |  6 +++---
 6 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 7da172a31..31f65ffa7 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -27,7 +27,7 @@ class AccountDeletionRequestedSign extends React.Component {
       'MMM Do YYYY, h:mm:ss a'
     );
     const deletionScheduledOn = moment(scheduledDeletionDate)
-      .subtract(12, 'hours')
+      .subtract(24, 'hours')
       .format('MMM Do YYYY, h:mm:ss a');
 
     return (
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index 9bc5573a1..982437de0 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -55,6 +55,7 @@ class DeleteMyAccount extends React.Component {
           requestAccountDeletion={this.requestAccountDeletion}
           showDialog={this.state.showDialog}
           closeDialog={this.closeDialog}
+          scheduledDeletionDate={scheduledDeletionDate}
         />
         <h3
           className={cn(
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
index 35069384c..bf440f01f 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
@@ -42,6 +42,8 @@ class DeleteMyAccountDialog extends React.Component {
 
   render() {
     const { step } = this.state;
+    const { scheduledDeletionDate } = this.props;
+
     return (
       <Dialog open={this.props.showDialog} className={styles.dialog}>
         <span className={styles.close} onClick={this.cancel}>
@@ -76,7 +78,12 @@ class DeleteMyAccountDialog extends React.Component {
             onChange={this.onChange}
           />
         )}
-        {step === 4 && <DeleteMyAccountFinalStep finish={this.cancel} />}
+        {step === 4 && (
+          <DeleteMyAccountFinalStep
+            scheduledDeletionDate={scheduledDeletionDate}
+            finish={this.cancel}
+          />
+        )}
       </Dialog>
     );
   }
@@ -86,6 +93,7 @@ DeleteMyAccountDialog.propTypes = {
   showDialog: PropTypes.bool.isRequired,
   closeDialog: PropTypes.func.isRequired,
   requestAccountDeletion: PropTypes.func.isRequired,
+  scheduledDeletionDate: PropTypes.string,
 };
 
 export default DeleteMyAccountDialog;
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index 4cda90347..d3604d1ae 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -3,6 +3,7 @@ import cn from 'classnames';
 import PropTypes from 'prop-types';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import moment from 'moment';
 
 const DeleteMyAccountFinalStep = props => (
   <div className={styles.step}>
@@ -17,7 +18,9 @@ const DeleteMyAccountFinalStep = props => (
       </strong>
       <strong className={styles.block}>
         <Icon name="access_time" className={styles.timeIcon} />
-        <span>Account Deletion Date and Time</span>
+        <span>
+          {moment(props.scheduledDeletionDate).format('MMM Do YYYY, h:mm:ss a')}
+        </span>
       </strong>
     </div>
 
@@ -45,6 +48,7 @@ const DeleteMyAccountFinalStep = props => (
 
 DeleteMyAccountFinalStep.propTypes = {
   finish: PropTypes.func.isRequired,
+  scheduledDeletionDate: PropTypes.string.isRequired,
 };
 
 export default DeleteMyAccountFinalStep;
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/mutations.js
index 3ae0d88f7..d2a8881b8 100644
--- a/plugins/talk-plugin-profile-data/client/mutations.js
+++ b/plugins/talk-plugin-profile-data/client/mutations.js
@@ -32,6 +32,7 @@ export const withRequestAccountDeletion = withMutation(
         return mutate({
           variables: {},
           update: proxy => {
+            debugger;
             const RequestAccountDeletionQuery = gql`
               query Talk_CancelAccountDeletion {
                 me {
@@ -46,7 +47,7 @@ export const withRequestAccountDeletion = withMutation(
             });
 
             const scheduledDeletionDate = moment()
-              .add(12, 'hours')
+              .add(24, 'hours')
               .toDate();
 
             const data = update(prev, {
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index d3785c951..c895e51d8 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -93,16 +93,16 @@ async function sendDownloadLink(ctx) {
 }
 
 // requestDeletion will schedule the current user to have their account deleted
-// by setting the `scheduledDeletionDate` on the user 12 hours from now.
+// by setting the `scheduledDeletionDate` on the user 24 hours from now.
 async function requestDeletion({ user, connectors: { models: { User } } }) {
   // Ensure the user doesn't already have a deletion scheduled.
   if (get(user, 'metadata.scheduledDeletionDate')) {
     throw new ErrDeletionAlreadyScheduled();
   }
 
-  // Get the date in the future 12 hours from now.
+  // Get the date in the future 24 hours from now.
   const scheduledDeletionDate = moment()
-    .add(12, 'hours')
+    .add(24, 'hours')
     .toDate();
 
   // Amend the scheduledDeletionDate on the user.

From 12701942c67a5207151ed995aacfaea0a419ba2b Mon Sep 17 00:00:00 2001
From: Cristian <cristian.dean@corp.globo.com>
Date: Thu, 3 May 2018 10:35:48 -0300
Subject: [PATCH 070/160] RECAPTCHA_WINDOW and RECAPTCHA_INCORRECT_TRIGGER now
 can be set with env vars

---
 config.js         | 6 ++++++
 services/users.js | 8 +++++---
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/config.js b/config.js
index a99e08923..7eb7f9280 100644
--- a/config.js
+++ b/config.js
@@ -212,6 +212,12 @@ const CONFIG = {
   RECAPTCHA_PUBLIC: process.env.TALK_RECAPTCHA_PUBLIC,
   RECAPTCHA_SECRET: process.env.TALK_RECAPTCHA_SECRET,
 
+  // RECAPTCHA_WINDOW is the rate limit's time interval
+  RECAPTCHA_WINDOW: process.env.RECAPTCHA_WINDOW || '10m',
+
+  // After RECAPTCHA_INCORRECT_TRIGGER incorrect attempts, recaptcha will be required.
+  RECAPTCHA_INCORRECT_TRIGGER: process.env.RECAPTCHA_INCORRECT_TRIGGER || 5,
+
   // WEBSOCKET_LIVE_URI is the absolute url to the live endpoint.
   WEBSOCKET_LIVE_URI: process.env.TALK_WEBSOCKET_LIVE_URI || null,
 
diff --git a/services/users.js b/services/users.js
index e53df4119..1e84c8ff1 100644
--- a/services/users.js
+++ b/services/users.js
@@ -18,12 +18,14 @@ const {
   ErrCannotIgnoreStaff,
 } = require('../errors');
 const { difference, sample, some, merge, random } = require('lodash');
-const { ROOT_URL } = require('../config');
+const {
+  ROOT_URL,
+  RECAPTCHA_WINDOW,
+  RECAPTCHA_INCORRECT_TRIGGER,
+} = require('../config');
 const { jwt: JWT_SECRET } = require('../secrets');
 const debug = require('debug')('talk:services:users');
 const User = require('../models/user');
-const RECAPTCHA_WINDOW = '10m'; // 10 minutes.
-const RECAPTCHA_INCORRECT_TRIGGER = 5; // after 5 incorrect attempts, recaptcha will be required.
 const Actions = require('./actions');
 const mailer = require('./mailer');
 const i18n = require('./i18n');

From 8fee07a3f85c3b7c5d0c0f54d6a5b47845e58994 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 09:58:49 -0600
Subject: [PATCH 071/160] cleaned up refs to passwor dhash

---
 plugins/talk-plugin-local-auth/server/mutators.js |  3 +--
 services/users.js                                 | 10 +++++++---
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
index cb34bed7a..95ab7cefc 100644
--- a/plugins/talk-plugin-local-auth/server/mutators.js
+++ b/plugins/talk-plugin-local-auth/server/mutators.js
@@ -5,7 +5,6 @@ const {
   ErrIncorrectPassword,
 } = require('./errors');
 const { get } = require('lodash');
-const bcrypt = require('bcryptjs');
 
 // hasLocalProfile checks a user's profiles to see if they already have a local
 // profile associated with their account.
@@ -88,7 +87,7 @@ async function attachUserLocalAuth(ctx, email, password) {
   await Users.isValidPassword(password);
 
   // Hash the new password.
-  const hashedPassword = await bcrypt.hash(password, 10);
+  const hashedPassword = await Users.hashPassword(password);
 
   try {
     // Associate the account with the user.
diff --git a/services/users.js b/services/users.js
index e53df4119..54fe057ba 100644
--- a/services/users.js
+++ b/services/users.js
@@ -557,7 +557,7 @@ class Users {
       throw new ErrPasswordTooShort();
     }
 
-    const hashedPassword = await bcrypt.hash(password, SALT_ROUNDS);
+    const hashedPassword = await Users.hashPassword(password);
 
     return User.update(
       { id },
@@ -634,7 +634,7 @@ class Users {
       Users.isValidPassword(password),
     ]);
 
-    const hashedPassword = await bcrypt.hash(password, SALT_ROUNDS);
+    const hashedPassword = await Users.hashPassword(password);
 
     let user = new User({
       username,
@@ -811,6 +811,10 @@ class Users {
     return { user, redirect, version };
   }
 
+  static async hashPassword(password) {
+    return bcrypt.hash(password, SALT_ROUNDS);
+  }
+
   // TODO: update doc
   static async resetPassword(token, password) {
     const { user, redirect, version } = await this.verifyPasswordResetToken(
@@ -821,7 +825,7 @@ class Users {
       throw new ErrPasswordTooShort();
     }
 
-    const hashedPassword = await bcrypt.hash(password, SALT_ROUNDS);
+    const hashedPassword = await Users.hashPassword(password);
 
     // Update the user's password.
     await User.update(

From 94b3ab4ac848877400ed2c14b158bf3acad266b7 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 12:59:03 -0300
Subject: [PATCH 072/160] translations

---
 .../AccountDeletionRequestedSign.js           | 26 +++++++++++-----
 .../client/components/DeleteMyAccount.js      | 30 +++++++++++--------
 .../client/translations.yml                   | 10 +++++++
 3 files changed, 46 insertions(+), 20 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 7da172a31..dd14bb4f4 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cn from 'classnames';
+import { t } from 'plugin-api/beta/client/services';
 import moment from 'moment';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './AccountDeletionRequestedSign.css';
@@ -13,7 +14,7 @@ class AccountDeletionRequestedSign extends React.Component {
       await cancelAccountDeletion();
       notify(
         'success',
-        'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+        t('talk-plugin-profile-data.delete_request.account_deletion_cancelled')
       );
     } catch (err) {
       notify('error', getErrorMessages(err));
@@ -33,24 +34,33 @@ class AccountDeletionRequestedSign extends React.Component {
     return (
       <div className={styles.container}>
         <h4 className={styles.title}>
-          <Icon name="warning" className={styles.icon} />Account Deletion
-          Requested
+          <Icon name="warning" className={styles.icon} />{' '}
+          {t(
+            'talk-plugin-profile-data.delete_request.account_deletion_requested'
+          )}
         </h4>
         <p className={styles.description}>
-          A request to delete your account was received on{' '}
+          {t('talk-plugin-profile-data.delete_request.received_on')}
           {deletionScheduledFor}.
         </p>
         <p className={styles.description}>
-          If you would like to continue leaving comments, replies or reactions,
-          you may cancel your request to delete your account below{' '}
-          <b>before {deletionScheduledOn}</b>.
+          {t(
+            'talk-plugin-profile-data.delete_request.cancel_request_description'
+          )}
+          <b>
+            {' '}
+            {t('talk-plugin-profile-data.delete_request.before')}{' '}
+            {deletionScheduledOn}
+          </b>.
         </p>
         <div className={styles.actions}>
           <Button
             className={cn(styles.button, styles.secondary)}
             onClick={this.cancelAccountDeletion}
           >
-            Cancel Account Deletion Request
+            {t(
+              'talk-plugin-profile-data.delete_request.cancel_account_deletion_request'
+            )}
           </Button>
         </div>
       </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index 9bc5573a1..28ead86de 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -6,6 +6,7 @@ import styles from './DeleteMyAccount.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import DeleteMyAccountDialog from './DeleteMyAccountDialog';
 import { getErrorMessages } from 'coral-framework/utils';
+import { t } from 'plugin-api/beta/client/services';
 
 const initialState = { showDialog: false };
 
@@ -30,7 +31,7 @@ class DeleteMyAccount extends React.Component {
       await cancelAccountDeletion();
       notify(
         'success',
-        'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+        t('talk-plugin-profile-data.delete_request.account_deletion_requested')
       );
     } catch (err) {
       notify('error', getErrorMessages(err));
@@ -41,7 +42,10 @@ class DeleteMyAccount extends React.Component {
     const { requestAccountDeletion, notify } = this.props;
     try {
       await requestAccountDeletion();
-      notify('success', 'Account Deletion Requested');
+      notify(
+        'success',
+        t('talk-plugin-profile-data.delete_request.account_deletion_requested')
+      );
     } catch (err) {
       notify('error', getErrorMessages(err));
     }
@@ -62,7 +66,7 @@ class DeleteMyAccount extends React.Component {
             'talk-plugin-auth--delete-my-account-description'
           )}
         >
-          Delete My Account
+          {t('talk-plugin-profile-data.delete_request.delete_my_account')}
         </h3>
         <p
           className={cn(
@@ -70,8 +74,9 @@ class DeleteMyAccount extends React.Component {
             'talk-plugin-auth--delete-my-account-description'
           )}
         >
-          Deleting your account will permanently erase your profile and remove
-          all your comments from this site.
+          {t(
+            'talk-plugin-profile-data.delete_request.delete_my_account_description'
+          )}
         </p>
         <p
           className={cn(
@@ -80,18 +85,19 @@ class DeleteMyAccount extends React.Component {
           )}
         >
           {scheduledDeletionDate &&
-            `You have already submitted a request to delete your account.
-          Your account will be deleted on ${moment(
-            scheduledDeletionDate
-          ).format('MMM Do YYYY, h:mm:ss a')}. You may
-          cancel the request until that time`}
+            t(
+              'talk-plugin-profile-data.delete_request.already_submitted_request_description',
+              moment(scheduledDeletionDate).format('MMM Do YYYY, h:mm:ss a')
+            )}
         </p>
         {scheduledDeletionDate ? (
           <Button
             className={cn(styles.button, styles.secondary)}
             onClick={this.cancelAccountDeletion}
           >
-            Cancel Account Deletion Request
+            {t(
+              'talk-plugin-profile-data.delete_request.cancel_account_deletion_request'
+            )}
           </Button>
         ) : (
           <Button
@@ -99,7 +105,7 @@ class DeleteMyAccount extends React.Component {
             icon="delete"
             onClick={this.showDialog}
           >
-            Delete My Account
+            {t('talk-plugin-profile-data.delete_request.delete_my_account')}
           </Button>
         )}
       </div>
diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index ee6dc4e51..e0b275224 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -10,3 +10,13 @@ en:
     days: "{0} days"
     hour: "{0} hour"
     day: "{0} day"
+  delete_request:
+    account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+    account_deletion_requested: 'Account Deletion Requested'
+    received_on: "A request to delete your account was received on "
+    cancel_request_description: "If you would like to continue leaving comments, replies or reactions, you may cancel your request to delete your account below"
+    before: "before"
+    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"
\ No newline at end of file

From 0caa82c1c4ba14783808fc8a5741803f0da3048b Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 11:59:27 -0400
Subject: [PATCH 073/160] Typo

---
 .../client/components/DeleteMyAccountFinalStep.js             | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index d3604d1ae..ebf7200b6 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -30,8 +30,8 @@ const DeleteMyAccountFinalStep = props => (
     </p>
 
     <p className={styles.description}>
-      <strong>Tell us why.</strong> Wed like to know why you chose to delete
-      your account. Send us feedback on our comment system by emailing.
+      <strong>Tell us why.</strong> We would like to know why you chose to
+      delete your account. Send us feedback on our comment system by emailing.
     </p>
 
     <div className={cn(styles.actions, styles.columnView)}>

From 8b35f2300a184254758c79f86debc85348275038 Mon Sep 17 00:00:00 2001
From: Cristian <cristian.dean@corp.globo.com>
Date: Thu, 3 May 2018 13:06:47 -0300
Subject: [PATCH 074/160] Added TALK_ prefix to constants RECAPTCHA_WINDOW and
 RECAPTCHA_INCORRECT_TRIGGER

---
 config.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/config.js b/config.js
index 7eb7f9280..6a1f999a7 100644
--- a/config.js
+++ b/config.js
@@ -213,10 +213,11 @@ const CONFIG = {
   RECAPTCHA_SECRET: process.env.TALK_RECAPTCHA_SECRET,
 
   // RECAPTCHA_WINDOW is the rate limit's time interval
-  RECAPTCHA_WINDOW: process.env.RECAPTCHA_WINDOW || '10m',
+  RECAPTCHA_WINDOW: process.env.TALK_RECAPTCHA_WINDOW || '10m',
 
   // After RECAPTCHA_INCORRECT_TRIGGER incorrect attempts, recaptcha will be required.
-  RECAPTCHA_INCORRECT_TRIGGER: process.env.RECAPTCHA_INCORRECT_TRIGGER || 5,
+  RECAPTCHA_INCORRECT_TRIGGER:
+    process.env.TALK_RECAPTCHA_INCORRECT_TRIGGER || 5,
 
   // WEBSOCKET_LIVE_URI is the absolute url to the live endpoint.
   WEBSOCKET_LIVE_URI: process.env.TALK_WEBSOCKET_LIVE_URI || null,

From 6485b1f080e4c0b81d05ddf5c9ed1e9df000c262 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 10:02:33 -0600
Subject: [PATCH 075/160] added email to final step

---
 .../src/routes/Configure/components/OrganizationSettings.js | 2 +-
 .../client/components/DeleteMyAccount.js                    | 6 +++++-
 .../client/components/DeleteMyAccountDialog.js              | 4 +++-
 .../client/components/DeleteMyAccountFinalStep.js           | 6 +++++-
 .../client/containers/DeleteMyAccount.js                    | 3 +++
 plugins/talk-plugin-profile-data/client/mutations.js        | 1 -
 6 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js
index f3daeffc2..3505ef7b5 100644
--- a/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js
+++ b/client/coral-admin/src/routes/Configure/components/OrganizationSettings.js
@@ -57,7 +57,7 @@ class OrganizationSettings extends React.Component {
     }
 
     const updater = { organizationContactEmail: { $set: email } };
-    const errorUpdater = { organizationEmail: { $set: error } };
+    const errorUpdater = { organizationContactEmail: { $set: error } };
 
     this.props.updatePending({ updater, errorUpdater });
   };
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index 982437de0..dc95c4b9e 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -48,7 +48,10 @@ class DeleteMyAccount extends React.Component {
   };
 
   render() {
-    const { me: { scheduledDeletionDate } } = this.props.root;
+    const {
+      me: { scheduledDeletionDate },
+      settings: { organizationContactEmail },
+    } = this.props.root;
     return (
       <div className="talk-plugin-auth--delete-my-account">
         <DeleteMyAccountDialog
@@ -56,6 +59,7 @@ class DeleteMyAccount extends React.Component {
           showDialog={this.state.showDialog}
           closeDialog={this.closeDialog}
           scheduledDeletionDate={scheduledDeletionDate}
+          organizationContactEmail={organizationContactEmail}
         />
         <h3
           className={cn(
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
index bf440f01f..bd01edcbb 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
@@ -42,7 +42,7 @@ class DeleteMyAccountDialog extends React.Component {
 
   render() {
     const { step } = this.state;
-    const { scheduledDeletionDate } = this.props;
+    const { scheduledDeletionDate, organizationContactEmail } = this.props;
 
     return (
       <Dialog open={this.props.showDialog} className={styles.dialog}>
@@ -81,6 +81,7 @@ class DeleteMyAccountDialog extends React.Component {
         {step === 4 && (
           <DeleteMyAccountFinalStep
             scheduledDeletionDate={scheduledDeletionDate}
+            organizationContactEmail={organizationContactEmail}
             finish={this.cancel}
           />
         )}
@@ -94,6 +95,7 @@ DeleteMyAccountDialog.propTypes = {
   closeDialog: PropTypes.func.isRequired,
   requestAccountDeletion: PropTypes.func.isRequired,
   scheduledDeletionDate: PropTypes.string,
+  organizationContactEmail: PropTypes.string.isRequired,
 };
 
 export default DeleteMyAccountDialog;
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index ebf7200b6..75a0b3aeb 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -31,7 +31,10 @@ const DeleteMyAccountFinalStep = props => (
 
     <p className={styles.description}>
       <strong>Tell us why.</strong> We would like to know why you chose to
-      delete your account. Send us feedback on our comment system by emailing.
+      delete your account. Send us feedback on our comment system by emailing{' '}
+      <a href={`mailto:${props.organizationContactEmail}`}>
+        {props.organizationContactEmail}
+      </a>.
     </p>
 
     <div className={cn(styles.actions, styles.columnView)}>
@@ -49,6 +52,7 @@ const DeleteMyAccountFinalStep = props => (
 DeleteMyAccountFinalStep.propTypes = {
   finish: PropTypes.func.isRequired,
   scheduledDeletionDate: PropTypes.string.isRequired,
+  organizationContactEmail: PropTypes.string.isRequired,
 };
 
 export default DeleteMyAccountFinalStep;
diff --git a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
index 84d0b9a5c..0a81107f5 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
@@ -16,6 +16,9 @@ const withData = withFragments({
       me {
         scheduledDeletionDate
       }
+      settings {
+        organizationContactEmail
+      }
     }
   `,
 });
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/mutations.js
index d2a8881b8..c7ca68950 100644
--- a/plugins/talk-plugin-profile-data/client/mutations.js
+++ b/plugins/talk-plugin-profile-data/client/mutations.js
@@ -32,7 +32,6 @@ export const withRequestAccountDeletion = withMutation(
         return mutate({
           variables: {},
           update: proxy => {
-            debugger;
             const RequestAccountDeletionQuery = gql`
               query Talk_CancelAccountDeletion {
                 me {

From 375f1bb6b1ab2413977ee7bcd711705db39e509c Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 10:07:27 -0600
Subject: [PATCH 076/160] copy fixes

---
 .../AccountDeletionRequestedSign.js           |  4 +--
 .../client/components/DeleteMyAccount.js      | 26 +++++++++----------
 .../components/DeleteMyAccountFinalStep.js    |  2 +-
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 31f65ffa7..f1d85e4e6 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -24,11 +24,11 @@ class AccountDeletionRequestedSign extends React.Component {
     const { me: { scheduledDeletionDate } } = this.props.root;
 
     const deletionScheduledFor = moment(scheduledDeletionDate).format(
-      'MMM Do YYYY, h:mm:ss a'
+      'MMM Do YYYY, h:mm a'
     );
     const deletionScheduledOn = moment(scheduledDeletionDate)
       .subtract(24, 'hours')
-      .format('MMM Do YYYY, h:mm:ss a');
+      .format('MMM Do YYYY, h:mm a');
 
     return (
       <div className={styles.container}>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index dc95c4b9e..1c7c12d16 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -78,19 +78,19 @@ class DeleteMyAccount extends React.Component {
           Deleting your account will permanently erase your profile and remove
           all your comments from this site.
         </p>
-        <p
-          className={cn(
-            styles.description,
-            'talk-plugin-auth--delete-my-account-description'
-          )}
-        >
-          {scheduledDeletionDate &&
-            `You have already submitted a request to delete your account.
-          Your account will be deleted on ${moment(
-            scheduledDeletionDate
-          ).format('MMM Do YYYY, h:mm:ss a')}. You may
-          cancel the request until that time`}
-        </p>
+        {scheduledDeletionDate && (
+          <p
+            className={cn(
+              styles.description,
+              'talk-plugin-auth--delete-my-account-description'
+            )}
+          >
+            You have already submitted a request to delete your account. Your
+            account will be deleted on{' '}
+            {moment(scheduledDeletionDate).format('MMM Do YYYY, h:mm a')}. You
+            may cancel the request until that time.
+          </p>
+        )}
         {scheduledDeletionDate ? (
           <Button
             className={cn(styles.button, styles.secondary)}
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index 75a0b3aeb..72637183c 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -19,7 +19,7 @@ const DeleteMyAccountFinalStep = props => (
       <strong className={styles.block}>
         <Icon name="access_time" className={styles.timeIcon} />
         <span>
-          {moment(props.scheduledDeletionDate).format('MMM Do YYYY, h:mm:ss a')}
+          {moment(props.scheduledDeletionDate).format('MMM Do YYYY, h:mm a')}
         </span>
       </strong>
     </div>

From f6d3f4cb14a8ebb24657bc686068222c550f3fb2 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 13:32:52 -0300
Subject: [PATCH 077/160] translations

---
 .../components/DeleteMyAccountDialog.js       |  5 ++-
 .../components/DeleteMyAccountFinalStep.js    | 31 +++++++++++++------
 .../client/components/DeleteMyAccountStep0.js | 13 ++++----
 .../client/components/DeleteMyAccountStep1.js | 21 +++++++------
 .../client/components/DeleteMyAccountStep2.js | 13 ++++----
 .../client/components/DeleteMyAccountStep3.js | 18 ++++++-----
 .../components/DownloadCommentHistory.js      |  5 +--
 .../client/translations.yml                   | 30 +++++++++++++++++-
 8 files changed, 91 insertions(+), 45 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
index 35069384c..f6ab9c2ce 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
@@ -8,6 +8,7 @@ import DeleteMyAccountStep1 from './DeleteMyAccountStep1';
 import DeleteMyAccountStep2 from './DeleteMyAccountStep2';
 import DeleteMyAccountStep3 from './DeleteMyAccountStep3';
 import DeleteMyAccountFinalStep from './DeleteMyAccountFinalStep';
+import { t } from 'plugin-api/beta/client/services';
 
 const initialState = { step: 0, formData: {} };
 
@@ -47,7 +48,9 @@ class DeleteMyAccountDialog extends React.Component {
         <span className={styles.close} onClick={this.cancel}>
           ×
         </span>
-        <h3 className={styles.title}>Delete My Account</h3>
+        <h3 className={styles.title}>
+          {t('talk-plugin-profile-data.delete_request.delete_my_account')}
+        </h3>
         <StepProgress currentStep={this.state.step} totalSteps={4} />
         {step === 0 && (
           <DeleteMyAccountStep0
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index 4cda90347..22d20167d 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -3,32 +3,45 @@ import cn from 'classnames';
 import PropTypes from 'prop-types';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const DeleteMyAccountFinalStep = props => (
   <div className={styles.step}>
     <p className={styles.description}>
-      Your request has been submitted and confirmation has been sent to the
-      email address associated with your account.
+      {t(
+        'talk-plugin-profile-data.delete_request.your_request_submitted_description'
+      )}
     </p>
 
     <div className={cn(styles.box, styles.scheduledDeletion)}>
       <strong className={styles.block}>
-        Your account is scheduled to be deleted at:
+        {t(
+          'talk-plugin-profile-data.delete_request.your_account_deletion_scheduled'
+        )}
       </strong>
       <strong className={styles.block}>
         <Icon name="access_time" className={styles.timeIcon} />
-        <span>Account Deletion Date and Time</span>
+        <span>{0}</span>
       </strong>
     </div>
 
     <p className={styles.description}>
-      <strong>Changed your mind?</strong> Simply go to your account again before
-      this time and click “<strong>Cancel Account Deletion Request.</strong>”
+      <strong>
+        {' '}
+        {t('talk-plugin-profile-data.delete_request.changed_your_mind')}
+      </strong>{' '}
+      {t('talk-plugin-profile-data.delete_request.simply_go_to')} “<strong>
+        {t(
+          'talk-plugin-profile-data.delete_request.cancel_account_deletion_request'
+        )}.
+      </strong>”
     </p>
 
     <p className={styles.description}>
-      <strong>Tell us why.</strong> Wed like to know why you chose to delete
-      your account. Send us feedback on our comment system by emailing.
+      <strong>
+        {t('talk-plugin-profile-data.delete_request.tell_us_why')}.
+      </strong>{' '}
+      {t('talk-plugin-profile-data.delete_request.feedback_copy')}
     </p>
 
     <div className={cn(styles.actions, styles.columnView)}>
@@ -37,7 +50,7 @@ const DeleteMyAccountFinalStep = props => (
         onClick={props.finish}
         full
       >
-        Done
+        {t('talk-plugin-profile-data.delete_request.done')}
       </Button>
     </div>
   </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js
index 901466d3b..468c96e94 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep0.js
@@ -3,29 +3,30 @@ import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const DeleteMyAccountStep0 = props => (
   <div className={styles.step}>
     <p className={styles.description}>
-      You are attempting to delete your account. This means:
+      {t('talk-plugin-profile-data.delete_request.you_are_attempting')}
     </p>
     <ul className={styles.list}>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          All of your comments are removed from this site
+          {t('talk-plugin-profile-data.delete_request.item_1')}
         </span>
       </li>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          All of your comments are deleted from our database
+          {t('talk-plugin-profile-data.delete_request.item_2')}
         </span>
       </li>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          Your username and email address are removed from our system
+          {t('talk-plugin-profile-data.delete_request.item_3')}
         </span>
       </li>
     </ul>
@@ -34,13 +35,13 @@ const DeleteMyAccountStep0 = props => (
         className={cn(styles.button, styles.cancel)}
         onClick={props.cancel}
       >
-        Cancel
+        {t('talk-plugin-profile-data.delete_request.cancel')}
       </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
       >
-        Proceed
+        {t('talk-plugin-profile-data.delete_request.proceed')}
       </Button>
     </div>
   </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
index ace020c65..7408df688 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
@@ -3,33 +3,34 @@ import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
-    <h4 className={styles.subTitle}>When will my account be deleted?</h4>
-    <p className={styles.description}>
-      Your account will be deleted 24 hours after your request has been
-      submitted.
-    </p>
     <h4 className={styles.subTitle}>
-      Can I still write comments until my account is deleted?{' '}
+      {t('talk-plugin-profile-data.delete_request.step1.subtitle')}
     </h4>
     <p className={styles.description}>
-      No. Once you have requested account deletion, you can no longer write
-      comments, reply to comments, or select reactions.
+      {t('talk-plugin-profile-data.delete_request.step1.description')}
+    </p>
+    <h4 className={styles.subTitle}>
+      {t('talk-plugin-profile-data.delete_request.step1.subtitle_2')}
+    </h4>
+    <p className={styles.description}>
+      {t('talk-plugin-profile-data.delete_request.step1.description_2')}
     </p>
     <div className={cn(styles.actions)}>
       <Button
         className={cn(styles.button, styles.cancel)}
         onClick={props.cancel}
       >
-        Cancel
+        {t('talk-plugin-profile-data.delete_request.cancel')}
       </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
       >
-        Proceed
+        {t('talk-plugin-profile-data.delete_request.proceed')}
       </Button>
     </div>
   </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js
index 8ef14445e..8976c7dcd 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep2.js
@@ -3,18 +3,17 @@ import PropTypes from 'prop-types';
 import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const DeleteMyAccountStep2 = props => (
   <div className={styles.step}>
     <p className={styles.description}>
-      Before your account is deleted, we recommend you download your comment
-      history for your records. After your account is deleted, you will be
-      unable to request your comment history.
+      {t('talk-plugin-profile-data.delete_request.step2.description')}
     </p>
     <p className={styles.description}>
-      To download your comment history go to:
+      {t('talk-plugin-profile-data.delete_request.step2.to_download')}
       <strong className={styles.block}>
-        My Profile {`>`} Download My Comment History
+        {t('talk-plugin-profile-data.delete_request.step2.path')}
       </strong>
     </p>
     <div className={cn(styles.actions)}>
@@ -22,13 +21,13 @@ const DeleteMyAccountStep2 = props => (
         className={cn(styles.button, styles.cancel)}
         onClick={props.cancel}
       >
-        Cancel
+        {t('talk-plugin-profile-data.delete_request.step2.cancel')}
       </Button>
       <Button
         className={cn(styles.button, styles.proceed)}
         onClick={props.goToNextStep}
       >
-        Proceed
+        {t('talk-plugin-profile-data.delete_request.step2.proceed')}
       </Button>
     </div>
   </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
index 4c87bbcf2..dfbe9bf1f 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep3.js
@@ -4,6 +4,7 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 import InputField from './InputField';
+import { t } from 'plugin-api/beta/client/services';
 
 const initialState = {
   showError: false,
@@ -42,11 +43,10 @@ class DeleteMyAccountStep3 extends React.Component {
     return (
       <div className={styles.step}>
         <h4 className={styles.subTitle}>
-          Are you sure you want to delete your account?
+          {t('talk-plugin-profile-data.delete_request.step3.subtitle')}
         </h4>
         <p className={styles.description}>
-          To confirm you would like to delete your account please type in the
-          following phrase into the text box below:
+          {t('talk-plugin-profile-data.delete_request.step3.description')}
         </p>
         <input
           className={styles.textBox}
@@ -56,13 +56,17 @@ class DeleteMyAccountStep3 extends React.Component {
         />
         <InputField
           id="confirmPhrase"
-          label={'Type phrase below to confirm'}
+          label={t(
+            'talk-plugin-profile-data.delete_request.step3.type_to_confirm'
+          )}
           name="confirmPhrase"
           type="text"
           onChange={this.props.onChange}
           defaultValue=""
           hasError={this.formHasError()}
-          errorMsg={'The input is not correct'}
+          errorMsg={t(
+            'talk-plugin-profile-data.delete_request.input_is_not_correct'
+          )}
           showError={this.state.showError}
           columnDisplay
         />
@@ -71,13 +75,13 @@ class DeleteMyAccountStep3 extends React.Component {
             className={cn(styles.button, styles.cancel)}
             onClick={this.props.cancel}
           >
-            Cancel
+            {t('talk-plugin-profile-data.delete_request.cancel')}
           </Button>
           <Button
             className={cn(styles.button, styles.danger)}
             onClick={this.deleteAndContinue}
           >
-            Delete My Account
+            {t('talk-plugin-profile-data.delete_request.delete_my_account')}
           </Button>
         </div>
       </div>
diff --git a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
index 398e2a640..feff6b582 100644
--- a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
@@ -28,10 +28,7 @@ class DownloadCommentHistory extends Component {
     const { requestDownloadLink, notify } = this.props;
     try {
       await requestDownloadLink();
-      notify(
-        'success',
-        'Account Download Preparing - Check your email shortly for a download link'
-      );
+      notify('success', t('download_request.download_preparing'));
     } catch (err) {
       notify('error', getErrorMessages(err));
     }
diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index e0b275224..839154446 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -10,6 +10,7 @@ en:
     days: "{0} days"
     hour: "{0} hour"
     day: "{0} day"
+    download_preparing: "Account Download Preparing - Check your email shortly for a download link"
   delete_request:
     account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
     account_deletion_requested: 'Account Deletion Requested'
@@ -19,4 +20,31 @@ 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"
\ No newline at end of file
+    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"
+    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:"
+    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"
+    feedback_copy: "We'd like to know why you chose to delete your account. Send us feedback on our comment system by emailing."
+    done: "Done"
+    cancel: "Cancel"
+    proceed: "Proceed"
+    input_is_not_correct: "The input is not correct"
+    you_are_attempting: "You are attempting to delete your account. This means:"
+    item_1: "All of your comments are removed from this site"
+    item_2: "All of your comments are deleted from our database"
+    item_3: "Your username and email address are removed from our system"
+    step1:
+      subtitle: "When will my account be deleted?"
+      description: "Your account will be deleted 24 hours after your request has been submitted."
+      subtitle_2: "Can I still write comments until my account is deleted?"
+      description_2: "No. Once you have requested account deletion, you can no longer write comments, reply to comments, or select reactions."
+    step2:
+      description: "Before your account is deleted, we recommend you download your comment history for your records. After your account is deleted, you will be unable to request your comment history."
+      to_download: "To download your comment history go to:"
+      path: "My Profile > Download My Comment History"
+    step3:
+      subtitle: "Are you sure you want to delete your account?"
+      description: "To confirm you would like to delete your account please type in the following phrase into the text box below:"
+      type_to_confirm: "Type phrase below to confirm"

From 0e20ddb2fde76907314eca3aafde9968d5481160 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 10:40:06 -0600
Subject: [PATCH 078/160] added docs

---
 docs/source/02-02-advanced-configuration.md | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/docs/source/02-02-advanced-configuration.md b/docs/source/02-02-advanced-configuration.md
index b2ad29ad0..5b638401d 100644
--- a/docs/source/02-02-advanced-configuration.md
+++ b/docs/source/02-02-advanced-configuration.md
@@ -316,6 +316,18 @@ default to providing only a time based lockout. Refer to
 [reCAPTCHA](https://www.google.com/recaptcha/intro/index.html) for information
 on getting an account setup.
 
+## TALK_RECAPTCHA_WINDOW
+
+The rate limit time interval that there can be [TALK_RECAPTCHA_INCORRECT_TRIGGER](#talk_recaptcha_incorrect_trigger) incorrect attempts until the reCAPTCHA is
+marked as required, parsed by
+[ms](https://www.npmjs.com/package/ms). (Default `10m`)
+
+## TALK_RECAPTCHA_INCORRECT_TRIGGER
+
+The number of times that an incorrect login can be entered before within a time
+perioud indicated by [TALK_RECAPTCHA_WINDOW](#talk_recaptcha_window) until the
+reCAPTCHA is marked as required. (Default `5`)
+
 ## TALK_REDIS_CLIENT_CONFIGURATION
 
 Configuration overrides for the redis client configuration in a JSON encoded
@@ -531,4 +543,4 @@ Sets the logging level for the context logger (from [Bunyan](https://github.com/
 A JSON string representing the configuration passed to the
 [fetch](https://www.npmjs.com/package/node-fetch) call for the scraper. It
 can be used to set an authorization header, or change the user agent. (Default
-`{}`)
\ No newline at end of file
+`{}`)

From 287cff289b8b66b121b99d7418bccf963843ce72 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 13:04:05 -0400
Subject: [PATCH 079/160] Update copy to reflect ability to take action up
 until account is deleted

---
 plugins/talk-plugin-profile-data/client/translations.yml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index 2a0c9e334..c5fbb8485 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -12,10 +12,10 @@ en:
     day: "{0} day"
     download_preparing: "Account Download Preparing - Check your email shortly for a download link"
   delete_request:
-    account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled. You may now write comments, reply to comments, and select reactions.'
+    account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled."'
     account_deletion_requested: 'Account Deletion Requested'
     received_on: "A request to delete your account was received on "
-    cancel_request_description: "If you would like to continue leaving comments, replies or reactions, you may cancel your request to delete your account below"
+    cancel_request_description: "If you would like to reactivate your account, you may cancel your request to delete your account below"
     before: "before"
     cancel_account_deletion_request: "Cancel Account Deletion Request"
     delete_my_account: "Delete My Account"
@@ -40,7 +40,7 @@ en:
       subtitle: "When will my account be deleted?"
       description: "Your account will be deleted 24 hours after your request has been submitted."
       subtitle_2: "Can I still write comments until my account is deleted?"
-      description_2: "No. Once you have requested account deletion, you can no longer write comments, reply to comments, or select reactions."
+      description_2: "Yes, you can still comment, reply, and react to comments until the 24 hours expires."
     step_2:
       description: "Before your account is deleted, we recommend you download your comment history for your records. After your account is deleted, you will be unable to request your comment history."
       to_download: "To download your comment history go to:"

From 06b08756e7b89fa7f8accea5bebc118026bb3b8a Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 11:36:07 -0600
Subject: [PATCH 080/160] added durations to configuration file

---
 .../AccountDeletionRequestedSign.js           |  3 ++-
 .../client/components/DeleteMyAccountStep1.js |  5 ++--
 .../components/DownloadCommentHistory.js      |  6 +++--
 .../client/translations.yml                   |  6 ++---
 plugins/talk-plugin-profile-data/config.json  |  4 +++
 .../server/mutators.js                        | 26 +++++++++++++------
 6 files changed, 34 insertions(+), 16 deletions(-)
 create mode 100644 plugins/talk-plugin-profile-data/config.json

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 60e4d4bc6..e0d5ab255 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -6,6 +6,7 @@ import moment from 'moment';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './AccountDeletionRequestedSign.css';
 import { getErrorMessages } from 'coral-framework/utils';
+import { scheduledDeletionDelayHours } from '../../config.json';
 
 class AccountDeletionRequestedSign extends React.Component {
   cancelAccountDeletion = async () => {
@@ -25,7 +26,7 @@ class AccountDeletionRequestedSign extends React.Component {
       'MMM Do YYYY, h:mm a'
     );
     const deletionScheduledOn = moment(scheduledDeletionDate)
-      .subtract(24, 'hours')
+      .subtract(scheduledDeletionDelayHours, 'hours')
       .format('MMM Do YYYY, h:mm a');
 
     return (
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
index dc137e41e..491c962cf 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
@@ -4,16 +4,17 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 import { t } from 'plugin-api/beta/client/services';
+import { scheduledDeletionDelayHours } from '../../config.json';
 
 const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
     <h4 className={styles.subTitle}>{t('delete_request.step_1.subtitle')}</h4>
     <p className={styles.description}>
-      {t('delete_request.step_1.description')}
+      {t('delete_request.step_1.description', scheduledDeletionDelayHours)}
     </p>
     <h4 className={styles.subTitle}>{t('delete_request.step_1.subtitle_2')}</h4>
     <p className={styles.description}>
-      {t('delete_request.step_1.description_2')}
+      {t('delete_request.step_1.description_2', scheduledDeletionDelayHours)}
     </p>
     <div className={cn(styles.actions)}>
       <Button
diff --git a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
index feff6b582..15279eb18 100644
--- a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
@@ -4,6 +4,7 @@ import { t } from 'plugin-api/beta/client/services';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DownloadCommentHistory.css';
 import { getErrorMessages } from 'coral-framework/utils';
+import { downloadRateLimitDays } from '../../config.json';
 
 export const readableDuration = durAsHours => {
   const durAsDays = Math.ceil(durAsHours / 24);
@@ -42,7 +43,8 @@ class DownloadCommentHistory extends Component {
       lastAccountDownload && new Date(lastAccountDownload);
     const hoursLeft = lastAccountDownloadDate
       ? Math.ceil(
-          7 * 24 - (now.getTime() - lastAccountDownloadDate.getTime()) / 3.6e6
+          downloadRateLimitDays * 24 -
+            (now.getTime() - lastAccountDownloadDate.getTime()) / 3.6e6
         )
       : 0;
     const canRequestDownload = !lastAccountDownloadDate || hoursLeft <= 0;
@@ -52,7 +54,7 @@ class DownloadCommentHistory extends Component {
         <h3>{t('download_request.section_title')}</h3>
         <p>
           {t('download_request.you_will_get_a_copy')}{' '}
-          <b>{t('download_request.download_rate')}</b>.
+          <b>{t('download_request.download_rate', downloadRateLimitDays)}</b>.
         </p>
         {lastAccountDownloadDate && (
           <p className={styles.most_recent}>
diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index c5fbb8485..c830bdeb2 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -2,7 +2,7 @@ en:
   download_request:
     section_title: "Download My Comment History"
     you_will_get_a_copy: "You will recieve an email with a link to download your comment history. You can make"
-    download_rate: "one download request every 7 days"
+    download_rate: "one download request every {0} days"
     most_recent_request: "Your most recent request"
     request: "Request Comment History"
     rate_limit: "You can submit another Comment History request in {0}"
@@ -38,9 +38,9 @@ en:
       item_3: "Your username and email address are removed from our system"
     step_1:
       subtitle: "When will my account be deleted?"
-      description: "Your account will be deleted 24 hours after your request has been submitted."
+      description: "Your account will be deleted {0} hours after your request has been submitted."
       subtitle_2: "Can I still write comments until my account is deleted?"
-      description_2: "Yes, you can still comment, reply, and react to comments until the 24 hours expires."
+      description_2: "Yes, you can still comment, reply, and react to comments until the {0} hours expires."
     step_2:
       description: "Before your account is deleted, we recommend you download your comment history for your records. After your account is deleted, you will be unable to request your comment history."
       to_download: "To download your comment history go to:"
diff --git a/plugins/talk-plugin-profile-data/config.json b/plugins/talk-plugin-profile-data/config.json
new file mode 100644
index 000000000..8b39a5f74
--- /dev/null
+++ b/plugins/talk-plugin-profile-data/config.json
@@ -0,0 +1,4 @@
+{
+  "scheduledDeletionDelayHours": 24,
+  "downloadRateLimitDays": 7
+}
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index c895e51d8..27488320d 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -8,6 +8,10 @@ const {
 } = require('./errors');
 const { ErrNotAuthorized, ErrMaxRateLimit } = require('errors');
 const { URL } = require('url');
+const {
+  scheduledDeletionDelayHours,
+  downloadRateLimitDays,
+} = require('../config.json');
 
 // generateDownloadLinks will generate a signed set of links for a given user to
 // download an archive of their data.
@@ -42,21 +46,26 @@ async function sendDownloadLink(ctx) {
   } = ctx;
 
   // downloadLinkLimiter can be used to limit downloads for the user's data to
-  // once every 7 days.
-  const downloadLinkLimiter = new Limit('profileDataDownloadLimiter', 1, '7d');
+  // once every ${downloadRateLimitDays} days.
+  const downloadLinkLimiter = new Limit(
+    'profileDataDownloadLimiter',
+    1,
+    `${downloadRateLimitDays}d`
+  );
 
   // Check that the user has not already requested a download within the last
-  // 7 days.
+  // ${downloadRateLimitDays} days.
   const attempts = await downloadLinkLimiter.get(user.id);
   if (attempts && attempts >= 1) {
     throw new ErrMaxRateLimit();
   }
 
-  // Check if the lastAccountDownload time is within 7 days.
+  // Check if the lastAccountDownload time is within ${downloadRateLimitDays}
+  // days.
   if (
     user.lastAccountDownload &&
     moment(user.lastAccountDownload)
-      .add(7, 'days')
+      .add(downloadRateLimitDays, 'days')
       .isAfter(moment())
   ) {
     throw new ErrMaxRateLimit();
@@ -93,16 +102,17 @@ async function sendDownloadLink(ctx) {
 }
 
 // requestDeletion will schedule the current user to have their account deleted
-// by setting the `scheduledDeletionDate` on the user 24 hours from now.
+// by setting the `scheduledDeletionDate` on the user
+// ${scheduledDeletionDelayHours} hours from now.
 async function requestDeletion({ user, connectors: { models: { User } } }) {
   // Ensure the user doesn't already have a deletion scheduled.
   if (get(user, 'metadata.scheduledDeletionDate')) {
     throw new ErrDeletionAlreadyScheduled();
   }
 
-  // Get the date in the future 24 hours from now.
+  // Get the date in the future ${scheduledDeletionDelayHours} hours from now.
   const scheduledDeletionDate = moment()
-    .add(24, 'hours')
+    .add(scheduledDeletionDelayHours, 'hours')
     .toDate();
 
   // Amend the scheduledDeletionDate on the user.

From 20c5804559296dacfcba5f15c38197135f3c5af2 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 11:38:23 -0600
Subject: [PATCH 081/160] added space

---
 .../client/components/DeleteMyAccountFinalStep.js               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
index 6e0941d13..289cd6c17 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountFinalStep.js
@@ -33,7 +33,7 @@ const DeleteMyAccountFinalStep = props => (
 
     <p className={styles.description}>
       <strong>{t('delete_request.tell_us_why')}.</strong>{' '}
-      {t('delete_request.feedback_copy')}
+      {t('delete_request.feedback_copy')}{' '}
       <a href={`mailto:${props.organizationContactEmail}`}>
         {props.organizationContactEmail}
       </a>.

From df29e610b37e790aa8a2926cb1f55aa2f7de6314 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 11:40:55 -0600
Subject: [PATCH 082/160] cleaned up config as js instead of json file

---
 .../client/components/AccountDeletionRequestedSign.js         | 2 +-
 .../client/components/DeleteMyAccountStep1.js                 | 2 +-
 .../client/components/DownloadCommentHistory.js               | 2 +-
 plugins/talk-plugin-profile-data/config.js                    | 4 ++++
 plugins/talk-plugin-profile-data/config.json                  | 4 ----
 plugins/talk-plugin-profile-data/server/mutators.js           | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)
 create mode 100644 plugins/talk-plugin-profile-data/config.js
 delete mode 100644 plugins/talk-plugin-profile-data/config.json

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index e0d5ab255..38d968c1d 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
@@ -6,7 +6,7 @@ import moment from 'moment';
 import { Button, Icon } from 'plugin-api/beta/client/components/ui';
 import styles from './AccountDeletionRequestedSign.css';
 import { getErrorMessages } from 'coral-framework/utils';
-import { scheduledDeletionDelayHours } from '../../config.json';
+import { scheduledDeletionDelayHours } from '../../config';
 
 class AccountDeletionRequestedSign extends React.Component {
   cancelAccountDeletion = async () => {
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
index 491c962cf..3d069cfd1 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountStep1.js
@@ -4,7 +4,7 @@ import cn from 'classnames';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DeleteMyAccountStep.css';
 import { t } from 'plugin-api/beta/client/services';
-import { scheduledDeletionDelayHours } from '../../config.json';
+import { scheduledDeletionDelayHours } from '../../config';
 
 const DeleteMyAccountStep1 = props => (
   <div className={styles.step}>
diff --git a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
index 15279eb18..7af15b774 100644
--- a/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/components/DownloadCommentHistory.js
@@ -4,7 +4,7 @@ import { t } from 'plugin-api/beta/client/services';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import styles from './DownloadCommentHistory.css';
 import { getErrorMessages } from 'coral-framework/utils';
-import { downloadRateLimitDays } from '../../config.json';
+import { downloadRateLimitDays } from '../../config';
 
 export const readableDuration = durAsHours => {
   const durAsDays = Math.ceil(durAsHours / 24);
diff --git a/plugins/talk-plugin-profile-data/config.js b/plugins/talk-plugin-profile-data/config.js
new file mode 100644
index 000000000..f0406be75
--- /dev/null
+++ b/plugins/talk-plugin-profile-data/config.js
@@ -0,0 +1,4 @@
+module.exports = {
+  scheduledDeletionDelayHours: 24,
+  downloadRateLimitDays: 7,
+};
diff --git a/plugins/talk-plugin-profile-data/config.json b/plugins/talk-plugin-profile-data/config.json
deleted file mode 100644
index 8b39a5f74..000000000
--- a/plugins/talk-plugin-profile-data/config.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-  "scheduledDeletionDelayHours": 24,
-  "downloadRateLimitDays": 7
-}
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index 27488320d..82e5ede4a 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -11,7 +11,7 @@ const { URL } = require('url');
 const {
   scheduledDeletionDelayHours,
   downloadRateLimitDays,
-} = require('../config.json');
+} = require('../config');
 
 // generateDownloadLinks will generate a signed set of links for a given user to
 // download an archive of their data.

From 64cb66512499a98f933cbe9bcfd5c965f0bc959b Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 14:00:07 -0400
Subject: [PATCH 083/160] typo

---
 plugins/talk-plugin-profile-data/client/translations.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index c830bdeb2..f38958e7f 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -12,7 +12,7 @@ en:
     day: "{0} day"
     download_preparing: "Account Download Preparing - Check your email shortly for a download link"
   delete_request:
-    account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled."'
+    account_deletion_cancelled: 'Account Deletion Request Cancelled - Your request to delete your account has been cancelled.'
     account_deletion_requested: 'Account Deletion Requested'
     received_on: "A request to delete your account was received on "
     cancel_request_description: "If you would like to reactivate your account, you may cancel your request to delete your account below"

From 8a9af896992c12ee9b955c08c05806bf84011f0e Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:12:23 -0300
Subject: [PATCH 084/160] withUpdateEmailAddress in the plugins hoc

---
 client/coral-framework/graphql/mutations.js   | 44 -----------------
 .../client/containers/Profile.js              |  6 +--
 .../client/hocs/index.js                      | 47 +++++++++++++++++++
 3 files changed, 49 insertions(+), 48 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/hocs/index.js

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index 29ec3fc96..228911d4a 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -321,50 +321,6 @@ const SetUsernameFragment = gql`
   }
 `;
 
-export const withUpdateEmailAddress = withMutation(
-  gql`
-    mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
-      updateEmailAddress(input: $input) {
-        ...UpdateEmailAddressResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      updateEmailAddress: input => {
-        return mutate({
-          variables: {
-            input,
-          },
-          update: proxy => {
-            const UpdateEmailAddressQuery = gql`
-              query Talk_UpdateEmailAddress {
-                me {
-                  id
-                  email
-                }
-              }
-            `;
-
-            const prev = proxy.readQuery({ query: UpdateEmailAddressQuery });
-
-            const data = update(prev, {
-              me: {
-                email: { $set: input.email },
-              },
-            });
-
-            proxy.writeQuery({
-              query: UpdateEmailAddressQuery,
-              data,
-            });
-          },
-        });
-      },
-    }),
-  }
-);
-
 export const withChangeUsername = withMutation(
   gql`
     mutation ChangeUsername($id: ID!, $username: String!) {
diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index 239304535..8f442ea43 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -3,10 +3,8 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
-import {
-  withChangeUsername,
-  withUpdateEmailAddress,
-} from 'plugin-api/beta/client/hocs';
+import { withChangeUsername } from 'plugin-api/beta/client/hocs';
+import { withUpdateEmailAddress } from './hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-local-auth/client/hocs/index.js b/plugins/talk-plugin-local-auth/client/hocs/index.js
new file mode 100644
index 000000000..bcd439af2
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/hocs/index.js
@@ -0,0 +1,47 @@
+import { gql } from 'react-apollo';
+import update from 'immutability-helper';
+import withMutation from 'coral-framework/hocs/withMutation';
+
+export const withUpdateEmailAddress = withMutation(
+  gql`
+    mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
+      updateEmailAddress(input: $input) {
+        ...UpdateEmailAddressResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      updateEmailAddress: input => {
+        return mutate({
+          variables: {
+            input,
+          },
+          update: proxy => {
+            const UpdateEmailAddressQuery = gql`
+              query Talk_UpdateEmailAddress {
+                me {
+                  id
+                  email
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: UpdateEmailAddressQuery });
+
+            const data = update(prev, {
+              me: {
+                email: { $set: input.email },
+              },
+            });
+
+            proxy.writeQuery({
+              query: UpdateEmailAddressQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);

From f173f495a5cd6914a8958fddf9858b2e39e2a4c1 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:15:58 -0300
Subject: [PATCH 085/160] moving mutations to /hocs folder

---
 .../client/containers/AccountDeletionRequestedSign.js        | 2 +-
 .../client/containers/DeleteMyAccount.js                     | 5 +----
 .../client/containers/DownloadCommentHistory.js              | 2 +-
 .../client/{mutations.js => hocs/index.js}                   | 0
 4 files changed, 3 insertions(+), 6 deletions(-)
 rename plugins/talk-plugin-profile-data/client/{mutations.js => hocs/index.js} (100%)

diff --git a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
index 9866045a3..ff54198dd 100644
--- a/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
+++ b/plugins/talk-plugin-profile-data/client/containers/AccountDeletionRequestedSign.js
@@ -3,7 +3,7 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
 import AccountDeletionRequestedSign from '../components/AccountDeletionRequestedSign';
 import { notify } from 'coral-framework/actions/notification';
-import { withCancelAccountDeletion } from '../mutations';
+import { withCancelAccountDeletion } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
index 0a81107f5..ac244d8b8 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DeleteMyAccount.js
@@ -3,10 +3,7 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import DeleteMyAccount from '../components/DeleteMyAccount';
 import { notify } from 'coral-framework/actions/notification';
-import {
-  withRequestAccountDeletion,
-  withCancelAccountDeletion,
-} from '../mutations';
+import { withRequestAccountDeletion, withCancelAccountDeletion } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
index f4b69b8fd..890824c44 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
@@ -4,7 +4,7 @@ import { bindActionCreators } from 'redux';
 import { compose, gql } from 'react-apollo';
 import DownloadCommentHistory from '../components/DownloadCommentHistory';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
-import { withRequestDownloadLink } from '../mutations';
+import { withRequestDownloadLink } from '../hocs';
 import { notify } from 'coral-framework/actions/notification';
 
 class DownloadCommentHistoryContainer extends Component {
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/hocs/index.js
similarity index 100%
rename from plugins/talk-plugin-profile-data/client/mutations.js
rename to plugins/talk-plugin-profile-data/client/hocs/index.js

From 687d0555c87996b7f6ff6f28639d0b37df8aecf1 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:18:09 -0300
Subject: [PATCH 086/160] moving mutations to /hocs folder

---
 .../client/containers/DownloadCommentHistory.js                 | 2 +-
 .../client/{mutations.js => hocs/index.js}                      | 0
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename plugins/talk-plugin-profile-data/client/{mutations.js => hocs/index.js} (100%)

diff --git a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
index 96dbf6975..df9843d4a 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { compose, gql } from 'react-apollo';
 import DownloadCommentHistory from '../components/DownloadCommentHistory';
 import { withFragments } from 'plugin-api/beta/client/hocs';
-import { withRequestDownloadLink } from '../mutations';
+import { withRequestDownloadLink } from '../hocs';
 
 class DownloadCommentHistoryContainer extends Component {
   static propTypes = {
diff --git a/plugins/talk-plugin-profile-data/client/mutations.js b/plugins/talk-plugin-profile-data/client/hocs/index.js
similarity index 100%
rename from plugins/talk-plugin-profile-data/client/mutations.js
rename to plugins/talk-plugin-profile-data/client/hocs/index.js

From 788cf25fa50acb9fa7888260b228c6aae77ba858 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:20:07 -0300
Subject: [PATCH 087/160] moving mutations to /hocs folder

---
 plugins/talk-plugin-local-auth/client/containers/Profile.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index 8f442ea43..e1ed99ef6 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -4,7 +4,7 @@ import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
 import { withChangeUsername } from 'plugin-api/beta/client/hocs';
-import { withUpdateEmailAddress } from './hocs';
+import { withUpdateEmailAddress } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 

From 690e6752ee9f583716266f871809a71e87967a99 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 12:28:52 -0600
Subject: [PATCH 088/160] added emails around account deletion

---
 .../server/connect.js                         | 45 ++++++++++++-
 .../server/mutators.js                        | 64 ++++++++++++++++---
 .../talk-plugin-profile-data/translations.yml | 12 ++++
 3 files changed, 112 insertions(+), 9 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/server/connect.js b/plugins/talk-plugin-profile-data/server/connect.js
index eab76828f..5bb59c125 100644
--- a/plugins/talk-plugin-profile-data/server/connect.js
+++ b/plugins/talk-plugin-profile-data/server/connect.js
@@ -1,10 +1,12 @@
 const path = require('path');
 const moment = require('moment');
 const { CronJob } = require('cron');
+const { get } = require('lodash');
+const { ErrMissingEmail } = require('errors');
 
 module.exports = connectors => {
   const {
-    services: { Mailer },
+    services: { Mailer, I18n },
     models: { User },
     graph: { Context },
   } = connectors;
@@ -28,6 +30,13 @@ module.exports = connectors => {
       // Create the context we'll use to perform user deletions.
       const ctx = Context.forSystem();
 
+      // Grab some settings.
+      const { loaders: { Settings } } = ctx;
+      const {
+        organizationName,
+        organizationContactEmail,
+      } = await Settings.load(['organizationName', 'organizationContactEmail']);
+
       // rescheduledDeletionDate is the date in the future that we'll set the
       // user's account to be deleted on if this delete fails.
       const rescheduledDeletionDate = moment()
@@ -61,6 +70,26 @@ module.exports = connectors => {
             break;
           }
 
+          // Get the user's email address.
+          const reply = await ctx.graphql(
+            `
+            query GetUserEmailAddress($user_id: ID!) {
+              user(id: $user_id) {
+                email
+              }
+            }
+            `,
+            { user_id: user.id }
+          );
+          if (reply.errors) {
+            throw reply.errors;
+          }
+
+          const email = get(reply, 'data.user.email');
+          if (!email) {
+            throw new ErrMissingEmail();
+          }
+
           ctx.log.info(
             {
               userID: user.id,
@@ -91,6 +120,20 @@ module.exports = connectors => {
           }
 
           ctx.log.info({ userID: user.id }, 'user was deleted successfully');
+
+          // Send the download link via the user's attached email account.
+          await Mailer.send({
+            template: 'plain',
+            locals: {
+              body: I18n.t(
+                'email.deleted.body',
+                organizationName,
+                organizationContactEmail
+              ),
+            },
+            subject: I18n.t('email.deleted.subject'),
+            email,
+          });
         }
       } catch (err) {
         ctx.log.error({ err }, 'could not handle user deletions');
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index 82e5ede4a..dfbcd2d01 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -104,31 +104,64 @@ async function sendDownloadLink(ctx) {
 // requestDeletion will schedule the current user to have their account deleted
 // by setting the `scheduledDeletionDate` on the user
 // ${scheduledDeletionDelayHours} hours from now.
-async function requestDeletion({ user, connectors: { models: { User } } }) {
+async function requestDeletion({
+  user,
+  loaders: { Settings },
+  connectors: { models: { User }, services: { Users, I18n } },
+}) {
   // Ensure the user doesn't already have a deletion scheduled.
   if (get(user, 'metadata.scheduledDeletionDate')) {
     throw new ErrDeletionAlreadyScheduled();
   }
 
   // Get the date in the future ${scheduledDeletionDelayHours} hours from now.
-  const scheduledDeletionDate = moment()
-    .add(scheduledDeletionDelayHours, 'hours')
-    .toDate();
+  const scheduledDeletionDate = moment().add(
+    scheduledDeletionDelayHours,
+    'hours'
+  );
 
   // Amend the scheduledDeletionDate on the user.
   await User.update(
     { id: user.id },
-    { $set: { 'metadata.scheduledDeletionDate': scheduledDeletionDate } }
+    {
+      $set: {
+        'metadata.scheduledDeletionDate': scheduledDeletionDate.toDate(),
+      },
+    }
   );
 
-  return scheduledDeletionDate;
+  const { organizationName } = await Settings.load('organizationName');
+
+  // Send the download link via the user's attached email account.
+  await Users.sendEmail(user, {
+    template: 'plain',
+    locals: {
+      body: I18n.t(
+        'email.delete.body',
+        organizationName,
+        scheduledDeletionDate.format('MMM Do YYYY, h:mm:ss a')
+      ),
+    },
+    subject: I18n.t('email.delete.subject'),
+  });
+
+  return scheduledDeletionDate.toDate();
 }
 
 // cancelDeletion will unset the scheduled deletion date on the user account
 // that is used to indicate that the user was scheduled for deletion.
-async function cancelDeletion({ user, connectors: { models: { User } } }) {
+async function cancelDeletion({
+  user,
+  loaders: { Settings },
+  connectors: { models: { User }, services: { I18n, Users } },
+}) {
   // Ensure the user has a deletion scheduled.
-  if (!get(user, 'metadata.scheduledDeletionDate', null)) {
+  const scheduledDeletionDate = get(
+    user,
+    'metadata.scheduledDeletionDate',
+    null
+  );
+  if (!scheduledDeletionDate) {
     throw new ErrDeletionNotScheduled();
   }
 
@@ -137,6 +170,21 @@ async function cancelDeletion({ user, connectors: { models: { User } } }) {
     { id: user.id },
     { $unset: { 'metadata.scheduledDeletionDate': 1 } }
   );
+
+  const { organizationName } = await Settings.load('organizationName');
+
+  // Send the download link via the user's attached email account.
+  await Users.sendEmail(user, {
+    template: 'plain',
+    locals: {
+      body: I18n.t(
+        'email.cancelDelete.body',
+        organizationName,
+        moment(scheduledDeletionDate).format('MMM Do YYYY, h:mm:ss a')
+      ),
+    },
+    subject: I18n.t('email.cancelDelete.subject'),
+  });
 }
 
 // downloadUser will return the download file url that can be used to directly
diff --git a/plugins/talk-plugin-profile-data/translations.yml b/plugins/talk-plugin-profile-data/translations.yml
index d1059d470..03a2c7d9d 100644
--- a/plugins/talk-plugin-profile-data/translations.yml
+++ b/plugins/talk-plugin-profile-data/translations.yml
@@ -14,5 +14,17 @@ en:
       subject: "Your comments are ready for download from {0}"
       download_link_ready: "Click here to download your comments from {0} as of {1}:"
       download_archive: "Download Archive"
+    delete:
+      subject: "Commenter Account Deletion Request"
+      body: "You have submitted a request to delete your commenter account on {0}. Your account will be deleted on {1}. If you change your mind, you can reactivate your account by logging in and cancelling the request."
+    deleted:
+      subject: "Commenter Account Deleted"
+      body: |
+        Your commenter account for {0} is now deleted. We’re sorry to see you go!
+        If you’d like to re-join the discussion in the future, you can sign up for a new account.
+        If you’d like to give us feedback on why you left and what we can do to make the commenting experience better, please email us at {1}.
+    cancelDelete:
+      subject: "Commenter Account Reactivated"
+      body: "You have cancelled your account deletion request for {0}. Your account is now reactivated."
   error:
     DOWNLOAD_TOKEN_INVALID: "Your download link is not valid."

From 29a840fe067d774fcf1928017c5f80c0df5b433a Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:38:17 -0300
Subject: [PATCH 089/160] InputField conflict

---
 .../client/components/ChangePassword.css      |  2 +-
 .../client/components/InputField.css          |  6 +-
 .../client/components/InputField.js           | 60 ++++++++++---------
 3 files changed, 38 insertions(+), 30 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
index 6c7f9ae41..af59ae65f 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
@@ -31,7 +31,7 @@
   display: block;
   padding-top: 4px;
   text-align: right;
-  width: 280px;
+  width: 230px;
 }
 
 .detailLink {
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.css b/plugins/talk-plugin-local-auth/client/components/InputField.css
index cd6015e47..d0dc51494 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.css
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.css
@@ -5,6 +5,7 @@
 
 .detailItemContainer {
   display: flex;
+  flex-direction: column;
 }
 
 .columnDisplay {
@@ -16,6 +17,10 @@
 }
 
 .detailItemContent {
+  display: flex;
+}
+
+.detailInput {
   border: solid 1px #787D80;
   border-radius: 2px;
   background-color: white;
@@ -64,7 +69,6 @@
   display: flex;
   align-items: center;
   padding-left: 6px;
-  padding-top: 16px;
 
   .warningIcon, .checkIcon {
     font-size: 17px;
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.js b/plugins/talk-plugin-local-auth/client/components/InputField.js
index 34c314c20..944f5e7cf 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.js
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.js
@@ -30,41 +30,45 @@ const InputField = ({
 
   return (
     <div className={styles.detailItem}>
-      <div
-        className={cn(styles.detailItemContainer, {
-          [styles.columnDisplay]: columnDisplay,
-        })}
-      >
+      <div className={cn(styles.detailItemContainer)}>
         {label && (
           <label className={styles.detailLabel} id={id}>
             {label}
           </label>
         )}
         <div
-          className={cn(
-            styles.detailItemContent,
-            { [styles.error]: hasError },
-            { [styles.disabled]: disabled }
-          )}
+          className={cn(styles.detailItemContent, {
+            [styles.columnDisplay]: columnDisplay,
+          })}
         >
-          {icon && <Icon name={icon} className={styles.detailIcon} />}
-          <input
-            id={id}
-            type={type}
-            name={name}
-            className={styles.detailValue}
-            onChange={onChange}
-            autoComplete="off"
-            data-validation-type={validationType}
-            disabled={disabled}
-            {...inputValue}
-          />
-        </div>
-        <div className={styles.detailItemMessage}>
-          {!hasError &&
-            showSuccess &&
-            value && <Icon className={styles.checkIcon} name="check_circle" />}
-          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+          <div
+            className={cn(
+              styles.detailInput,
+              { [styles.error]: hasError },
+              { [styles.disabled]: disabled }
+            )}
+          >
+            {icon && <Icon name={icon} className={styles.detailIcon} />}
+            <input
+              id={id}
+              type={type}
+              name={name}
+              className={styles.detailValue}
+              onChange={onChange}
+              autoComplete="off"
+              data-validation-type={validationType}
+              disabled={disabled}
+              {...inputValue}
+            />
+          </div>
+          <div className={styles.detailItemMessage}>
+            {!hasError &&
+              showSuccess &&
+              value && (
+                <Icon className={styles.checkIcon} name="check_circle" />
+              )}
+            {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+          </div>
         </div>
       </div>
       {children}

From 6cfebb408f82a36187ea18bfa1243ca0dc171299 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:42:28 -0300
Subject: [PATCH 090/160] Updating InputField

---
 .../client/components/InputField.css          |  6 +-
 .../client/components/InputField.js           | 60 ++++++++++---------
 2 files changed, 37 insertions(+), 29 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/InputField.css b/plugins/talk-plugin-profile-data/client/components/InputField.css
index 3442befde..f6663b9b5 100644
--- a/plugins/talk-plugin-profile-data/client/components/InputField.css
+++ b/plugins/talk-plugin-profile-data/client/components/InputField.css
@@ -5,6 +5,7 @@
 
 .detailItemContainer {
   display: flex;
+  flex-direction: column;
 }
 
 .columnDisplay {
@@ -16,6 +17,10 @@
 }
 
 .detailItemContent {
+  display: flex;
+}
+
+.detailInput {
   border: solid 1px #787D80;
   border-radius: 2px;
   background-color: white;
@@ -64,7 +69,6 @@
   display: flex;
   align-items: center;
   padding-left: 6px;
-  padding-top: 16px;
 
   .warningIcon, .checkIcon {
     font-size: 17px;
diff --git a/plugins/talk-plugin-profile-data/client/components/InputField.js b/plugins/talk-plugin-profile-data/client/components/InputField.js
index 26937d5b9..944f5e7cf 100644
--- a/plugins/talk-plugin-profile-data/client/components/InputField.js
+++ b/plugins/talk-plugin-profile-data/client/components/InputField.js
@@ -30,41 +30,45 @@ const InputField = ({
 
   return (
     <div className={styles.detailItem}>
-      <div
-        className={cn(styles.detailItemContainer, {
-          [styles.columnDisplay]: columnDisplay,
-        })}
-      >
+      <div className={cn(styles.detailItemContainer)}>
         {label && (
           <label className={styles.detailLabel} id={id}>
             {label}
           </label>
         )}
         <div
-          className={cn(
-            styles.detailItemContent,
-            { [styles.error]: hasError && showError },
-            { [styles.disabled]: disabled }
-          )}
+          className={cn(styles.detailItemContent, {
+            [styles.columnDisplay]: columnDisplay,
+          })}
         >
-          {icon && <Icon name={icon} className={styles.detailIcon} />}
-          <input
-            id={id}
-            type={type}
-            name={name}
-            className={styles.detailValue}
-            onChange={onChange}
-            autoComplete="off"
-            data-validation-type={validationType}
-            disabled={disabled}
-            {...inputValue}
-          />
-        </div>
-        <div className={styles.detailItemMessage}>
-          {!hasError &&
-            showSuccess &&
-            value && <Icon className={styles.checkIcon} name="check_circle" />}
-          {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+          <div
+            className={cn(
+              styles.detailInput,
+              { [styles.error]: hasError },
+              { [styles.disabled]: disabled }
+            )}
+          >
+            {icon && <Icon name={icon} className={styles.detailIcon} />}
+            <input
+              id={id}
+              type={type}
+              name={name}
+              className={styles.detailValue}
+              onChange={onChange}
+              autoComplete="off"
+              data-validation-type={validationType}
+              disabled={disabled}
+              {...inputValue}
+            />
+          </div>
+          <div className={styles.detailItemMessage}>
+            {!hasError &&
+              showSuccess &&
+              value && (
+                <Icon className={styles.checkIcon} name="check_circle" />
+              )}
+            {hasError && showError && <ErrorMessage>{errorMsg}</ErrorMessage>}
+          </div>
         </div>
       </div>
       {children}

From 10dbce55bad8b12085b1b93fdbf5d0337d5a49ad Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:45:19 -0300
Subject: [PATCH 091/160] Updating InputField

---
 .../talk-plugin-profile-data/client/components/InputField.js    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/InputField.js b/plugins/talk-plugin-profile-data/client/components/InputField.js
index 944f5e7cf..930c15582 100644
--- a/plugins/talk-plugin-profile-data/client/components/InputField.js
+++ b/plugins/talk-plugin-profile-data/client/components/InputField.js
@@ -44,7 +44,7 @@ const InputField = ({
           <div
             className={cn(
               styles.detailInput,
-              { [styles.error]: hasError },
+              { [styles.error]: hasError && showError },
               { [styles.disabled]: disabled }
             )}
           >

From 140ef3eb5eb30924cd4b95718bf7ccf3733711b1 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 15:57:00 -0300
Subject: [PATCH 092/160] Styling

---
 .../talk-plugin-profile-data/client/components/InputField.css | 1 +
 .../client/components/StepProgress.css                        | 4 ++++
 .../client/components/StepProgress.js                         | 2 +-
 3 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/InputField.css b/plugins/talk-plugin-profile-data/client/components/InputField.css
index f6663b9b5..fae31c80a 100644
--- a/plugins/talk-plugin-profile-data/client/components/InputField.css
+++ b/plugins/talk-plugin-profile-data/client/components/InputField.css
@@ -62,6 +62,7 @@
   flex: 1;
   height: 100%;
   box-sizing: border-box;
+  padding: 0 6px;
 }
 
 .detailItemMessage {
diff --git a/plugins/talk-plugin-profile-data/client/components/StepProgress.css b/plugins/talk-plugin-profile-data/client/components/StepProgress.css
index 68fab06a9..bede31511 100644
--- a/plugins/talk-plugin-profile-data/client/components/StepProgress.css
+++ b/plugins/talk-plugin-profile-data/client/components/StepProgress.css
@@ -4,6 +4,10 @@
   padding: 6px;
   z-index: 10;
 
+  > .icon {
+    font-size: 25px;
+  }
+
   &.current {
     color: rgba(0, 205, 115, 0.3);
   }
diff --git a/plugins/talk-plugin-profile-data/client/components/StepProgress.js b/plugins/talk-plugin-profile-data/client/components/StepProgress.js
index e11bf46d5..ff32fe431 100644
--- a/plugins/talk-plugin-profile-data/client/components/StepProgress.js
+++ b/plugins/talk-plugin-profile-data/client/components/StepProgress.js
@@ -11,7 +11,7 @@ const CheckItem = ({ current = false, completed = false }) => (
       [styles.completed]: completed,
     })}
   >
-    <Icon name="check_circle" />
+    <Icon name="check_circle" className={styles.icon} />
   </span>
 );
 

From 65aa90904add094411de97386da634407409443b Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 16:00:25 -0300
Subject: [PATCH 093/160] Styling

---
 .../client/components/DeleteMyAccountDialog.css                | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
index 44dcad0cf..2735474da 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
@@ -6,7 +6,7 @@
   font-family: Helvetica, 'Helvetica Neue', Verdana, sans-serif;
   font-size: 14px;
   border-radius: 4px;
-  padding: 12px 20px;
+  padding: 20px;
 }
 
 .close {
@@ -27,6 +27,7 @@
 
 .title {
   font-size: 1.2em;
+  margin-top: 0;
   margin-bottom: 8px;
 }
 

From 438c515d2ff56de6baaa9a45204fe4764394e5e2 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 16:06:28 -0300
Subject: [PATCH 094/160] moving mutations to /hocs folder

---
 client/coral-framework/graphql/mutations.js   | 88 ------------------
 plugin-api/beta/client/hocs/index.js          |  2 -
 .../containers/AddEmailAddressDialog.js       |  2 +-
 .../client/containers/Profile.js              |  6 +-
 .../client/hocs/index.js                      | 91 +++++++++++++++++++
 5 files changed, 94 insertions(+), 95 deletions(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/hocs/index.js

diff --git a/client/coral-framework/graphql/mutations.js b/client/coral-framework/graphql/mutations.js
index dd54d0438..228911d4a 100644
--- a/client/coral-framework/graphql/mutations.js
+++ b/client/coral-framework/graphql/mutations.js
@@ -321,94 +321,6 @@ const SetUsernameFragment = gql`
   }
 `;
 
-export const withAttachLocalAuth = withMutation(
-  gql`
-    mutation AttachLocalAuth($input: AttachLocalAuthInput!) {
-      attachLocalAuth(input: $input) {
-        ...AttachLocalAuthResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      attachLocalAuth: input => {
-        return mutate({
-          variables: {
-            input,
-          },
-          update: proxy => {
-            const AttachLocalAuthQuery = gql`
-              query Talk_AttachLocalAuth {
-                me {
-                  id
-                  email
-                }
-              }
-            `;
-
-            const prev = proxy.readQuery({ query: AttachLocalAuthQuery });
-
-            const data = update(prev, {
-              me: {
-                email: { $set: input.email },
-              },
-            });
-
-            proxy.writeQuery({
-              query: AttachLocalAuthQuery,
-              data,
-            });
-          },
-        });
-      },
-    }),
-  }
-);
-
-export const withUpdateEmailAddress = withMutation(
-  gql`
-    mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
-      updateEmailAddress(input: $input) {
-        ...UpdateEmailAddressResponse
-      }
-    }
-  `,
-  {
-    props: ({ mutate }) => ({
-      updateEmailAddress: input => {
-        return mutate({
-          variables: {
-            input,
-          },
-          update: proxy => {
-            const UpdateEmailAddressQuery = gql`
-              query Talk_UpdateEmailAddress {
-                me {
-                  id
-                  email
-                }
-              }
-            `;
-
-            const prev = proxy.readQuery({ query: UpdateEmailAddressQuery });
-
-            const data = update(prev, {
-              me: {
-                email: { $set: input.email },
-              },
-            });
-
-            proxy.writeQuery({
-              query: UpdateEmailAddressQuery,
-              data,
-            });
-          },
-        });
-      },
-    }),
-  }
-);
-
 export const withChangeUsername = withMutation(
   gql`
     mutation ChangeUsername($id: ID!, $username: String!) {
diff --git a/plugin-api/beta/client/hocs/index.js b/plugin-api/beta/client/hocs/index.js
index 910969227..d7ca5fce9 100644
--- a/plugin-api/beta/client/hocs/index.js
+++ b/plugin-api/beta/client/hocs/index.js
@@ -27,7 +27,5 @@ export {
   withSetCommentStatus,
   withChangePassword,
   withChangeUsername,
-  withUpdateEmailAddress,
-  withAttachLocalAuth,
 } from 'coral-framework/graphql/mutations';
 export { compose } from 'recompose';
diff --git a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
index 7ab887183..841dc8420 100644
--- a/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/containers/AddEmailAddressDialog.js
@@ -4,7 +4,7 @@ import { connect, withFragments, excludeIf } from 'plugin-api/beta/client/hocs';
 import AddEmailAddressDialog from '../components/AddEmailAddressDialog';
 import { notify } from 'coral-framework/actions/notification';
 
-import { withAttachLocalAuth } from 'plugin-api/beta/client/hocs';
+import { withAttachLocalAuth } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index 239304535..e1ed99ef6 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -3,10 +3,8 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
-import {
-  withChangeUsername,
-  withUpdateEmailAddress,
-} from 'plugin-api/beta/client/hocs';
+import { withChangeUsername } from 'plugin-api/beta/client/hocs';
+import { withUpdateEmailAddress } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
diff --git a/plugins/talk-plugin-local-auth/client/hocs/index.js b/plugins/talk-plugin-local-auth/client/hocs/index.js
new file mode 100644
index 000000000..573fa6b10
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/hocs/index.js
@@ -0,0 +1,91 @@
+import { withMutation } from 'plugin-api/beta/client/hocs';
+import { gql } from 'react-apollo';
+import update from 'immutability-helper';
+
+export const withAttachLocalAuth = withMutation(
+  gql`
+    mutation AttachLocalAuth($input: AttachLocalAuthInput!) {
+      attachLocalAuth(input: $input) {
+        ...AttachLocalAuthResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      attachLocalAuth: input => {
+        return mutate({
+          variables: {
+            input,
+          },
+          update: proxy => {
+            const AttachLocalAuthQuery = gql`
+              query Talk_AttachLocalAuth {
+                me {
+                  id
+                  email
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: AttachLocalAuthQuery });
+
+            const data = update(prev, {
+              me: {
+                email: { $set: input.email },
+              },
+            });
+
+            proxy.writeQuery({
+              query: AttachLocalAuthQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);
+
+export const withUpdateEmailAddress = withMutation(
+  gql`
+    mutation UpdateEmailAddress($input: UpdateEmailAddressInput!) {
+      updateEmailAddress(input: $input) {
+        ...UpdateEmailAddressResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      updateEmailAddress: input => {
+        return mutate({
+          variables: {
+            input,
+          },
+          update: proxy => {
+            const UpdateEmailAddressQuery = gql`
+              query Talk_UpdateEmailAddress {
+                me {
+                  id
+                  email
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: UpdateEmailAddressQuery });
+
+            const data = update(prev, {
+              me: {
+                email: { $set: input.email },
+              },
+            });
+
+            proxy.writeQuery({
+              query: UpdateEmailAddressQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);

From 070ecbaafc15097091a1b568a5886fd0182320b0 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Thu, 3 May 2018 16:30:15 -0300
Subject: [PATCH 095/160] translations

---
 .../client/components/AddEmailContent.js      | 28 +++++++++----------
 .../client/components/EmailAddressAdded.js    | 15 ++++++----
 .../client/components/InputField.css          |  5 ++--
 .../client/components/VerifyEmailAddress.js   | 11 ++++----
 .../client/translations.yml                   | 23 +++++++++++++++
 5 files changed, 54 insertions(+), 28 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index 0d3411ff3..4a2ce7430 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -4,6 +4,7 @@ import styles from './AddEmailAddressDialog.css';
 import { Icon } from 'plugin-api/beta/client/components/ui';
 import cn from 'classnames';
 import InputField from './InputField';
+import { t } from 'plugin-api/beta/client/services';
 
 const AddEmailContent = ({
   formData,
@@ -13,29 +14,29 @@ const AddEmailContent = ({
   onChange,
 }) => (
   <div>
-    <h4 className={styles.title}>Add an Email Address</h4>
+    <h4 className={styles.title}>
+      {t('talk-plugin-local-auth.add_email.content.title')}
+    </h4>
     <p className={styles.description}>
-      For your added security, we require users to add an email address to their
-      accounts. Your email address will be used to:
+      {t('talk-plugin-local-auth.add_email.content.description')}
     </p>
     <ul className={styles.list}>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          Receive updates regarding any changes to your account (email address,
-          username, password, etc.)
+          {t('talk-plugin-local-auth.add_email.content.item_1')}
         </span>
       </li>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          Allow you to download your comments.
+          {t('talk-plugin-local-auth.add_email.content.item_2')}
         </span>
       </li>
       <li className={styles.item}>
         <Icon name="done" className={styles.itemIcon} />
         <span className={styles.text}>
-          Send comment notifications that you have chosen to receive.
+          {t('talk-plugin-local-auth.add_email.content.item_3')}
         </span>
       </li>
     </ul>
@@ -43,20 +44,20 @@ const AddEmailContent = ({
     <form autoComplete="off">
       <InputField
         id="emailAddress"
-        label="Enter Email Address:"
+        label={t('talk-plugin-local-auth.add_email.enter_email_address')}
         name="emailAddress"
         type="email"
         onChange={onChange}
         defaultValue=""
         hasError={!formData.emailAddress || errors.emailAddress}
-        errorMsg={'Invalid email address'}
+        errorMsg={t('talk-plugin-local-auth.add_email.invalid_email_address')}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
       />
       <InputField
         id="confirmEmailAddress"
-        label="Confirm Email Address:"
+        label={t('talk-plugin-local-auth.add_email.confirm_email_address')}
         name="confirmEmailAddress"
         type="email"
         onChange={onChange}
@@ -65,20 +66,19 @@ const AddEmailContent = ({
           !formData.emailAddress ||
           formData.emailAddress !== formData.confirmEmailAddress
         }
-        errorMsg={'Email address does not match'}
+        errorMsg={t('talk-plugin-local-auth.add_email.email_does_not_match')}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
       />
       <InputField
         id="confirmPassword"
-        label="Insert Password:"
+        label={t('talk-plugin-local-auth.add_email.insert_password')}
         name="confirmPassword"
         type="password"
         onChange={onChange}
         defaultValue=""
         hasError={!formData.confirmPassword}
-        errorMsg={'Confirm Password'}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
@@ -88,7 +88,7 @@ const AddEmailContent = ({
           className={cn(styles.button, styles.proceed)}
           onClick={confirmChanges}
         >
-          Add Email Address
+          {t('talk-plugin-local-auth.add_email.add_email_address')}
         </a>
       </div>
     </form>
diff --git a/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
index ef74f4b8b..6d5775f3c 100644
--- a/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
+++ b/plugins/talk-plugin-local-auth/client/components/EmailAddressAdded.js
@@ -2,21 +2,24 @@ import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const EmailAddressAdded = ({ done }) => (
   <div>
-    <h4 className={styles.title}>Email Address Added</h4>
+    <h4 className={styles.title}>
+      {t('talk-plugin-local-auth.add_email.added.title')}
+    </h4>
     <p className={styles.description}>
-      Your email address has been added to your account.
+      {t('talk-plugin-local-auth.add_email.added.description')}
     </p>
-    <strong>Need to change your email address?</strong>
+    <strong>{t('talk-plugin-local-auth.add_email.added.subtitle')}</strong>
     <p className={styles.description}>
-      You can change your account settings by visiting{' '}
-      <strong>My Profile {'>'} Settings</strong>.
+      {t('talk-plugin-local-auth.add_email.added.description_2')}{' '}
+      <strong>{t('talk-plugin-local-auth.add_email.added.path')}</strong>.
     </p>
     <div className={styles.actions}>
       <a className={cn(styles.button, styles.proceed)} onClick={done}>
-        Done
+        {t('talk-plugin-local-auth.add_email.done')}
       </a>
     </div>
   </div>
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.css b/plugins/talk-plugin-local-auth/client/components/InputField.css
index befc94f18..3442befde 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.css
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.css
@@ -42,11 +42,10 @@
 }
 
 .detailLabel {
-  color: #4c4c4d;
+  color: #4C4C4D;
   font-size: 1em;
   display: block;
   margin-bottom: 4px;
-  font-weight: bold;
 }
 
 .detailValue {
@@ -78,4 +77,4 @@
 
 .warningIcon {
   color: #FA4643;
-}
\ No newline at end of file
+}
diff --git a/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
index 9a3e6ae89..cc1ff3626 100644
--- a/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
+++ b/plugins/talk-plugin-local-auth/client/components/VerifyEmailAddress.js
@@ -2,18 +2,19 @@ import React from 'react';
 import cn from 'classnames';
 import PropTypes from 'prop-types';
 import styles from './AddEmailAddressDialog.css';
+import { t } from 'plugin-api/beta/client/services';
 
 const VerifyEmailAddress = ({ emailAddress, done }) => (
   <div>
-    <h4 className={styles.title}>Verify Your Email Address</h4>
+    <h4 className={styles.title}>
+      {t('talk-plugin-local-auth.add_email.verify.title')}
+    </h4>
     <p className={styles.description}>
-      We’ve sent an email to {emailAddress} to verify your account. You must
-      verify your email address so that it can be used for account change
-      confirmations and notifications.
+      {t('talk-plugin-local-auth.add_email.verify.description', emailAddress)}
     </p>
     <div className={styles.actions}>
       <a className={cn(styles.button, styles.proceed)} onClick={done}>
-        Done
+        {t('talk-plugin-local-auth.add_email.done')}
       </a>
     </div>
   </div>
diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
index d3b323f54..2b46a0464 100644
--- a/plugins/talk-plugin-local-auth/client/translations.yml
+++ b/plugins/talk-plugin-local-auth/client/translations.yml
@@ -35,6 +35,29 @@ en:
       change_email_msg: "Email Address Changed - Your email address has been successfully changed. This email address will now be used for signing in and email notifications."
       changed_username_success_msg: "Username Changed - Your username has been successfully changed. You will not be able to change your user name for 14 days."
       change_username_attempt: "Username can't be updated. Usernames can only be changed every 14 days."
+    add_email:
+      add_email_address: "Add Email Address"
+      enter_email_address: "Enter Email Address:"
+      invalid_email_address: "Invalid Email address"
+      confirm_email_address: "Confirm Email Address:"
+      email_does_not_match: "Email Address does not match"
+      insert_password: "Insert Password:"
+      done: "done"
+      content:
+        title: "Add an Email Address"
+        description: "For your added security, we require users to add an email address to their accounts. Your email address will be used to:"
+        item_1: "Receive updates regarding any changes to your account (email address, username, password, etc.)"
+        item_2: "Allow you to download your comments."
+        item_3: "Send comment notifications that you have chosen to receive."
+      verify:
+        title: "Verify Your Email Address"
+        description:  "We’ve sent an email to {0} to verify your account. You must verify your email address so that it can be used for account change confirmations and notifications."
+      added: 
+        title: "Email Address Added"
+        description: "Your email address has been added to your account."
+        subtitle: "Need to change your email address?"
+        description_2: "You can change your account settings by visiting"
+        path: "My Profile > Settings"
 es:
   talk-plugin-local-auth:
     change_password:

From 903b74cb31d9432b8ab8641352c3f3ea17f333d5 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 15:43:22 -0400
Subject: [PATCH 096/160] Update email copy

---
 plugins/talk-plugin-profile-data/translations.yml | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/translations.yml b/plugins/talk-plugin-profile-data/translations.yml
index 03a2c7d9d..1c2122f1b 100644
--- a/plugins/talk-plugin-profile-data/translations.yml
+++ b/plugins/talk-plugin-profile-data/translations.yml
@@ -15,16 +15,20 @@ en:
       download_link_ready: "Click here to download your comments from {0} as of {1}:"
       download_archive: "Download Archive"
     delete:
-      subject: "Commenter Account Deletion Request"
-      body: "You have submitted a request to delete your commenter account on {0}. Your account will be deleted on {1}. If you change your mind, you can reactivate your account by logging in and cancelling the request."
+      subject: "Your account for {0} is scheduled to be deleted"
+      body: |
+        A request to delete your account was received on {0} and your account is scheduled to be deleted on {1}.
+        After that time all of your comments will be removed from the site, all of your comments will be removed from our database, and your username and email address are removed from our system.
+        To cancel this request, sign into your account and cancel the request before your scheduled account deletion time.
+        If you didn't request this change contact {2}
     deleted:
-      subject: "Commenter Account Deleted"
+      subject: "Your account for {0} has been deleted"
       body: |
         Your commenter account for {0} is now deleted. We’re sorry to see you go!
         If you’d like to re-join the discussion in the future, you can sign up for a new account.
         If you’d like to give us feedback on why you left and what we can do to make the commenting experience better, please email us at {1}.
     cancelDelete:
-      subject: "Commenter Account Reactivated"
+      subject: "Your account deletion request for {0} has been cancelled"
       body: "You have cancelled your account deletion request for {0}. Your account is now reactivated."
   error:
     DOWNLOAD_TOKEN_INVALID: "Your download link is not valid."

From d9806c0eccb2930bcc06dcd1edee6c2f9695ad45 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 16:23:47 -0400
Subject: [PATCH 097/160] Fix email subject variables

---
 plugins/talk-plugin-profile-data/server/connect.js  |  2 +-
 plugins/talk-plugin-profile-data/server/mutators.js |  4 ++--
 plugins/talk-plugin-profile-data/translations.yml   | 13 ++++++++-----
 3 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/server/connect.js b/plugins/talk-plugin-profile-data/server/connect.js
index 5bb59c125..5881fa6d1 100644
--- a/plugins/talk-plugin-profile-data/server/connect.js
+++ b/plugins/talk-plugin-profile-data/server/connect.js
@@ -131,7 +131,7 @@ module.exports = connectors => {
                 organizationContactEmail
               ),
             },
-            subject: I18n.t('email.deleted.subject'),
+            subject: I18n.t('email.deleted.subject', organizationName),
             email,
           });
         }
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index dfbcd2d01..eec54772c 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -142,7 +142,7 @@ async function requestDeletion({
         scheduledDeletionDate.format('MMM Do YYYY, h:mm:ss a')
       ),
     },
-    subject: I18n.t('email.delete.subject'),
+    subject: I18n.t('email.delete.subject', organizationName),
   });
 
   return scheduledDeletionDate.toDate();
@@ -183,7 +183,7 @@ async function cancelDeletion({
         moment(scheduledDeletionDate).format('MMM Do YYYY, h:mm:ss a')
       ),
     },
-    subject: I18n.t('email.cancelDelete.subject'),
+    subject: I18n.t('email.cancelDelete.subject', organizationName),
   });
 }
 
diff --git a/plugins/talk-plugin-profile-data/translations.yml b/plugins/talk-plugin-profile-data/translations.yml
index 1c2122f1b..7f3063aa7 100644
--- a/plugins/talk-plugin-profile-data/translations.yml
+++ b/plugins/talk-plugin-profile-data/translations.yml
@@ -17,16 +17,19 @@ en:
     delete:
       subject: "Your account for {0} is scheduled to be deleted"
       body: |
-        A request to delete your account was received on {0} and your account is scheduled to be deleted on {1}.
+        A request to delete your account was received. Your account is scheduled for deletion on {1}. 
+
         After that time all of your comments will be removed from the site, all of your comments will be removed from our database, and your username and email address are removed from our system.
+
         To cancel this request, sign into your account and cancel the request before your scheduled account deletion time.
-        If you didn't request this change contact {2}
     deleted:
       subject: "Your account for {0} has been deleted"
       body: |
-        Your commenter account for {0} is now deleted. We’re sorry to see you go!
-        If you’d like to re-join the discussion in the future, you can sign up for a new account.
-        If you’d like to give us feedback on why you left and what we can do to make the commenting experience better, please email us at {1}.
+        Your commenter account for {0} is now deleted. We're sorry to see you go!
+
+        If you'd like to re-join the discussion in the future, you can sign up for a new account.
+
+        If you'd like to give us feedback on why you left and what we can do to make the commenting experience better, please email us at {1}.
     cancelDelete:
       subject: "Your account deletion request for {0} has been cancelled"
       body: "You have cancelled your account deletion request for {0}. Your account is now reactivated."

From f5099d94bcef86bea9035d5d7560e58ade6cb91b Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 14:32:56 -0600
Subject: [PATCH 098/160] fix

---
 bin/cli-settings | 21 ++++++++-------------
 1 file changed, 8 insertions(+), 13 deletions(-)

diff --git a/bin/cli-settings b/bin/cli-settings
index d4ff3480e..72f42672d 100755
--- a/bin/cli-settings
+++ b/bin/cli-settings
@@ -4,7 +4,7 @@ const util = require('./util');
 const program = require('commander');
 const inquirer = require('inquirer');
 const mongoose = require('../services/mongoose');
-const SettingsService = require('../services/settings');
+const Settings = require('../services/settings');
 const cache = require('../services/cache');
 
 // Register the shutdown criteria.
@@ -16,15 +16,11 @@ util.onshutdown([() => mongoose.disconnect()]);
 async function changeOrgName() {
   try {
     await cache.init();
-  } catch (err) {
-    console.error(err);
-    util.shutdown(1);
-  }
 
-  try {
-    let settings = await SettingsService.retrieve();
+    // Get the original settings.
+    const settings = await Settings.retrieve('organizationName');
 
-    let { organizationName } = await inquirer.prompt([
+    const { organizationName } = await inquirer.prompt([
       {
         name: 'organizationName',
         message: 'Organization Name',
@@ -33,9 +29,8 @@ async function changeOrgName() {
     ]);
 
     if (settings.organizationName !== organizationName) {
-      settings.organizationName = organizationName;
-
-      await SettingsService.update(settings);
+      // Set the organization name if there was a mutation to it.
+      await Settings.update({ organizationName });
 
       console.log('Settings were updated.');
     } else {
@@ -44,9 +39,9 @@ async function changeOrgName() {
   } catch (err) {
     console.error(err);
     util.shutdown(1);
+  } finally {
+    util.shutdown();
   }
-
-  util.shutdown();
 }
 
 //==============================================================================

From 3e9d835eb26c338e9343d62d71bed5c41a4a8a39 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 16:37:19 -0400
Subject: [PATCH 099/160] Grammar

---
 plugins/talk-plugin-profile-data/translations.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/translations.yml b/plugins/talk-plugin-profile-data/translations.yml
index 7f3063aa7..39b810cca 100644
--- a/plugins/talk-plugin-profile-data/translations.yml
+++ b/plugins/talk-plugin-profile-data/translations.yml
@@ -19,9 +19,9 @@ en:
       body: |
         A request to delete your account was received. Your account is scheduled for deletion on {1}. 
 
-        After that time all of your comments will be removed from the site, all of your comments will be removed from our database, and your username and email address are removed from our system.
+        After that time all of your comments will be removed from the site, all of your comments will be removed from our database, and your username and email address will be removed from our system.
 
-        To cancel this request, sign into your account and cancel the request before your scheduled account deletion time.
+        If you change your mind you can sign into your account and cancel the request before your scheduled account deletion time.
     deleted:
       subject: "Your account for {0} has been deleted"
       body: |

From 2e7bad35081e28c440a9f58976b26a701527852f Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 14:56:57 -0600
Subject: [PATCH 100/160] moved settings loading into try/catch block

---
 .../server/connect.js                         | 29 ++++++++++---------
 1 file changed, 16 insertions(+), 13 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/server/connect.js b/plugins/talk-plugin-profile-data/server/connect.js
index 5881fa6d1..0e5284e57 100644
--- a/plugins/talk-plugin-profile-data/server/connect.js
+++ b/plugins/talk-plugin-profile-data/server/connect.js
@@ -30,20 +30,23 @@ module.exports = connectors => {
       // Create the context we'll use to perform user deletions.
       const ctx = Context.forSystem();
 
-      // Grab some settings.
-      const { loaders: { Settings } } = ctx;
-      const {
-        organizationName,
-        organizationContactEmail,
-      } = await Settings.load(['organizationName', 'organizationContactEmail']);
-
-      // rescheduledDeletionDate is the date in the future that we'll set the
-      // user's account to be deleted on if this delete fails.
-      const rescheduledDeletionDate = moment()
-        .add(1, 'hours')
-        .toDate();
-
       try {
+        // Grab some settings.
+        const { loaders: { Settings } } = ctx;
+        const {
+          organizationName,
+          organizationContactEmail,
+        } = await Settings.load([
+          'organizationName',
+          'organizationContactEmail',
+        ]);
+
+        // rescheduledDeletionDate is the date in the future that we'll set the
+        // user's account to be deleted on if this delete fails.
+        const rescheduledDeletionDate = moment()
+          .add(1, 'hours')
+          .toDate();
+
         // Keep running for each user we can pull.
         while (true) {
           // We'll find any user that has an account deletion date before now

From 58b73a4d0a7d15734b9b88306c75150a421a8771 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 17:08:20 -0400
Subject: [PATCH 101/160] Add feature overview to GDPR docs

---
 docs/source/03-08-gdpr.md | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/docs/source/03-08-gdpr.md b/docs/source/03-08-gdpr.md
index 187920bbc..76fe23211 100644
--- a/docs/source/03-08-gdpr.md
+++ b/docs/source/03-08-gdpr.md
@@ -12,9 +12,19 @@ can enable the following plugins:
 - [talk-plugin-profile-data](/talk/plugin/talk-plugin-profile-data) - to facilitate account download and deletion
 
 Even if you don't reside in a location where GDPR will apply, it is recommended
-to enable these features anyways to provide your users with control over their
+to enable these features as a best practice to provide your users with control over their
 own data.
 
+## GPDR Feature Overview
+
+Integrating our GDPR tools will give your users and organization the following benefits:
+
+- **Download my comment data**: Users can request a download of their comments. An email with a link is emailed to them to download a CSV with each comment they've made, what story it was made on, and the comment's ID and timestamp.
+- **Delete my acccount**: Users can request deletion of their account. Deleted account requests are pending for 24 hours to allow the user to download their comments, or to change their mind and reactivate their account before the expiry. Account deletions remove all of their comments from the site, all their comments and actions from the database, and their account info from our system.
+- **Add an email to an Oauth/external account**: Users are prompted to add an email to their non-Talk account (Facebook, Google, external, etc) so that they can take part in GDPR and other features requiring email communication.
+** Change my username: Users can update their username. This is capped at once every 2 weeks.
+** Change my email: Users can change their email.
+
 ## Custom Authentication Solutions
 
 As many of the newsrooms who have integrated Talk have followed our guides on

From bc3ceac61a405c25c5776b97c34a613641015eba Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 15:26:50 -0600
Subject: [PATCH 102/160] docs patch

---
 docs/source/03-08-gdpr.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/source/03-08-gdpr.md b/docs/source/03-08-gdpr.md
index 76fe23211..868897955 100644
--- a/docs/source/03-08-gdpr.md
+++ b/docs/source/03-08-gdpr.md
@@ -22,8 +22,8 @@ Integrating our GDPR tools will give your users and organization the following b
 - **Download my comment data**: Users can request a download of their comments. An email with a link is emailed to them to download a CSV with each comment they've made, what story it was made on, and the comment's ID and timestamp.
 - **Delete my acccount**: Users can request deletion of their account. Deleted account requests are pending for 24 hours to allow the user to download their comments, or to change their mind and reactivate their account before the expiry. Account deletions remove all of their comments from the site, all their comments and actions from the database, and their account info from our system.
 - **Add an email to an Oauth/external account**: Users are prompted to add an email to their non-Talk account (Facebook, Google, external, etc) so that they can take part in GDPR and other features requiring email communication.
-** Change my username: Users can update their username. This is capped at once every 2 weeks.
-** Change my email: Users can change their email.
+- **Change my username**: Users can update their username. This is capped at once every 2 weeks.
+- **Change my email**: Users can change their email.
 
 ## Custom Authentication Solutions
 

From aee963ce39e788f9be6157ebe22dae42ab9c06db Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 17:34:41 -0400
Subject: [PATCH 103/160] Missed an s

---
 docs/source/03-08-gdpr.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/source/03-08-gdpr.md b/docs/source/03-08-gdpr.md
index 868897955..9b1050454 100644
--- a/docs/source/03-08-gdpr.md
+++ b/docs/source/03-08-gdpr.md
@@ -17,7 +17,7 @@ own data.
 
 ## GPDR Feature Overview
 
-Integrating our GDPR tools will give your users and organization the following benefits:
+Integrating our GDPR tools will give your users and organizations the following benefits:
 
 - **Download my comment data**: Users can request a download of their comments. An email with a link is emailed to them to download a CSV with each comment they've made, what story it was made on, and the comment's ID and timestamp.
 - **Delete my acccount**: Users can request deletion of their account. Deleted account requests are pending for 24 hours to allow the user to download their comments, or to change their mind and reactivate their account before the expiry. Account deletions remove all of their comments from the site, all their comments and actions from the database, and their account info from our system.

From 31cb70fa77f3bb31052917d7f4dc60a4b46ba818 Mon Sep 17 00:00:00 2001
From: Davis Shaver <davisshaver@gmail.com>
Date: Thu, 3 May 2018 17:42:10 -0400
Subject: [PATCH 104/160] JWT_Audience is listed twice in the docs under
 required keys

---
 docs/source/integrating/authentication.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/docs/source/integrating/authentication.md b/docs/source/integrating/authentication.md
index 2a78944a6..b7340caf5 100644
--- a/docs/source/integrating/authentication.md
+++ b/docs/source/integrating/authentication.md
@@ -74,7 +74,6 @@ example issuer and Talk must match:
 |------|----------------------|
 |`JWT_ISSUER`|`JWT_ISSUER`|
 |`JWT_AUDIENCE`|`JWT_AUDIENCE`|
-|`JWT_AUDIENCE`|`JWT_AUDIENCE`|
 |`SECRET`|`JWT_SECRET`*|
 
 \* Note that secrets is a pretty complex topic, refer to the
@@ -83,4 +82,4 @@ reference, the basic takeaway is that the secret used to sign the tokens issued
 by the issuer must be able to be verified by Talk.
 
 For an example of implementing the plugin, refer to [`tokenUserNotFound`](/talk/reference/server/#tokenUserNotFound)
-reference.
\ No newline at end of file
+reference.

From 35cefd55706c19ca15165c46e1768c9bc7e8aa97 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Thu, 3 May 2018 17:42:47 -0400
Subject: [PATCH 105/160] Fix build fail

---
 .../client/containers/DownloadCommentHistory.js                  | 1 -
 1 file changed, 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
index a610e834b..7a22ef37f 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { compose, gql } from 'react-apollo';
 import DownloadCommentHistory from '../components/DownloadCommentHistory';
-import { withFragments } from 'plugin-api/beta/client/hocs';
 import { withRequestDownloadLink } from '../hocs';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import { withRequestDownloadLink } from '../hocs';

From b5958d5879153274faa7d48250432f4e7f524686 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 15:45:43 -0600
Subject: [PATCH 106/160] fixed merge error

---
 .../containers/DownloadCommentHistory.js      |  1 -
 .../client/hocs/index.js                      | 92 +++++++++++++++++++
 2 files changed, 92 insertions(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
index 7a22ef37f..1716de983 100644
--- a/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
+++ b/plugins/talk-plugin-profile-data/client/containers/DownloadCommentHistory.js
@@ -5,7 +5,6 @@ import { compose, gql } from 'react-apollo';
 import DownloadCommentHistory from '../components/DownloadCommentHistory';
 import { withRequestDownloadLink } from '../hocs';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
-import { withRequestDownloadLink } from '../hocs';
 import { notify } from 'coral-framework/actions/notification';
 
 class DownloadCommentHistoryContainer extends Component {
diff --git a/plugins/talk-plugin-profile-data/client/hocs/index.js b/plugins/talk-plugin-profile-data/client/hocs/index.js
index a370c9ff0..c90ad21df 100644
--- a/plugins/talk-plugin-profile-data/client/hocs/index.js
+++ b/plugins/talk-plugin-profile-data/client/hocs/index.js
@@ -1,5 +1,7 @@
 import { withMutation } from 'plugin-api/beta/client/hocs';
 import { gql } from 'react-apollo';
+import moment from 'moment';
+import update from 'immutability-helper';
 
 export const withRequestDownloadLink = withMutation(
   gql`
@@ -17,3 +19,93 @@ export const withRequestDownloadLink = withMutation(
     }),
   }
 );
+
+export const withRequestAccountDeletion = withMutation(
+  gql`
+    mutation RequestAccountDeletion {
+      requestAccountDeletion {
+        ...RequestAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      requestAccountDeletion: () => {
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const RequestAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({
+              query: RequestAccountDeletionQuery,
+            });
+
+            const scheduledDeletionDate = moment()
+              .add(24, 'hours')
+              .toDate();
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: scheduledDeletionDate },
+              },
+            });
+
+            proxy.writeQuery({
+              query: RequestAccountDeletionQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);
+
+export const withCancelAccountDeletion = withMutation(
+  gql`
+    mutation RequestDownloadLink {
+      cancelAccountDeletion {
+        ...CancelAccountDeletionResponse
+      }
+    }
+  `,
+  {
+    props: ({ mutate }) => ({
+      cancelAccountDeletion: () => {
+        return mutate({
+          variables: {},
+          update: proxy => {
+            const CancelAccountDeletionQuery = gql`
+              query Talk_CancelAccountDeletion {
+                me {
+                  id
+                  scheduledDeletionDate
+                }
+              }
+            `;
+
+            const prev = proxy.readQuery({ query: CancelAccountDeletionQuery });
+
+            const data = update(prev, {
+              me: {
+                scheduledDeletionDate: { $set: null },
+              },
+            });
+
+            proxy.writeQuery({
+              query: CancelAccountDeletionQuery,
+              data,
+            });
+          },
+        });
+      },
+    }),
+  }
+);

From ea71b779d2df69464235a18f0627611304c06054 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 15:51:50 -0600
Subject: [PATCH 107/160] password patches

---
 .../client/components/ChangePassword.css        | 17 +++++++++++------
 .../client/components/DeleteMyAccountDialog.js  |  2 +-
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
index af59ae65f..0df8eb409 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
@@ -1,22 +1,27 @@
 .container {
   position: relative;
   color: #202020;
-  padding: 10px;
   border-radius: 2px;
   border: solid 1px transparent;
   box-sizing: border-box;
   justify-content: space-between;
-  
+
   &.editing {
+    padding: 10px;
     border-color: #979797;
     background-color: #EDEDED;
+
+    .actions {
+      top: 10px;
+      right: 10px;
+    }
   }
 }
 
 .actions {
   position: absolute;
-  top: 10px;
-  right: 10px;
+  top: 0px;
+  right: 0px;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -35,7 +40,7 @@
 }
 
 .detailLink {
-  color: #00538A;  
+  color: #00538A;
   text-decoration: none;
   font-size: 0.9em;
   &:hover {
@@ -59,7 +64,7 @@
   > i {
     font-size: 17px;
   }
-    
+
   &:hover {
     background-color: #399ee2;
     color: white;
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
index 9264bb75c..584fbb1b8 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.js
@@ -97,7 +97,7 @@ DeleteMyAccountDialog.propTypes = {
   showDialog: PropTypes.bool.isRequired,
   closeDialog: PropTypes.func.isRequired,
   requestAccountDeletion: PropTypes.func.isRequired,
-  scheduledDeletionDate: PropTypes.any.isRequired,
+  scheduledDeletionDate: PropTypes.any,
   organizationContactEmail: PropTypes.string.isRequired,
 };
 

From fa66f07db6cbd8bf915a07e327186a387f4b8caa Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 15:58:52 -0600
Subject: [PATCH 108/160] standardized styles, fixed mutation bug

---
 .../client/components/DeleteMyAccount.css     | 23 -------------
 .../client/components/DeleteMyAccount.js      | 34 +++----------------
 .../client/graphql.js                         |  2 +-
 3 files changed, 6 insertions(+), 53 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css
index e524d990a..e69de29bb 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.css
@@ -1,23 +0,0 @@
-.button {
-  color: #787D80;
-  border-radius: 2px;
-  border: 1px solid #787d80;
-  background-color: transparent;
-  height: 30px;
-  font-size: 0.9em;
-  line-height: normal;
-
-  &:hover {
-    background-color: #eaeaea;
-  }
-
-  &.secondary {
-    background-color: #787D80;
-    color: white;
-  }
-
-  > i { 
-    font-size: 1.2em;
-    vertical-align: middle;
-  }
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index bbaca5b96..bbada134f 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -1,8 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import cn from 'classnames';
 import moment from 'moment';
-import styles from './DeleteMyAccount.css';
 import { Button } from 'plugin-api/beta/client/components/ui';
 import DeleteMyAccountDialog from './DeleteMyAccountDialog';
 import { getErrorMessages } from 'coral-framework/utils';
@@ -59,28 +57,13 @@ class DeleteMyAccount extends React.Component {
           scheduledDeletionDate={scheduledDeletionDate}
           organizationContactEmail={organizationContactEmail}
         />
-        <h3
-          className={cn(
-            styles.title,
-            'talk-plugin-auth--delete-my-account-description'
-          )}
-        >
+        <h3 className="talk-plugin-auth--delete-my-account-description">
           {t('delete_request.delete_my_account')}
         </h3>
-        <p
-          className={cn(
-            styles.description,
-            'talk-plugin-auth--delete-my-account-description'
-          )}
-        >
+        <p className="talk-plugin-auth--delete-my-account-description">
           {t('delete_request.delete_my_account_description')}
         </p>
-        <p
-          className={cn(
-            styles.description,
-            'talk-plugin-auth--delete-my-account-description'
-          )}
-        >
+        <p className="talk-plugin-auth--delete-my-account-description">
           {scheduledDeletionDate &&
             t(
               'delete_request.already_submitted_request_description',
@@ -88,18 +71,11 @@ class DeleteMyAccount extends React.Component {
             )}
         </p>
         {scheduledDeletionDate ? (
-          <Button
-            className={cn(styles.button, styles.secondary)}
-            onClick={this.cancelAccountDeletion}
-          >
+          <Button onClick={this.cancelAccountDeletion}>
             {t('delete_request.cancel_account_deletion_request')}
           </Button>
         ) : (
-          <Button
-            className={cn(styles.button)}
-            icon="delete"
-            onClick={this.showDialog}
-          >
+          <Button icon="delete" onClick={this.showDialog}>
             {t('delete_request.delete_my_account')}
           </Button>
         )}
diff --git a/plugins/talk-plugin-profile-data/client/graphql.js b/plugins/talk-plugin-profile-data/client/graphql.js
index e0c459f7e..9b3711bfc 100644
--- a/plugins/talk-plugin-profile-data/client/graphql.js
+++ b/plugins/talk-plugin-profile-data/client/graphql.js
@@ -10,7 +10,7 @@ export default {
     ),
   },
   mutations: {
-    RequestDownloadLink: () => ({
+    DownloadCommentHistory: () => ({
       updateQueries: {
         CoralEmbedStream_Profile: previousData =>
           update(previousData, {

From 949925586f414cb54dc4aa0621174b4ce1f2c838 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 17:50:53 -0600
Subject: [PATCH 109/160] handle confirmed email better

---
 .../talk-plugin-local-auth/client/graphql.js  | 34 +++++++++++++++++++
 .../talk-plugin-local-auth/client/index.js    |  2 ++
 .../talk-plugin-local-auth/server/mutators.js |  1 +
 services/users.js                             |  5 ++-
 4 files changed, 41 insertions(+), 1 deletion(-)
 create mode 100644 plugins/talk-plugin-local-auth/client/graphql.js

diff --git a/plugins/talk-plugin-local-auth/client/graphql.js b/plugins/talk-plugin-local-auth/client/graphql.js
new file mode 100644
index 000000000..67fde246a
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/graphql.js
@@ -0,0 +1,34 @@
+import update from 'immutability-helper';
+import get from 'lodash/get';
+
+export default {
+  mutations: {
+    UpdateEmailAddress: () => ({
+      updateQueries: {
+        CoralEmbedStream_Profile: previousData => {
+          // Find the local profile (if they have one).
+          const localIndex = get(previousData, 'me.profiles', []).indexOf(
+            ({ provider }) => provider === 'local'
+          );
+          if (localIndex < 0) {
+            return previousData;
+          }
+
+          // Mutate the confirmedAt, because we changed the email address, they
+          // can't possibly be confirmed now as well.
+          return update(previousData, {
+            me: {
+              profiles: {
+                [localIndex]: {
+                  confirmedAt: {
+                    $set: null,
+                  },
+                },
+              },
+            },
+          });
+        },
+      },
+    }),
+  },
+};
diff --git a/plugins/talk-plugin-local-auth/client/index.js b/plugins/talk-plugin-local-auth/client/index.js
index c669effaa..d5f9f8636 100644
--- a/plugins/talk-plugin-local-auth/client/index.js
+++ b/plugins/talk-plugin-local-auth/client/index.js
@@ -1,6 +1,7 @@
 import ChangePassword from './containers/ChangePassword';
 import Profile from './containers/Profile';
 import translations from './translations.yml';
+import graphql from './graphql';
 
 export default {
   translations,
@@ -8,4 +9,5 @@ export default {
     profileHeader: [Profile],
     profileSettings: [ChangePassword],
   },
+  ...graphql,
 };
diff --git a/plugins/talk-plugin-local-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
index cb34bed7a..6798584f5 100644
--- a/plugins/talk-plugin-local-auth/server/mutators.js
+++ b/plugins/talk-plugin-local-auth/server/mutators.js
@@ -43,6 +43,7 @@ async function updateUserEmailAddress(ctx, email, confirmPassword) {
     },
     {
       $set: { 'profiles.$.id': email },
+      $unset: { 'profiles.$.metadata.confirmed_at': 1 },
     }
   );
 
diff --git a/services/users.js b/services/users.js
index 1e84c8ff1..d5486b3f8 100644
--- a/services/users.js
+++ b/services/users.js
@@ -32,6 +32,7 @@ const i18n = require('./i18n');
 const Wordlist = require('./wordlist');
 const DomainList = require('./domain_list');
 const Limit = require('./limit');
+const { get } = require('lodash');
 
 const EMAIL_CONFIRM_JWT_SUBJECT = 'email_confirm';
 const PASSWORD_RESET_JWT_SUBJECT = 'password_reset';
@@ -965,7 +966,9 @@ class Users {
       throw new ErrNotFound();
     }
 
-    if (profile.metadata && profile.metadata.confirmed_at !== null) {
+    // Check to see if the profile has already been confirmed.
+    const confirmedAt = get(profile, 'metadata.confirmed_at', null);
+    if (confirmedAt && confirmedAt < Date.now()) {
       throw new ErrEmailAlreadyVerified();
     }
 

From 15df20e72056739c0a200db23cb81f87c751cda4 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Thu, 3 May 2018 17:57:09 -0600
Subject: [PATCH 110/160] fix

---
 plugins/talk-plugin-local-auth/client/graphql.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/graphql.js b/plugins/talk-plugin-local-auth/client/graphql.js
index 67fde246a..eddf58315 100644
--- a/plugins/talk-plugin-local-auth/client/graphql.js
+++ b/plugins/talk-plugin-local-auth/client/graphql.js
@@ -1,5 +1,6 @@
 import update from 'immutability-helper';
 import get from 'lodash/get';
+import findIndex from 'lodash/findIndex';
 
 export default {
   mutations: {
@@ -7,9 +8,9 @@ export default {
       updateQueries: {
         CoralEmbedStream_Profile: previousData => {
           // Find the local profile (if they have one).
-          const localIndex = get(previousData, 'me.profiles', []).indexOf(
-            ({ provider }) => provider === 'local'
-          );
+          const localIndex = findIndex(get(previousData, 'me.profiles', []), {
+            provider: 'local',
+          });
           if (localIndex < 0) {
             return previousData;
           }

From eabcbc36c64cda59810a89967cb958fe55377a03 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Fri, 4 May 2018 13:34:20 -0300
Subject: [PATCH 111/160] forgot password

---
 .../client/components/ChangePassword.js       | 23 ++++++++++++++-
 .../client/containers/ChangePassword.js       | 29 +++++++++++++++----
 .../client/translations.yml                   |  2 ++
 3 files changed, 47 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index e5535b8ba..04d420d22 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -125,6 +125,23 @@ class ChangePassword extends React.Component {
     this.disableEditing();
   };
 
+  onForgotPassword = async () => {
+    const { root: { me: { email } } } = this.props;
+
+    try {
+      await this.props.forgotPassword(email);
+      this.props.notify(
+        'success',
+        t('talk-plugin-local-auth.change_password.forgot_password_sent')
+      );
+    } catch (err) {
+      this.props.notify('error', getErrorMessages(err));
+    }
+
+    this.clearForm();
+    this.disableEditing();
+  };
+
   disableEditing = () => {
     this.setState({
       editing: false,
@@ -166,7 +183,10 @@ class ChangePassword extends React.Component {
               showErrors
             >
               <span className={styles.detailBottomBox}>
-                <a className={styles.detailLink}>
+                <a
+                  className={styles.detailLink}
+                  onClick={this.onForgotPassword}
+                >
                   {t('talk-plugin-local-auth.change_password.forgot_password')}
                 </a>
               </span>
@@ -223,6 +243,7 @@ class ChangePassword extends React.Component {
 
 ChangePassword.propTypes = {
   changePassword: PropTypes.func.isRequired,
+  forgotPassword: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
 };
 
diff --git a/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js b/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
index 1322a2940..dfcf4a143 100644
--- a/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
@@ -1,12 +1,29 @@
-import { compose } from 'react-apollo';
+import { compose, gql } from 'react-apollo';
 import { bindActionCreators } from 'redux';
-import { connect } from 'plugin-api/beta/client/hocs';
+import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import ChangePassword from '../components/ChangePassword';
 import { notify } from 'coral-framework/actions/notification';
-import { withChangePassword } from 'plugin-api/beta/client/hocs';
+import {
+  withChangePassword,
+  withForgotPassword,
+} from 'plugin-api/beta/client/hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
 
-export default compose(connect(null, mapDispatchToProps), withChangePassword)(
-  ChangePassword
-);
+const withData = withFragments({
+  root: gql`
+    fragment TalkPluginLocalAuth_ChangePassword_root on RootQuery {
+      me {
+        id
+        email
+      }
+    }
+  `,
+});
+
+export default compose(
+  connect(null, mapDispatchToProps),
+  withChangePassword,
+  withForgotPassword,
+  withData
+)(ChangePassword);
diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
index d3b323f54..0c3216009 100644
--- a/plugins/talk-plugin-local-auth/client/translations.yml
+++ b/plugins/talk-plugin-local-auth/client/translations.yml
@@ -9,6 +9,7 @@ en:
       cancel: "Cancel"
       edit: "Edit"
       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"
       save: "Save"
@@ -46,6 +47,7 @@ es:
       cancel: "Cancelar"
       edit: "Editar"
       changed_password_msg: "Contraseña Actualizada - Tu contraseña ha sido exitosamente actualizada"
+      forgot_password_sent: "Contraseña Olvidada - Te enviamos un email para recuperar tu contraseña"
     change_username:
       change_username_note: "El usuario puede ser cambiado cada 14 días"
       save: "Guardar"

From 9a8f0e98a43afb16cfbf1f4961a127827c0902f1 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 4 May 2018 11:16:53 -0600
Subject: [PATCH 112/160] Username Change Fixes

---
 .../components/ChangeEmailContentDialog.js    |  10 +-
 .../components/ChangeUsernameContentDialog.js |  25 ++-
 .../client/components/Profile.css             |  28 ++--
 .../client/components/Profile.js              | 149 ++++++++++--------
 .../client/containers/Profile.js              |   4 +-
 .../client/translations.yml                   |  11 +-
 6 files changed, 120 insertions(+), 107 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index 4bc15757e..438acc398 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
@@ -16,7 +16,8 @@ class ChangeEmailContentDialog extends React.Component {
     });
   };
 
-  confirmChanges = async () => {
+  confirmChanges = async e => {
+    e.preventDefault();
     await this.props.save();
     this.props.next();
   };
@@ -44,7 +45,7 @@ class ChangeEmailContentDialog extends React.Component {
               {this.props.formData.newEmail}
             </span>
           </div>
-          <form>
+          <form onSubmit={this.confirmChanges}>
             <InputField
               id="confirmPassword"
               label={t('talk-plugin-local-auth.change_email.enter_password')}
@@ -67,10 +68,7 @@ class ChangeEmailContentDialog extends React.Component {
             <Button className={styles.cancel} onClick={this.props.cancel}>
               {t('talk-plugin-local-auth.change_email.cancel')}
             </Button>
-            <Button
-              className={styles.confirmChanges}
-              onClick={this.confirmChanges}
-            >
+            <Button className={styles.confirmChanges} type="submit">
               {t('talk-plugin-local-auth.change_email.confirm_change')}
             </Button>
           </div>
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
index 894bdcbd6..917d77782 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
@@ -16,7 +16,9 @@ class ChangeUsernameContentDialog extends React.Component {
     });
   };
 
-  confirmChanges = async () => {
+  confirmChanges = async e => {
+    e.preventDefault();
+
     if (this.formHasError()) {
       this.showError();
       return;
@@ -60,7 +62,7 @@ class ChangeUsernameContentDialog extends React.Component {
               {this.props.formData.newUsername}
             </span>
           </div>
-          <form>
+          <form onSubmit={this.confirmChanges}>
             <InputField
               id="confirmNewUsername"
               label="Re-enter new username"
@@ -81,18 +83,15 @@ class ChangeUsernameContentDialog extends React.Component {
                 {t('talk-plugin-local-auth.change_username.bottom_note')}
               </span>
             </InputField>
+            <div className={styles.bottomActions}>
+              <Button className={styles.cancel} onClick={this.props.cancel}>
+                {t('talk-plugin-local-auth.change_username.cancel')}
+              </Button>
+              <Button className={styles.confirmChanges} type="submit">
+                {t('talk-plugin-local-auth.change_username.confirm_changes')}
+              </Button>
+            </div>
           </form>
-          <div className={styles.bottomActions}>
-            <Button className={styles.cancel} onClick={this.props.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>
       </div>
     );
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.css b/plugins/talk-plugin-local-auth/client/components/Profile.css
index 5b4631ecf..dcdbdd2ae 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.css
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.css
@@ -7,30 +7,38 @@
   border-radius: 2px;
   box-sizing: border-box;
   justify-content: space-between;
-  
-  &.editing { 
+
+  &.editing {
     background-color: #EDEDED;
   }
 }
 
+.wrapper {
+  display: flex;
+  position: relative;
+  box-sizing: inherit;
+  justify-content: inherit;
+  flex-grow: 1;
+}
+
 .content {
   flex-grow: 1;
-} 
+}
 
 .actions {
   flex-grow: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
-}                                                                       
+}
 
 .email {
   margin: 0;
 }
 
-.username {   
+.username {
   margin-bottom: 4px;
-}         
+}
 
 .button {
   border: 1px solid #787d80;
@@ -48,7 +56,7 @@
   > i {
     font-size: 17px;
   }
-    
+
   &:hover {
     background-color: #399ee2;
     color: white;
@@ -82,13 +90,13 @@
   height: 30px;
   display: inline-block;
   width: 230px;
-  display: flex;  
+  display: flex;
 
   > .detailLabelIcon {
     font-size: 1.2em;
     padding: 0 5px;
     color: #787D80;
-    line-height: 30px; 
+    line-height: 30px;
   }
 
   &.disabled {
@@ -115,7 +123,7 @@
   list-style: none;
   margin: 0;
   padding: 0;
-} 
+}
 
 .detailItem {
   margin-bottom: 12px;
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 949923e77..85c1f1295 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.js
@@ -50,8 +50,12 @@ class Profile extends React.Component {
     });
   };
 
-  onSave = async () => {
-    this.showDialog();
+  onSave = async e => {
+    e.preventDefault();
+
+    if (this.isSaveEnabled()) {
+      this.showDialog();
+    }
   };
 
   addError = err => {
@@ -121,10 +125,10 @@ class Profile extends React.Component {
 
   saveUsername = async () => {
     const { newUsername } = this.state.formData;
-    const { changeUsername } = this.props;
+    const { setUsername } = this.props;
 
     try {
-      await changeUsername(this.props.root.me.id, newUsername);
+      await setUsername(newUsername);
       this.props.notify(
         'success',
         t('talk-plugin-local-auth.change_username.changed_username_success_msg')
@@ -163,6 +167,8 @@ class Profile extends React.Component {
     } = this.props;
     const { editing, formData, showDialog } = this.state;
 
+    const usernameCanBeUpdated = canUsernameBeUpdated(status);
+
     return (
       <section
         className={cn(
@@ -178,15 +184,17 @@ class Profile extends React.Component {
           closeDialog={this.closeDialog}
           finish={this.finish}
         >
-          <ChangeUsernameContentDialog
-            notify={notify}
-            canUsernameBeUpdated={canUsernameBeUpdated(status)}
-            save={this.saveUsername}
-            onChange={this.onChange}
-            formData={this.state.formData}
-            username={username}
-            enable={formData.newUsername && username !== formData.newUsername}
-          />
+          {usernameCanBeUpdated && (
+            <ChangeUsernameContentDialog
+              notify={notify}
+              canUsernameBeUpdated={usernameCanBeUpdated}
+              save={this.saveUsername}
+              onChange={this.onChange}
+              formData={this.state.formData}
+              username={username}
+              enable={formData.newUsername && username !== formData.newUsername}
+            />
+          )}
           <ChangeEmailContentDialog
             save={this.saveEmail}
             onChange={this.onChange}
@@ -197,63 +205,65 @@ class Profile extends React.Component {
         </ConfirmChangesDialog>
 
         {editing ? (
-          <div className={styles.content}>
-            <div className={styles.detailList}>
-              <InputField
-                icon="person"
-                id="newUsername"
-                name="newUsername"
-                onChange={this.onChange}
-                defaultValue={username}
-                validationType="username"
-                columnDisplay
-              >
-                <span className={styles.bottomText}>
-                  {t(
-                    'talk-plugin-local-auth.change_username.change_username_note'
-                  )}
-                </span>
-              </InputField>
-              <InputField
-                icon="email"
-                id="newEmail"
-                name="newEmail"
-                onChange={this.onChange}
-                defaultValue={email}
-                validationType="email"
-                columnDisplay
-              />
+          <form className={styles.wrapper} onSubmit={this.onSave}>
+            <div className={styles.content}>
+              <div className={styles.detailList}>
+                <InputField
+                  icon="person"
+                  id="newUsername"
+                  name="newUsername"
+                  onChange={this.onChange}
+                  defaultValue={username}
+                  validationType="username"
+                  disabled={!usernameCanBeUpdated}
+                  columnDisplay
+                >
+                  <span className={styles.bottomText}>
+                    {t(
+                      'talk-plugin-local-auth.change_username.change_username_note'
+                    )}
+                  </span>
+                </InputField>
+                <InputField
+                  icon="email"
+                  id="newEmail"
+                  name="newEmail"
+                  onChange={this.onChange}
+                  defaultValue={email}
+                  validationType="email"
+                  columnDisplay
+                />
+              </div>
             </div>
-          </div>
+            <div className={styles.actions}>
+              <Button
+                className={cn(styles.button, styles.saveButton)}
+                icon="save"
+                type="submit"
+                disabled={!this.isSaveEnabled()}
+              >
+                {t('talk-plugin-local-auth.change_username.save')}
+              </Button>
+              <a className={styles.cancelButton} onClick={this.cancel}>
+                {t('talk-plugin-local-auth.change_username.cancel')}
+              </a>
+            </div>
+          </form>
         ) : (
-          <div className={styles.content}>
-            <h2 className={styles.username}>{username}</h2>
-            {email ? <p className={styles.email}>{email}</p> : null}
-          </div>
-        )}
-        {editing ? (
-          <div className={styles.actions}>
-            <Button
-              className={cn(styles.button, styles.saveButton)}
-              icon="save"
-              onClick={this.onSave}
-              disabled={!this.isSaveEnabled()}
-            >
-              {t('talk-plugin-local-auth.change_username.save')}
-            </Button>
-            <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-local-auth.change_username.cancel')}
-            </a>
-          </div>
-        ) : (
-          <div className={styles.actions}>
-            <Button
-              className={styles.button}
-              icon="settings"
-              onClick={this.enableEditing}
-            >
-              {t('talk-plugin-local-auth.change_username.edit_profile')}
-            </Button>
+          <div className={styles.wrapper}>
+            <div className={styles.content}>
+              <h2 className={styles.username}>{username}</h2>
+              {email ? <p className={styles.email}>{email}</p> : null}
+            </div>
+            <div className={styles.actions}>
+              <Button
+                className={styles.button}
+                icon="settings"
+                onClick={this.enableEditing}
+              >
+                {t('talk-plugin-local-auth.change_username.edit_profile')}
+              </Button>
+            </div>
           </div>
         )}
       </section>
@@ -263,9 +273,8 @@ class Profile extends React.Component {
 
 Profile.propTypes = {
   updateEmailAddress: PropTypes.func.isRequired,
-  changeUsername: PropTypes.func.isRequired,
+  setUsername: PropTypes.func.isRequired,
   root: PropTypes.object.isRequired,
-  changeUsername: PropTypes.func.isRequired,
   notify: PropTypes.func.isRequired,
   username: PropTypes.string,
   emailAddress: PropTypes.string,
diff --git a/plugins/talk-plugin-local-auth/client/containers/Profile.js b/plugins/talk-plugin-local-auth/client/containers/Profile.js
index e1ed99ef6..ccfca72ae 100644
--- a/plugins/talk-plugin-local-auth/client/containers/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/containers/Profile.js
@@ -3,7 +3,7 @@ import { bindActionCreators } from 'redux';
 import { connect, withFragments } from 'plugin-api/beta/client/hocs';
 import Profile from '../components/Profile';
 import { notify } from 'coral-framework/actions/notification';
-import { withChangeUsername } from 'plugin-api/beta/client/hocs';
+import { withSetUsername } from 'plugin-api/beta/client/hocs';
 import { withUpdateEmailAddress } from '../hocs';
 
 const mapDispatchToProps = dispatch => bindActionCreators({ notify }, dispatch);
@@ -33,7 +33,7 @@ const withData = withFragments({
 
 export default compose(
   connect(null, mapDispatchToProps),
-  withChangeUsername,
+  withSetUsername,
   withUpdateEmailAddress,
   withData
 )(Profile);
diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
index 2b46a0464..059e497db 100644
--- a/plugins/talk-plugin-local-auth/client/translations.yml
+++ b/plugins/talk-plugin-local-auth/client/translations.yml
@@ -22,19 +22,18 @@ en:
       confirm_changes: "Confirm Changes"
       username_does_not_match: "Username does not match"
       cant_be_equal: "Your new {0} must be different to your current one"
-      change_username_attempt: "Username can't be updated. Usernames can be changed every 14 days"
+      changed_username_success_msg: "Username Changed - Your username has been successfully changed. You will not be able to change your user name for 14 days."
+      change_username_attempt: "Username can't be updated. Usernames can only be changed every 14 days."
     change_email:
       confirm_email_change: "Confirm Email Address Change"
       description: "You are attempting to change your email address. Your new email address will be used for your login and to receive account notifications."
-      old_email: "Old Email Address" 
+      old_email: "Old Email Address"
       new_email: "New Email Address"
       enter_password: "Enter Password"
       incorrect_password: "Incorrect Password"
       confirm_change: "Confirm Change"
       cancel: "Cancel"
       change_email_msg: "Email Address Changed - Your email address has been successfully changed. This email address will now be used for signing in and email notifications."
-      changed_username_success_msg: "Username Changed - Your username has been successfully changed. You will not be able to change your user name for 14 days."
-      change_username_attempt: "Username can't be updated. Usernames can only be changed every 14 days."
     add_email:
       add_email_address: "Add Email Address"
       enter_email_address: "Enter Email Address:"
@@ -52,7 +51,7 @@ en:
       verify:
         title: "Verify Your Email Address"
         description:  "We’ve sent an email to {0} to verify your account. You must verify your email address so that it can be used for account change confirmations and notifications."
-      added: 
+      added:
         title: "Email Address Added"
         description: "Your email address has been added to your account."
         subtitle: "Need to change your email address?"
@@ -82,4 +81,4 @@ es:
       confirm_changes: "Confirmar Cambios"
       username_does_not_match: "El usuario no coincide"
       changed_username_success_msg: "Usuario Actualizado - Tu usuario ha sido exitosamente actualizado. No podrás cambiar el usuario por 14 días."
-      change_username_attempt: "El usuario no puede ser actualizado. Los usuarios pueden ser cambiados cada 14 días."
\ No newline at end of file
+      change_username_attempt: "El usuario no puede ser actualizado. Los usuarios pueden ser cambiados cada 14 días."

From 4bc8a167a4a2446ecb334992b2d6fa6ff45fd702 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Fri, 4 May 2018 19:29:05 +0200
Subject: [PATCH 113/160] Styling tweaks

---
 .../client/components/ChangePassword.css      |  9 ++++---
 .../client/components/Profile.css             | 27 ++++++++++---------
 2 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
index 0df8eb409..c1c6c9c7c 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.css
@@ -5,22 +5,25 @@
   border: solid 1px transparent;
   box-sizing: border-box;
   justify-content: space-between;
+  margin: 16px 0;
 
   &.editing {
     padding: 10px;
-    border-color: #979797;
     background-color: #EDEDED;
 
     .actions {
       top: 10px;
       right: 10px;
     }
+    .title {
+      margin-bottom: 1em;
+    }
   }
 }
 
 .actions {
   position: absolute;
-  top: 0px;
+  top: -6px;
   right: 0px;
   display: flex;
   flex-direction: column;
@@ -29,7 +32,7 @@
 
 .title {
   color: #202020;
-  margin: 0 0 20px;
+  margin: 0;
 }
 
 .detailBottomBox {
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.css b/plugins/talk-plugin-local-auth/client/components/Profile.css
index 5b4631ecf..30b75f451 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.css
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.css
@@ -1,36 +1,39 @@
 .container {
-  margin-bottom: 20px;
+  margin-top: 6px;
+  margin-bottom: 12px;
   display: flex;
   position: relative;
   color: #202020;
-  padding: 10px;
+  padding: 5px;
   border-radius: 2px;
   box-sizing: border-box;
   justify-content: space-between;
-  
-  &.editing { 
+
+  &.editing {
+    padding: 10px;
     background-color: #EDEDED;
   }
 }
 
 .content {
   flex-grow: 1;
-} 
+}
 
 .actions {
   flex-grow: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
-}                                                                       
+}
 
 .email {
   margin: 0;
 }
 
-.username {   
+.username {
+  margin-top: 0;
   margin-bottom: 4px;
-}         
+}
 
 .button {
   border: 1px solid #787d80;
@@ -48,7 +51,7 @@
   > i {
     font-size: 17px;
   }
-    
+
   &:hover {
     background-color: #399ee2;
     color: white;
@@ -82,13 +85,13 @@
   height: 30px;
   display: inline-block;
   width: 230px;
-  display: flex;  
+  display: flex;
 
   > .detailLabelIcon {
     font-size: 1.2em;
     padding: 0 5px;
     color: #787D80;
-    line-height: 30px; 
+    line-height: 30px;
   }
 
   &.disabled {
@@ -115,7 +118,7 @@
   list-style: none;
   margin: 0;
   padding: 0;
-} 
+}
 
 .detailItem {
   margin-bottom: 12px;

From d41984f171e0b00dfdb1e4670b5340597b184136 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Fri, 4 May 2018 19:32:29 +0200
Subject: [PATCH 114/160] Remove unused field

---
 .../talk-plugin-local-auth/client/containers/ChangePassword.js   | 1 -
 1 file changed, 1 deletion(-)

diff --git a/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js b/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
index dfcf4a143..11bd5c5fb 100644
--- a/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/containers/ChangePassword.js
@@ -14,7 +14,6 @@ const withData = withFragments({
   root: gql`
     fragment TalkPluginLocalAuth_ChangePassword_root on RootQuery {
       me {
-        id
         email
       }
     }

From 2a5075f434d21394a86e6977e3c6ce895ecb4681 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 4 May 2018 11:33:06 -0600
Subject: [PATCH 115/160] Form update

---
 .../client/components/ChangePassword.js       | 43 +++++++++++--------
 1 file changed, 25 insertions(+), 18 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 04d420d22..8f86fff48 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -105,7 +105,13 @@ class ChangePassword extends React.Component {
     this.setState(initialState);
   };
 
-  onSave = async () => {
+  onSave = async e => {
+    e.preventDefault();
+
+    if (this.isSubmitBlocked()) {
+      return;
+    }
+
     const { oldPassword, newPassword } = this.state.formData;
 
     try {
@@ -169,8 +175,11 @@ class ChangePassword extends React.Component {
         <h3 className={styles.title}>
           {t('talk-plugin-local-auth.change_password.change_password')}
         </h3>
-        {editing && (
-          <form className="talk-plugin-local-auth--change-password-form">
+        {editing ? (
+          <form
+            className="talk-plugin-local-auth--change-password-form"
+            onSubmit={this.onSave}
+          >
             <InputField
               id="oldPassword"
               label="Old Password"
@@ -213,22 +222,20 @@ class ChangePassword extends React.Component {
               errorMsg={errors['confirmNewPassword']}
               showErrors
             />
+            <div className={styles.actions}>
+              <Button
+                className={cn(styles.button, styles.saveButton)}
+                icon="save"
+                type="submit"
+                disabled={this.isSubmitBlocked()}
+              >
+                {t('talk-plugin-local-auth.change_password.save')}
+              </Button>
+              <a className={styles.cancelButton} onClick={this.cancel}>
+                {t('talk-plugin-local-auth.change_password.cancel')}
+              </a>
+            </div>
           </form>
-        )}
-        {editing ? (
-          <div className={styles.actions}>
-            <Button
-              className={cn(styles.button, styles.saveButton)}
-              icon="save"
-              onClick={this.onSave}
-              disabled={this.isSubmitBlocked()}
-            >
-              {t('talk-plugin-local-auth.change_password.save')}
-            </Button>
-            <a className={styles.cancelButton} onClick={this.cancel}>
-              {t('talk-plugin-local-auth.change_password.cancel')}
-            </a>
-          </div>
         ) : (
           <div className={styles.actions}>
             <Button className={styles.button} onClick={this.enableEditing}>

From 6bad9e530687880ed4fc81c593f03e9171915c48 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Fri, 4 May 2018 11:50:37 -0600
Subject: [PATCH 116/160] Fixed bug with button placement

---
 .../components/ChangeEmailContentDialog.js       | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index 438acc398..1f1719444 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
@@ -63,15 +63,15 @@ class ChangeEmailContentDialog extends React.Component {
               columnDisplay
               showSuccess={false}
             />
+            <div className={styles.bottomActions}>
+              <Button className={styles.cancel} onClick={this.props.cancel}>
+                {t('talk-plugin-local-auth.change_email.cancel')}
+              </Button>
+              <Button className={styles.confirmChanges} type="submit">
+                {t('talk-plugin-local-auth.change_email.confirm_change')}
+              </Button>
+            </div>
           </form>
-          <div className={styles.bottomActions}>
-            <Button className={styles.cancel} onClick={this.props.cancel}>
-              {t('talk-plugin-local-auth.change_email.cancel')}
-            </Button>
-            <Button className={styles.confirmChanges} type="submit">
-              {t('talk-plugin-local-auth.change_email.confirm_change')}
-            </Button>
-          </div>
         </div>
       </div>
     );

From 7a7dcdd7c63744e577cd69e2407fd914f28d660b Mon Sep 17 00:00:00 2001
From: Jero <jero@daneel.net>
Date: Fri, 4 May 2018 16:35:24 -0300
Subject: [PATCH 117/160] corrections in spanish translations

---
 locales/es.yml | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/locales/es.yml b/locales/es.yml
index 702f6b9e0..a6d35ef0d 100644
--- a/locales/es.yml
+++ b/locales/es.yml
@@ -63,10 +63,10 @@ es:
     reactions: 'reacciones'
     story: 'Artículo'
   flagged_usernames:
-    notify_approved: '{0} nombre de usuario aprobado {1}'
-    notify_rejected: '{0} nombre de usuario rechazado {1}'
-    notify_flagged: '{0} nombre de usuario reportado {1}'
-    notify_changed: 'El usuario {0} cambio su nombre de usuario por {1}'
+    notify_approved: '{0} ha aprobado el nombre de usuario {1}'
+    notify_rejected: '{0} ha rechazado el nombre de usuario {1}'
+    notify_flagged: '{0} ha reportado el nombre de usuario {1}'
+    notify_changed: 'El usuario {0} ha modificado su nombre de usuario por {1}'
   community:
     account_creation_date: "Fecha de creación de la cuenta"
     active: Activa
@@ -194,9 +194,9 @@ es:
     minutes_plural: "minutos"
   email:
     suspended:
-      subject: "Su cuenta fue suspendida"
+      subject: "Su cuenta ha sido suspendida"
     banned:
-      subject: "Su cuenta fue bloqueada"
+      subject: "Su cuenta ha sido bloqueada"
       body: "De acuerdo con las guías de comunidad de The Coral Project, su cuenta a sido bloqueada. No podrá hacer comentarios, reportar o entrar en contacto con nuestra comunidad."
     confirm:
       has_been_requested: "Un correo de confirmación ha sido pedido para la siguiente cuenta:"
@@ -306,11 +306,11 @@ es:
     actions: Acciones
     all: todos
     all_streams: "Todos los Hilos"
-    notify_edited: '{0} comentarios editados "{1}"'
-    notify_accepted: '{0} comentarios aceptados "{1}"'
-    notify_rejected: '{0} comentarios rechazados "{1}"'
-    notify_flagged: '{0} comentarios reportados "{1}"'
-    notify_reset: '{0} resetear el status de comentarios "{1}"'
+    notify_edited: '{0} ha editado el comentario "{1}"'
+    notify_accepted: '{0} ha aceptado el comentario "{1}"'
+    notify_rejected: '{0} ha rechazado el comentario "{1}"'
+    notify_flagged: '{0} ha reportado el comentario "{1}"'
+    notify_reset: '{0} ha reseteado el status del comentario "{1}"'
     approve: "Aprobar"
     approved: "Aprobado"
     ban_user: "Bloquear"

From 4312b8d02468e7d235f832eddf09b398cf683d86 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Fri, 4 May 2018 17:49:40 -0300
Subject: [PATCH 118/160] bug

---
 .../client/components/ChangePassword.js                   | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 8f86fff48..1b7b97dfc 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -160,7 +160,7 @@ class ChangePassword extends React.Component {
   };
 
   render() {
-    const { editing, errors } = this.state;
+    const { editing, errors, showErrors } = this.state;
 
     return (
       <section
@@ -189,7 +189,7 @@ class ChangePassword extends React.Component {
               value={this.state.formData.oldPassword}
               hasError={this.hasError('oldPassword')}
               errorMsg={errors['oldPassword']}
-              showErrors
+              showError={showErrors}
             >
               <span className={styles.detailBottomBox}>
                 <a
@@ -209,7 +209,7 @@ class ChangePassword extends React.Component {
               value={this.state.formData.newPassword}
               hasError={this.hasError('newPassword')}
               errorMsg={errors['newPassword']}
-              showErrors
+              showError={showErrors}
             />
             <InputField
               id="confirmNewPassword"
@@ -220,7 +220,7 @@ class ChangePassword extends React.Component {
               value={this.state.formData.confirmNewPassword}
               hasError={this.hasError('confirmNewPassword')}
               errorMsg={errors['confirmNewPassword']}
-              showErrors
+              showError={showErrors}
             />
             <div className={styles.actions}>
               <Button

From 7cf991d67271de33825f37c5d0703279d22fd0df Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Fri, 4 May 2018 17:03:22 -0400
Subject: [PATCH 119/160] Change copy

---
 plugins/talk-plugin-profile-data/server/router.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/server/router.js b/plugins/talk-plugin-profile-data/server/router.js
index 2a2e0161a..6d8f47d03 100644
--- a/plugins/talk-plugin-profile-data/server/router.js
+++ b/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.

From 8b5cb9d96ddbfb9fc31b24af1ce76dc08ace3631 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Fri, 4 May 2018 17:36:05 -0400
Subject: [PATCH 120/160] Copy tweaks

---
 plugins/talk-plugin-local-auth/client/translations.yml   | 2 +-
 plugins/talk-plugin-profile-data/client/translations.yml | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
index 8a3d7c90e..90c25ae0a 100644
--- a/plugins/talk-plugin-local-auth/client/translations.yml
+++ b/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"
diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index f38958e7f..e139cfb57 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/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"

From ce9276521854ca248885f5203539a52e32e183ba Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Fri, 4 May 2018 17:40:10 -0400
Subject: [PATCH 121/160] Swap DeletedOn and DeletedFor

---
 .../client/components/AccountDeletionRequestedSign.js         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js b/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
index 38d968c1d..f0e7be8f3 100644
--- a/plugins/talk-plugin-profile-data/client/components/AccountDeletionRequestedSign.js
+++ b/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}>

From 565ba2af065c87b1d827b446d067f6f4a55fe959 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 7 May 2018 17:54:59 +0200
Subject: [PATCH 122/160] Restore cancel buttons

---
 .../components/ChangeEmailContentDialog.js    |   6 +-
 .../client/components/ChangePassword.js       |  10 +-
 .../components/ChangeUsernameContentDialog.js |   6 +-
 .../components/ChangeUsernameDialog.css       |  84 ------------
 .../client/components/ChangeUsernameDialog.js | 120 ------------------
 .../client/components/Profile.js              |  10 +-
 6 files changed, 24 insertions(+), 212 deletions(-)
 delete mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
 delete mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index 1f1719444..62540927f 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
@@ -64,7 +64,11 @@ class ChangeEmailContentDialog extends React.Component {
               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">
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 8f86fff48..3e7210c10 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/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>
         ) : (
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
index 917d77782..3e7107922 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameContentDialog.js
+++ b/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">
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
deleted file mode 100644
index af681d596..000000000
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
+++ /dev/null
@@ -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;
-  }
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
deleted file mode 100644
index 097168b06..000000000
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
+++ /dev/null
@@ -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;
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 85c1f1295..e5d0276c7 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/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';
@@ -244,9 +244,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>
         ) : (

From 06abccabb4de53832a12f504e7c1c01b3ef788d3 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 7 May 2018 18:26:37 +0200
Subject: [PATCH 123/160] Fix InputField controlled / uncontrolled mode

---
 .../client/components/ChangePassword.js                   | 6 +++++-
 .../client/components/InputField.js                       | 8 ++++----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 8f86fff48..a375e90a4 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -14,7 +14,11 @@ const initialState = {
   editing: false,
   showErrors: true,
   errors: {},
-  formData: {},
+  formData: {
+    oldPassword: '',
+    newPassword: '',
+    confirmNewPassword: '',
+  },
 };
 
 class ChangePassword extends React.Component {
diff --git a/plugins/talk-plugin-local-auth/client/components/InputField.js b/plugins/talk-plugin-local-auth/client/components/InputField.js
index 930c15582..7dca22197 100644
--- a/plugins/talk-plugin-local-auth/client/components/InputField.js
+++ b/plugins/talk-plugin-local-auth/client/components/InputField.js
@@ -19,13 +19,13 @@ const InputField = ({
   showSuccess = false,
   validationType = '',
   icon = '',
-  value = '',
-  defaultValue = '',
+  value,
+  defaultValue,
   disabled = false,
 }) => {
   const inputValue = {
-    ...(value ? { value } : {}),
-    ...(defaultValue ? { defaultValue } : {}),
+    ...(value !== undefined ? { value } : {}),
+    ...(defaultValue !== undefined ? { defaultValue } : {}),
   };
 
   return (

From 46e5efbd559c02c6cae73589ef6e461de856f0f0 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Mon, 7 May 2018 15:00:55 -0300
Subject: [PATCH 124/160] validation for password input in change email

---
 .../components/ChangeEmailContentDialog.js    | 19 ++++++++++++-------
 .../client/components/Profile.js              |  7 +++++++
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
index 1f1719444..b80529d82 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangeEmailContentDialog.js
+++ b/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,15 +61,10 @@ 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}>
@@ -85,6 +88,8 @@ ChangeEmailContentDialog.propTypes = {
   onChange: PropTypes.func,
   formData: PropTypes.object,
   email: PropTypes.string,
+  hasError: PropTypes.func,
+  getError: PropTypes.func,
 };
 
 export default ChangeEmailContentDialog;
diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 85c1f1295..3a588951f 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.js
@@ -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>
 

From 4fb511e48832109e1322b51e1078b15458dc35f2 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 7 May 2018 21:07:46 +0200
Subject: [PATCH 125/160] Fix save icon

---
 plugins/talk-plugin-local-auth/client/components/Profile.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.css b/plugins/talk-plugin-local-auth/client/components/Profile.css
index 08187e238..920b93260 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.css
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.css
@@ -29,6 +29,7 @@
 
 .actions {
   flex-grow: 0;
+  flex-shrink: 0;
   display: flex;
   flex-direction: column;
   align-items: center;

From 8c2733734aaecbee013b14743030700d5ffccbb3 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 7 May 2018 22:16:36 +0200
Subject: [PATCH 126/160] Fix Add Email Dialog

---
 .../components/AddEmailAddressDialog.js       | 71 ++++++++++++-------
 .../client/components/AddEmailContent.js      | 20 +++---
 .../client/translations.yml                   |  1 +
 3 files changed, 56 insertions(+), 36 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index 691915c0f..0fd70b505 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -1,12 +1,10 @@
 import React from 'react';
-import isMatch from 'lodash/isEqual';
-import isEqualWith from 'lodash/isEqual';
 import PropTypes from 'prop-types';
 import { Dialog } from 'plugin-api/beta/client/components/ui';
 import validate from 'coral-framework/helpers/validate';
-import errorMsj from 'coral-framework/helpers/error';
 import { getErrorMessages } from 'coral-framework/utils';
 import styles from './AddEmailAddressDialog.css';
+import { t } from 'plugin-api/beta/client/services';
 
 import AddEmailContent from './AddEmailContent';
 import VerifyEmailAddress from './VerifyEmailAddress';
@@ -16,15 +14,39 @@ const initialState = {
   step: 0,
   showErrors: false,
   errors: {},
-  formData: {},
+  formData: {
+    emailAddress: '',
+    confirmPassword: '',
+    confirmEmailAddress: '',
+  },
 };
 
+const validateRequired = v =>
+  v ? '' : t('talk-plugin-local-auth.add_email.required_field');
+
+const validateRepeat = (key, msg) => (v, data) => (v !== data[key] ? msg : '');
+
+const validateEmail = v =>
+  validateRequired(v) || !validate.email(v)
+    ? t('talk-plugin-local-auth.add_email.invalid_email_address')
+    : '';
+
+const validatePassword = v => validateRequired(v);
+
 class AddEmailAddressDialog extends React.Component {
   state = initialState;
-  validKeys = ['emailAddress', 'confirmPassword', 'confirmEmailAddress'];
+
+  fields = {
+    emailAddress: validateEmail,
+    confirmPassword: validatePassword,
+    confirmEmailAddress: validateRepeat(
+      'emailAddress',
+      t('talk-plugin-local-auth.add_email.confirm_email_address')
+    ),
+  };
 
   onChange = e => {
-    const { name, value, type } = e.target;
+    const { name, value } = e.target;
     this.setState(
       state => ({
         formData: {
@@ -33,21 +55,19 @@ class AddEmailAddressDialog extends React.Component {
         },
       }),
       () => {
-        this.fieldValidation(value, type, name);
+        this.validate();
       }
     );
   };
 
-  fieldValidation = (value, type, name) => {
-    if (!value.length) {
-      this.addError({
-        [name]: 'Field is required',
-      });
-    } else if (!validate[type](value)) {
-      this.addError({ [name]: errorMsj[type] });
-    } else {
-      this.removeError(name);
+  validateField = (value, name) => {
+    const error = this.fields[name](value, this.state.formData);
+    if (error) {
+      this.addError({ [name]: error });
+      return false;
     }
+    this.removeError(name);
+    return true;
   };
 
   addError = err => {
@@ -56,6 +76,14 @@ class AddEmailAddressDialog extends React.Component {
     }));
   };
 
+  validate() {
+    let hasErrors = false;
+    Object.keys(this.state.formData).forEach(k => {
+      hasErrors = !this.validateField(this.state.formData[k], k) || hasErrors;
+    });
+    return !hasErrors;
+  }
+
   removeError = errKey => {
     this.setState(state => {
       const { [errKey]: _, ...errors } = state.errors;
@@ -70,14 +98,7 @@ class AddEmailAddressDialog extends React.Component {
   };
 
   formHasError = () => {
-    const formHasErrors = !!Object.keys(this.state.errors).length;
-    const formIncomplete = !isEqualWith(
-      Object.keys(this.state.formData),
-      this.validKeys,
-      isMatch
-    );
-
-    return formHasErrors || formIncomplete;
+    return !!Object.keys(this.state.errors).length;
   };
 
   showErrors = () => {
@@ -87,7 +108,7 @@ class AddEmailAddressDialog extends React.Component {
   };
 
   confirmChanges = async () => {
-    if (this.formHasError()) {
+    if (!this.validate()) {
       this.showErrors();
       return;
     }
diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
index 4a2ce7430..8d3fc308f 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailContent.js
@@ -48,9 +48,9 @@ const AddEmailContent = ({
         name="emailAddress"
         type="email"
         onChange={onChange}
-        defaultValue=""
-        hasError={!formData.emailAddress || errors.emailAddress}
-        errorMsg={t('talk-plugin-local-auth.add_email.invalid_email_address')}
+        value={formData.emailAddress}
+        hasError={!!errors.emailAddress}
+        errorMsg={errors.emailAddress}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
@@ -61,12 +61,9 @@ const AddEmailContent = ({
         name="confirmEmailAddress"
         type="email"
         onChange={onChange}
-        defaultValue=""
-        hasError={
-          !formData.emailAddress ||
-          formData.emailAddress !== formData.confirmEmailAddress
-        }
-        errorMsg={t('talk-plugin-local-auth.add_email.email_does_not_match')}
+        value={formData.confirmEmailAddress}
+        hasError={!!errors.confirmEmailAddress}
+        errorMsg={errors.confirmEmailAddress}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
@@ -77,8 +74,9 @@ const AddEmailContent = ({
         name="confirmPassword"
         type="password"
         onChange={onChange}
-        defaultValue=""
-        hasError={!formData.confirmPassword}
+        value={formData.confirmPassword}
+        hasError={!!errors.confirmPassword}
+        errorMsg={errors.confirmPassword}
         showError={showErrors}
         columnDisplay
         showSuccess={false}
diff --git a/plugins/talk-plugin-local-auth/client/translations.yml b/plugins/talk-plugin-local-auth/client/translations.yml
index 90c25ae0a..fcb80782a 100644
--- a/plugins/talk-plugin-local-auth/client/translations.yml
+++ b/plugins/talk-plugin-local-auth/client/translations.yml
@@ -42,6 +42,7 @@ en:
       confirm_email_address: "Confirm Email Address:"
       email_does_not_match: "Email Address does not match"
       insert_password: "Insert Password:"
+      required_field: "This field is required"
       done: "done"
       content:
         title: "Add an Email Address"

From 5953ed711ab903b3c49c166d34678044a3311cca Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Mon, 7 May 2018 22:21:25 +0200
Subject: [PATCH 127/160] Remove unused code

---
 .../client/components/AddEmailAddressDialog.js            | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
index 0fd70b505..dc7e0d974 100644
--- a/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
+++ b/plugins/talk-plugin-local-auth/client/components/AddEmailAddressDialog.js
@@ -93,14 +93,6 @@ class AddEmailAddressDialog extends React.Component {
     });
   };
 
-  hasError = err => {
-    return Object.keys(this.state.errors).indexOf(err) !== -1;
-  };
-
-  formHasError = () => {
-    return !!Object.keys(this.state.errors).length;
-  };
-
   showErrors = () => {
     this.setState({
       showErrors: true,

From 2b1108cd883affeab55491cad2486999793afb69 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 14:27:00 -0600
Subject: [PATCH 128/160] Settings Cache Refactor

---
 bin/cli-settings                              |  2 +-
 graph/loaders/assets.js                       |  2 +-
 graph/loaders/settings.js                     | 79 +++++++++++----
 graph/mutators/user.js                        |  6 +-
 graph/resolvers/asset.js                      |  9 +-
 graph/resolvers/comment.js                    | 10 +-
 graph/resolvers/root_query.js                 | 10 +-
 graph/resolvers/util.js                       |  7 +-
 middleware/staticTemplate.js                  |  2 +-
 models/schema/asset.js                        |  3 +-
 models/schema/setting.js                      | 17 ----
 package.json                                  |  1 +
 .../talk-plugin-local-auth/server/mutators.js |  6 +-
 .../talk-plugin-notifications/server/util.js  |  2 +-
 .../server/connect.js                         |  6 +-
 .../server/mutators.js                        |  6 +-
 services/assets.js                            | 47 +++------
 services/cache.js                             | 66 -------------
 services/comments.js                          |  2 +-
 services/domain_list.js                       |  4 +-
 services/moderation/index.js                  | 15 +--
 services/passport.js                          |  6 +-
 services/settings.js                          | 99 +++++++++----------
 services/setup.js                             |  2 +-
 services/tags.js                              | 50 ++++------
 services/wordlist.js                          |  6 +-
 yarn.lock                                     |  4 +
 27 files changed, 209 insertions(+), 260 deletions(-)

diff --git a/bin/cli-settings b/bin/cli-settings
index 72f42672d..05c7f2888 100755
--- a/bin/cli-settings
+++ b/bin/cli-settings
@@ -18,7 +18,7 @@ async function changeOrgName() {
     await cache.init();
 
     // Get the original settings.
-    const settings = await Settings.retrieve('organizationName');
+    const settings = await Settings.select('organizationName');
 
     const { organizationName } = await inquirer.prompt([
       {
diff --git a/graph/loaders/assets.js b/graph/loaders/assets.js
index 40305760c..868c8af68 100644
--- a/graph/loaders/assets.js
+++ b/graph/loaders/assets.js
@@ -71,7 +71,7 @@ const findOrCreateAssetByURL = async (ctx, url) => {
   // Check for whitelisting + get the settings at the same time.
   const [whitelisted, settings] = await Promise.all([
     DomainList.urlCheck(url),
-    Settings.load('autoCloseStream closedTimeout'),
+    Settings.select('autoCloseStream', 'closedTimeout'),
   ]);
 
   // If the domain wasn't whitelisted, then we shouldn't create this asset!
diff --git a/graph/loaders/settings.js b/graph/loaders/settings.js
index fa0a17459..a1329b619 100644
--- a/graph/loaders/settings.js
+++ b/graph/loaders/settings.js
@@ -1,23 +1,66 @@
-const SettingsService = require('../../services/settings');
+const Setting = require('../../models/setting');
+const Settings = require('../../services/settings');
 const DataLoader = require('dataloader');
+const { zipObject } = require('lodash');
 
 /**
- * Creates a set of loaders based on a GraphQL context.
- * @param  {Object} context the context of the GraphQL request
- * @return {Object}         object of loaders
+ * SettingsLoader manages loading specific fields only of the Settings object.
  */
-module.exports = () => {
-  const loader = new DataLoader(selections =>
-    Promise.all(
-      selections.map(fields => {
-        return SettingsService.retrieve(fields);
-      })
-    )
-  );
+class SettingsLoader {
+  constructor() {
+    this._loader = new DataLoader(this._batchLoadFn.bind(this));
+    this._cache = null;
+  }
 
-  return {
-    Settings: {
-      load: (fields = false) => loader.load(fields),
-    },
-  };
-};
+  async _batchLoadFn(fields) {
+    // Load a settings object with all the requested fields, unless we have the
+    // entire object cached, in which case we'll return the whole cache.
+    const model = this._cache
+      ? await this._cache
+      : await Settings.retrieve(...fields);
+
+    // Convert the model into an object for easier manipulation.
+    const obj = model.toObject();
+
+    // Return the specific fields for each of the fields that were loaded.
+    return fields.map(field => obj[field]);
+  }
+
+  /**
+   * load will return the entire Settings object with all fields.
+   */
+  load() {
+    if (this._cache) {
+      // Return the cached settings promise.
+      return this._cache;
+    }
+
+    // Create a promise that will return the settings object.
+    const promise = Settings.retrieve();
+
+    // Set this as the cached value.
+    this._cache = promise;
+
+    // Return the promised settings.
+    return promise;
+  }
+
+  /**
+   * select will return a promise which resolves to the Settings object that
+   * contains the requested fields only.
+   *
+   * @param {Array<String>} fields the fields from Settings we want to load.
+   */
+  async select(...fields) {
+    // Load all the values for the specific fields.
+    const values = await this._loader.loadMany(fields);
+
+    // Zip up the fields and values to create an object to return.
+    const obj = zipObject(fields, values);
+
+    // Return the assembled Settings object.
+    return new Setting(obj);
+  }
+}
+
+module.exports = () => ({ Settings: new SettingsLoader() });
diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index 8657905d9..7487eec2e 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -177,10 +177,10 @@ const changeUserPassword = async (ctx, oldPassword, newPassword) => {
   await Users.changePassword(user.id, newPassword);
 
   // Get some context for the email to be sent.
-  const { organizationName, organizationContactEmail } = await Settings.load([
+  const { organizationName, organizationContactEmail } = await Settings.select(
     'organizationName',
-    'organizationContactEmail',
-  ]);
+    'organizationContactEmail'
+  );
 
   // Send the password change email.
   await Users.sendEmail(user, {
diff --git a/graph/resolvers/asset.js b/graph/resolvers/asset.js
index 6bdf4d19e..ae5188e6e 100644
--- a/graph/resolvers/asset.js
+++ b/graph/resolvers/asset.js
@@ -1,4 +1,4 @@
-const { decorateWithTags } = require('./util');
+const { decorateWithTags, getRequestedFields } = require('./util');
 
 const Asset = {
   async comment({ id }, { id: commentId }, { loaders: { Comments } }) {
@@ -64,10 +64,13 @@ const Asset = {
 
     return Comments.countByAssetID.load(id);
   },
-  async settings({ settings = null }, _, { loaders: { Settings } }) {
+  async settings({ settings = null }, _, { loaders: { Settings } }, info) {
+    // Get the fields we want from the settings.
+    const fields = getRequestedFields(info);
+
     // Load the global settings, and merge them into the asset specific settings
     // if we have some.
-    let globalSettings = await Settings.load();
+    let globalSettings = await Settings.select(...fields);
     if (settings !== null) {
       settings = Object.assign({}, globalSettings.toObject(), settings);
     } else {
diff --git a/graph/resolvers/comment.js b/graph/resolvers/comment.js
index e562c062c..c40aa49e0 100644
--- a/graph/resolvers/comment.js
+++ b/graph/resolvers/comment.js
@@ -58,10 +58,14 @@ const Comment = {
     return Assets.getByID.load(asset_id);
   },
   async editing(comment, _, { loaders: { Settings } }) {
-    const settings = await Settings.load();
-    const editableUntil = new Date(
-      Number(new Date(comment.created_at)) + settings.editCommentWindowLength
+    const { editCommentWindowLength } = await Settings.select(
+      'editCommentWindowLength'
     );
+
+    const editableUntil = new Date(
+      Number(new Date(comment.created_at)) + editCommentWindowLength
+    );
+
     return {
       edited: comment.edited,
       editableUntil: editableUntil,
diff --git a/graph/resolvers/root_query.js b/graph/resolvers/root_query.js
index 23fdef288..53296a2ca 100644
--- a/graph/resolvers/root_query.js
+++ b/graph/resolvers/root_query.js
@@ -1,4 +1,4 @@
-const { decorateWithPermissionCheck } = require('./util');
+const { decorateWithPermissionCheck, getRequestedFields } = require('./util');
 const {
   SEARCH_ASSETS,
   SEARCH_OTHERS_COMMENTS,
@@ -16,8 +16,12 @@ const RootQuery = {
 
     return Assets.getByURL(query.url);
   },
-  settings(_, args, { loaders: { Settings } }) {
-    return Settings.load();
+  settings(_, args, { loaders: { Settings } }, info) {
+    // Get the fields we want from the settings.
+    const fields = getRequestedFields(info);
+
+    // Load only the requested fields.
+    return Settings.select(...fields);
   },
 
   // This endpoint is used for loading moderation queues, so hide it in the
diff --git a/graph/resolvers/util.js b/graph/resolvers/util.js
index cec2a71dd..a1a745ab2 100644
--- a/graph/resolvers/util.js
+++ b/graph/resolvers/util.js
@@ -2,7 +2,8 @@ const {
   ADD_COMMENT_TAG,
   SEARCH_OTHER_USERS,
 } = require('../../perms/constants');
-const { property, isBoolean } = require('lodash');
+const { property, isBoolean, pull } = require('lodash');
+const graphqlFields = require('graphql-fields');
 
 /**
  * getResolver will get the resolver from the typeResolver or apply the default
@@ -207,7 +208,11 @@ const decorateWithTags = (
   };
 };
 
+const getRequestedFields = info =>
+  pull(Object.keys(graphqlFields(info)), '__typename');
+
 module.exports = {
+  getRequestedFields,
   decorateUserField,
   decorateWithTags,
   decorateWithPermissionCheck,
diff --git a/middleware/staticTemplate.js b/middleware/staticTemplate.js
index 0dc05a7be..f16caaea9 100644
--- a/middleware/staticTemplate.js
+++ b/middleware/staticTemplate.js
@@ -95,7 +95,7 @@ const createResolveFactory = (() => {
 module.exports = async (req, res, next) => {
   try {
     // Attach the custom css url.
-    const { customCssUrl } = await SettingsService.retrieve('customCssUrl');
+    const { customCssUrl } = await SettingsService.select('customCssUrl');
     res.locals.customCssUrl = customCssUrl;
   } catch (err) {
     console.warn(err);
diff --git a/models/schema/asset.js b/models/schema/asset.js
index 043bc9a3f..82de92120 100644
--- a/models/schema/asset.js
+++ b/models/schema/asset.js
@@ -43,8 +43,7 @@ const Asset = new Schema(
     modified_date: Date,
 
     // This object is used exclusively for storing settings that are to override
-    // the base settings from the base Settings object. This is to be accessed
-    // always after running `rectifySettings` against it.
+    // the base settings from the base Settings object.
     settings: {
       default: {},
       type: Object,
diff --git a/models/schema/setting.js b/models/schema/setting.js
index af7932910..eb9dc76d1 100644
--- a/models/schema/setting.js
+++ b/models/schema/setting.js
@@ -125,21 +125,4 @@ const Setting = new Schema(
   }
 );
 
-/**
- * Merges two settings objects.
- */
-Setting.method('merge', function(src) {
-  Setting.eachPath(path => {
-    // Exclude internal fields...
-    if (['id', '_id', '__v', 'created_at', 'updated_at'].includes(path)) {
-      return;
-    }
-
-    // If the source object contains the path, shallow copy it.
-    if (path in src) {
-      this[path] = src[path];
-    }
-  });
-});
-
 module.exports = Setting;
diff --git a/package.json b/package.json
index 1127dd05c..59ceceb95 100644
--- a/package.json
+++ b/package.json
@@ -114,6 +114,7 @@
     "graphql-ast-tools": "0.2.3",
     "graphql-docs": "0.2.0",
     "graphql-errors": "^2.1.0",
+    "graphql-fields": "^1.0.2",
     "graphql-redis-subscriptions": "1.3.0",
     "graphql-subscriptions": "^0.4.3",
     "graphql-tag": "^1.2.3",
diff --git a/plugins/talk-plugin-local-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
index 389574d2d..385d84c91 100644
--- a/plugins/talk-plugin-local-auth/server/mutators.js
+++ b/plugins/talk-plugin-local-auth/server/mutators.js
@@ -47,9 +47,9 @@ async function updateUserEmailAddress(ctx, email, confirmPassword) {
   );
 
   // Get some context for the email to be sent.
-  const { organizationContactEmail } = await Settings.load([
-    'organizationContactEmail',
-  ]);
+  const { organizationContactEmail } = await Settings.select(
+    'organizationContactEmail'
+  );
 
   // Send off the email to the old email address that we have changed it.
   await Mailer.send({
diff --git a/plugins/talk-plugin-notifications/server/util.js b/plugins/talk-plugin-notifications/server/util.js
index 7198df1e1..bbebef4b2 100644
--- a/plugins/talk-plugin-notifications/server/util.js
+++ b/plugins/talk-plugin-notifications/server/util.js
@@ -3,7 +3,7 @@ const getOrganizationName = async ctx => {
   const { loaders: { Settings } } = ctx;
 
   // Get the settings.
-  const { organizationName = null } = await Settings.load('organizationName');
+  const { organizationName = null } = await Settings.select('organizationName');
 
   return organizationName;
 };
diff --git a/plugins/talk-plugin-profile-data/server/connect.js b/plugins/talk-plugin-profile-data/server/connect.js
index 0e5284e57..676d67176 100644
--- a/plugins/talk-plugin-profile-data/server/connect.js
+++ b/plugins/talk-plugin-profile-data/server/connect.js
@@ -36,10 +36,10 @@ module.exports = connectors => {
         const {
           organizationName,
           organizationContactEmail,
-        } = await Settings.load([
+        } = await Settings.select(
           'organizationName',
-          'organizationContactEmail',
-        ]);
+          'organizationContactEmail'
+        );
 
         // rescheduledDeletionDate is the date in the future that we'll set the
         // user's account to be deleted on if this delete fails.
diff --git a/plugins/talk-plugin-profile-data/server/mutators.js b/plugins/talk-plugin-profile-data/server/mutators.js
index eec54772c..4a1e97791 100644
--- a/plugins/talk-plugin-profile-data/server/mutators.js
+++ b/plugins/talk-plugin-profile-data/server/mutators.js
@@ -81,7 +81,7 @@ async function sendDownloadLink(ctx) {
   // Generate the download links.
   const { downloadLandingURL } = await generateDownloadLinks(ctx, user.id);
 
-  const { organizationName } = await Settings.load('organizationName');
+  const { organizationName } = await Settings.select('organizationName');
 
   // Send the download link via the user's attached email account.
   await Users.sendEmail(user, {
@@ -130,7 +130,7 @@ async function requestDeletion({
     }
   );
 
-  const { organizationName } = await Settings.load('organizationName');
+  const { organizationName } = await Settings.select('organizationName');
 
   // Send the download link via the user's attached email account.
   await Users.sendEmail(user, {
@@ -171,7 +171,7 @@ async function cancelDeletion({
     { $unset: { 'metadata.scheduledDeletionDate': 1 } }
   );
 
-  const { organizationName } = await Settings.load('organizationName');
+  const { organizationName } = await Settings.select('organizationName');
 
   // Send the download link via the user's attached email account.
   await Users.sendEmail(user, {
diff --git a/services/assets.js b/services/assets.js
index fbed22287..794145eb3 100644
--- a/services/assets.js
+++ b/services/assets.js
@@ -1,13 +1,12 @@
 const CommentModel = require('../models/comment');
 const AssetModel = require('../models/asset');
-const SettingsService = require('./settings');
+const Settings = require('./settings');
 const DomainList = require('./domain_list');
 const {
   ErrAssetURLAlreadyExists,
   ErrNotFound,
   ErrInvalidAssetURL,
 } = require('../errors');
-const { merge, isEmpty } = require('lodash');
 const { dotize } = require('./utils');
 
 module.exports = class AssetsService {
@@ -27,28 +26,6 @@ module.exports = class AssetsService {
     return AssetModel.findOne({ url });
   }
 
-  /**
-   * Retrieves the settings given an asset query and rectifies it against the
-   * global settings.
-   * @param  {Promise} assetQuery an asset query that returns a single asset.
-   * @return {Promise}
-   */
-  static async rectifySettings(assetQuery, settings = null) {
-    const [globalSettings, asset] = await Promise.all([
-      settings !== null ? settings : SettingsService.retrieve(),
-      assetQuery,
-    ]);
-
-    // If the asset exists and has settings then return the merged object.
-    if (asset && asset.settings && !isEmpty(asset.settings)) {
-      settings = merge({}, globalSettings, asset.settings);
-    } else {
-      settings = globalSettings;
-    }
-
-    return settings;
-  }
-
   /**
    * Finds a asset by its url.
    *
@@ -65,13 +42,13 @@ module.exports = class AssetsService {
     // Check the URL to confirm that is in the domain whitelist
     return Promise.all([
       DomainList.urlCheck(url),
-      SettingsService.retrieve(),
-    ]).then(([whitelisted, settings]) => {
+      Settings.select('autoCloseStream', 'closedTimeout'),
+    ]).then(([whitelisted, { autoCloseStream, closedTimeout }]) => {
       const update = { $setOnInsert: { url } };
 
-      if (settings.autoCloseStream) {
+      if (autoCloseStream) {
         update.$setOnInsert.closedAt = new Date(
-          Date.now() + settings.closedTimeout * 1000
+          Date.now() + closedTimeout * 1000
         );
       }
 
@@ -139,10 +116,10 @@ module.exports = class AssetsService {
    * @return {Promise}
    */
   static search({ value, limit, open, sortOrder, cursor } = {}) {
-    let assets = AssetModel.find({});
+    let query = AssetModel.find({});
 
     if (value && value.length > 0) {
-      assets.merge({
+      query.merge({
         $text: {
           $search: value,
         },
@@ -151,7 +128,7 @@ module.exports = class AssetsService {
 
     if (open != null) {
       if (open) {
-        assets.merge({
+        query.merge({
           $or: [
             {
               closedAt: null,
@@ -164,7 +141,7 @@ module.exports = class AssetsService {
           ],
         });
       } else {
-        assets.merge({
+        query.merge({
           closedAt: {
             $lt: Date.now(),
           },
@@ -174,13 +151,13 @@ module.exports = class AssetsService {
 
     if (cursor) {
       if (sortOrder === 'DESC') {
-        assets.merge({
+        query.merge({
           created_at: {
             $lt: cursor,
           },
         });
       } else {
-        assets.merge({
+        query.merge({
           created_at: {
             $gt: cursor,
           },
@@ -188,7 +165,7 @@ module.exports = class AssetsService {
       }
     }
 
-    return assets
+    return query
       .sort({ created_at: sortOrder === 'DESC' ? -1 : 1 })
       .limit(limit);
   }
diff --git a/services/cache.js b/services/cache.js
index c413537a7..64f8ad934 100644
--- a/services/cache.js
+++ b/services/cache.js
@@ -271,69 +271,3 @@ cache.set = async (key, value, expiry, kf = keyfunc) => {
 
   return cache.client.set(kf(key), reply, 'EX', expiry);
 };
-
-/**
- * h is the hash form of the cache.
- */
-cache.h = {};
-
-cache.h.get = async (key, field = '__default__') => {
-  // Get the current value from redis.
-  const reply = await cache.client.hget(keyfunc(key), field);
-
-  if (typeof reply !== 'undefined' && reply !== null) {
-    return JSON.parse(reply);
-  }
-
-  return null;
-};
-
-cache.h.set = async (key, field = '__default__', value, expiry = 60) => {
-  // Serialize the value as JSON.
-  let reply = JSON.stringify(value);
-
-  return cache.client
-    .pipeline()
-    .hset(keyfunc(key), field, reply)
-    .expire(keyfunc(key), expiry)
-    .exec();
-};
-
-cache.h.invalidate = async (key, field = null) => {
-  if (field === null) {
-    return cache.invalidate(key);
-  }
-
-  debug(`invalidate: ${keyfunc(key)} ${field}`);
-
-  return cache.client.hdel(keyfunc(key), field);
-};
-
-cache.h.wrap = async (key, field, expiry, work) => {
-  let value = await cache.h.get(key, field);
-  if (value !== null) {
-    debug('wrap: hit', keyfunc(key));
-    return value;
-  }
-
-  debug('wrap: miss', keyfunc(key));
-
-  value = await work();
-
-  process.nextTick(async () => {
-    try {
-      await cache.h.set(key, field, value, expiry);
-      debug('wrap: set complete');
-    } catch (err) {
-      console.error(err);
-    }
-  });
-
-  return value;
-};
-
-cache.h.incr = async (key, field = '__default__', expiry) =>
-  cache.client.hincrbyex(keyfunc(key), field, 1, expiry);
-
-cache.h.decr = async (key, field = '__default__', expiry) =>
-  cache.client.hincrbyex(keyfunc(key), field, -1, expiry);
diff --git a/services/comments.js b/services/comments.js
index b9d73d91c..4b436b5f4 100644
--- a/services/comments.js
+++ b/services/comments.js
@@ -100,7 +100,7 @@ module.exports = {
     // original query.
     const {
       editCommentWindowLength: editWindowMs,
-    } = await SettingsService.retrieve();
+    } = await SettingsService.select('editCommentWindowLength');
     const lastEditableCommentCreatedAt = new Date(Date.now() - editWindowMs);
     query.created_at = {
       $gt: lastEditableCommentCreatedAt,
diff --git a/services/domain_list.js b/services/domain_list.js
index aab1f9ea8..b194305b1 100644
--- a/services/domain_list.js
+++ b/services/domain_list.js
@@ -1,6 +1,6 @@
 const debug = require('debug')('talk:services:domain_list');
 const _ = require('lodash');
-const SettingsService = require('./settings');
+const Settings = require('./settings');
 
 const { ROOT_URL } = require('../config');
 
@@ -19,7 +19,7 @@ class DomainList {
    * Loads domains white list in from the database
    */
   async load() {
-    const { domains } = await SettingsService.retrieve();
+    const { domains } = await Settings.select('domains');
     this.upsert(domains);
   }
 
diff --git a/services/moderation/index.js b/services/moderation/index.js
index 530d6f2a6..27346e620 100644
--- a/services/moderation/index.js
+++ b/services/moderation/index.js
@@ -1,5 +1,5 @@
 const { ErrNotFound } = require('../../errors');
-const get = require('lodash/get');
+const { get, merge, isEmpty } = require('lodash');
 
 // Load in the phases to use.
 const {
@@ -80,10 +80,7 @@ const compose = phases => async (ctx, comment, options) => {
  * @param {Object} comment comment object to use
  */
 const fetchOptions = async (ctx, comment) => {
-  const {
-    connectors: { services: { Assets: AssetsService } },
-    loaders: { Settings, Assets },
-  } = ctx;
+  const { loaders: { Settings, Assets } } = ctx;
 
   // Load the settings.
   const settings = await Settings.load();
@@ -102,8 +99,12 @@ const fetchOptions = async (ctx, comment) => {
     throw new ErrNotFound();
   }
 
-  // Combine the asset and the settings to get the asset settings.
-  asset.settings = await AssetsService.rectifySettings(asset, settings);
+  // If the asset exists and has settings then return the merged object.
+  if (asset && asset.settings && !isEmpty(asset.settings)) {
+    asset.settings = merge({}, settings, asset.settings);
+  } else {
+    asset.settings = settings;
+  }
 
   // Create the options that will be consumed by the phases.
   return {
diff --git a/services/passport.js b/services/passport.js
index 0ae06afb8..e4813e419 100644
--- a/services/passport.js
+++ b/services/passport.js
@@ -1,7 +1,7 @@
 const passport = require('passport');
 const { set, get } = require('lodash');
 const UsersService = require('./users');
-const SettingsService = require('./settings');
+const Settings = require('./settings');
 const TokensService = require('./tokens');
 const fetch = require('node-fetch');
 const FormData = require('form-data');
@@ -157,7 +157,9 @@ async function ValidateUserLogin(loginProfile, user, done) {
   }
 
   // The user is a local user, check if we need email confirmation.
-  const { requireEmailConfirmation = false } = await SettingsService.retrieve();
+  const { requireEmailConfirmation = false } = await Settings.select(
+    'requireEmailConfirmation'
+  );
 
   // If we have the requirement of checking that emails for users are
   // verified, then we need to check the email address to ensure that it has
diff --git a/services/settings.js b/services/settings.js
index ee5125183..34b6fead4 100644
--- a/services/settings.js
+++ b/services/settings.js
@@ -1,59 +1,61 @@
-const SettingModel = require('../models/setting');
-const cache = require('./cache');
+const Setting = require('../models/setting');
 const { ErrSettingsNotInit } = require('../errors');
 const { dotize } = require('./utils');
-const { SETTINGS_CACHE_TIME } = require('../config');
+const { isEmpty, zipObject, uniq } = require('lodash');
+const DataLoader = require('dataloader');
 
-/**
- * The selector used to uniquely identify the settings document.
- */
 const selector = { id: '1' };
 
-const retrieve = async fields => {
-  let settings;
-  if (fields) {
-    settings = await SettingModel.findOne(selector).select(fields);
-  } else {
-    settings = await SettingModel.findOne(selector);
-  }
-  if (!settings) {
+async function loadFn(fields = []) {
+  const model = await Setting.findOne(selector).select(uniq(fields));
+  if (!model) {
     throw new ErrSettingsNotInit();
   }
 
-  return settings;
-};
+  return model;
+}
 
-/**
- * The Setting Service object exposing the Setting model.
- */
-module.exports = class SettingsService {
-  /**
-   * Gets the entire settings record and sends it back
-   * @return {Promise} settings the whole settings record
-   */
-  static async retrieve(fields) {
-    if (process.env.NODE_ENV === 'production') {
-      // When in production, wrap the settings retrieval with a cache.
-      const settings = await cache.h.wrap(
-        'settings',
-        fields,
-        SETTINGS_CACHE_TIME / 1000,
-        () => retrieve(fields)
-      );
+// batchLoadFn will load a settings object with all the requested fields.
+async function batchLoadFn(fields) {
+  // Load a settings object with all the requested fields.
+  const model = await loadFn(fields);
 
-      return new SettingModel(settings);
+  // Convert the model into an object for easier manipulation.
+  const obj = model.toObject();
+
+  // Return the specific fields for each of the fields that were loaded.
+  return fields.map(field => obj[field]);
+}
+
+// batchedSettingsLoader will load setting fields for each request. This isn't a
+// cached loader, so this is really just for optimizing the requests made to the
+// database by batching.
+const batchedSettingsLoader = new DataLoader(batchLoadFn, { cache: false });
+
+class Settings {
+  static async retrieve(...fields) {
+    if (!isEmpty(fields)) {
+      // Included for backwards compatibility.
+      return Settings.select(...fields);
     }
 
-    return retrieve(fields);
+    // Call the loadFn directly if we need to load all the fields.
+    return loadFn(fields);
+  }
+
+  static async select(...fields) {
+    // Load all the values for the specific fields.
+    const values = await batchedSettingsLoader.loadMany(fields);
+
+    // Zip up the fields and values to create an object to return.
+    const obj = zipObject(fields, values);
+
+    // Return the assembled Settings object.
+    return new Setting(obj);
   }
 
-  /**
-   * This will update the settings object with whatever you pass in
-   * @param  {object} setting a hash of whatever settings you want to update
-   * @return {Promise} settings Promise that resolves to the entire (updated) settings object.
-   */
   static async update(settings) {
-    const updatedSettings = await SettingModel.findOneAndUpdate(
+    const updatedSettings = await Setting.findOneAndUpdate(
       selector,
       {
         $set: dotize(settings),
@@ -65,21 +67,16 @@ module.exports = class SettingsService {
       }
     );
 
-    if (process.env.NODE_ENV === 'production') {
-      await cache.h.invalidate('settings');
-    }
-
     return updatedSettings;
   }
 
-  /**
-   * This is run once when the app starts to ensure settings are populated.
-   */
   static init(defaults = {}) {
-    return SettingsService.retrieve().catch(() => {
-      let settings = new SettingModel(defaults);
+    return Settings.retrieve().catch(() => {
+      const settings = new Setting(defaults);
 
       return settings.save();
     });
   }
-};
+}
+
+module.exports = Settings;
diff --git a/services/setup.js b/services/setup.js
index 2517d376b..a691550ef 100644
--- a/services/setup.js
+++ b/services/setup.js
@@ -26,7 +26,7 @@ module.exports = class SetupService {
 
     try {
       // Get the current settings, we are expecting an error here.
-      await SettingsService.retrieve();
+      await SettingsService.select('id');
 
       // We should NOT have gotten a settings object, this means that the
       // application is already setup. Error out here.
diff --git a/services/tags.js b/services/tags.js
index cc8934e0a..b4e70cb29 100644
--- a/services/tags.js
+++ b/services/tags.js
@@ -1,23 +1,24 @@
-const CommentModel = require('../models/comment');
-const AssetModel = require('../models/asset');
-const UserModel = require('../models/user');
-const AssetsService = require('./assets');
-const SettingsService = require('./settings');
+const Comment = require('../models/comment');
+const Asset = require('../models/asset');
+const User = require('../models/user');
+const Assets = require('./assets');
+const Settings = require('./settings');
 const { ADD_COMMENT_TAG } = require('../perms/constants');
 const { ErrNotAuthorized } = require('../errors');
+const { get, has } = require('lodash');
 
 const updateModel = async (item_type, query, update) => {
   // Get the model to update with.
   let Model;
   switch (item_type) {
     case 'COMMENTS':
-      Model = CommentModel;
+      Model = Comment;
       break;
     case 'ASSETS':
-      Model = AssetModel;
+      Model = Asset;
       break;
     case 'USERS':
-      Model = UserModel;
+      Model = User;
       break;
     default:
       throw new Error(
@@ -44,32 +45,23 @@ const ownershipQuery = async (item_type, link, query) => {
 
 class TagsService {
   /**
-   * Retrives a global tag from the settings based on the input_type.
+   * Retrieves a global tag from the settings based on the input_type.
    */
   static async getAll({ id, item_type, asset_id = null }) {
-    // Extract the settings from the database.
-    let settings;
-    switch (item_type) {
-      case 'COMMENTS':
-        settings = await AssetsService.rectifySettings(
-          AssetsService.findById(asset_id)
-        );
-        break;
-      case 'ASSETS':
-        settings = await AssetsService.rectifySettings(
-          AssetsService.findById(id)
-        );
-        break;
-      case 'USERS':
-        settings = await SettingsService.retrieve();
-        break;
-      default:
-        settings = await SettingsService.retrieve();
-        break;
+    // Optionally get an asset.
+    let asset;
+    if (item_type === 'COMMENTS') {
+      asset = await Assets.findById(asset_id);
+    } else if (item_type === 'ASSETS') {
+      asset = await Assets.findById(id);
+    }
+
+    if (asset && has(asset, 'settings.tags')) {
+      return get(asset, 'settings.tags');
     }
 
     // Extract the tags from the settings object.
-    let { tags = [] } = settings;
+    const { tags = [] } = await Settings.select('tags');
 
     // Return the first tag that matches the requested form.
     return tags;
diff --git a/services/wordlist.js b/services/wordlist.js
index 9e7e1581e..22bde090a 100644
--- a/services/wordlist.js
+++ b/services/wordlist.js
@@ -1,12 +1,12 @@
 const debug = require('debug')('talk:services:wordlist');
 const _ = require('lodash');
-const SettingsService = require('./settings');
+const Settings = require('./settings');
 const { ErrContainsProfanity } = require('../errors');
 const memoize = require('lodash/memoize');
 const { escapeRegExp } = require('./regex');
 
 /**
- * Generate a regulare expression that catches the `phrases`.
+ * Generate a regular expression that catches the `phrases`.
  */
 function generateRegExp(phrases) {
   const inner = phrases
@@ -49,7 +49,7 @@ class Wordlist {
    * Loads wordlists in from the database
    */
   load() {
-    return SettingsService.retrieve().then(settings => {
+    return Settings.select('wordlist').then(settings => {
       // Insert the settings wordlist.
       this.upsert(settings.wordlist);
     });
diff --git a/yarn.lock b/yarn.lock
index 9a455a9a6..75911aaa8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4451,6 +4451,10 @@ graphql-extensions@^0.0.x:
     core-js "^2.5.1"
     source-map-support "^0.5.0"
 
+graphql-fields@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/graphql-fields/-/graphql-fields-1.0.2.tgz#099ee1d4445b42d0f47e06d622acebb33abc6cce"
+
 graphql-redis-subscriptions@1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/graphql-redis-subscriptions/-/graphql-redis-subscriptions-1.3.0.tgz#bbc52b0f77bf7d50945c6bf4e8b8aba5135555b4"

From 732ff98f9bb9c2e6ecfc7affa1757be8ca2ccfc2 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 14:48:47 -0600
Subject: [PATCH 129/160] fixed test

---
 test/server/services/settings.js | 43 +++++++++++++++-----------------
 1 file changed, 20 insertions(+), 23 deletions(-)

diff --git a/test/server/services/settings.js b/test/server/services/settings.js
index ff2c898e1..44068e6cd 100644
--- a/test/server/services/settings.js
+++ b/test/server/services/settings.js
@@ -1,15 +1,13 @@
-const SettingsService = require('../../../services/settings');
+const Settings = require('../../../services/settings');
 const chai = require('chai');
 const expect = chai.expect;
 
 describe('services.SettingsService', () => {
-  beforeEach(() =>
-    SettingsService.init({ moderation: 'PRE', wordlist: ['donut'] })
-  );
+  beforeEach(() => Settings.init({ moderation: 'PRE', wordlist: ['donut'] }));
 
   describe('#retrieve()', () => {
     it('should have a moderation field defined', () => {
-      return SettingsService.retrieve().then(settings => {
+      return Settings.retrieve().then(settings => {
         expect(settings)
           .to.have.property('moderation')
           .and.to.equal('PRE');
@@ -17,7 +15,7 @@ describe('services.SettingsService', () => {
     });
 
     it('should have two infoBox fields defined', () => {
-      return SettingsService.retrieve().then(settings => {
+      return Settings.retrieve().then(settings => {
         expect(settings)
           .to.have.property('infoBoxEnable')
           .and.to.equal(false);
@@ -28,6 +26,17 @@ describe('services.SettingsService', () => {
     });
   });
 
+  describe('#select()', () => {
+    it('should have a moderation field defined and not wordlist', () => {
+      return Settings.select('moderation').then(settings => {
+        expect(settings)
+          .to.have.property('moderation')
+          .and.to.equal('PRE');
+        expect(settings).to.not.have.property('wordlist');
+      });
+    });
+  });
+
   describe('#update()', () => {
     it('should update the settings with a passed object', () => {
       const mockSettings = {
@@ -35,7 +44,7 @@ describe('services.SettingsService', () => {
         infoBoxEnable: true,
         infoBoxContent: 'yeah',
       };
-      return SettingsService.update(mockSettings).then(updatedSettings => {
+      return Settings.update(mockSettings).then(updatedSettings => {
         expect(updatedSettings).to.be.an('object');
         expect(updatedSettings)
           .to.have.property('moderation')
@@ -51,32 +60,20 @@ describe('services.SettingsService', () => {
         infoBoxEnable: true,
         infoBoxContent: 'yeah',
       };
-      await SettingsService.update(mockSettings);
+      await Settings.update(mockSettings);
 
-      const settings = await SettingsService.retrieve();
+      const settings = await Settings.retrieve();
       settings.charCount = 500;
 
-      await SettingsService.update(settings.toObject());
+      await Settings.update(settings.toObject());
     });
   });
 
   describe('#get', () => {
     it('should return the moderation settings', () => {
-      return SettingsService.retrieve().then(({ moderation }) => {
+      return Settings.retrieve().then(({ moderation }) => {
         expect(moderation).not.to.be.null;
       });
     });
   });
-
-  describe('#merge', () => {
-    it('should merge a settings object and its overrides', () => {
-      return SettingsService.retrieve().then(settings => {
-        let ovrSett = { moderation: 'POST' };
-
-        settings.merge(ovrSett);
-
-        expect(settings).to.have.property('moderation', 'POST');
-      });
-    });
-  });
 });

From 01039aa411cad96bf0967874bb2e0438d3e82f15 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 14:57:51 -0600
Subject: [PATCH 130/160] include trace ID in each downstream request

---
 middleware/trace.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/middleware/trace.js b/middleware/trace.js
index 24cbf38f4..6ac6f4b2c 100644
--- a/middleware/trace.js
+++ b/middleware/trace.js
@@ -3,5 +3,9 @@ const uuid = require('uuid/v1');
 // Trace middleware attaches a request id to each incoming request.
 module.exports = (req, res, next) => {
   req.id = uuid();
+
+  // Add the context ID to the request as an HTTP header.
+  res.set('X-Talk-Trace-ID', req.id);
+
   next();
 };

From fa2730a661fdb7cbb6bf71c5e18fde7769214049 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 15:06:53 -0600
Subject: [PATCH 131/160] Upgraded lodash

---
 package.json |  4 ++--
 yarn.lock    | 12 ++++++++++--
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 1127dd05c..9ec249f83 100644
--- a/package.json
+++ b/package.json
@@ -136,8 +136,8 @@
     "keymaster": "^1.6.2",
     "kue": "0.11.6",
     "linkify-it": "^2.0.3",
-    "lodash": "^4.16.6",
-    "lodash-es": "^4.16.6",
+    "lodash": "^4.17.10",
+    "lodash-es": "^4.17.10",
     "marked": "^0.3.6",
     "material-design-lite": "^1.2.1",
     "metascraper": "^3.9.2",
diff --git a/yarn.lock b/yarn.lock
index 9a455a9a6..a043febf4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6647,7 +6647,11 @@ locate-path@^2.0.0:
     p-locate "^2.0.0"
     path-exists "^3.0.0"
 
-lodash-es@^4.16.6, lodash-es@^4.2.1:
+lodash-es@^4.17.10:
+  version "4.17.10"
+  resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.10.tgz#62cd7104cdf5dd87f235a837f0ede0e8e5117e05"
+
+lodash-es@^4.2.1:
   version "4.17.4"
   resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.4.tgz#dcc1d7552e150a0640073ba9cb31d70f032950e7"
 
@@ -6928,10 +6932,14 @@ lodash.values@^4.3.0:
   version "4.17.5"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
 
-lodash@^4.0.0, lodash@^4.1.0, lodash@^4.14.0, lodash@^4.16.6, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1:
+lodash@^4.0.0, lodash@^4.1.0, lodash@^4.14.0, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1:
   version "4.17.4"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
 
+lodash@^4.17.10:
+  version "4.17.10"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
+
 log-symbols@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-1.0.2.tgz#376ff7b58ea3086a0f09facc74617eca501e1a18"

From 86595b4dd0e847555b728ef7e00263b68c582934 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 15:07:21 -0600
Subject: [PATCH 132/160] Added exception for metascraper

---
 .nsprc | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.nsprc b/.nsprc
index da6cb9865..048339414 100644
--- a/.nsprc
+++ b/.nsprc
@@ -2,6 +2,7 @@
   "exceptions": [
     "https://nodesecurity.io/advisories/531",
     "https://nodesecurity.io/advisories/532",
-    "https://nodesecurity.io/advisories/566"
+    "https://nodesecurity.io/advisories/566",
+    "https://nodesecurity.io/advisories/603"
   ]
 }

From cb50a1e7093bf7f03f1045752901c94585b758e0 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 15:12:37 -0600
Subject: [PATCH 133/160] updated excemptions

---
 .nsprc | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/.nsprc b/.nsprc
index 048339414..530a17a9f 100644
--- a/.nsprc
+++ b/.nsprc
@@ -3,6 +3,10 @@
     "https://nodesecurity.io/advisories/531",
     "https://nodesecurity.io/advisories/532",
     "https://nodesecurity.io/advisories/566",
-    "https://nodesecurity.io/advisories/603"
+    "https://nodesecurity.io/advisories/577",
+    "https://nodesecurity.io/advisories/594",
+    "https://nodesecurity.io/advisories/603",
+    "https://nodesecurity.io/advisories/611",
+    "https://nodesecurity.io/advisories/612"
   ]
 }

From 7a32bf855dec205d499ae5956ef7b5b256d31ad0 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Mon, 7 May 2018 17:14:43 -0400
Subject: [PATCH 134/160] Links, typos, updates for docs

---
 docs/source/03-05-product-guide-toxic-comments.md | 2 +-
 docs/source/03-08-gdpr.md                         | 3 ++-
 docs/source/05-03-when-youve-installed-talk.md    | 4 ++--
 docs/source/contact.md                            | 6 +++---
 4 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/docs/source/03-05-product-guide-toxic-comments.md b/docs/source/03-05-product-guide-toxic-comments.md
index ddbb4f9ff..9e6ea2a6e 100644
--- a/docs/source/03-05-product-guide-toxic-comments.md
+++ b/docs/source/03-05-product-guide-toxic-comments.md
@@ -50,7 +50,7 @@ trying to improve a broken part of the internet.
 
 ## How do I add the Toxic Comments plugin?
 To enable this behavior, visit the
-[talk-plugin-toxic-comments](/talk/additional-plugins/#talk-plugin-toxic-comments)
+[talk-plugin-toxic-comments](/talk/plugin/talk-plugin-toxic-comments)
 plugin documentation.
 
 
diff --git a/docs/source/03-08-gdpr.md b/docs/source/03-08-gdpr.md
index 9b1050454..b6689be0e 100644
--- a/docs/source/03-08-gdpr.md
+++ b/docs/source/03-08-gdpr.md
@@ -20,10 +20,11 @@ own data.
 Integrating our GDPR tools will give your users and organizations the following benefits:
 
 - **Download my comment data**: Users can request a download of their comments. An email with a link is emailed to them to download a CSV with each comment they've made, what story it was made on, and the comment's ID and timestamp.
-- **Delete my acccount**: Users can request deletion of their account. Deleted account requests are pending for 24 hours to allow the user to download their comments, or to change their mind and reactivate their account before the expiry. Account deletions remove all of their comments from the site, all their comments and actions from the database, and their account info from our system.
+- **Delete my account**: Users can request deletion of their account. Deleted account requests are pending for 24 hours to allow the user to download their comments, or to change their mind and reactivate their account before the expiry. Account deletions remove all of their comments from the site, all their comments and actions from the database, and their account info from our system.
 - **Add an email to an Oauth/external account**: Users are prompted to add an email to their non-Talk account (Facebook, Google, external, etc) so that they can take part in GDPR and other features requiring email communication.
 - **Change my username**: Users can update their username. This is capped at once every 2 weeks.
 - **Change my email**: Users can change their email.
+- **Change my password**: Users can change their password.
 
 ## Custom Authentication Solutions
 
diff --git a/docs/source/05-03-when-youve-installed-talk.md b/docs/source/05-03-when-youve-installed-talk.md
index 7bd775469..6e9a3e07e 100644
--- a/docs/source/05-03-when-youve-installed-talk.md
+++ b/docs/source/05-03-when-youve-installed-talk.md
@@ -70,7 +70,7 @@ The most important predictors of the success of an online community are:
 
 * Utilize [our Toxic Comments plugin](https://blog.coralproject.net/toxic-avenging/), developed with Google Jigsaw, to improve commenter behavior and use AI to help identify and prevent the most abusive comments from appearing on your site.
 
-* Enable our [Akismet plugin](https://coralproject.github.io/talk/additional-plugins/#talk-plugin-akismet) to keep spam from appearing in your comments.
+* Enable our [Akismet plugin](/talk/plugin/talk-plugin-akismet) to keep spam from appearing in your comments.
 
 * Use keyboard shortcuts in the moderation queue to moderate quickly (type '?' in the moderation view to see the list of shortcuts), and if there is a sudden deluge of comments, ask for someone in your newsroom to help you moderate. Talk will notify you in the moderation interface if someone else moderates a comment that's already on your screen.
 *   Click on a community member's name in the moderation interface to review all their comments, and see if there is a clear pattern of abuse among their Rejected comments. You can also select all their recent comments and delete them in bulk.![A screenshot of the moderation interface with the user drawer on display. Pink arrows indicate the user name, which can be clicked to open the drawer, and the drawer itself.](http://blog.coralproject.net/wp-content/uploads/2018/03/userdrawer.jpg)
@@ -83,7 +83,7 @@ The most important predictors of the success of an online community are:
 
 ![A screenshot of the comments stream with a moderation menu popped out and a large pink arrow pointing to the caret where moderators can unfold the moderation menu](http://blog.coralproject.net/wp-content/uploads/2018/03/caret-mod.jpg)
 
-* If you find new commenters are causing a lot of trouble with their first comments, consider changing [the User Karma threshold](https://coralproject.github.io/talk/trust/) from negative one to zero, forcing every new commenter's first comment into pre-moderation.
+* If you find new commenters are causing a lot of trouble with their first comments, consider changing [the User Karma threshold](/talk/trust/) from negative one to zero, forcing every new commenter's first comment into pre-moderation.
 
 #### Effectively
 
diff --git a/docs/source/contact.md b/docs/source/contact.md
index 029652fea..eba8e08c1 100644
--- a/docs/source/contact.md
+++ b/docs/source/contact.md
@@ -5,8 +5,8 @@ permalink: /contact/
 
 ## How can I get help integrating Talk into my newsroom?
 
-We're here to help with newsrooms of all sizes. Email our Integration Engineer
-([jeff@mozillafoundation.org](mailto:jeff@mozillafoundation.org)) to set up a meeting.
+We're here to help with newsrooms of all sizes. Email our Support Team
+([support@coralproject.net](mailto:support@coralproject.net)) to set up a meeting.
 
 ## How do I request a feature or submit a bug?
 
@@ -14,4 +14,4 @@ The best way is to [submit a GitHub issue](https://github.com/coralproject/talk/
 
 ## How can our dev team contribute to Talk?
 
-We are lucky to work with newsroom dev teams and individual contributors who span the world, and come from newsrooms of all sizes. You can read our [Contribution Guide](https://github.com/coralproject/talk/blob/master/CONTRIBUTING.md) to get started, but feel free to reach out to us via GitHub, or get in touch directly with Jeff via jeff@mozillafoundation.org.
+We are lucky to work with newsroom dev teams and individual contributors who span the world, and come from newsrooms of all sizes. You can read our [Contribution Guide](https://github.com/coralproject/talk/blob/master/CONTRIBUTING.md) to get started, but feel free to reach out to us via GitHub, or get in touch with us directly via support@coralproject.net.

From 0e7961aa1c2b7c1dab641acafcab433b8618dbed Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Mon, 7 May 2018 17:27:59 -0400
Subject: [PATCH 135/160] Fix broken links

---
 docs/source/03-01-product-guide-how-talk-works.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/docs/source/03-01-product-guide-how-talk-works.md b/docs/source/03-01-product-guide-how-talk-works.md
index 9463f74fe..8d221c8e5 100644
--- a/docs/source/03-01-product-guide-how-talk-works.md
+++ b/docs/source/03-01-product-guide-how-talk-works.md
@@ -28,8 +28,7 @@ Plugins are additional functionality which are optional to use with Talk. You
 can turn these on or off, depending on your specific needs. Plugins are either
 part of our core plugins, which ship with Talk, or they are developed by 3rd
 parties and either used privately and internally, or are open sourced for use
-across the greater community. You can explore the plugins we offer by visiting our [Default Plugins](/talk/default-plugins/)
-and [Additional Plugins](/talk/additional-plugins/) pages.
+across the greater community. You can explore the plugins we offer by visiting our [Plugin Directory](/talk/plugins-directory/).
 
 ## Recipes
 

From 15c3a96291ded237262d0b8f82f7ff5122b2ccac Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 17:16:52 -0600
Subject: [PATCH 136/160] fixed settings

---
 graph/loaders/settings.js        | 16 +++++-----------
 services/settings.js             | 15 +++++----------
 test/server/services/settings.js | 19 ++++++++++++++++---
 3 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/graph/loaders/settings.js b/graph/loaders/settings.js
index a1329b619..8b07d712b 100644
--- a/graph/loaders/settings.js
+++ b/graph/loaders/settings.js
@@ -1,4 +1,3 @@
-const Setting = require('../../models/setting');
 const Settings = require('../../services/settings');
 const DataLoader = require('dataloader');
 const { zipObject } = require('lodash');
@@ -15,12 +14,9 @@ class SettingsLoader {
   async _batchLoadFn(fields) {
     // Load a settings object with all the requested fields, unless we have the
     // entire object cached, in which case we'll return the whole cache.
-    const model = this._cache
+    const obj = this._cache
       ? await this._cache
-      : await Settings.retrieve(...fields);
-
-    // Convert the model into an object for easier manipulation.
-    const obj = model.toObject();
+      : await Settings.select(...fields);
 
     // Return the specific fields for each of the fields that were loaded.
     return fields.map(field => obj[field]);
@@ -55,11 +51,9 @@ class SettingsLoader {
     // Load all the values for the specific fields.
     const values = await this._loader.loadMany(fields);
 
-    // Zip up the fields and values to create an object to return.
-    const obj = zipObject(fields, values);
-
-    // Return the assembled Settings object.
-    return new Setting(obj);
+    // Zip up the fields and values to create an object to return and return the
+    // assembled Settings object.
+    return zipObject(fields, values);
   }
 }
 
diff --git a/services/settings.js b/services/settings.js
index 34b6fead4..def42187a 100644
--- a/services/settings.js
+++ b/services/settings.js
@@ -12,16 +12,13 @@ async function loadFn(fields = []) {
     throw new ErrSettingsNotInit();
   }
 
-  return model;
+  return model.toObject();
 }
 
 // batchLoadFn will load a settings object with all the requested fields.
 async function batchLoadFn(fields) {
   // Load a settings object with all the requested fields.
-  const model = await loadFn(fields);
-
-  // Convert the model into an object for easier manipulation.
-  const obj = model.toObject();
+  const obj = await loadFn(fields);
 
   // Return the specific fields for each of the fields that were loaded.
   return fields.map(field => obj[field]);
@@ -47,11 +44,9 @@ class Settings {
     // Load all the values for the specific fields.
     const values = await batchedSettingsLoader.loadMany(fields);
 
-    // Zip up the fields and values to create an object to return.
-    const obj = zipObject(fields, values);
-
-    // Return the assembled Settings object.
-    return new Setting(obj);
+    // Zip up the fields and values to create an object to return and return the
+    // assembled Settings object.
+    return zipObject(fields, values);
   }
 
   static async update(settings) {
diff --git a/test/server/services/settings.js b/test/server/services/settings.js
index 44068e6cd..ca6fdef8d 100644
--- a/test/server/services/settings.js
+++ b/test/server/services/settings.js
@@ -2,8 +2,13 @@ const Settings = require('../../../services/settings');
 const chai = require('chai');
 const expect = chai.expect;
 
-describe('services.SettingsService', () => {
-  beforeEach(() => Settings.init({ moderation: 'PRE', wordlist: ['donut'] }));
+describe('services.Settings', () => {
+  beforeEach(() =>
+    Settings.init({
+      moderation: 'PRE',
+      wordlist: { banned: ['bannedWord'], suspect: [] },
+    })
+  );
 
   describe('#retrieve()', () => {
     it('should have a moderation field defined', () => {
@@ -35,6 +40,14 @@ describe('services.SettingsService', () => {
         expect(settings).to.not.have.property('wordlist');
       });
     });
+    it('should have a wordlist field defined and not moderation', () => {
+      return Settings.select('wordlist').then(settings => {
+        expect(settings).to.not.have.property('moderation');
+        expect(settings).to.have.property('wordlist');
+        expect(settings.wordlist).to.have.property('banned');
+        expect(settings.wordlist.banned).to.contain('bannedWord');
+      });
+    });
   });
 
   describe('#update()', () => {
@@ -65,7 +78,7 @@ describe('services.SettingsService', () => {
       const settings = await Settings.retrieve();
       settings.charCount = 500;
 
-      await Settings.update(settings.toObject());
+      await Settings.update(settings);
     });
   });
 

From 10a99aab889320c447d8dbed309cc0fe84cde324 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 17:47:02 -0600
Subject: [PATCH 137/160] Fixed bug with password form

---
 errors.js                                                | 9 +++++++++
 graph/mutators/user.js                                   | 8 ++++++--
 locales/en.yml                                           | 1 +
 .../client/components/ChangePassword.js                  | 5 ++---
 4 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/errors.js b/errors.js
index 37f42f4ff..da1287dd3 100644
--- a/errors.js
+++ b/errors.js
@@ -371,6 +371,14 @@ class ErrParentDoesNotVisible extends TalkError {
   }
 }
 
+class ErrPasswordIncorrect extends TalkError {
+  constructor() {
+    super('Your current password was entered incorrectly', {
+      translation_key: 'PASSWORD_INCORRECT',
+    });
+  }
+}
+
 module.exports = {
   TalkError,
   ErrAlreadyExists,
@@ -395,6 +403,7 @@ module.exports = {
   ErrNotFound,
   ErrNotVerified,
   ErrParentDoesNotVisible,
+  ErrPasswordIncorrect,
   ErrPasswordResetToken,
   ErrPasswordTooShort,
   ErrPermissionUpdateUsername,
diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index 8657905d9..1f43ca838 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -1,4 +1,8 @@
-const { ErrNotFound, ErrNotAuthorized } = require('../../errors');
+const {
+  ErrNotFound,
+  ErrNotAuthorized,
+  ErrPasswordIncorrect,
+} = require('../../errors');
 const Users = require('../../services/users');
 const migrationHelpers = require('../../services/migration/helpers');
 const {
@@ -170,7 +174,7 @@ const changeUserPassword = async (ctx, oldPassword, newPassword) => {
   // Verify the old password.
   const validPassword = await user.verifyPassword(oldPassword);
   if (!validPassword) {
-    throw new ErrNotAuthorized();
+    throw new ErrPasswordIncorrect();
   }
 
   // Change the users password now.
diff --git a/locales/en.yml b/locales/en.yml
index 3d2fe88c7..e293fb40b 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -225,6 +225,7 @@ en:
   embedlink:
     copy: "Copy to Clipboard"
   error:
+    PASSWORD_INCORRECT: "Your current password was entered incorrectly"
     COMMENT_PARENT_NOT_VISIBLE: "The comment that you're replying to has been removed or doesn't exist."
     EMAIL_VERIFICATION_TOKEN_INVALID: "Email verification token is invalid."
     EMAIL_ALREADY_VERIFIED: "Email address already verified."
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
index 1ceb1b9f5..010df0826 100644
--- a/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
+++ b/plugins/talk-plugin-local-auth/client/components/ChangePassword.js
@@ -127,12 +127,11 @@ class ChangePassword extends React.Component {
         'success',
         t('talk-plugin-local-auth.change_password.changed_password_msg')
       );
+      this.clearForm();
+      this.disableEditing();
     } catch (err) {
       this.props.notify('error', getErrorMessages(err));
     }
-
-    this.clearForm();
-    this.disableEditing();
   };
 
   onForgotPassword = async () => {

From 08a857e07cd3066405488eca31fde85af0127d84 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 17:51:46 -0600
Subject: [PATCH 138/160] Fixed email in use error

---
 .../talk-plugin-local-auth/server/mutators.js | 26 ++++++++++++-------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/server/mutators.js b/plugins/talk-plugin-local-auth/server/mutators.js
index 389574d2d..147d06cd2 100644
--- a/plugins/talk-plugin-local-auth/server/mutators.js
+++ b/plugins/talk-plugin-local-auth/server/mutators.js
@@ -35,16 +35,24 @@ async function updateUserEmailAddress(ctx, email, confirmPassword) {
   email = email.toLowerCase().trim();
 
   // Update the Users email address.
-  await User.update(
-    {
-      id: user.id,
-      profiles: { $elemMatch: { provider: 'local' } },
-    },
-    {
-      $set: { 'profiles.$.id': email },
-      $unset: { 'profiles.$.metadata.confirmed_at': 1 },
+  try {
+    await User.update(
+      {
+        id: user.id,
+        profiles: { $elemMatch: { provider: 'local' } },
+      },
+      {
+        $set: { 'profiles.$.id': email },
+        $unset: { 'profiles.$.metadata.confirmed_at': 1 },
+      }
+    );
+  } catch (err) {
+    if (err.code === 11000) {
+      throw new ErrEmailTaken();
     }
-  );
+
+    throw err;
+  }
 
   // Get some context for the email to be sent.
   const { organizationContactEmail } = await Settings.load([

From a7c9f0112590f68c385247446c8b71e6b20e4d51 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Mon, 7 May 2018 17:59:43 -0600
Subject: [PATCH 139/160] fixed bug

---
 graph/resolvers/asset.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/graph/resolvers/asset.js b/graph/resolvers/asset.js
index ae5188e6e..3ed5305b7 100644
--- a/graph/resolvers/asset.js
+++ b/graph/resolvers/asset.js
@@ -72,9 +72,9 @@ const Asset = {
     // if we have some.
     let globalSettings = await Settings.select(...fields);
     if (settings !== null) {
-      settings = Object.assign({}, globalSettings.toObject(), settings);
+      settings = Object.assign({}, globalSettings, settings);
     } else {
-      settings = globalSettings.toObject();
+      settings = globalSettings;
     }
 
     return settings;

From 2f94674b78dce39565a5813d0f44cdd508cbceae Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 8 May 2018 11:08:46 -0300
Subject: [PATCH 140/160] Adding CommentDeletedTombstone

---
 .../src/components/CommentAnimatedEdit.js     |   2 +-
 .../components/CommentDeletedTombstone.css    |   5 +
 .../src/components/CommentDeletedTombstone.js |   8 ++
 .../src/components/UserDetailComment.js       |  87 +++++++------
 .../routes/Moderation/components/Comment.js   |  83 ++++++------
 .../components/ChangeUsernameDialog.css       |  84 ++++++++++++
 .../client/components/ChangeUsernameDialog.js | 120 ++++++++++++++++++
 7 files changed, 308 insertions(+), 81 deletions(-)
 create mode 100644 client/coral-admin/src/components/CommentDeletedTombstone.css
 create mode 100644 client/coral-admin/src/components/CommentDeletedTombstone.js
 create mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
 create mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js

diff --git a/client/coral-admin/src/components/CommentAnimatedEdit.js b/client/coral-admin/src/components/CommentAnimatedEdit.js
index 12280b204..f43cb9c89 100644
--- a/client/coral-admin/src/components/CommentAnimatedEdit.js
+++ b/client/coral-admin/src/components/CommentAnimatedEdit.js
@@ -29,7 +29,7 @@ const CommentAnimatedEdit = ({ children, body }) => {
 
 CommentAnimatedEdit.propTypes = {
   children: PropTypes.node,
-  body: PropTypes.string,
+  body: PropTypes.string.isRequired,
 };
 
 export default CommentAnimatedEdit;
diff --git a/client/coral-admin/src/components/CommentDeletedTombstone.css b/client/coral-admin/src/components/CommentDeletedTombstone.css
new file mode 100644
index 000000000..81f5ddf7a
--- /dev/null
+++ b/client/coral-admin/src/components/CommentDeletedTombstone.css
@@ -0,0 +1,5 @@
+.tombstone {
+  background-color: #f0f0f0;
+  padding: 1em;
+  color: #1a212f;
+}
\ No newline at end of file
diff --git a/client/coral-admin/src/components/CommentDeletedTombstone.js b/client/coral-admin/src/components/CommentDeletedTombstone.js
new file mode 100644
index 000000000..db9a609b1
--- /dev/null
+++ b/client/coral-admin/src/components/CommentDeletedTombstone.js
@@ -0,0 +1,8 @@
+import React from 'react';
+import styles from './CommentDeletedTombstone.css';
+
+const CommentDeletedTombstone = () => (
+  <div className={styles.tombstone}>The comment was deleted.</div>
+);
+
+export default CommentDeletedTombstone;
diff --git a/client/coral-admin/src/components/UserDetailComment.js b/client/coral-admin/src/components/UserDetailComment.js
index f2ff2e932..f7a500203 100644
--- a/client/coral-admin/src/components/UserDetailComment.js
+++ b/client/coral-admin/src/components/UserDetailComment.js
@@ -12,6 +12,7 @@ import CommentAnimatedEdit from './CommentAnimatedEdit';
 import CommentLabels from '../containers/CommentLabels';
 import ApproveButton from './ApproveButton';
 import RejectButton from 'coral-admin/src/components/RejectButton';
+import CommentDeletedTombstone from './CommentDeletedTombstone';
 
 import t, { timeago } from 'coral-framework/services/i18n';
 
@@ -83,49 +84,53 @@ class UserDetailComment extends React.Component {
               </Link>
             }
           </div>
-          <CommentAnimatedEdit body={comment.body}>
-            <div className={styles.bodyContainer}>
-              <div className={styles.body}>
-                <Slot
-                  fill="userDetailCommentContent"
-                  className={cn(
-                    styles.commentContent,
-                    'talk-admin-user-detail-comment'
-                  )}
-                  size={1}
-                  defaultComponent={AdminCommentContent}
-                  passthrough={slotPassthrough}
-                />
-                <a
-                  className={styles.external}
-                  href={`${comment.asset.url}?commentId=${comment.id}`}
-                  target="_blank"
-                >
-                  <Icon name="open_in_new" /> {t('comment.view_context')}
-                </a>
-              </div>
-              <div className={styles.sideActions}>
-                <IfHasLink text={comment.body}>
-                  <span className={styles.hasLinks}>
-                    {/* TODO: translate string */}
-                    <Icon name="error_outline" /> Contains Link
-                  </span>
-                </IfHasLink>
-                <div className={styles.actions}>
-                  <ApproveButton
-                    active={comment.status === 'ACCEPTED'}
-                    onClick={this.approve}
-                    minimal
-                  />
-                  <RejectButton
-                    active={comment.status === 'REJECTED'}
-                    onClick={this.reject}
-                    minimal
+          {comment.body ? (
+            <CommentAnimatedEdit body={comment.body}>
+              <div className={styles.bodyContainer}>
+                <div className={styles.body}>
+                  <Slot
+                    fill="userDetailCommentContent"
+                    className={cn(
+                      styles.commentContent,
+                      'talk-admin-user-detail-comment'
+                    )}
+                    size={1}
+                    defaultComponent={AdminCommentContent}
+                    passthrough={slotPassthrough}
                   />
+                  <a
+                    className={styles.external}
+                    href={`${comment.asset.url}?commentId=${comment.id}`}
+                    target="_blank"
+                  >
+                    <Icon name="open_in_new" /> {t('comment.view_context')}
+                  </a>
+                </div>
+                <div className={styles.sideActions}>
+                  <IfHasLink text={comment.body}>
+                    <span className={styles.hasLinks}>
+                      {/* TODO: translate string */}
+                      <Icon name="error_outline" /> Contains Link
+                    </span>
+                  </IfHasLink>
+                  <div className={styles.actions}>
+                    <ApproveButton
+                      active={comment.status === 'ACCEPTED'}
+                      onClick={this.approve}
+                      minimal
+                    />
+                    <RejectButton
+                      active={comment.status === 'REJECTED'}
+                      onClick={this.reject}
+                      minimal
+                    />
+                  </div>
                 </div>
               </div>
-            </div>
-          </CommentAnimatedEdit>
+            </CommentAnimatedEdit>
+          ) : (
+            <CommentDeletedTombstone />
+          )}
         </div>
         <CommentDetails root={root} comment={comment} />
       </li>
@@ -152,7 +157,7 @@ UserDetailComment.propTypes = {
   comment: PropTypes.shape({
     id: PropTypes.string.isRequired,
     status: PropTypes.string.isRequired,
-    body: PropTypes.string.isRequired,
+    body: PropTypes.string,
     actions: PropTypes.array,
     created_at: PropTypes.string.isRequired,
     asset: PropTypes.shape({
diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.js b/client/coral-admin/src/routes/Moderation/components/Comment.js
index 28dcf8ca8..137bd9381 100644
--- a/client/coral-admin/src/routes/Moderation/components/Comment.js
+++ b/client/coral-admin/src/routes/Moderation/components/Comment.js
@@ -13,6 +13,7 @@ import IfHasLink from 'coral-admin/src/components/IfHasLink';
 import cn from 'classnames';
 import ApproveButton from 'coral-admin/src/components/ApproveButton';
 import RejectButton from 'coral-admin/src/components/RejectButton';
+import CommentDeletedTombstone from '../../../components/CommentDeletedTombstone';
 
 import t, { timeago } from 'coral-framework/services/i18n';
 
@@ -133,48 +134,52 @@ class Comment extends React.Component {
               </Link>
             )}
           </div>
-          <CommentAnimatedEdit body={comment.body}>
-            <div className={styles.itemBody}>
-              <div className={styles.body}>
-                <Slot
-                  fill="adminCommentContent"
-                  className={cn(styles.commentContent, 'talk-admin-comment')}
-                  size={1}
-                  defaultComponent={AdminCommentContent}
-                  passthrough={{ ...slotPassthrough, ...formatterSettings }}
-                />
-                <div className={styles.commentContentFooter}>
-                  <a
-                    className={styles.external}
-                    href={`${comment.asset.url}?commentId=${comment.id}`}
-                    target="_blank"
-                  >
-                    <Icon name="open_in_new" /> {t('comment.view_context')}
-                  </a>
+          {comment.body ? (
+            <CommentAnimatedEdit body={comment.body}>
+              <div className={styles.itemBody}>
+                <div className={styles.body}>
+                  <Slot
+                    fill="adminCommentContent"
+                    className={cn(styles.commentContent, 'talk-admin-comment')}
+                    size={1}
+                    defaultComponent={AdminCommentContent}
+                    passthrough={{ ...slotPassthrough, ...formatterSettings }}
+                  />
+                  <div className={styles.commentContentFooter}>
+                    <a
+                      className={styles.external}
+                      href={`${comment.asset.url}?commentId=${comment.id}`}
+                      target="_blank"
+                    >
+                      <Icon name="open_in_new" /> {t('comment.view_context')}
+                    </a>
+                  </div>
                 </div>
-              </div>
 
-              <div className={styles.sideActions}>
-                <IfHasLink text={comment.body}>
-                  <span className={styles.hasLinks}>
-                    {/* TODO: translate string */}
-                    <Icon name="error_outline" /> Contains Link
-                  </span>
-                </IfHasLink>
-                <div className={`actions ${styles.actions}`}>
-                  <ApproveButton
-                    active={comment.status === 'ACCEPTED'}
-                    onClick={this.approve}
-                  />
-                  <RejectButton
-                    active={comment.status === 'REJECTED'}
-                    onClick={this.reject}
-                  />
+                <div className={styles.sideActions}>
+                  <IfHasLink text={comment.body}>
+                    <span className={styles.hasLinks}>
+                      {/* TODO: translate string */}
+                      <Icon name="error_outline" /> Contains Link
+                    </span>
+                  </IfHasLink>
+                  <div className={`actions ${styles.actions}`}>
+                    <ApproveButton
+                      active={comment.status === 'ACCEPTED'}
+                      onClick={this.approve}
+                    />
+                    <RejectButton
+                      active={comment.status === 'REJECTED'}
+                      onClick={this.reject}
+                    />
+                  </div>
+                  <Slot fill="adminSideActions" passthrough={slotPassthrough} />
                 </div>
-                <Slot fill="adminSideActions" passthrough={slotPassthrough} />
               </div>
-            </div>
-          </CommentAnimatedEdit>
+            </CommentAnimatedEdit>
+          ) : (
+            <CommentDeletedTombstone />
+          )}
         </div>
         <CommentDetails
           root={root}
@@ -200,7 +205,7 @@ Comment.propTypes = {
   comment: PropTypes.shape({
     id: PropTypes.string.isRequired,
     status: PropTypes.string.isRequired,
-    body: PropTypes.string.isRequired,
+    body: PropTypes.string,
     action_summaries: PropTypes.array,
     actions: PropTypes.array,
     created_at: PropTypes.string.isRequired,
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
new file mode 100644
index 000000000..af681d596
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
@@ -0,0 +1,84 @@
+.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;
+  }
+}
\ No newline at end of file
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
new file mode 100644
index 000000000..097168b06
--- /dev/null
+++ b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
@@ -0,0 +1,120 @@
+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;

From e9c18faf32bd9641f30bc42d3801d272455bf2de Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 8 May 2018 11:30:33 -0300
Subject: [PATCH 141/160] Deleted Comment display in Queues

---
 .../src/components/CommentDeletedTombstone.js |   3 +-
 .../src/components/UserDetailComment.js       |  97 ++++++++--------
 .../routes/Moderation/components/Comment.css  |   4 +
 .../routes/Moderation/components/Comment.js   | 105 ++++++++++--------
 4 files changed, 120 insertions(+), 89 deletions(-)

diff --git a/client/coral-admin/src/components/CommentDeletedTombstone.js b/client/coral-admin/src/components/CommentDeletedTombstone.js
index db9a609b1..c04e97b88 100644
--- a/client/coral-admin/src/components/CommentDeletedTombstone.js
+++ b/client/coral-admin/src/components/CommentDeletedTombstone.js
@@ -1,8 +1,9 @@
 import React from 'react';
 import styles from './CommentDeletedTombstone.css';
+import t from 'coral-framework/services/i18n';
 
 const CommentDeletedTombstone = () => (
-  <div className={styles.tombstone}>The comment was deleted.</div>
+  <div className={styles.tombstone}>{t('framework.comment_is_deleted')}</div>
 );
 
 export default CommentDeletedTombstone;
diff --git a/client/coral-admin/src/components/UserDetailComment.js b/client/coral-admin/src/components/UserDetailComment.js
index f7a500203..41fb87b28 100644
--- a/client/coral-admin/src/components/UserDetailComment.js
+++ b/client/coral-admin/src/components/UserDetailComment.js
@@ -44,6 +44,19 @@ class UserDetailComment extends React.Component {
       body: comment.body,
     };
 
+    if (!comment.body) {
+      return (
+        <li
+          tabIndex={0}
+          className={cn(className, styles.root, {
+            [styles.rootSelected]: selected,
+          })}
+        >
+          <CommentDeletedTombstone />
+        </li>
+      );
+    }
+
     return (
       <li
         tabIndex={0}
@@ -84,53 +97,49 @@ class UserDetailComment extends React.Component {
               </Link>
             }
           </div>
-          {comment.body ? (
-            <CommentAnimatedEdit body={comment.body}>
-              <div className={styles.bodyContainer}>
-                <div className={styles.body}>
-                  <Slot
-                    fill="userDetailCommentContent"
-                    className={cn(
-                      styles.commentContent,
-                      'talk-admin-user-detail-comment'
-                    )}
-                    size={1}
-                    defaultComponent={AdminCommentContent}
-                    passthrough={slotPassthrough}
+          <CommentAnimatedEdit body={comment.body}>
+            <div className={styles.bodyContainer}>
+              <div className={styles.body}>
+                <Slot
+                  fill="userDetailCommentContent"
+                  className={cn(
+                    styles.commentContent,
+                    'talk-admin-user-detail-comment'
+                  )}
+                  size={1}
+                  defaultComponent={AdminCommentContent}
+                  passthrough={slotPassthrough}
+                />
+                <a
+                  className={styles.external}
+                  href={`${comment.asset.url}?commentId=${comment.id}`}
+                  target="_blank"
+                >
+                  <Icon name="open_in_new" /> {t('comment.view_context')}
+                </a>
+              </div>
+              <div className={styles.sideActions}>
+                <IfHasLink text={comment.body}>
+                  <span className={styles.hasLinks}>
+                    {/* TODO: translate string */}
+                    <Icon name="error_outline" /> Contains Link
+                  </span>
+                </IfHasLink>
+                <div className={styles.actions}>
+                  <ApproveButton
+                    active={comment.status === 'ACCEPTED'}
+                    onClick={this.approve}
+                    minimal
+                  />
+                  <RejectButton
+                    active={comment.status === 'REJECTED'}
+                    onClick={this.reject}
+                    minimal
                   />
-                  <a
-                    className={styles.external}
-                    href={`${comment.asset.url}?commentId=${comment.id}`}
-                    target="_blank"
-                  >
-                    <Icon name="open_in_new" /> {t('comment.view_context')}
-                  </a>
-                </div>
-                <div className={styles.sideActions}>
-                  <IfHasLink text={comment.body}>
-                    <span className={styles.hasLinks}>
-                      {/* TODO: translate string */}
-                      <Icon name="error_outline" /> Contains Link
-                    </span>
-                  </IfHasLink>
-                  <div className={styles.actions}>
-                    <ApproveButton
-                      active={comment.status === 'ACCEPTED'}
-                      onClick={this.approve}
-                      minimal
-                    />
-                    <RejectButton
-                      active={comment.status === 'REJECTED'}
-                      onClick={this.reject}
-                      minimal
-                    />
-                  </div>
                 </div>
               </div>
-            </CommentAnimatedEdit>
-          ) : (
-            <CommentDeletedTombstone />
-          )}
+            </div>
+          </CommentAnimatedEdit>
         </div>
         <CommentDetails root={root} comment={comment} />
       </li>
diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.css b/client/coral-admin/src/routes/Moderation/components/Comment.css
index 2dc03a503..0f8f91a97 100644
--- a/client/coral-admin/src/routes/Moderation/components/Comment.css
+++ b/client/coral-admin/src/routes/Moderation/components/Comment.css
@@ -85,6 +85,10 @@
   font-weight: 300;
 }
 
+.deleted {
+  background-color: #f0f0f0;
+}
+
 .moderateArticle {
   font-size: 14px;
   margin: 10px 0;
diff --git a/client/coral-admin/src/routes/Moderation/components/Comment.js b/client/coral-admin/src/routes/Moderation/components/Comment.js
index 137bd9381..97cdf9443 100644
--- a/client/coral-admin/src/routes/Moderation/components/Comment.js
+++ b/client/coral-admin/src/routes/Moderation/components/Comment.js
@@ -76,6 +76,27 @@ class Comment extends React.Component {
       asset: comment.asset,
     };
 
+    if (!comment.body) {
+      return (
+        <li
+          tabIndex={0}
+          className={cn(
+            className,
+            'mdl-card',
+            selectionStateCSS,
+            styles.root,
+            { [styles.selected]: selected, [styles.dangling]: dangling },
+            'talk-admin-moderate-comment',
+            styles.deleted
+          )}
+          id={`comment_${comment.id}`}
+          ref={this.handleRef}
+        >
+          <CommentDeletedTombstone />
+        </li>
+      );
+    }
+
     return (
       <li
         tabIndex={0}
@@ -134,52 +155,48 @@ class Comment extends React.Component {
               </Link>
             )}
           </div>
-          {comment.body ? (
-            <CommentAnimatedEdit body={comment.body}>
-              <div className={styles.itemBody}>
-                <div className={styles.body}>
-                  <Slot
-                    fill="adminCommentContent"
-                    className={cn(styles.commentContent, 'talk-admin-comment')}
-                    size={1}
-                    defaultComponent={AdminCommentContent}
-                    passthrough={{ ...slotPassthrough, ...formatterSettings }}
-                  />
-                  <div className={styles.commentContentFooter}>
-                    <a
-                      className={styles.external}
-                      href={`${comment.asset.url}?commentId=${comment.id}`}
-                      target="_blank"
-                    >
-                      <Icon name="open_in_new" /> {t('comment.view_context')}
-                    </a>
-                  </div>
-                </div>
-
-                <div className={styles.sideActions}>
-                  <IfHasLink text={comment.body}>
-                    <span className={styles.hasLinks}>
-                      {/* TODO: translate string */}
-                      <Icon name="error_outline" /> Contains Link
-                    </span>
-                  </IfHasLink>
-                  <div className={`actions ${styles.actions}`}>
-                    <ApproveButton
-                      active={comment.status === 'ACCEPTED'}
-                      onClick={this.approve}
-                    />
-                    <RejectButton
-                      active={comment.status === 'REJECTED'}
-                      onClick={this.reject}
-                    />
-                  </div>
-                  <Slot fill="adminSideActions" passthrough={slotPassthrough} />
+          <CommentAnimatedEdit body={comment.body}>
+            <div className={styles.itemBody}>
+              <div className={styles.body}>
+                <Slot
+                  fill="adminCommentContent"
+                  className={cn(styles.commentContent, 'talk-admin-comment')}
+                  size={1}
+                  defaultComponent={AdminCommentContent}
+                  passthrough={{ ...slotPassthrough, ...formatterSettings }}
+                />
+                <div className={styles.commentContentFooter}>
+                  <a
+                    className={styles.external}
+                    href={`${comment.asset.url}?commentId=${comment.id}`}
+                    target="_blank"
+                  >
+                    <Icon name="open_in_new" /> {t('comment.view_context')}
+                  </a>
                 </div>
               </div>
-            </CommentAnimatedEdit>
-          ) : (
-            <CommentDeletedTombstone />
-          )}
+
+              <div className={styles.sideActions}>
+                <IfHasLink text={comment.body}>
+                  <span className={styles.hasLinks}>
+                    {/* TODO: translate string */}
+                    <Icon name="error_outline" /> Contains Link
+                  </span>
+                </IfHasLink>
+                <div className={`actions ${styles.actions}`}>
+                  <ApproveButton
+                    active={comment.status === 'ACCEPTED'}
+                    onClick={this.approve}
+                  />
+                  <RejectButton
+                    active={comment.status === 'REJECTED'}
+                    onClick={this.reject}
+                  />
+                </div>
+                <Slot fill="adminSideActions" passthrough={slotPassthrough} />
+              </div>
+            </div>
+          </CommentAnimatedEdit>
         </div>
         <CommentDetails
           root={root}

From d02bb20333d5fde61b431a3446927ed58dbda9a6 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Tue, 8 May 2018 11:33:39 -0300
Subject: [PATCH 142/160] removing extra

---
 .../components/ChangeUsernameDialog.css       |  84 ------------
 .../client/components/ChangeUsernameDialog.js | 120 ------------------
 2 files changed, 204 deletions(-)
 delete mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
 delete mode 100644 plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js

diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
deleted file mode 100644
index af681d596..000000000
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.css
+++ /dev/null
@@ -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;
-  }
-}
\ No newline at end of file
diff --git a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js b/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
deleted file mode 100644
index 097168b06..000000000
--- a/plugins/talk-plugin-local-auth/client/components/ChangeUsernameDialog.js
+++ /dev/null
@@ -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;

From 231dfe7997545f65425a213ce4c14e404f527b46 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 09:32:14 -0600
Subject: [PATCH 143/160] Fixes for notifications

---
 .../index.js                                  | 56 +++++++++++++------
 .../server/NotificationManager.js             |  5 +-
 2 files changed, 44 insertions(+), 17 deletions(-)

diff --git a/plugins/talk-plugin-notifications-category-reply/index.js b/plugins/talk-plugin-notifications-category-reply/index.js
index cce258daa..627d50ff8 100644
--- a/plugins/talk-plugin-notifications-category-reply/index.js
+++ b/plugins/talk-plugin-notifications-category-reply/index.js
@@ -1,17 +1,23 @@
 const { get, map } = require('lodash');
 const path = require('path');
 
-const handle = async (ctx, comment) => {
+const commentAddedHandler = async (ctx, comment) => {
   // Check to see if this reply is visible.
   if (!comment.visible) {
-    ctx.log.info('comment was not visible, not sending notification');
+    ctx.log.info(
+      { commentID: comment.id },
+      'comment was not visible, not sending notification'
+    );
     return;
   }
 
   // Check to see if this is a reply to an existing comment.
   const parentID = get(comment, 'parent_id', null);
-  if (parentID === null) {
-    ctx.log.info('could not get parent comment id');
+  if (!parentID) {
+    ctx.log.info(
+      { commentID: comment.id },
+      'could not get parent comment id, comment must be a top level comment'
+    );
     return;
   }
 
@@ -40,42 +46,60 @@ const handle = async (ctx, comment) => {
     return;
   }
 
+  const parentComment = get(reply, 'data.comment');
+  if (!parentComment) {
+    ctx.log.info({ parentID }, 'could not get parent comment');
+    return;
+  }
+
   // Check if the user has notifications enabled.
   const enabled = get(
-    reply,
-    'data.comment.user.notificationSettings.onReply',
+    parentComment,
+    'user.notificationSettings.onReply',
     false
   );
   if (!enabled) {
+    ctx.log.error(
+      'parent comment author does not have notification category enabled'
+    );
     return;
   }
 
-  const userID = get(reply, 'data.comment.user.id', null);
-  if (!userID) {
-    ctx.log.info('could not get parent comment user id');
+  const parentAuthor = get(parentComment, 'user', null);
+  if (!parentAuthor) {
+    ctx.log.info('could not get parent author');
     return;
   }
 
-  // Pull out the author of the new comment.
+  // Pull out the author of the new comment. This was outputted from Mongo, so
+  // we have to pull it out of the `author_id` field.
   const authorID = get(comment, 'author_id');
 
   // Check to see if this is yourself replying to yourself, if that's the case
   // don't send a notification.
-  if (userID === authorID) {
+  if (parentAuthor.id === authorID) {
     ctx.log.info('user id of parent comment is the same as the new comment');
     return;
   }
 
   // Check to see if this user is ignoring the user who replied to their
   // comment.
-  if (map(get(comment, 'user.ignoredUsers', []), 'id').indexOf(authorID)) {
-    ctx.log.info('parent user has ignored the author of the new comment');
+  const ignoredUsers = map(get(parentAuthor, 'ignoredUsers', []), 'id');
+  if (ignoredUsers.includes(authorID)) {
+    ctx.log.info(
+      { parentAuthorID: parentAuthor.id, authorID },
+      'parent user has ignored the author of the new comment'
+    );
     return;
   }
 
   // The user does have notifications for replied comments enabled, queue the
   // notification to be sent.
-  return { userID, date: comment.created_at, context: comment.id };
+  return {
+    userID: parentAuthor.id,
+    date: comment.created_at,
+    context: comment.id,
+  };
 };
 
 const hydrate = async (ctx, category, context) => {
@@ -133,7 +157,7 @@ const commentAcceptedHandleAdapter = (ctx, comment) => {
   }
 
   // Delegate to the handle function.
-  return handle(ctx, comment);
+  return commentAddedHandler(ctx, comment);
 };
 
 module.exports = {
@@ -155,7 +179,7 @@ module.exports = {
   translations: path.join(__dirname, 'translations.yml'),
   notifications: [
     {
-      handle,
+      handle: commentAddedHandler,
       category: 'reply',
       event: 'commentAdded',
       hydrate,
diff --git a/plugins/talk-plugin-notifications/server/NotificationManager.js b/plugins/talk-plugin-notifications/server/NotificationManager.js
index eb90dd48b..63af8efdb 100644
--- a/plugins/talk-plugin-notifications/server/NotificationManager.js
+++ b/plugins/talk-plugin-notifications/server/NotificationManager.js
@@ -32,7 +32,10 @@ const handleHandlers = (ctx, handlers, ...args) =>
         // Attempt to create a notification out of it.
         const notification = await handle(ctx, ...args);
         if (!notification) {
-          ctx.log.info('no notification deemed by event handler');
+          ctx.log.info(
+            { category, event },
+            'no notification deemed by event handler'
+          );
           return;
         }
 

From 74dbfda63368538ed9b82131ba0af058d67c0fd6 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 11:53:49 -0600
Subject: [PATCH 144/160] Exclude deleted comments

---
 .../Moderation/containers/Moderation.js       |  2 ++
 graph/loaders/comments.js                     | 34 +++++++++++++------
 graph/typeDefs.graphql                        | 11 +++++-
 services/comments.js                          | 12 +++++--
 4 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/client/coral-admin/src/routes/Moderation/containers/Moderation.js b/client/coral-admin/src/routes/Moderation/containers/Moderation.js
index f35255732..c908404cb 100644
--- a/client/coral-admin/src/routes/Moderation/containers/Moderation.js
+++ b/client/coral-admin/src/routes/Moderation/containers/Moderation.js
@@ -432,6 +432,7 @@ const withModQueueQuery = withQuery(
     ${Object.keys(queueConfig).map(
       queue => `
       ${queue}: comments(query: {
+        excludeDeleted: true,
         statuses: ${
           queueConfig[queue].statuses
             ? `[${queueConfig[queue].statuses.join(', ')}],`
@@ -458,6 +459,7 @@ const withModQueueQuery = withQuery(
     ${Object.keys(queueConfig).map(
       queue => `
       ${queue}Count: commentCount(query: {
+        excludeDeleted: true,
         statuses: ${
           queueConfig[queue].statuses
             ? `[${queueConfig[queue].statuses.join(', ')}],`
diff --git a/graph/loaders/comments.js b/graph/loaders/comments.js
index 37d40a219..b42a636bc 100644
--- a/graph/loaders/comments.js
+++ b/graph/loaders/comments.js
@@ -94,6 +94,7 @@ const getCommentCountByQuery = (ctx, options) => {
     author_id,
     tags,
     action_type,
+    excludeDeleted,
   } = options;
 
   // If user queries for statuses other than NONE and/or ACCEPTED statuses, it needs
@@ -120,6 +121,12 @@ const getCommentCountByQuery = (ctx, options) => {
     query.merge({ author_id });
   }
 
+  if (excludeDeleted) {
+    // The null query matches documents that either contain the `deleted_at`
+    // field whose value is null or that do not contain the `deleted_at` field.
+    query.merge({ deleted_at: null });
+  }
+
   if (ctx.user != null && ctx.user.can(SEARCH_OTHERS_COMMENTS) && action_type) {
     query.merge({
       [`action_counts.${sc(action_type.toLowerCase())}`]: {
@@ -328,11 +335,12 @@ const getCommentsByQuery = async (
     sortOrder,
     sortBy,
     excludeIgnored,
+    excludeDeleted,
     tags,
     action_type,
   }
 ) => {
-  let comments = CommentModel.find();
+  const query = CommentModel.find();
 
   // Enforce that the limit must be gte 0 if this option is not true.
   if (!ALLOW_NO_LIMIT_QUERIES && limit < 0) {
@@ -350,11 +358,17 @@ const getCommentsByQuery = async (
   }
 
   if (statuses) {
-    comments = comments.where({ status: { $in: statuses } });
+    query.merge({ status: { $in: statuses } });
+  }
+
+  if (excludeDeleted) {
+    // The null query matches documents that either contain the `deleted_at`
+    // field whose value is null or that do not contain the `deleted_at` field.
+    query.merge({ deleted_at: null });
   }
 
   if (ctx.user != null && ctx.user.can(SEARCH_OTHERS_COMMENTS) && action_type) {
-    comments = comments.where({
+    query.merge({
       [`action_counts.${sc(action_type.toLowerCase())}`]: {
         $gt: 0,
       },
@@ -362,7 +376,7 @@ const getCommentsByQuery = async (
   }
 
   if (ids) {
-    comments = comments.find({
+    query.merge({
       id: {
         $in: ids,
       },
@@ -370,7 +384,7 @@ const getCommentsByQuery = async (
   }
 
   if (tags) {
-    comments = comments.find({
+    query.merge({
       'tags.tag.name': {
         $in: tags,
       },
@@ -383,17 +397,17 @@ const getCommentsByQuery = async (
     (ctx.user.can(SEARCH_OTHERS_COMMENTS) || ctx.user.id === author_id) &&
     author_id != null
   ) {
-    comments = comments.where({ author_id });
+    query.merge({ author_id });
   }
 
   if (asset_id) {
-    comments = comments.where({ asset_id });
+    query.merge({ asset_id });
   }
 
   // We perform the undefined check because, null, is a valid state for the
   // search to be with, which indicates that it is at depth 0.
   if (parent_id !== undefined) {
-    comments = comments.where({ parent_id });
+    query.merge({ parent_id });
   }
 
   if (
@@ -402,12 +416,12 @@ const getCommentsByQuery = async (
     ctx.user.ignoresUsers &&
     ctx.user.ignoresUsers.length > 0
   ) {
-    comments = comments.where({
+    query.merge({
       author_id: { $nin: ctx.user.ignoresUsers },
     });
   }
 
-  return executeWithSort(ctx, comments, { cursor, sortOrder, sortBy, limit });
+  return executeWithSort(ctx, query, { cursor, sortOrder, sortBy, limit });
 };
 
 /**
diff --git a/graph/typeDefs.graphql b/graph/typeDefs.graphql
index b5c193e3d..03c97ce58 100644
--- a/graph/typeDefs.graphql
+++ b/graph/typeDefs.graphql
@@ -418,6 +418,9 @@ input CommentsQuery {
 
   # Exclude comments ignored by the requesting user
   excludeIgnored: Boolean
+
+  # excludeDeleted when true will exclude deleted comments from the response.
+  excludeDeleted: Boolean = false
 }
 
 input RepliesQuery {
@@ -434,6 +437,9 @@ input RepliesQuery {
 
   # Exclude comments ignored by the requesting user
   excludeIgnored: Boolean
+
+  # excludeDeleted when true will exclude deleted comments from the response.
+  excludeDeleted: Boolean = false
 }
 
 # CommentCountQuery allows the ability to query comment counts by specific
@@ -463,6 +469,9 @@ input CommentCountQuery {
 
   # Filter by a specific tag name.
   tags: [String!]
+
+  # excludeDeleted when true will exclude deleted comments from the count.
+  excludeDeleted: Boolean = false
 }
 
 # UserCountQuery allows the ability to query user counts by specific
@@ -519,7 +528,7 @@ type Comment {
   replies(query: RepliesQuery = {}): CommentConnection!
 
   # replyCount is the number of replies with a depth of 1. Only direct replies
-  # to this comment are counted.
+  # to this comment are counted. Deleted comments are included in this count.
   replyCount: Int
 
   # Actions completed on the parent. Requires the `ADMIN` role.
diff --git a/services/comments.js b/services/comments.js
index 4b436b5f4..19b611089 100644
--- a/services/comments.js
+++ b/services/comments.js
@@ -39,9 +39,12 @@ module.exports = {
     const created_at = new Date();
 
     // Check to see if we are replying to a comment, and if that comment is
-    // visible.
+    // visible and that it's not deleted.
     if (parent_id !== null) {
-      const parent = await CommentModel.findOne({ id: parent_id });
+      const parent = await CommentModel.findOne({
+        id: parent_id,
+        deleted_at: null,
+      });
       if (parent === null || !parent.visible) {
         throw new ErrParentDoesNotVisible();
       }
@@ -94,6 +97,7 @@ module.exports = {
       status: {
         $in: EDITABLE_STATUSES,
       },
+      deleted_at: null,
     };
 
     // Establish the edit window (if it exists) and add the condition to the
@@ -186,8 +190,10 @@ module.exports = {
    */
   pushStatus: async (id, status, assigned_by = null) => {
     const created_at = new Date();
+
+    // Update the comment unless the comment was deleted.
     const originalComment = await CommentModel.findOneAndUpdate(
-      { id },
+      { id, deleted_at: null },
       {
         $push: {
           status_history: {

From e14af46c68c9a7fcad6fcaa58a4ea4aaa651db85 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 12:02:04 -0600
Subject: [PATCH 145/160] prevent actions against deleted comments

---
 graph/mutators/action.js | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/graph/mutators/action.js b/graph/mutators/action.js
index d759449b0..5557e1a9b 100644
--- a/graph/mutators/action.js
+++ b/graph/mutators/action.js
@@ -14,8 +14,15 @@ const getActionItem = async (ctx, { item_id, item_type }) => {
   const { loaders: { Comments, Users } } = ctx;
 
   switch (item_type) {
-    case 'COMMENTS':
-      return Comments.get.load(item_id);
+    case 'COMMENTS': {
+      // Get a comment by ID, unless the comment is deleted, then return null.
+      const comment = await Comments.get.load(item_id);
+      if (comment.deleted_at) {
+        return null;
+      }
+
+      return comment;
+    }
     case 'USERS':
       return Users.getByID.load(item_id);
     default:

From 7b86ec7d0a5ae915aa1af68929c822140b1a7320 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 12:06:52 -0600
Subject: [PATCH 146/160] Update translations.yml

---
 plugins/talk-plugin-profile-data/client/translations.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/translations.yml b/plugins/talk-plugin-profile-data/client/translations.yml
index e139cfb57..d1fdccb73 100644
--- a/plugins/talk-plugin-profile-data/client/translations.yml
+++ b/plugins/talk-plugin-profile-data/client/translations.yml
@@ -1,7 +1,7 @@
 en:
   download_request:
     section_title: "Download My Comment History"
-    you_will_get_a_copy: "You will recieve an email with a link to download your comment history. You can make"
+    you_will_get_a_copy: "You will receive an email with a link to download your comment history. You can make"
     download_rate: "one download request every {0} days"
     most_recent_request: "Your most recent request"
     request: "Request Comment History"

From a1edbcf974e10986ec15613563b7f00080f66143 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 14:01:04 -0600
Subject: [PATCH 147/160] disallow adding a tag to a deleted comment

---
 services/tags.js | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/services/tags.js b/services/tags.js
index b4e70cb29..18cf5869f 100644
--- a/services/tags.js
+++ b/services/tags.js
@@ -163,6 +163,11 @@ class TagsService {
       },
     };
 
+    if (item_type === 'COMMENT') {
+      // Don't allow adding tags to deleted comments.
+      query.deleted_at = null;
+    }
+
     // If ownership verification is required, ensure that the person that is
     // assigning the tag is the same person that owns the comment.
     if (ownershipCheck) {

From 17a0297911754e2049453aa9a7ad4878f4252094 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 14:02:47 -0600
Subject: [PATCH 148/160] fixed bug..

---
 services/tags.js | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/services/tags.js b/services/tags.js
index 18cf5869f..49d271c0b 100644
--- a/services/tags.js
+++ b/services/tags.js
@@ -13,6 +13,10 @@ const updateModel = async (item_type, query, update) => {
   switch (item_type) {
     case 'COMMENTS':
       Model = Comment;
+
+      // Don't allow adding tags to deleted comments.
+      query.deleted_at = null;
+
       break;
     case 'ASSETS':
       Model = Asset;
@@ -163,11 +167,6 @@ class TagsService {
       },
     };
 
-    if (item_type === 'COMMENT') {
-      // Don't allow adding tags to deleted comments.
-      query.deleted_at = null;
-    }
-
     // If ownership verification is required, ensure that the person that is
     // assigning the tag is the same person that owns the comment.
     if (ownershipCheck) {

From 8c29b0f1d44326ecbb13a735607f0d3197a881b9 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 15:20:56 -0600
Subject: [PATCH 149/160] fix for delete

---
 graph/mutators/user.js | 22 ++++++++++++++++------
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/graph/mutators/user.js b/graph/mutators/user.js
index 8b9afc206..7422f2290 100644
--- a/graph/mutators/user.js
+++ b/graph/mutators/user.js
@@ -70,15 +70,25 @@ const setRole = (ctx, id, role) => {
 /**
  * transforms a specific action to a removal action on the target model.
  */
-const actionDecrTransformer = ({ item_id, action_type, group_id }) => ({
-  query: { id: item_id },
-  update: {
+const actionDecrTransformer = ({ item_id, action_type, group_id }) => {
+  const update = {
     $inc: {
       [`action_counts.${action_type.toLowerCase()}`]: -1,
-      [`action_counts.${action_type.toLowerCase()}_${group_id.toLowerCase()}`]: -1,
     },
-  },
-});
+  };
+
+  if (group_id) {
+    // If the action had a groupID, also decrement that key.
+    update.$inc[
+      `action_counts.${action_type.toLowerCase()}_${group_id.toLowerCase()}`
+    ] = -1;
+  }
+
+  return {
+    query: { id: item_id },
+    update,
+  };
+};
 
 // delUser will delete a given user with the specified id.
 const delUser = async (ctx, id) => {

From 1815bd4d75275e8008ecb90f58f51820f463692b Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 15:30:12 -0600
Subject: [PATCH 150/160] fix translation copy

---
 .../client/components/DeleteMyAccount.js                        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
index bbada134f..179fa0193 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccount.js
@@ -27,7 +27,7 @@ class DeleteMyAccount extends React.Component {
     const { cancelAccountDeletion, notify } = this.props;
     try {
       await cancelAccountDeletion();
-      notify('success', t('delete_request.account_deletion_requested'));
+      notify('success', t('delete_request.account_deletion_cancelled'));
     } catch (err) {
       notify('error', getErrorMessages(err));
     }

From 7348bfc7c9f8c95fb414c6067efc180049eea888 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Tue, 8 May 2018 15:46:24 -0600
Subject: [PATCH 151/160] fixed error

---
 .../client/containers/IgnoreUserConfirmation.js      | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js b/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
index 5aa834034..efd4cd366 100644
--- a/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
+++ b/plugins/talk-plugin-ignore-user/client/containers/IgnoreUserConfirmation.js
@@ -10,16 +10,22 @@ import { bindActionCreators } from 'redux';
 import { closeMenu } from 'plugins/talk-plugin-author-menu/client/actions';
 import { notify } from 'plugin-api/beta/client/actions/notification';
 import { t } from 'plugin-api/beta/client/services';
+import { getErrorMessages } from 'coral-framework/utils';
 
 class IgnoreUserConfirmationContainer extends React.Component {
-  ignoreUser = () => {
+  ignoreUser = async () => {
     const { ignoreUser, notify, comment, closeMenu } = this.props;
-    ignoreUser(comment.user.id).then(() => {
+
+    try {
+      await ignoreUser(comment.user.id);
       notify(
         'success',
         t('talk-plugin-ignore-user.notify_success', comment.user.username)
       );
-    });
+    } catch (err) {
+      notify('error', getErrorMessages(err));
+    }
+
     closeMenu();
   };
 

From b50fde619e436f9db1ea466c09776fae7199fa42 Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Tue, 8 May 2018 23:46:33 +0200
Subject: [PATCH 152/160] Pass postDontAgree to replies

---
 .../src/tabs/stream/components/AllCommentsPane.js             | 2 +-
 .../coral-embed-stream/src/tabs/stream/components/Comment.js  | 4 +++-
 .../coral-embed-stream/src/tabs/stream/containers/Stream.js   | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/client/coral-embed-stream/src/tabs/stream/components/AllCommentsPane.js b/client/coral-embed-stream/src/tabs/stream/components/AllCommentsPane.js
index 9aa2b8a4c..eae72c749 100644
--- a/client/coral-embed-stream/src/tabs/stream/components/AllCommentsPane.js
+++ b/client/coral-embed-stream/src/tabs/stream/components/AllCommentsPane.js
@@ -214,7 +214,7 @@ AllCommentsPane.propTypes = {
   asset: PropTypes.object,
   currentUser: PropTypes.object,
   postFlag: PropTypes.func,
-  postDontAgree: PropTypes.func,
+  postDontAgree: PropTypes.func.isRequired,
   loadNewReplies: PropTypes.func,
   deleteAction: PropTypes.func,
   showSignInDialog: PropTypes.func,
diff --git a/client/coral-embed-stream/src/tabs/stream/components/Comment.js b/client/coral-embed-stream/src/tabs/stream/components/Comment.js
index 8b1524839..32778f7ea 100644
--- a/client/coral-embed-stream/src/tabs/stream/components/Comment.js
+++ b/client/coral-embed-stream/src/tabs/stream/components/Comment.js
@@ -184,7 +184,7 @@ export default class Comment extends React.Component {
     maxCharCount: PropTypes.number,
     root: PropTypes.object,
     loadMore: PropTypes.func,
-    postDontAgree: PropTypes.func,
+    postDontAgree: PropTypes.func.isRequired,
     animateEnter: PropTypes.bool,
     commentClassNames: PropTypes.array,
     comment: PropTypes.object.isRequired,
@@ -410,6 +410,7 @@ export default class Comment extends React.Component {
       charCountEnable,
       showSignInDialog,
       liveUpdates,
+      postDontAgree,
       emit,
     } = this.props;
     return (
@@ -440,6 +441,7 @@ export default class Comment extends React.Component {
               key={reply.id}
               comment={reply}
               emit={emit}
+              postDontAgree={postDontAgree}
             />
           );
         })}
diff --git a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
index 17d3132ea..f1a973f03 100644
--- a/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
+++ b/client/coral-embed-stream/src/tabs/stream/containers/Stream.js
@@ -265,7 +265,7 @@ StreamContainer.propTypes = {
   commentClassNames: PropTypes.array,
   setActiveStreamTab: PropTypes.func,
   postFlag: PropTypes.func,
-  postDontAgree: PropTypes.func,
+  postDontAgree: PropTypes.func.isRequired,
   deleteAction: PropTypes.func,
   showSignInDialog: PropTypes.func,
   currentUser: PropTypes.object,

From 1517611c9ed4a36c47211effdae0f0a2a5894c13 Mon Sep 17 00:00:00 2001
From: Kim Gardner <kgardnr@gmail.com>
Date: Wed, 9 May 2018 11:00:02 -0400
Subject: [PATCH 153/160] Update tombstone copy

---
 locales/en.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/locales/en.yml b/locales/en.yml
index e293fb40b..9a26fbdb6 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -274,7 +274,7 @@ en:
     comment: comment
     comment_is_ignored: "This comment is hidden because you ignored this user."
     comment_is_rejected: "You have rejected this comment."
-    comment_is_deleted: "This comment was deleted."
+    comment_is_deleted: "This commenter has deleted their account."
     comment_is_hidden: "This comment is not available."
     comments: comments
     configure_stream: "Configure"

From 0ded5c72e98799a4cba0959985e7a8e529593776 Mon Sep 17 00:00:00 2001
From: okbel <curciobelen@gmail.com>
Date: Wed, 9 May 2018 14:23:22 -0300
Subject: [PATCH 154/160] adding media

---
 .../client/components/DeleteMyAccountDialog.css          | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
index 2735474da..26087c534 100644
--- a/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
+++ b/plugins/talk-plugin-profile-data/client/components/DeleteMyAccountDialog.css
@@ -1,12 +1,19 @@
+@custom-media --small-viewport (min-width: 425px);
+
 .dialog {
+  width: calc(100% - 50px);
   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: 380px;
+
   top: 10px;
   font-family: Helvetica, 'Helvetica Neue', Verdana, sans-serif;
   font-size: 14px;
   border-radius: 4px;
   padding: 20px;
+
+  @media (--small-viewport) {
+    width: 380px;
+  }
 }
 
 .close {

From 51525de679c3957d583d6b85ad8bf02398556ff5 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 9 May 2018 14:17:43 -0600
Subject: [PATCH 155/160] fixed set-role description

---
 bin/cli-users | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/bin/cli-users b/bin/cli-users
index a01980a20..bf34cce97 100755
--- a/bin/cli-users
+++ b/bin/cli-users
@@ -328,7 +328,7 @@ program
   .action(searchUsers);
 
 program
-  .command('set-role <userID> <role>')
+  .command('set-role <userID>')
   .description('sets the role on a user')
   .action(setUserRole);
 

From 9af3772087198b9645d5fcfb2733c5f01966b419 Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 9 May 2018 14:28:04 -0600
Subject: [PATCH 156/160] Added json output for assets list

- Fixes #1597
---
 bin/cli-assets | 40 ++++++++++++++++++++++++++++------------
 1 file changed, 28 insertions(+), 12 deletions(-)

diff --git a/bin/cli-assets b/bin/cli-assets
index 210b9f22e..62c996412 100755
--- a/bin/cli-assets
+++ b/bin/cli-assets
@@ -23,23 +23,33 @@ util.onshutdown([() => mongoose.disconnect()]);
 /**
  * Lists all the assets registered in the database.
  */
-async function listAssets() {
+async function listAssets(opts) {
   try {
     let assets = await AssetModel.find({}).sort({ created_at: 1 });
 
-    let table = new Table({
-      head: ['ID', 'Title', 'URL'],
-    });
+    switch (opts.format) {
+      case 'json': {
+        console.log(JSON.stringify(assets, null, 2));
+        break;
+      }
+      default: {
+        let table = new Table({
+          head: ['ID', 'Title', 'URL'],
+        });
 
-    assets.forEach(asset => {
-      table.push([
-        asset.id,
-        asset.title ? asset.title : '',
-        asset.url ? asset.url : '',
-      ]);
-    });
+        assets.forEach(asset => {
+          table.push([
+            asset.id,
+            asset.title ? asset.title : '',
+            asset.url ? asset.url : '',
+          ]);
+        });
+
+        console.log(table.toString());
+        break;
+      }
+    }
 
-    console.log(table.toString());
     util.shutdown();
   } catch (e) {
     console.error(e);
@@ -202,6 +212,12 @@ async function rewrite(search, replace, options) {
 
 program
   .command('list')
+  .option(
+    '--format <type>',
+    'Specify the output format [table]',
+    /^(table|json)$/i,
+    'table'
+  )
   .description('list all the assets in the database')
   .action(listAssets);
 

From ca3d56def87d1e478fb44a3d29ce82d1dd47ad1d Mon Sep 17 00:00:00 2001
From: Wyatt Johnson <wyattjoh@gmail.com>
Date: Wed, 9 May 2018 14:40:24 -0600
Subject: [PATCH 157/160] asset refresh patched

---
 bin/cli-assets | 35 ++++++++++++++++++++++++-----------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/bin/cli-assets b/bin/cli-assets
index 62c996412..5c1afb741 100755
--- a/bin/cli-assets
+++ b/bin/cli-assets
@@ -59,12 +59,13 @@ async function listAssets(opts) {
 
 async function refreshAssets(ageString) {
   try {
-    const now = new Date().getTime();
-    const ageMs = parseDuration(ageString);
-    const age = new Date(now - ageMs);
+    const query = AssetModel.find({}, { id: 1 });
+    if (ageString) {
+      // An age was specified, so filter only those assets.
+      const ageMs = parseDuration(ageString);
+      const age = new Date(Date.now() - ageMs);
 
-    let assets = await AssetModel.find(
-      {
+      query.merge({
         $or: [
           {
             scraped: {
@@ -75,16 +76,28 @@ async function refreshAssets(ageString) {
             scraped: null,
           },
         ],
-      },
-      { id: 1 }
-    );
+      });
+    }
 
     // Create a graph context.
     const ctx = Context.forSystem();
 
+    // Load the assets.
+    const cursor = query.cursor();
+
     // Queue all the assets for scraping.
-    await Promise.all(assets.map(({ id }) => scraper.create(ctx, id)));
-    console.log('Assets were queued to be scraped');
+    const promises = [];
+
+    let asset = await cursor.next();
+    while (asset) {
+      promises.push(scraper.create(ctx, asset.id));
+      asset = await cursor.next();
+    }
+
+    await Promise.all(promises);
+
+    console.log(`${promises.length} Assets were queued to be scraped.`);
+
     util.shutdown();
   } catch (e) {
     console.error(e);
@@ -222,7 +235,7 @@ program
   .action(listAssets);
 
 program
-  .command('refresh <age>')
+  .command('refresh [age]')
   .description('queues the assets that exceed the age requested')
   .action(refreshAssets);
 

From a092a197cffeb3a8a1591a2af4332effaadb7e3f Mon Sep 17 00:00:00 2001
From: Chi Vinh Le <vinh@wikiwi.io>
Date: Wed, 9 May 2018 23:45:53 +0200
Subject: [PATCH 158/160] Check correct email

---
 plugins/talk-plugin-local-auth/client/components/Profile.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/plugins/talk-plugin-local-auth/client/components/Profile.js b/plugins/talk-plugin-local-auth/client/components/Profile.js
index 2b2d4be11..c3b09aab2 100644
--- a/plugins/talk-plugin-local-auth/client/components/Profile.js
+++ b/plugins/talk-plugin-local-auth/client/components/Profile.js
@@ -114,11 +114,11 @@ class Profile extends React.Component {
 
   isSaveEnabled = () => {
     const { formData } = this.state;
-    const { emailAddress, username } = this.props;
+    const { root: { me: { username, email } } } = this.props;
     const formHasErrors = !!Object.keys(this.state.errors).length;
     const validUsername =
       formData.newUsername && formData.newUsername !== username;
-    const validEmail = formData.newEmail && formData.newEmail !== emailAddress;
+    const validEmail = formData.newEmail && formData.newEmail !== email;
 
     return !formHasErrors && (validUsername || validEmail);
   };

From 2554b261100ab80d0f38e8c83bdfb78cded75dd6 Mon Sep 17 00:00:00 2001
From: Andrew Losowsky <andrew@losowsky.com>
Date: Thu, 10 May 2018 10:21:44 -0400
Subject: [PATCH 159/160] Corrections and clarity

Fixed the incorrect thresholds and made the description clearer
---
 docs/source/03-07-product-guide-trust.md | 44 ++++++++++++++----------
 1 file changed, 25 insertions(+), 19 deletions(-)

diff --git a/docs/source/03-07-product-guide-trust.md b/docs/source/03-07-product-guide-trust.md
index c27c59dcc..961cf843d 100644
--- a/docs/source/03-07-product-guide-trust.md
+++ b/docs/source/03-07-product-guide-trust.md
@@ -3,47 +3,53 @@ title: Trust
 permalink: /trust/
 ---
 
-Trust is a set of components within Talk that incorporate automated moderation
-features based on a user's previous behavior.
+Trust is a set of components within Talk that incorporate basic automated moderation features based on a user's previous behavior. 
 
 ## User Karma Score
 
-Using Trust’s calculations, Talk will automatically pre-moderate comments of
-users who have a negative karma score. All users start out with a `0` neutral
-karma score. If they have a comment approved by a moderator, their score
-increases by `1`; if they have a comment rejected by a moderator, it decreases
-by `1`. When a commenter is labeled as Unreliable, their comments must be
-moderated before they are posted.
+Using Trust’s calculations, Talk will automatically hold back, move to the Reported queue, and tag with a 'History' marker, any comments by users who have an Unreliable karma score. (This is for sites who practice post-moderation. If you set pre-moderation of all comments sitewide, this feature has limited use.)
 
-When a commenter has one comment rejected, their next comment must be moderated
-once in order to post freely again. If they instead get rejected again, then
-they must have two of their comments approved in order to get added back to the
-queue.
+All users start out with a Neutral karma score (`0`). If they have a comment approved by a moderator, their score increases by `1`; if they have a comment rejected by a moderator, it decreases by `1`. When a commenter's score is labeled as Unreliable, their comments must be approved from the Reported queue before they are posted. Commenters are shown a message stating that a moderator will review their comment shortly.
 
 Here are the default thresholds:
 
 ```text
--2 and lower: Unreliable
--1 to +2: Neutral
-+3 and higher: Reliable
+-1 and lower: Unreliable
+0 to +1: Neutral
++1 and higher: Reliable (we don't do anything with this label right now)
 ```
 
-You can configure your own Trust thresholds by using [TRUST_THRESHOLD](/talk/advanced-configuration/#trust-thresholds) in your
-configuration.
+So in this case, when a new commenter has their first comment rejected, their user karma score becomes `-1`, which triggers the Unreliable threshhold, and they must then have a comment approved by a moderator in order to post freely again. Until that occurs, all of their comments will be held back temporarily in the Reported queue, marked with a `History` tag. 
+
+If their next comment is also rejected, their user karma score is now `-2`, and they must have two comments approved in order to reach a Neutral score, and post without pre-approval.
+
+We strongly recommend not telling your community how this system works, or where the threshholds lie. Firstly, they might try to game the system to meet approval, and secondly, it makes it harder for you to change the threshhold in the future. We suggest using language such as "We hold back comments for approval for a variety of reasons, including content, account history, and more."
+
+If you see that a high proportion of first-time commenters on your site are abusive, you might want to change the threshhold to `0`, at least temporarily. You can configure your own Trust thresholds by using [TRUST_THRESHOLD](/talk/advanced-configuration/#trust-thresholds) in your site configuration.
 
 
 ## Reliable and Unreliable Flaggers
 
 Trust also calculates how reliable users are in terms of the comments they
 report. This information is displayed to moderators in the User History drawer,
-which is accessed by clicking on a user’s name in the Admin.
+which is accessed by clicking on a user’s name in the Admin. Currently, no other action is taken based on this score.
 
 If a user's reports mostly match what moderators reject, their Report status
 will display to moderators as Reliable in the user information drawer. If a
 user's reports mostly differ from what moderators reject, their Report status
 will show as Unreliable.
 
-If we don't have enough reports to make a call, or the reports even out, their
+If Talk doesn't have enough reports to make a call, or the reports even out, their
 status is Neutral.
 
+Here are the default thresholds:
+
+```text
+-1 and lower: Unreliable
+0 to +1: Neutral
++2 and higher: Reliable
+```
+You can configure your own Trust thresholds by using [TRUST_THRESHOLD](/talk/advanced-configuration/#trust-thresholds) in your
+configuration.
+
 Note: Report Karma doesn't include reports of "I don't agree with this comment".

From e0cada5bde50f7b61a3e8bfd13b4040042eb92a9 Mon Sep 17 00:00:00 2001
From: Andrew Losowsky <andrew@losowsky.com>
Date: Thu, 10 May 2018 13:44:03 -0700
Subject: [PATCH 160/160] Update 03-07-product-guide-trust.md

---
 docs/source/03-07-product-guide-trust.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/source/03-07-product-guide-trust.md b/docs/source/03-07-product-guide-trust.md
index 961cf843d..72248e7d1 100644
--- a/docs/source/03-07-product-guide-trust.md
+++ b/docs/source/03-07-product-guide-trust.md
@@ -16,7 +16,7 @@ Here are the default thresholds:
 ```text
 -1 and lower: Unreliable
 0 to +1: Neutral
-+1 and higher: Reliable (we don't do anything with this label right now)
++2 and higher: Reliable (we don't do anything with this label right now)
 ```
 
 So in this case, when a new commenter has their first comment rejected, their user karma score becomes `-1`, which triggers the Unreliable threshhold, and they must then have a comment approved by a moderator in order to post freely again. Until that occurs, all of their comments will be held back temporarily in the Reported queue, marked with a `History` tag.