Merge branch 'master' of github.com:coralproject/talk into reject-username

* 'master' of github.com:coralproject/talk: (33 commits) apply @cvle suggestion for fix Take karma into account when doing e2e Bump version to 4.4.2 move placeholder right behind contentEditable added pivotal tracker ref moved event handler to bundle Update stream.njk disable CSP until we can work on configuration + webpack issues added missing translation Remove redundant period. It's in the translation strings already. Remove redundancy One more missing German translation Add missing translations (en/de) for plugins ignore-user and local-auth. text-replace error support the __webpack_nonce__ parameter csp fixes added comment `karma` -> `karmaThresholds` name changes Fix Touch issues on IOS Safari (iPad) ...
2026-07-03 12:54:43 +08:00 · 2018-05-28 11:23:34 -03:00
parent 6411c1cf0d 2bd4e1182b
commit b4e7dd54cf
52 changed files with 632 additions and 456 deletions
@@ -14,7 +14,8 @@ const ApproveButton = ({ active, minimal, onClick, className, disabled }) => {
      className={cn(
        styles.root,
        { [styles.minimal]: minimal, [styles.active]: active },
-        className
+        className,
+        'talk-admin-approve-button'
      )}
      onClick={onClick}
      disabled={disabled || active}
@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Label from 'coral-ui/components/Label';
 import Slot from 'coral-framework/components/Slot';
+import { t } from 'coral-framework/services/i18n';
 import FlagLabel from 'coral-ui/components/FlagLabel';
 import cn from 'classnames';
 import styles from './CommentLabels.css';
@@ -63,10 +64,14 @@ const CommentLabels = ({
          <FlagLabel iconName="person">{getUserFlaggedType(actions)}</FlagLabel>
        )}
        {hasSuspectedWords(actions) && (
-          <FlagLabel iconName="sms_failed">Suspect</FlagLabel>
+          <FlagLabel iconName="sms_failed">
+            {t('flags.reasons.comment.suspect_word')}
+          </FlagLabel>
        )}
        {hasHistoryFlag(actions) && (
-          <FlagLabel iconName="sentiment_very_dissatisfied">History</FlagLabel>
+          <FlagLabel iconName="sentiment_very_dissatisfied">
+            {t('flags.reasons.comment.trust')}
+          </FlagLabel>
        )}
      </div>
      <Slot
@@ -0,0 +1,103 @@
+.karmaTooltip {
+  position: relative;
+  display: inline-block;
+  margin: 2px 4px 0;
+}
+
+.icon {
+  font-size: 16px;
+  color: #0D5B8F;
+  user-select: none;
+  -webkit-tap-highlight-color:rgba(0,0,0,0);
+
+  > i {
+    vertical-align: baseline;
+  }
+}
+
+.icon:hover {
+  cursor: pointer;
+}
+
+.menu {
+  background-color: white;
+  border: solid 1px #999;
+  border-radius: 3px;
+  padding: 10px;
+  position: absolute;
+  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
+  z-index: 10;
+  top: 32px;
+  left: -100px;
+  width: 150px;
+  text-align: left;
+  color: #616161;
+}
+
+.menu::before{
+  content: '';
+  border: 10px solid transparent;
+  border-top-color: #999;
+  position: absolute;
+  left: 96px;
+  top: -20px;
+  transform: rotate(180deg);
+}
+
+.menu::after{
+  content: '';
+  border: 10px solid transparent;
+  border-top-color: white;
+  position: absolute;
+  left: 96px;
+  top: -19px;
+  transform: rotate(180deg);
+}
+
+.menu ul {
+  list-style: none;
+  padding: 0;
+  
+  li {
+    display: flex;
+    justify-content: space-between;
+    margin: 5px 0;
+  }
+}
+
+.label {
+  padding: 4px 5px;
+  border-radius: 3px;
+  color: #fff;
+  font-weight: 400;
+  text-align: center;
+  font-size: .9em;
+  line-height: normal;
+  letter-spacing: .4px;
+  min-width: 25px;
+  display: block;
+
+  /* &.reliable { background-color: #03AB61; } */
+  /* &.neutral { background-color: #616161; } */
+  &.unreliable { background-color: #F44336; }
+}
+
+.descriptionList {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+
+.strongItem {
+  margin-right: 3px;
+}
+
+.descriptionItem {
+  font-size: 0.9em;
+}
+
+.link {
+  color: #2B7EB5;
+  text-decoration: underline;
+  display: block;
+}
@@ -0,0 +1,82 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cn from 'classnames';
+import { Icon } from 'coral-ui';
+import styles from './KarmaTooltip.css';
+import ClickOutside from 'coral-framework/components/ClickOutside';
+import t from 'coral-framework/services/i18n';
+
+const initialState = { menuVisible: false };
+
+class KarmaTooltip extends React.Component {
+  static propTypes = {
+    thresholds: PropTypes.shape({
+      reliable: PropTypes.number.isRequired,
+      unreliable: PropTypes.number.isRequired,
+    }).isRequired,
+  };
+
+  state = initialState;
+
+  toogleMenu = () => {
+    this.setState({ menuVisible: !this.state.menuVisible });
+  };
+
+  hideMenu = () => {
+    this.setState({ menuVisible: false });
+  };
+
+  render() {
+    const { thresholds: { unreliable } } = this.props;
+    const { menuVisible } = this.state;
+
+    return (
+      <ClickOutside onClickOutside={this.hideMenu}>
+        <div className={cn(styles.karmaTooltip, 'talk-admin-karma-tooltip')}>
+          <span
+            onClick={this.toogleMenu}
+            className={cn(styles.icon, 'talk-admin-karma-tooltip-icon')}
+          >
+            <Icon name="info" />
+          </span>
+
+          {menuVisible && (
+            <div className={cn(styles.menu, 'talk-admin-karma-tooltip-menu')}>
+              <strong>{t('user_detail.user_karma_score')}</strong>
+              <ul>
+                {/* NOTE: we may display this data in the future, keeping around for that eventuality */}
+                {/* <li>
+                  <span>Reliable</span>{' '}
+                  <span className={cn(styles.label, styles.reliable)}>
+                    &ge; {reliable}
+                  </span>
+                </li>
+                <li>
+                  <span>Neutral</span>{' '}
+                  <span className={cn(styles.label, styles.neutral)}>
+                    &lt; {reliable}, &gt; {unreliable}
+                  </span>
+                </li> */}
+                <li>
+                  <span>{t('user_detail.unreliable')}</span>{' '}
+                  <span className={cn(styles.label, styles.unreliable)}>
+                    &le; {unreliable}
+                  </span>
+                </li>
+              </ul>
+              <a
+                className={styles.link}
+                href={t('user_detail.karma_docs_link')}
+                target="_blank"
+              >
+                {t('user_detail.learn_more')}
+              </a>
+            </div>
+          )}
+        </div>
+      </ClickOutside>
+    );
+  }
+}
+
+export default KarmaTooltip;
@@ -14,7 +14,8 @@ const RejectButton = ({ active, minimal, onClick, className, disabled }) => {
      className={cn(
        styles.root,
        { [styles.minimal]: minimal, [styles.active]: active },
-        className
+        className,
+        'talk-admin-reject-button'
      )}
      onClick={onClick}
      disabled={disabled || active}
@@ -35,44 +35,49 @@
  margin-right: 20px;
 }

+.karmaStat {
+  display: flex;
+}
+
 .stat:last-child {
  margin-right: 0px;
 }

-.statItem,
-.statReportResult {
+.statItem, .statReportResult, .statKarmaResult {
  padding: 3px 5px;
  background-color: #D8D8D8;
  border-radius: 3px;
  font-weight: 500;
-  display: block;
  font-size: 0.9em;
  line-height: normal;
  letter-spacing: 0.4px;
-  min-width: 60px;
+  min-width: 25px;
+  display: block;
 }

 .statResult {
  font-size: 1.5em;
  padding: 5px 0;
  display: inline-block;
+  text-align: center; 
 }

-.statReportResult {
+.statReportResult, .statKarmaResult {
  color: white;
  margin: 5px 0;
  font-weight: 400;
+  text-align: center;
 }

-.statReportResult.reliable {
-  background-color: #749C48;
+.statReportResult.reliable, .statKarmaResult.good {
+  background-color: #03AB61;
 }

-.statReportResult.neutral {
+.statReportResult.neutral, .statKarmaResult.neutral {
  background-color: #616161;
 }

-.statReportResult.unreliable {
+.statReportResult.unreliable, .statKarmaResult.bad {
  background-color: #F44336;
 }

@@ -6,6 +6,7 @@ import styles from './UserDetail.css';
 import UserHistory from './UserHistory';
 import { Slot } from 'coral-framework/components';
 import UserDetailCommentList from '../components/UserDetailCommentList';
+
 import {
  getReliability,
  isSuspended,
@@ -13,7 +14,9 @@ import {
  isUsernameRejected,
  isUsernameChanged,
  getActiveStatuses,
+  isSuspended, isBanned, getKarma
 } from 'coral-framework/utils/user';
+
 import ButtonCopyToClipboard from './ButtonCopyToClipboard';
 import ClickOutside from 'coral-framework/components/ClickOutside';
 import {
@@ -28,6 +31,7 @@ import {
 import ActionsMenu from 'coral-admin/src/components/ActionsMenu';
 import ActionsMenuItem from 'coral-admin/src/components/ActionsMenuItem';
 import UserInfoTooltip from './UserInfoTooltip';
+import KarmaTooltip from './KarmaTooltip';
 import t from 'coral-framework/services/i18n';
 import flatten from 'lodash/flatten';

@@ -112,7 +116,13 @@ class UserDetail extends React.Component {
  renderLoaded() {
    const {
      root,
-      root: { me, user, totalComments, rejectedComments },
+      root: {
+        me,
+        user,
+        totalComments,
+        rejectedComments,
+        settings: { karmaThresholds },
+      },
      activeTab,
      selectedCommentIds,
      toggleSelect,
@@ -286,18 +296,21 @@ class UserDetail extends React.Component {
                  {rejectedPercent.toFixed(1)}%
                </span>
              </li>
-              <li className={styles.stat}>
-                <span className={styles.statItem}>
-                  {t('user_detail.reports')}
-                </span>
-                <span
-                  className={cn(
-                    styles.statReportResult,
-                    styles[getReliability(user.reliable.flagger)]
-                  )}
-                >
-                  {capitalize(getReliability(user.reliable.flagger))}
-                </span>
+              <li className={cn(styles.stat, styles.karmaStat)}>
+                <div>
+                  <span className={styles.statItem}>
+                    {t('user_detail.karma')}
+                  </span>
+                  <span
+                    className={cn(
+                      styles.statKarmaResult,
+                      styles[getKarma(user.reliable.commenter)]
+                    )}
+                  >
+                    {user.reliable.commenterKarma}
+                  </span>
+                </div>
+                <KarmaTooltip thresholds={karmaThresholds.comment} />
              </li>
            </ul>
          </div>
@@ -189,7 +189,8 @@ export const withUserDetailQuery = withQuery(
        provider
      }
      reliable {
-        flagger
+        commenter
+        commenterKarma
      }
      state {
        status {
@@ -230,6 +231,14 @@ export const withUserDetailQuery = withQuery(
      }
      ${getSlotFragmentSpreads(slots, 'user')}
    }
+    settings {
+      karmaThresholds {
+        comment {
+          reliable
+          unreliable
+        }
+      }
+    }
    me {
      id
    }
@@ -24,6 +24,25 @@ const userRoleFragment = gql`
  }
 `;

+/**
+ * calculateReliability will determine the reliability of a karma score based on
+ * the settings for the karma type.
+ *
+ * @param {Number} karma - the current karma value/score for the given user
+ * @param {Object} thresholds - the karma thresholds to base the karma computation on
+ */
+const calculateReliability = (karma, { reliable, unreliable }) => {
+  if (karma >= reliable) {
+    return true;
+  }
+
+  if (karma <= unreliable) {
+    return false;
+  }
+
+  return null;
+};
+
 export default {
  mutations: {
    SetUserRole: ({ variables: { id, role } }) => ({
@@ -156,7 +175,9 @@ export default {
          }
          const updated = update(prev, {
            users: {
-              nodes: { $apply: nodes => nodes.filter(node => node.id !== id) },
+              nodes: {
+                $apply: nodes => nodes.filter(node => node.id !== id),
+              },
            },
          });
          return updated;
@@ -185,7 +206,9 @@ export default {
          const updated = update(prev, {
            ...decrement,
            flaggedUsers: {
-              nodes: { $apply: nodes => nodes.filter(node => node.id !== id) },
+              nodes: {
+                $apply: nodes => nodes.filter(node => node.id !== id),
+              },
            },
          });
          return updated;
@@ -295,12 +318,38 @@ export default {
      updateQueries: {
        CoralAdmin_UserDetail: prev => {
          const increment = {
+            user: {
+              reliable: {
+                commenter: {
+                  $set: calculateReliability(
+                    prev.user.reliable.commenterKarma - 1,
+                    prev.settings.karmaThresholds.comment
+                  ),
+                },
+                commenterKarma: {
+                  $apply: count => count - 1,
+                },
+              },
+            },
            rejectedComments: {
              $apply: count => (count < prev.totalComments ? count + 1 : count),
            },
          };

          const decrement = {
+            user: {
+              reliable: {
+                commenter: {
+                  $set: calculateReliability(
+                    prev.user.reliable.commenterKarma + 1,
+                    prev.settings.karmaThresholds.comment
+                  ),
+                },
+                commenterKarma: {
+                  $apply: count => count + 1,
+                },
+              },
+            },
            rejectedComments: {
              $apply: count => (count > 0 ? count - 1 : 0),
            },
@@ -24,6 +24,7 @@ const ModerationMenu = ({ asset = {}, items, getModPath, activeTab }) => {
        >
          {items.map(queue => (
            <Link
+              id={`talk-admin-moderate-tab-${queue.key}`}
              key={queue.key}
              to={getModPath(queue.key, asset.id)}
              className={cn('mdl-tabs__tab', styles.tab, {
@@ -15,6 +15,7 @@ import {
 } from 'react-virtualized';
 import throttle from 'lodash/throttle';
 import key from 'keymaster';
+import cn from 'classnames';

 const hasComment = (nodes, id) => nodes.some(node => node.id === id);

@@ -380,6 +381,11 @@ class ModerationQueue extends React.Component {
      ...props
    } = this.props;

+    const rootClassName = cn(
+      styles.root,
+      `talk-admin-moderate-queue-${this.props.activeTab}`
+    );
+
    if (comments.length === 0) {
      return (
        <div className={styles.root}>
@@ -401,7 +407,7 @@ class ModerationQueue extends React.Component {

      const comment = comments[index];
      return (
-        <div className={styles.root}>
+        <div className={rootClassName}>
          <Comment
            root={this.props.root}
            key={comment.id}
@@ -423,7 +429,7 @@ class ModerationQueue extends React.Component {
    const view = this.state.view;

    return (
-      <div className={styles.root}>
+      <div className={rootClassName}>
        <ViewMore
          viewMore={() => this.viewNewComments()}
          count={comments.length - view.length}
@@ -8,6 +8,14 @@ import reducers from './reducers';
 import TalkProvider from 'coral-framework/components/TalkProvider';
 import pluginsConfig from 'pluginsConfig';

+// Resolves touch handling issues encountered on IOS Safari under certain
+// circumstances. It may be related to issues reported here:
+//
+//  https://stackoverflow.com/questions/12363742/touchstart-event-is-not-firing-inside-iframe-ios-6
+//
+// Further details: https://www.pivotaltracker.com/story/show/157794038
+document.body.addEventListener('touchstart', () => {});
+
 async function main() {
  const context = await createContext({
    reducers,
@@ -1,9 +1,9 @@
-/* global __webpack_public_path__ */ // eslint-disable-line no-unused-vars
+/* global __webpack_public_path__, __webpack_nonce__ */ // eslint-disable-line no-unused-vars

 import { getStaticConfiguration } from 'coral-framework/services/staticConfiguration';

 // Load the static url from the static configuration.
-const { STATIC_URL } = getStaticConfiguration();
+const { STATIC_URL, SCRIPT_NONCE } = getStaticConfiguration();

 // Update the static url for the imported public path so dynamically imported
 // chunks will use the correct path as defined by the process.env.STATIC_URL
@@ -14,3 +14,13 @@ const { STATIC_URL } = getStaticConfiguration();
 // https://webpack.js.org/configuration/output/#output-publicpath
 //
 __webpack_public_path__ = STATIC_URL + 'static/';
+
+// All dynamically included scripts that support nonce's will add this to their
+// script tags.
+//
+// The __webpack_nonce__ can be referenced: https://webpack.js.org/guides/csp/
+//
+// Pending issues:
+// - https://github.com/webpack-contrib/style-loader/pull/319
+//
+__webpack_nonce__ = SCRIPT_NONCE;
@@ -86,3 +86,18 @@ export const canUsernameBeUpdated = status => {
    moment(created_at).isAfter(oldestEditTime)
  );
 };
+
+/**
+ * getKarma
+ * retrieves karma value as string
+ */
+
+export const getKarma = reliability => {
+  if (reliability === null) {
+    return 'neutral';
+  } else if (reliability) {
+    return 'good';
+  } else {
+    return 'bad';
+  }
+};
@@ -512,13 +512,14 @@ tracing of GraphQL requests.

 **Note: Apollo Engine is a premium service, charges may apply.**

-## TALK_ENABLE_STRICT_CSP
+<!-- TODO: re-add CSP once we've resolved issues with dynamic webpack loading. -->
+<!-- ## TALK_ENABLE_STRICT_CSP

 Setting this to `TRUE` will enforce the [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)
 (or CSP). By default, this configuration is set to
 [report only](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP#Testing_your_policy)
 where the policy is not enforced, but any violations are reported to a provided
-URI. (Default `FALSE`)
+URI. (Default `FALSE`) -->

 ## ALLOW_NO_LIMIT_QUERIES

@@ -25,7 +25,7 @@ If their next comment is also rejected, their user karma score is now `-2`, and

 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.
+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_THRESHOLDS](/talk/advanced-configuration/#trust-thresholds) in your site configuration.


 ## Reliable and Unreliable Flaggers
@@ -49,7 +49,7 @@ Here are the default thresholds:
 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
+You can configure your own Trust thresholds by using [TRUST_THRESHOLDS](/talk/advanced-configuration/#trust-thresholds) in your
 configuration.

 Note: Report Karma doesn't include reports of "I don't agree with this comment".
@@ -15,6 +15,7 @@ const DontAgreeActionSummary = require('./dont_agree_action_summary');
 const FlagAction = require('./flag_action');
 const FlagActionSummary = require('./flag_action_summary');
 const GenericUserError = require('./generic_user_error');
+const KarmaThreshold = require('./karma_threshold');
 const LocalUserProfile = require('./local_user_profile');
 const RootMutation = require('./root_mutation');
 const RootQuery = require('./root_query');
@@ -48,6 +49,7 @@ let resolvers = {
  FlagAction,
  FlagActionSummary,
  GenericUserError,
+  KarmaThreshold,
  LocalUserProfile,
  RootMutation,
  RootQuery,
@@ -0,0 +1,6 @@
+const { property } = require('lodash');
+
+module.exports = {
+  reliable: property('RELIABLE'),
+  unreliable: property('UNRELIABLE'),
+};
@@ -1,8 +1,13 @@
 const { VIEW_PROTECTED_SETTINGS } = require('../../perms/constants');
-
 const { decorateWithPermissionCheck } = require('./util');

-const Settings = {};
+const Settings = {
+  karmaThresholds: (
+    settings,
+    args,
+    { connectors: { services: { Karma: { THRESHOLDS } } } }
+  ) => THRESHOLDS,
+};

 // PROTECTED_SETTINGS are the settings keys that must be protected for only some
 // eyes.
@@ -11,6 +16,7 @@ const PROTECTED_SETTINGS = {
  autoCloseStream: [VIEW_PROTECTED_SETTINGS],
  wordlist: [VIEW_PROTECTED_SETTINGS],
  domains: [VIEW_PROTECTED_SETTINGS],
+  karmaThresholds: [VIEW_PROTECTED_SETTINGS],
 };

 // decorate the fields on the settings resolver with a permission check.
@@ -20,9 +20,17 @@ type Reliability {
  # `null` if the reliability cannot be determined.
  flagger: Boolean

+  # flaggerKarma will contains the number of agreed flags vs disagred flag
+  # count.
+  flaggerKarma: Int!
+
  # Commenter will be `true` when the commenter is reliable, `false` if not, or
  # `null` if the reliability cannot be determined.
  commenter: Boolean
+
+  # commenterKarma the number of approved comments (not untouched) subtracted by
+  # the number of rejected comments.
+  commenterKarma: Int!
 }

 ################################################################################
@@ -793,6 +801,29 @@ type Domains {
  whitelist: [String!]!
 }

+# KarmaThreshold defines the bounds for which a User will become unreliable or
+# reliable based on their karma score. If the score is equal or less than the
+# unreliable value, they are unreliable. If the score is equal or more than the
+# reliable value, they are reliable. If they are neither reliable or unreliable
+# then they are neutral.
+type KarmaThreshold {
+  reliable: Int!
+  unreliable: Int!
+}
+
+# KarmaThresholds contains the currently set thresholds for triggering Trust
+# beheviour.
+type KarmaThresholds {
+
+  # flag represents karma settings in relation to how well a User's flagging
+  # ability aligns with the moderation decicions made by moderators.
+  flag: KarmaThreshold!
+
+  # comment represents the karma setting in relation to how well a User's
+  # comments are moderated.
+  comment: KarmaThreshold!
+}
+
 # Settings stores the global settings for a given installation.
 type Settings {

@@ -865,6 +896,10 @@ type Settings {

  # domains will return a given list of domains.
  domains: Domains
+
+  # karmaThresholds contains the currently set thresholds for triggering Trust
+  # beheviour.
+  karmaThresholds: KarmaThresholds
 }

 ################################################################################
@@ -292,55 +292,7 @@ ar:
         suspect_word: "كلمة مشتبهة"
         banned_word: "كلمة محظورة"
         body_count: "يتجاوز النص الحد الأقصى للطول المسموح"
-         trust: "ثقة"
         links: "رابط"
-  modqueue:
-    account: "account flags"
-    actions: Actions
-    all: all
-    all_streams: "All Streams"
-    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}"'
-    approve: "Approve"
-    approved: "Approved"
-    ban_user: "Ban"
-    billion: B
-    close: Close
-    empty_queue: "No more comments to moderate! You're all caught up. Go have some ☕️"
-    flagged: flagged
-    reported: reported
-    less_detail: "Less detail"
-    likes: likes
-    million: M
-    mod_faster: "Moderate faster with keyboard shortcuts"
-    moderate: "Moderate →"
-    more_detail: "More detail"
-    new: New
-    newest_first: "Newest First"
-    navigation: Navigation
-    next_comment: "Go to the next comment"
-    toggle_search: "Open search"
-    next_queue: "Switch queues"
-    oldest_first: "Oldest First"
-    premod: pre-mod
-    prev_comment: "Go to the previous comment"
-    reject: "Reject"
-    rejected: "Rejected"
-    reply: "Reply"
-    select_stream: "Select Stream"
-    shift_key: "⇧"
-    shortcuts: "Shortcuts"
-    sort: "Sort"
-    show_shortcuts: "Show Shortcuts"
-    singleview: "Zen mode"
-    thismenu: "Open this menu"
-    jump_to_queue: "Jump to specific queue"
-    thousand: k
-    try_these: "Try these"
-    view_more_shortcuts: "View more shortcuts"
  my_comment_history: "سجل التعليقات"
  name: اسم
  no_agree_comment: "لا أوافق على هذا التعليق"
@@ -358,9 +310,6 @@ ar:
  report_notif: "شكرا على الإبلاغ عن هذا التعليق. تم إبلاغ فريق الإشراف لدينا وسيراجعه قريبًا."
  report_notif_remove: "لقد تمت إزالة بلاغك."
  reported: بلغ عنه
-  comment_history_blank:
-    title: You have not written any comments
-    info: A history of your comments will appear here
  settings:
    from_settings_page: "من صفحة الملف الشخصي يمكنك مشاهدة سجل التعليقات."
    my_comment_history: "سجل التعليقات"
@@ -378,104 +327,8 @@ ar:
  step_1_header: "بلغ عن مشكلة"
  step_2_header: "ساعدنا على الفهم"
  step_3_header: "شكرا لك على المساهمة الخاصة بك"
-  streams:
-    all: All
-    article: Story
-    closed: Closed
-    empty_result: "No assets match this search. Maybe try widening your search?"
-    filter_streams: "Filter Streams"
-    newest: Newest
-    oldest: Oldest
-    open: Open
-    pubdate: "Publication Date"
-    search: Search
-    sort_by: "Sort By"
-    status: "Stream Status"
-    stream_status: "Stream Status"
-  suspenduser:
-    title_suspend: "Suspend User"
-    description_suspend: "You are suspending {0}. This comment will go to the Rejected queue, and {0} will not be allowed to like, report, reply or post until the suspension time is complete."
-    select_duration: "Select suspension duration"
-    one_hour: "1 hour"
-    hours: "{0} hours"
-    days: "{0} days"
-    hour: "{0} hours"
-    day: "{0} days"
-    cancel: "Cancel"
-    suspend_user: "Suspend User"
-    email_message_suspend: "Dear {0},\n\nIn accordance with {1}’s community guidelines, your account has been temporarily suspended. During the suspension, you will be unable to comment, flag or engage with fellow commenters. Please rejoin the conversation {2}."
-    title_notify: "Notify the user of their temporary suspension"
-    notify_suspend_until: "User {0} has been temporarily suspended. This suspension will automatically end {1}."
-    description_notify: "Suspending this user will temporarily disable their account."
-    write_message: "Write a message"
-    send: Send
-  reject_username:
-    username: username
-    no_cancel: "No cancel"
-    description_reject: "Would you like to temporarily ban this user because of their {0}? Doing so will temporarily suspend this user until they rewrite their {0}."
-    title_notify: "Notify the user of their temporary suspension"
-    description_notify: "Suspending this user will temporarily disable their account."
-    title_reject: "We noticed you rejected a username"
-    suspend_user: "Suspend User"
-    yes_suspend: "Yes suspend"
-    email_message_reject: "Another member of the community recently flagged your username for review. Because of its content your user was rejected. This means you can no longer comment, like, or flag content until you rewrite your username. Please e-mail us if you have any questions or concerns."
-    write_message: "Write a message"
-    send: Send
  thank_you: "نحن نقدر سلامتك وردود الفعل. سيراجع المشرف التقرير الخاص بك"
-  user:
-    bio_flags: "flags for this bio"
-    user_bio: "User Bio"
-    username_flags: "flags for this username"
-  user_detail:
-    remove_suspension: "Remove Suspension"
-    suspend: "Suspend User"
-    remove_ban: "Remove Ban"
-    ban: "Ban User"
-    member_since: "Member Since"
-    email: "Email"
-    total_comments: "Total Comments"
-    reject_rate: "Reject Rate"
-    reports: "Reports"
-    all: "All"
-    rejected: "Rejected"
-    user_history: "User History"
-  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_impersonating: "هذا المستخدم ينتحل شخصية"
  user_no_comment: "لم تترك تعليقا مطلقا. إنضم إلى المحادثة!"
  username_offensive: "اسم المستخدم هذا مسيء"
-  view_conversation: "عرض المحادثة"
-  install:
-    initial:
-      description: "Let's set up your Talk community in just a few short steps."
-      submit: "Get Started"
-    add_organization:
-      description: "Please tell us the name of your organization. This will appear in emails when inviting new team members."
-      label: "Organization Name"
-      save: "Save"
-    create:
-      email: "Email address"
-      username: "Username"
-      password: "Password"
-      confirm_password: "Confirm Password"
-      organization_contact_email: "Organization Contact Email"
-      save: "Save"
-    permitted_domains:
-      title: "Permitted domains"
-      description: "Enter the domains you would like to permit for Talk, e.g. your local, staging and production environments (ex. localhost:3000, staging.domain.com, domain.com)."
-      submit: "Finish install"
-    final:
-      description: "Thanks for installing Talk! We sent an email to verify your email address. While you finish setting up the account, you can start engaging with your readers now."
-      launch: "Launch Talk"
-      close: "Close this Installer"
-  admin_sidebar:
-    view_options: "View Options"
-    sort_comments: "Sort Comments"
+  view_conversation: "عرض المحادثة"
@@ -211,7 +211,6 @@ da:
    NO_SPECIAL_CHARACTERS: "Brugernavne kan kun indeholder bogstaver og _"
    PASSWORD_LENGTH: "Adgangskoden er for kort"
    PROFANITY_ERROR: "Brugernavne må ikke inholde stødende indhold. Kontakt venligst administratoren, hvis du mener at dette er en fejl."
-    RATE_LIMIT_EXCEEDED: "Rate limit exceeded"
    USERNAME_IN_USE: "Brugernavnet er allerede i brug"
    USERNAME_REQUIRED: "Du skal indtaste et brugernavn"
    EMAIL_NOT_VERIFIED: "E-mail address not verified"
@@ -287,10 +286,8 @@ da:
        comment_spam: "Spam"
        comment_noagree: "Uenig"
        comment_other: "Andre"
-        suspect_word: "Suspect Word"
        banned_word: "Forbudt ord"
        body_count: "Body overstiger max længde"
-        trust: "Stol"
        links: "Link"
  modqueue:
    account: "konto flag"
@@ -322,7 +322,6 @@ de:
         suspect_word: "Verdächtiges Wort"
         banned_word: "Unzulässiges Wort"
         body_count: "Text überschreitet Zeichenlimit"
-         trust: "Vertrauen"
         links: "Link"
  modqueue:
    account: "Konto-Markierungen"
@@ -227,6 +227,7 @@ en:
  embedlink:
    copy: "Copy to Clipboard"
  error:
+    AUTHENTICATION: "An error occurred trying to authenticate your account."
    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."
@@ -322,7 +323,7 @@ en:
         suspect_word: "Suspect Word"
         banned_word: "Banned Word"
         body_count: "Body exceeds max length"
-         trust: "Trust"
+         trust: "Karma"
         links: "Link"
  modqueue:
    account: "account flags"
@@ -472,10 +473,14 @@ en:
    email: "Email"
    total_comments: "Total Comments"
    reject_rate: "Reject Rate"
-    reports: "Reports"
    all: "All"
    rejected: "Rejected"
    user_history: "User History"
+    unreliable: "Unreliable"
+    karma: "Karma"
+    learn_more: "Learn More"
+    user_karma_score: "User Karma Score"
+    karma_docs_link: "https://docs.coralproject.net/talk/trust/#user-karma-score"
    id: "ID"
  user_history:
    user_banned: "User banned"
@@ -310,7 +310,6 @@ es:
         suspect_word: "Palabra sospechosa"
         banned_word: "Palabra prohibida"
         body_count: "El texto exede el límite permitido"
-         trust: "Trust"
         links: "Link"
  modqueue:
    account: "reportes de cuentas"
@@ -292,7 +292,6 @@ fi_FI:
         suspect_word: "Epäilyttävä sana"
         banned_word: "Kielletty sana"
         body_count: "Liian pitkä viesti"
-         trust: "Luotettava"
         links: "Linkki"
  modqueue:
    account: "Liputuksia"
@@ -300,7 +300,6 @@ fr:
         suspect_word: "Mot suspect"
         banned_word: "Mot banni"
         body_count: "Le texte dépasse la longueur maximale"
-         trust: "Trust"
         links: "Lien"
  modqueue:
    account: "Signalements du compte"
@@ -290,7 +290,6 @@ nl_NL:
         suspect_word: "Verdacht woord"
         banned_word: "Geblokeerd woord"
         body_count: "Tekst is te lang"
-         trust: "Vertrouwen"
         links: "Link"
  modqueue:
    account: "account meldingen"
@@ -61,11 +61,6 @@ pt_BR:
    reaction: 'Reação'
    reactions: 'Reações'
    story: 'Conversas'
-  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}'
  community:
    account_creation_date: "Data de criação da conta"
    active: Ativo
@@ -273,24 +268,6 @@ pt_BR:
  loading_results: "Carregando resultados"
  marketing: "Isso parece um anúncio/marketing"
  moderate_this_stream: "Moderar comentários"
-  flags:
-    reasons:
-      user:
-        username_offensive: "Offensive"
-        username_nolike: "Dislike"
-        username_impersonating: "Impersonation"
-        username_spam: "Spam"
-        username_other: "Other"
-      comment:
-        comment_offensive: "Offensive"
-        comment_spam: "Spam"
-        comment_noagree: "Disagree"
-        comment_other: "Other"
-        suspect_word: "Suspect Word"
-        banned_word: "Banned Word"
-        body_count: "Body exceeds max length"
-        trust: "Trust"
-        links: "Link"
  modqueue:
    account: "contas marcadas"
    actions: Ações
@@ -418,29 +395,6 @@ pt_BR:
    bio_flags: "Marcadas para este perfil"
    user_bio: "Perfil do usuário"
    username_flags: "Marcadas para este usuário"
-  user_detail:
-    remove_suspension: "Remove Suspension"
-    suspend: "Suspend User"
-    remove_ban: "Remove Ban"
-    ban: "Ban User"
-    member_since: "Member Since"
-    email: "Email"
-    total_comments: "Total Comments"
-    reject_rate: "Reject Rate"
-    reports: "Reports"
-    all: "All"
-    rejected: "Rejected"
-    user_history: "User History"
-  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_impersonating: "Este usuário está representando"
  user_no_comment: "Você nunca deixou um comentário. Participe da conversa!"
  username_offensive: "Esse nome de usuário é ofensivo"
@@ -468,6 +422,3 @@ pt_BR:
      description: "Obrigado por instalar o Talk! Enviamos um e-mail para verificar seu endereço de e-mail. Enquanto você terminar de configurar a conta, você pode começar a se envolver com seus leitores agora."
      launch: "Iniciar Talk"
      close: "Feche este instalador"
-  admin_sidebar:
-    view_options: "View Options"
-    sort_comments: "Sort Comments"
@@ -12,22 +12,11 @@ zh_CN:
    note_reject_comment: "封禁该用户将使这条评论被移入“被拒”队列。"
    note_ban_user: "封禁该用户将使其无法编辑或删除评论。"
    yes_ban_user: "是的，封禁该用户"
-    write_a_message: "Write a message"
-    send: "Send"
-    notify_ban_headline: "Notify the user of ban"
-    notify_ban_description: "This will notify the user by email that they have been banned from the community"
-    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."
  bio_offensive: "该简介含有冒犯言语"
  cancel: "取消"
  confirm_email:
    click_to_confirm: "Click below to confirm your email address"
    confirm: "Confirm"
-  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: "字符剩余可用"
  comment:
    anon: "匿名"
@@ -61,11 +50,6 @@ zh_CN:
    reaction: '回应'
    reactions: '回应'
    story: '文章'
-  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}'
  community:
    account_creation_date: "账户创建日期"
    active: "活动中"
@@ -203,9 +187,6 @@ zh_CN:
  embedlink:
    copy: "复制到粘贴板"
  error:
-    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."
-    PASSWORD_RESET_TOKEN_INVALID: "Your password reset link is invalid."
    COMMENT_TOO_SHORT: "评论至少应有一个字符。请修改您的评论，再度尝试。"
    NOT_AUTHORIZED: "您没有权限进行该操作"
    NO_SPECIAL_CHARACTERS: "用户名只能包含字母、数字跟下划线"
@@ -237,7 +218,6 @@ zh_CN:
    username: "用户名只能包含字母、数字跟下划线"
    unexpected: "发生了异常错误。对不起！"
    required_field: "该字段必填"
-    temporarily_suspended: "Your account is currently suspended. It will be reactivated {0}. Please contact us if you have any questions."
  flag_comment: "举报评论"
  flag_reason: "举报理由（可选）"
  flag_username: "举报用户名"
@@ -256,8 +236,6 @@ zh_CN:
      error: "用户名只能包含字母、数字跟下划线"
      label: "新用户名"
      msg: "由于您的用户名不当，您的帐号目前被暂停使用。如要恢复您的帐户，请输入一个新的用户名。如有任何疑问，请与我们联系。"
-    changed_name:
-      msg: "Your username change is under review by our moderation team."
    my_comments: "我的评论"
    my_profile: "我的资料"
    new_count: "查看 {0} 更多 {1}"
@@ -275,24 +253,6 @@ zh_CN:
  loading_results: "加载结果中"
  marketing: "这看起来像是广告"
  moderate_this_stream: "审查该流"
-  flags:
-    reasons:
-       user:
-         username_offensive: "Offensive"
-         username_nolike: "Dislike"
-         username_impersonating: "Impersonation"
-         username_spam: "Spam"
-         username_other: "Other"
-       comment:
-         comment_offensive: "Offensive"
-         comment_spam: "Spam"
-         comment_noagree: "Disagree"
-         comment_other: "Other"
-         suspect_word: "Suspect Word"
-         banned_word: "Banned Word"
-         body_count: "Body exceeds max length"
-         trust: "Trust"
-         links: "Link"
  modqueue:
    account: "帐户标记"
    actions: "操作"
@@ -420,29 +380,6 @@ zh_CN:
    bio_flags: "对简介的举报"
    user_bio: "用户简介"
    username_flags: "对用户名的举报"
-  user_detail:
-    remove_suspension: "Remove Suspension"
-    suspend: "Suspend User"
-    remove_ban: "Remove Ban"
-    ban: "Ban User"
-    member_since: "Member Since"
-    email: "Email"
-    total_comments: "Total Comments"
-    reject_rate: "Reject Rate"
-    reports: "Reports"
-    all: "All"
-    rejected: "Rejected"
-    user_history: "User History"
-  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_impersonating: "冒名用户"
  user_no_comment: "您未曾发表评论。现在就来加入对话吧！"
  username_offensive: "用户名有冒犯性"
@@ -468,7 +405,4 @@ zh_CN:
    final:
      description: "感谢您安装 Talk！我们已向您的邮箱发送一封验证邮件。当您进行帐号设置时，您可以开始跟您的读者开始互动。"
      launch: "启动 Talk"
-      close: "关闭安装程序"
-  admin_sidebar:
-    view_options: "View Options"
-    sort_comments: "Sort Comments"
+      close: "关闭安装程序"
@@ -12,22 +12,8 @@ zh_TW:
    note_reject_comment: "封禁該用戶將使這條評論被移入“被拒”列表。"
    note_ban_user: "封禁該用戶將使其無法編輯或刪除評論。"
    yes_ban_user: "是的，封禁該用戶"
-    write_a_message: "Write a message"
-    send: "Send"
-    notify_ban_headline: "Notify the user of ban"
-    notify_ban_description: "This will notify the user by email that they have been banned from the community"
-    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."
  bio_offensive: "該介紹包含具有攻擊性的內容。"
  cancel: "取消"
-  confirm_email:
-    click_to_confirm: "Click below to confirm your email address"
-    confirm: "Confirm"
-  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: "剩餘字符數"
  comment:
    anon: "匿名用戶"
@@ -61,11 +47,6 @@ zh_TW:
    reaction: '回應'
    reactions: '回應'
    story: '故事'
-  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}'
  community:
    account_creation_date: "賬戶創建日期"
    active: 激活
@@ -203,9 +184,6 @@ zh_TW:
  embedlink:
    copy: "覆制到剪貼板"
  error:
-    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."
-    PASSWORD_RESET_TOKEN_INVALID: "Your password reset link is invalid."
    COMMENT_TOO_SHORT: "評論長度必須超過一個字符，請您修改評論後重試。"
    NOT_AUTHORIZED: "您無權執行該操作。"
    NO_SPECIAL_CHARACTERS: "用戶名只能包含字母、數字和下劃線"
@@ -237,7 +215,6 @@ zh_TW:
    username: "用戶名只能包含字母、數字和下劃線。"
    unexpected: "發生了意外錯誤。抱歉!"
    required_field: "該字段必填"
-    temporarily_suspended: "Your account is currently suspended. It will be reactivated {0}. Please contact us if you have any questions."
  flag_comment: "舉報評論"
  flag_reason: "舉報原因（可選）"
  flag_username: "舉報用戶名"
@@ -256,8 +233,6 @@ zh_TW:
      error: "用戶名只能包含字母、數字和下劃線。"
      label: "新用戶名"
      msg: "由於您的用戶名不當，您的帳號目前已被暫停使用。如要恢復您的帳戶，請輸入一個新的用戶名。如有任何疑問，請與我們聯繫。"
-    changed_name:
-      msg: "Your username change is under review by our moderation team."
    my_comments: "我的評論"
    my_profile: "我的概況"
    new_count: "查看{0}更多{1}"
@@ -275,24 +250,6 @@ zh_TW:
  loading_results: "加載結果"
  marketing: "這看起來像是廣告/營銷"
  moderate_this_stream: "審核這個流"
-  flags:
-    reasons:
-       user:
-         username_offensive: "Offensive"
-         username_nolike: "Dislike"
-         username_impersonating: "Impersonation"
-         username_spam: "Spam"
-         username_other: "Other"
-       comment:
-         comment_offensive: "Offensive"
-         comment_spam: "Spam"
-         comment_noagree: "Disagree"
-         comment_other: "Other"
-         suspect_word: "Suspect Word"
-         banned_word: "Banned Word"
-         body_count: "Body exceeds max length"
-         trust: "Trust"
-         links: "Link"
  modqueue:
    account: "帳戶標記"
    actions: 操作
@@ -345,7 +302,6 @@ zh_TW:
  no_agree_comment: "我不同意這個評論"
  no_like_bio: "我不喜歡這個個人簡介"
  no_like_username: "我不喜歡這個用戶名"
-  already_flagged_username: "You have already flagged this username."
  other: 其他
  permalink: 分享
  personal_info: "該評論洩露了個人身份資訊"
@@ -420,29 +376,6 @@ zh_TW:
    bio_flags: "該簡介的標記"
    user_bio: "用戶簡介"
    username_flags: "該用戶名的標記"
-  user_detail:
-    remove_suspension: "Remove Suspension"
-    suspend: "Suspend User"
-    remove_ban: "Remove Ban"
-    ban: "Ban User"
-    member_since: "Member Since"
-    email: "Email"
-    total_comments: "Total Comments"
-    reject_rate: "Reject Rate"
-    reports: "Reports"
-    all: "All"
-    rejected: "Rejected"
-    user_history: "User History"
-  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_impersonating: "此用戶正在冒充"
  user_no_comment: "您尚未評論過。加入對話吧！"
  username_offensive: "這個用戶名有冒犯性"
@@ -469,6 +402,3 @@ zh_TW:
      description: "感謝安裝Talk！我們給您發送了一封郵件以驗證您的電子郵箱地址。在完成帳戶設置後，您即可開始與您的讀者互動。"
      launch: "啟動Talk"
      close: "關閉安裝程序"
-  admin_sidebar:
-    view_options: "View Options"
-    sort_comments: "Sort Comments"
@@ -1,9 +1,16 @@
+const { get, merge } = require('lodash');
 const uuid = require('uuid/v4');

 // nonce is designed to create a random value that can be used in conjunction
 // with the csp middleware.
 module.exports = (req, res, next) => {
-  res.locals.nonce = uuid();
+  const nonce = uuid();
+
+  // Attach the nonce to the locals.
+  res.locals.nonce = nonce;
+  res.locals.data = merge({}, get(res.locals, 'data', {}), {
+    SCRIPT_NONCE: nonce,
+  });

  next();
 };
@@ -48,7 +48,7 @@ const attachStaticLocals = locals => {
  for (const key in TEMPLATE_LOCALS) {
    const value = TEMPLATE_LOCALS[key];

-    locals[key] = value;
+    merge(locals, { [key]: value });
  }
 };

@@ -1,6 +1,6 @@
 {
  "name": "talk",
-  "version": "4.4.1",
+  "version": "4.4.2",
  "description": "A better commenting experience from Mozilla, The New York Times, and the Washington Post. https://coralproject.net",
  "main": "app.js",
  "private": true,
@@ -39,6 +39,7 @@ en:
    confirmation_title: Ignore {0}?
 de:
  talk-plugin-ignore-user:
+    blank_info: Sie ignorieren derzeit keine Nutzer
    section_title: Ignorierte Nutzer
    section_info: Weil Sie die folgenden Nutzer ignorieren, sind deren Kommentare versteckt.
    stop_ignoring: Ignorieren beenden
@@ -185,7 +185,7 @@ class ChangePassword extends React.Component {
          >
            <InputField
              id="oldPassword"
-              label="Old Password"
+              label={t('talk-plugin-local-auth.change_password.old_password')}
              name="oldPassword"
              type="password"
              onChange={this.onChange}
@@ -205,7 +205,7 @@ class ChangePassword extends React.Component {
            </InputField>
            <InputField
              id="newPassword"
-              label="New Password"
+              label={t('talk-plugin-local-auth.change_password.new_password')}
              name="newPassword"
              type="password"
              onChange={this.onChange}
@@ -216,7 +216,9 @@ class ChangePassword extends React.Component {
            />
            <InputField
              id="confirmNewPassword"
-              label="Confirm New Password"
+              label={t(
+                'talk-plugin-local-auth.change_password.confirm_new_password'
+              )}
              name="confirmNewPassword"
              type="password"
              onChange={this.onChange}
@@ -65,7 +65,7 @@ class ChangeUsernameContentDialog extends React.Component {
          <form onSubmit={this.confirmChanges}>
            <InputField
              id="confirmNewUsername"
-              label="Re-enter new username"
+              label={t('talk-plugin-local-auth.change_username.re_enter')}
              name="confirmNewUsername"
              type="text"
              onChange={this.props.onChange}
@@ -13,6 +13,9 @@ en:
      passwords_dont_match: "Passwords don`t match"
      required_field: "This field is required"
      forgot_password: "Forgot your password?"
+      old_password: "Old Password"
+      new_password: "New Password"
+      confirm_new_password: "Confirm New Password"
      save: "Save"
      cancel: "Cancel"
      edit: "Edit"
@@ -28,6 +31,7 @@ en:
      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"
+      re_enter: "Re-enter 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"
@@ -84,13 +88,17 @@ de:
      passwords_dont_match: "Die Passwörter stimmen nicht überein"
      required_field: "Diese Angabe ist erforderlich"
      forgot_password: "Passwort vergessen?"
+      old_password: "Altes Passwort"
+      new_password: "Neues Passwort"
+      confirm_new_password: "Neues Passwort bestätigen"
      save: "Speichern"
      cancel: "Abbrechen"
      edit: "Ändern"
      changed_password_msg: "Passwort geändert - Ihr Passwort wurde erfolgreich geändert"
      forgot_password_sent: "Passwort vergessen - Wir haben Ihnen eine E-Mail zum Zurücksetzen des Passwortes geschickt"
    change_username:
-      change_username_note: "Nutzernamen können nur alle 14 Tage geändert werden. Ihr Nutzername ist zur Zeit nicht editierbar."
+      change_username_note: "Nutzernamen können nur alle 14 Tage geändert werden."
+      is_not_eligible: "Sie können Ihren Nutzernamen derzeit nicht ändern."
      save: "Speichern"
      edit_profile: "Profil ändern"
      cancel: "Abbrechen"
@@ -98,6 +106,7 @@ de:
      description: "Sie möchten Ihren Nutzernamen ändern: der neue Nutzername wird an allen alten und neuen Kommentaren erscheinen."
      old_username: "Alter Nutzername"
      new_username: "Neuer Nutzername"
+      re_enter: "Neuen Nutzernamen bestätigen"
      bottom_note: "Achtung: die nächste Änderung des Nutzernamens ist erst nach 14 Tagen möglich"
      confirm_changes: "Änderung bestätigen"
      username_does_not_match: "Die Nutzernamen stimmen nicht überein"
@@ -15,6 +15,8 @@
  position: absolute;
  margin: 12px 0 0 12px;
  color: #bbb;
+  user-select: none;
+  pointer-events: none;
 }

 .toolbarDisabled {
@@ -4,13 +4,18 @@ const { logger } = require('../../../services/logging');
 const router = express.Router();

 const schema = Joi.object().keys({
-  'csp-report': Joi.object().keys({
-    'document-uri': Joi.string(),
-    referrer: Joi.string(),
-    'blocked-uri': Joi.string(),
-    'violated-directive': Joi.string(),
-    'original-policy': Joi.string(),
-  }),
+  'csp-report': Joi.object()
+    .keys({
+      'document-uri': Joi.string(),
+      referrer: Joi.string().allow(''),
+      'blocked-uri': Joi.string(),
+      'violated-directive': Joi.string(),
+      'original-policy': Joi.string(),
+      'script-sample': Joi.string()
+        .allow('')
+        .optional(),
+    })
+    .optionalKeys('referrer', 'script-sample'),
 });

 const json = express.json({ type: 'application/csp-report' });
@@ -18,7 +23,7 @@ const json = express.json({ type: 'application/csp-report' });
 router.post('/', json, async (req, res, next) => {
  const { value, error: err } = Joi.validate(req.body, schema, {
    stripUnknown: true,
-    presence: 'required',
+    presence: 'optional',
  });
  if (err) {
    res.status(400).end();
@@ -9,7 +9,6 @@ const path = require('path');
 const compression = require('compression');
 const plugins = require('../services/plugins');
 const staticTemplate = require('../middleware/staticTemplate');
-const contentSecurityPolicy = require('../middleware/contentSecurityPolicy');
 const nonce = require('../middleware/nonce');
 const staticServer = require('express-static-gzip');
 const { DISABLE_STATIC_SERVER } = require('../config');
@@ -76,7 +75,8 @@ router.use(compression());
 // STATIC ROUTES
 //==============================================================================

-const staticMiddleware = [staticTemplate, nonce, contentSecurityPolicy];
+// TODO: re-add CSP once we've resolved issues with dynamic webpack loading.
+const staticMiddleware = [staticTemplate, nonce];

 router.use('/admin', ...staticMiddleware, require('./admin'));
 router.use('/account', ...staticMiddleware, require('./account'));
@@ -2,13 +2,12 @@ const express = require('express');
 const debug = require('debug')('talk:routes:plugins');
 const plugins = require('../services/plugins');
 const staticTemplate = require('../middleware/staticTemplate');
-const contentSecurityPolicy = require('../middleware/contentSecurityPolicy');
 const nonce = require('../middleware/nonce');

 const router = express.Router();

-// Apply the middleware.
-router.use(staticTemplate, nonce, contentSecurityPolicy);
+// TODO: re-add CSP once we've resolved issues with dynamic webpack loading.
+router.use(staticTemplate, nonce);

 // Inject server route plugins.
 plugins.get('server', 'router').forEach(plugin => {
@@ -1,6 +1,7 @@
 const debug = require('debug')('talk:services:karma');
 const UserModel = require('../models/user');
 const { TRUST_THRESHOLDS } = require('../config');
+const { get } = require('lodash');

 /**
 * This will create an object with the property name of the action type as the
@@ -83,9 +84,17 @@ class KarmaModel {
    return KarmaService.isReliable('flag', this.model);
  }

+  get flaggerKarma() {
+    return get(this.model, 'flag.karma', 0);
+  }
+
  get commenter() {
    return KarmaService.isReliable('comment', this.model);
  }
+
+  get commenterKarma() {
+    return get(this.model, 'comment.karma', 0);
+  }
 }

 /**
@@ -106,18 +115,14 @@ class KarmaService {
  /**
   * Inspects the reliability of a property and returns it if known.
   * @param {String} name - name of the property
-   * @param {Object} trust - object possibly containing the propertys
+   * @param {Object} trust - object possibly containing the properties
   */
  static isReliable(name, trust) {
-    if (trust && trust[name]) {
-      if (trust[name].karma > THRESHOLDS[name].RELIABLE) {
-        return true;
-      } else if (trust[name].karma < THRESHOLDS[name].UNRELIABLE) {
-        return false;
-      }
-    } else if (THRESHOLDS[name].RELIABLE < 0) {
+    const karma = get(trust, [name, 'karma'], 0);
+
+    if (karma >= THRESHOLDS[name].RELIABLE) {
      return true;
-    } else if (THRESHOLDS[name].UNRELIABLE > 0) {
+    } else if (karma <= THRESHOLDS[name].UNRELIABLE) {
      return false;
    }

@@ -162,3 +167,4 @@ class KarmaService {
 }

 module.exports = KarmaService;
+module.exports.THRESHOLDS = THRESHOLDS;
@@ -1,3 +1,3 @@
-<%= t('email.password_reset.we_received_a_request') %>. <%= t('email.password_reset.if_you_did') %> <%= t('email.password_reset.please_click') %>:
+<%= t('email.password_reset.we_received_a_request') %> <%= t('email.password_reset.if_you_did') %> <%= t('email.password_reset.please_click') %>:

 <%= BASE_URL %>account/password/reset#<%= token %>
@@ -6,28 +6,26 @@ module.exports = ctx => {
  const { connectors: { services: { Karma } } } = ctx;
  const trust = get(ctx, 'user.metadata.trust', null);

-  if (trust !== null) {
-    // If the user is not a reliable commenter (passed the unreliability
-    // threshold by having too many rejected comments) then we can change the
-    // status of the comment to `SYSTEM_WITHHELD`, therefore pushing the user's
-    // comments away from the public eye until a moderator can manage them. This of
-    // course can only be applied if the comment's current status is `NONE`,
-    // we don't want to interfere if the comment was rejected.
-    if (Karma.isReliable('comment', trust) === false) {
-      // Add the flag related to Trust to the comment.
-      return {
-        status: 'SYSTEM_WITHHELD',
-        actions: [
-          {
-            action_type: 'FLAG',
-            user_id: null,
-            group_id: 'TRUST',
-            metadata: {
-              trust,
-            },
+  // If the user is not a reliable commenter (passed the unreliability
+  // threshold by having too many rejected comments) then we can change the
+  // status of the comment to `SYSTEM_WITHHELD`, therefore pushing the user's
+  // comments away from the public eye until a moderator can manage them. This of
+  // course can only be applied if the comment's current status is `NONE`,
+  // we don't want to interfere if the comment was rejected.
+  if (Karma.isReliable('comment', trust) === false) {
+    // Add the flag related to Trust to the comment.
+    return {
+      status: 'SYSTEM_WITHHELD',
+      actions: [
+        {
+          action_type: 'FLAG',
+          user_id: null,
+          group_id: 'TRUST',
+          metadata: {
+            trust,
          },
-        ],
-      };
-    }
+        },
+      ],
+    };
  }
 };
@@ -23,9 +23,6 @@ module.exports = {
      username: 'user',
      password: 'testtest',
    },
-    comment: {
-      body: 'This is a test comment',
-    },
    organizationName: 'Coral',
    organizationContactEmail: 'coral@coralproject.net',
  },
@@ -70,9 +70,28 @@ module.exports = {
    },
    moderate: {
      selector: '.talk-admin-moderation-container',
+      commands: [
+        {
+          url: function() {
+            return `${this.api.launchUrl}/admin/moderate`;
+          },
+          ready() {
+            return this.waitForElementVisible('body');
+          },
+          goToQueue(queue) {
+            this.click(`#talk-admin-moderate-tab-${queue}`).expect.section(
+              `.talk-admin-moderate-queue-${queue}`
+            ).to.be.visible;
+            return this;
+          },
+        },
+      ],
      elements: {
-        comment: '.talk-admin-moderate-comment',
-        commentUsername: '.talk-admin-moderate-comment-username',
+        firstComment: '.talk-admin-moderate-comment',
+        firstCommentUsername: '.talk-admin-moderate-comment-username',
+        firstCommentContent: '.talk-admin-comment',
+        firstCommentApprove: '.talk-admin-approve-button',
+        firstCommentReject: '.talk-admin-reject-button',
      },
    },
    stories: {
@@ -1,3 +1,5 @@
+const commentBody = 'Embed Stream Test';
+
 module.exports = {
  '@tags': ['embedStream', 'login'],

@@ -40,28 +42,26 @@ module.exports = {
  },
  'user posts a comment': client => {
    const comments = client.page.embedStream().section.comments;
-    const { testData: { comment } } = client.globals;

    comments
      .waitForElementVisible('@commentBoxTextarea')
-      .setValue('@commentBoxTextarea', comment.body)
+      .setValue('@commentBoxTextarea', commentBody)
      .waitForElementVisible('@commentBoxPostButton')
      .click('@commentBoxPostButton')
      .waitForElementVisible('@firstCommentContent')
      .getText('@firstCommentContent', result => {
-        comments.assert.equal(result.value, comment.body);
+        comments.assert.equal(result.value, commentBody);
      });
  },

  'signed in user sees comment history': client => {
    const profile = client.page.embedStream().goToProfileSection();
-    const { testData: { comment } } = client.globals;

    profile
      .waitForElementVisible('@myCommentHistory')
      .waitForElementVisible('@myCommentHistoryComment')
      .getText('@myCommentHistoryComment', result => {
-        profile.assert.equal(result.value, comment.body);
+        profile.assert.equal(result.value, commentBody);
      });
  },
  'user sees replies and reactions to comments': client => {
@@ -1,3 +1,5 @@
+const commentBody = 'Ban User Test';
+
 module.exports = {
  before: client => {
    client.setWindowPosition(0, 0);
@@ -109,4 +111,51 @@ module.exports = {
      .waitForElementVisible('@commentBoxTextarea')
      .waitForElementVisible('@commentBoxPostButton');
  },
+  'user posts comment, karma should stop it from happening': client => {
+    const comments = client.page.embedStream().section.comments;
+
+    comments
+      .waitForElementVisible('@commentBoxTextarea')
+      .setValue('@commentBoxTextarea', commentBody)
+      .waitForElementVisible('@commentBoxPostButton')
+      .click('@commentBoxPostButton');
+
+    client.pause(2000);
+
+    comments.waitForElementNotPresent('@firstCommentContent');
+  },
+  'user logs out 3': client => {
+    const embedStream = client.page.embedStream();
+    const comments = embedStream.section.comments;
+
+    comments.logout();
+  },
+  'admin logs in (3)': client => {
+    const adminPage = client.page.admin();
+    const { testData: { admin } } = client.globals;
+
+    adminPage.navigateAndLogin(admin);
+  },
+  'admin goes to moderation queue reported': client => {
+    const adminPage = client.page.admin();
+
+    adminPage.goToModerate().goToQueue('reported');
+  },
+  'comment should be in reported queue': client => {
+    const moderate = client.page.admin().section.moderate;
+
+    moderate
+      .waitForElementVisible('@firstComment')
+      .getText('@firstCommentContent', result => {
+        moderate.assert.equal(result.value, commentBody);
+      });
+  },
+  'approve comment to restore karma': client => {
+    const moderate = client.page.admin().section.moderate;
+
+    moderate.click('@firstCommentApprove');
+
+    // TODO: check why this fails.
+    //  .waitForElementNotPresent('@firstComment');
+  },
 };
@@ -1,3 +1,5 @@
+const commentBody = 'Suspend User Test';
+
 module.exports = {
  before: client => {
    client.setWindowPosition(0, 0);
@@ -25,16 +27,15 @@ module.exports = {
  },
  'user posts comment': client => {
    const comments = client.page.embedStream().section.comments;
-    const { testData: { comment } } = client.globals;

    comments
      .waitForElementVisible('@commentBoxTextarea')
-      .setValue('@commentBoxTextarea', comment.body)
+      .setValue('@commentBoxTextarea', commentBody)
      .waitForElementVisible('@commentBoxPostButton')
      .click('@commentBoxPostButton')
      .waitForElementVisible('@firstCommentContent')
      .getText('@firstCommentContent', result => {
-        comments.assert.equal(result.value, comment.body);
+        comments.assert.equal(result.value, commentBody);
      });
  },
  'user logs out': client => {
@@ -84,9 +85,9 @@ module.exports = {
      .goToModerate();

    moderate
-      .waitForElementVisible('@comment')
-      .waitForElementVisible('@commentUsername')
-      .click('@commentUsername');
+      .waitForElementVisible('@firstComment')
+      .waitForElementVisible('@firstCommentUsername')
+      .click('@firstCommentUsername');

    userDetailDrawer
      .waitForElementVisible('@actionsMenu')
@@ -112,9 +113,9 @@ module.exports = {
    const { moderate, userDetailDrawer } = adminPage.section;

    moderate
-      .waitForElementVisible('@comment')
-      .waitForElementVisible('@commentUsername')
-      .click('@commentUsername');
+      .waitForElementVisible('@firstComment')
+      .waitForElementVisible('@firstCommentUsername')
+      .click('@firstCommentUsername');

    userDetailDrawer
      .waitForElementVisible('@tabBar')
@@ -0,0 +1,55 @@
+const chai = require('chai');
+const { expect } = chai;
+const { merge } = require('lodash');
+const Karma = require('../../../services/karma');
+
+const thresholdsBackup = {};
+const thresholdsOverride = {
+  comment: {
+    RELIABLE: 2,
+    UNRELIABLE: 0,
+  },
+  flag: {
+    RELIABLE: 1,
+    UNRELIABLE: -1,
+  },
+};
+
+describe('services.Karma', () => {
+  before(() => {
+    // Backup the existing thresholds.
+    merge(thresholdsBackup, Karma.THRESHOLDS);
+
+    // Configure the thresholds to a known value.
+    merge(Karma.THRESHOLDS, thresholdsOverride);
+
+    expect(Karma.THRESHOLDS).to.deep.equal(thresholdsOverride);
+  });
+
+  after(() => {
+    // Restore the thresholds.
+    merge(Karma.THRESHOLDS, thresholdsBackup);
+
+    expect(Karma.THRESHOLDS).to.deep.equal(thresholdsBackup);
+  });
+
+  describe('#isReliable', () => {
+    it('neutral', () => {
+      expect(Karma.isReliable('comment', { comment: { karma: 1 } })).to.be.null;
+      expect(Karma.isReliable('comment', { comment: { karma: 0 } })).to.not.be
+        .null;
+      expect(Karma.isReliable('comment', { comment: { karma: -1 } })).to.not.be
+        .null;
+    });
+    it('unreliable', () => {
+      expect(Karma.isReliable('comment', {})).to.be.false;
+      expect(Karma.isReliable('comment', { comment: {} })).to.be.false;
+      expect(Karma.isReliable('comment', { comment: { karma: 0 } })).to.be
+        .false;
+    });
+    it('reliable', () => {
+      expect(Karma.isReliable('comment', { comment: { karma: 2 } })).to.be.true;
+      expect(Karma.isReliable('comment', { comment: { karma: 3 } })).to.be.true;
+    });
+  });
+});
@@ -309,7 +309,10 @@ const applyConfig = (entries, root = {}) =>
      entry: entries.reduce(
        (entry, { name, path: modulePath, disablePolyfill = false }) => {
          const entries = [
-            path.join(__dirname, 'client/coral-framework/helpers/publicPath'),
+            path.join(
+              __dirname,
+              'client/coral-framework/helpers/webpackGlobals'
+            ),
          ];
          if (disablePolyfill) {
            entries.push(modulePath);