MM-51977 : Remove inconsistencies of the duplicate IDs with different defaultMessages (#22965)

* eslint format lib to root * eslint fixes * no id rule removed * same rectintl * try 1 * eslint format lib to root * eslint fixes * no id rule removed * same rectintl * react intl in root * type fix * add back version to components * missing translations added * remove type casting * a * type fix formatjs * snaps updated * Update package-lock.json * Update package-lock.json * rem * snapshot updates --------- Co-authored-by: Mattermost Build <build@mattermost.com>
2023-04-18 01:04:45 +05:30
--- a/webapp/channels/src/components/snapshots/setting_picture.test.tsx.snap
+++ b/webapp/channels/src/components/snapshots/setting_picture.test.tsx.snap
@@ -34,7 +34,7 @@ exports[`components/SettingItemMin should match snapshot with active Save button
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -139,7 +139,7 @@ exports[`components/SettingItemMin should match snapshot with active Save button
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -254,7 +254,7 @@ exports[`components/SettingItemMin should match snapshot, on loading picture 1`]
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -381,7 +381,7 @@ exports[`components/SettingItemMin should match snapshot, profile picture on fil
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -496,7 +496,7 @@ exports[`components/SettingItemMin should match snapshot, profile picture on sou
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -623,7 +623,7 @@ exports[`components/SettingItemMin should match snapshot, team icon on file 1`]
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -792,7 +792,7 @@ exports[`components/SettingItemMin should match snapshot, team icon on source 1`
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
@@ -961,7 +961,7 @@ exports[`components/SettingItemMin should match snapshot, user icon on source 1`
      >
        <MemoizedFormattedMessage
          defaultMessage="Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}"
-          id="setting_picture.help.profile"
+          id="setting_picture.help.profile.example"
          values={
            Object {
              "max": 52428800,
--- a/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_line_chart/snapshots/top_channels_line_chart.test.tsx.snap
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_line_chart/snapshots/top_channels_line_chart.test.tsx.snap
@@ -222,7 +222,7 @@ exports[`components/activity_and_insights/insights/top_channels should match sna
          title={
            <Memo(MemoizedFormattedMessage)
              defaultMessage="Top Channels"
-              id="analytics.system.totalBotPosts"
+              id="analytics.system.topChannels"
            />
          }
        >
@@ -237,7 +237,7 @@ exports[`components/activity_and_insights/insights/top_channels should match sna
              >
                <FormattedMessage
                  defaultMessage="Top Channels"
-                  id="analytics.system.totalBotPosts"
+                  id="analytics.system.topChannels"
                >
                  <span>
                    Top Channels
--- a/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_line_chart/top_channels_line_chart.tsx
+++ b/webapp/channels/src/components/activity_and_insights/insights/top_channels/top_channels_line_chart/top_channels_line_chart.tsx
@@ -115,7 +115,7 @@ const TopChannelsLineChart = ({topChannels, timeFrame, channelLineChartData, tim
        <LineChart
            title={
                <FormattedMessage
-                    id='analytics.system.totalBotPosts'
+                    id='analytics.system.topChannels'
                    defaultMessage='Top Channels'
                />
            }
--- a/webapp/channels/src/components/admin_console/license_settings/trial_banner/trial_banner.tsx
+++ b/webapp/channels/src/components/admin_console/license_settings/trial_banner/trial_banner.tsx
@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import React, {useEffect, useState} from 'react';
+import React, {useEffect, useState, ReactNode} from 'react';
 import {FormattedMessage, useIntl} from 'react-intl';
 import {useDispatch, useSelector} from 'react-redux';

@@ -106,7 +106,7 @@ const TrialBanner = ({

    const dispatch = useDispatch();

-    const btnText = (status: TrialLoadStatus): string => {
+    const btnText = (status: TrialLoadStatus) => {
        switch (status) {
        case TrialLoadStatus.Started:
            return formatMessage({id: 'start_trial.modal.gettingTrial', defaultMessage: 'Getting Trial...'});
@@ -115,7 +115,22 @@ const TrialBanner = ({
        case TrialLoadStatus.Failed:
            return formatMessage({id: 'start_trial.modal.failed', defaultMessage: 'Failed'});
        case TrialLoadStatus.Embargoed:
-            return formatMessage({id: 'admin.license.trial-request.embargoed'});
+            return formatMessage<ReactNode>(
+                {
+                    id: 'admin.license.trial-request.embargoed',
+                    defaultMessage: 'We were unable to process the request due to limitations for embargoed countries. <link>Learn more in our documentation</link>, or reach out to legal@mattermost.com for questions around export limitations.',
+                },
+                {
+                    link: (text: string) => (
+                        <ExternalLink
+                            location='trial_banner'
+                            href={LicenseLinks.EMBARGOED_COUNTRIES}
+                        >
+                            {text}
+                        </ExternalLink>
+                    ),
+                },
+            );
        default:
            return formatMessage({id: 'admin.license.trial-request.startTrial', defaultMessage: 'Start trial'});
        }
--- a/webapp/channels/src/components/admin_console/request_button/snapshots/request_button.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/request_button/snapshots/request_button.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
        >
          <MemoizedFormattedMessage
            defaultMessage="Button Text"
-            id="test"
+            id="test2"
          />
        </LoadingWrapper>
      </button>
@@ -30,7 +30,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
    >
      <MemoizedFormattedMessage
        defaultMessage="Help Text"
-        id="test"
+        id="test1"
      />
    </div>
  </div>
@@ -42,7 +42,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  buttonText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Button Text"
-      id="test"
+      id="test2"
    />
  }
  disabled={false}
@@ -55,7 +55,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  helpText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Help Text"
-      id="test"
+      id="test1"
    />
  }
  includeDetailedError={true}
@@ -103,7 +103,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
          >
            <FormattedMessage
              defaultMessage="Button Text"
-              id="test"
+              id="test2"
            >
              <span>
                Button Text
@@ -154,7 +154,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
      >
        <FormattedMessage
          defaultMessage="Help Text"
-          id="test"
+          id="test1"
        >
          <span>
            Help Text
@@ -171,7 +171,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  buttonText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Button Text"
-      id="test"
+      id="test2"
    />
  }
  disabled={false}
@@ -184,7 +184,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  helpText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Help Text"
-      id="test"
+      id="test1"
    />
  }
  includeDetailedError={false}
@@ -240,7 +240,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
          >
            <FormattedMessage
              defaultMessage="Button Text"
-              id="test"
+              id="test2"
            >
              <span>
                Button Text
@@ -291,7 +291,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
      >
        <FormattedMessage
          defaultMessage="Help Text"
-          id="test"
+          id="test1"
        >
          <span>
            Help Text
@@ -308,7 +308,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  buttonText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Button Text"
-      id="test"
+      id="test2"
    />
  }
  disabled={false}
@@ -321,7 +321,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  helpText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Help Text"
-      id="test"
+      id="test1"
    />
  }
  includeDetailedError={false}
@@ -369,7 +369,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
          >
            <FormattedMessage
              defaultMessage="Button Text"
-              id="test"
+              id="test2"
            >
              <span>
                Button Text
@@ -413,7 +413,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
      >
        <FormattedMessage
          defaultMessage="Help Text"
-          id="test"
+          id="test1"
        >
          <span>
            Help Text
@@ -430,7 +430,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  buttonText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Button Text"
-      id="test"
+      id="test2"
    />
  }
  disabled={false}
@@ -443,7 +443,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
  helpText={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="Help Text"
-      id="test"
+      id="test1"
    />
  }
  includeDetailedError={false}
@@ -499,7 +499,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
          >
            <FormattedMessage
              defaultMessage="Button Text"
-              id="test"
+              id="test2"
            >
              <span>
                Button Text
@@ -513,7 +513,7 @@ exports[`components/admin_console/request_button/request_button.jsx should match
      >
        <FormattedMessage
          defaultMessage="Help Text"
-          id="test"
+          id="test1"
        >
          <span>
            Help Text
--- a/webapp/channels/src/components/admin_console/request_button/request_button.test.tsx
+++ b/webapp/channels/src/components/admin_console/request_button/request_button.test.tsx
@@ -18,13 +18,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={emptyFunction}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -42,13 +42,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionSuccess}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -72,13 +72,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionSuccess}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -102,13 +102,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionSuccess}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -129,13 +129,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionSuccess}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -164,13 +164,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionFailure}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
@@ -191,13 +191,13 @@ describe('components/admin_console/request_button/request_button.jsx', () => {
                requestAction={requestActionFailure}
                helpText={
                    <FormattedMessage
-                        id='test'
+                        id='test1'
                        defaultMessage='Help Text'
                    />
                }
                buttonText={
                    <FormattedMessage
-                        id='test'
+                        id='test2'
                        defaultMessage='Button Text'
                    />
                }
--- a/webapp/channels/src/components/admin_console/server_logs/log_list.tsx
+++ b/webapp/channels/src/components/admin_console/server_logs/log_list.tsx
@@ -95,7 +95,7 @@ export default class LogList extends React.PureComponent<Props, State> {
        );
        const level: JSX.Element = (
            <FormattedMessage
-                id='admin.log.logLevel'
+                id='admin.log.Level'
                defaultMessage='Level'
            />
        );
--- a/webapp/channels/src/components/announcement_bar/cloud_trial_announcement_bar/cloud_trial_announcement_bar.tsx
+++ b/webapp/channels/src/components/announcement_bar/cloud_trial_announcement_bar/cloud_trial_announcement_bar.tsx
@@ -137,7 +137,7 @@ class CloudTrialAnnouncementBar extends React.PureComponent<Props> {

        let trialMoreThan7DaysMsg = (
            <FormattedMessage
-                id='admin.billing.subscription.cloudTrial.moreThan3Days'
+                id='admin.billing.subscription.cloudTrial.daysLeft'
                defaultMessage='Your trial has started! There are {daysLeftOnTrial} days left'
                values={{daysLeftOnTrial}}
            />
--- a/webapp/channels/src/components/apps_form/apps_form_component.tsx
+++ b/webapp/channels/src/components/apps_form/apps_form_component.tsx
@@ -234,7 +234,7 @@ export class AppsForm extends React.PureComponent<Props, State> {
            const errorResponse = res.error;
            const errMsg = errorResponse.text || intl.formatMessage({
                id: 'apps.error.unknown',
-                defaultMessage: 'Unknown error.',
+                defaultMessage: 'Unknown error occurred.',
            });
            this.setState({
                fieldErrors: {
@@ -256,7 +256,7 @@ export class AppsForm extends React.PureComponent<Props, State> {
        case AppCallResponseTypes.NAVIGATE: {
            const errMsg = intl.formatMessage({
                id: 'apps.error.responses.unexpected_type',
-                defaultMessage: 'App response type was not expected. Response type: {type}.',
+                defaultMessage: 'App response type was not expected. Response type: {type}',
            }, {
                type: callResp.type,
            },
@@ -338,7 +338,7 @@ export class AppsForm extends React.PureComponent<Props, State> {
                case AppCallResponseTypes.NAVIGATE:
                    this.updateErrors([], undefined, this.props.intl.formatMessage({
                        id: 'apps.error.responses.unexpected_type',
-                        defaultMessage: 'App response type was not expected. Response type: {type}.',
+                        defaultMessage: 'App response type was not expected. Response type: {type}',
                    }, {
                        type: callResponse.type,
                    }));
--- a/webapp/channels/src/components/apps_form/apps_form_container.tsx
+++ b/webapp/channels/src/components/apps_form/apps_form_container.tsx
@@ -48,7 +48,7 @@ class AppsFormContainer extends React.PureComponent<Props, State> {
        };
        const {form} = this.state;
        if (!form) {
-            const errMsg = this.props.intl.formatMessage({id: 'apps.error.form.no_form', defaultMessage: '`form` is not defined'});
+            const errMsg = this.props.intl.formatMessage({id: 'apps.error.form.no_form', defaultMessage: '`form` is not defined.'});
            return {error: makeCallErrorResponse(makeErrorMsg(errMsg))};
        }
        if (!form.submit) {
@@ -97,7 +97,7 @@ class AppsFormContainer extends React.PureComponent<Props, State> {
    refreshOnSelect = async (field: AppField, values: AppFormValues): Promise<DoAppCallResult<FormResponseData>> => {
        const makeErrMsg = (message: string) => this.props.intl.formatMessage(
            {
-                id: 'apps.error.form.refresh',
+                id: 'apps.error.form.update',
                defaultMessage: 'There has been an error updating the modal. Contact the app developer. Details: {details}',
            },
            {details: message},
@@ -144,7 +144,7 @@ class AppsFormContainer extends React.PureComponent<Props, State> {
        case AppCallResponseTypes.NAVIGATE:
            return {error: makeCallErrorResponse(makeErrMsg(this.props.intl.formatMessage({
                id: 'apps.error.responses.unexpected_type',
-                defaultMessage: 'App response type was not expected. Response type: {type}.',
+                defaultMessage: 'App response type was not expected. Response type: {type}',
            }, {
                type: callResp.type,
            },
--- a/webapp/channels/src/components/channel_groups_manage_modal/channel_groups_manage_modal.tsx
+++ b/webapp/channels/src/components/channel_groups_manage_modal/channel_groups_manage_modal.tsx
@@ -145,7 +145,7 @@ class ChannelGroupsManageModal extends React.PureComponent<Props> {
        const {formatMessage} = this.props.intl;
        return (
            <ListModal
-                titleText={formatMessage({id: 'groups', defaultMessage: '{channel} Groups'}, {channel: this.props.channel.display_name})}
+                titleText={formatMessage({id: 'channel_groups', defaultMessage: '{channel} Groups'}, {channel: this.props.channel.display_name})}
                searchPlaceholderText={formatMessage({id: 'manage_channel_groups_modal.search_placeholder', defaultMessage: 'Search groups'})}
                renderRow={this.renderRow}
                loadItems={this.loadItems}
--- a/webapp/channels/src/components/cloud_start_trial/cloud_start_trial_btn.tsx
+++ b/webapp/channels/src/components/cloud_start_trial/cloud_start_trial_btn.tsx
@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import React, {useEffect, useState} from 'react';
+import React, {useEffect, useState, ReactNode} from 'react';
 import {useIntl} from 'react-intl';
 import {useDispatch} from 'react-redux';

@@ -14,8 +14,9 @@ import {trackEvent} from 'actions/telemetry_actions';
 import {openModal, closeModal} from 'actions/views/modals';

 import TrialBenefitsModal from 'components/trial_benefits_modal/trial_benefits_modal';
+import ExternalLink from 'components/external_link';

-import {ModalIdentifiers, TELEMETRY_CATEGORIES} from 'utils/constants';
+import {ModalIdentifiers, TELEMETRY_CATEGORIES, LicenseLinks} from 'utils/constants';

 import RequestBusinessEmailModal from './request_business_email_modal';
 import './cloud_start_trial_btn.scss';
@@ -129,7 +130,7 @@ const CloudStartTrialButton = ({
        }));
    };

-    const btnText = (status: TrialLoadStatus): string => {
+    const btnText = (status: TrialLoadStatus) => {
        switch (status) {
        case TrialLoadStatus.Started:
            return formatMessage({id: 'start_cloud_trial.modal.gettingTrial', defaultMessage: 'Getting Trial...'});
@@ -138,7 +139,22 @@ const CloudStartTrialButton = ({
        case TrialLoadStatus.Failed:
            return formatMessage({id: 'start_cloud_trial.modal.failed', defaultMessage: 'Failed'});
        case TrialLoadStatus.Embargoed:
-            return formatMessage({id: 'admin.license.trial-request.embargoed'});
+            return formatMessage<ReactNode>(
+                {
+                    id: 'admin.license.trial-request.embargoed',
+                    defaultMessage: 'We were unable to process the request due to limitations for embargoed countries. <link>Learn more in our documentation</link>, or reach out to legal@mattermost.com for questions around export limitations.',
+                },
+                {
+                    link: (text: string) => (
+                        <ExternalLink
+                            location='trial_banner'
+                            href={LicenseLinks.EMBARGOED_COUNTRIES}
+                        >
+                            {text}
+                        </ExternalLink>
+                    ),
+                },
+            );
        default:
            return message;
        }
--- a/webapp/channels/src/components/dot_menu/dot_menu.tsx
+++ b/webapp/channels/src/components/dot_menu/dot_menu.tsx
@@ -497,7 +497,7 @@ export class DotMenuClass extends React.PureComponent<Props, State> {
                    class: classNames('post-menu__item', {
                        'post-menu__item--active': this.props.isMenuOpen,
                    }),
-                    'aria-label': formatMessage({id: 'post_info.dot_menu.tooltip.more_actions', defaultMessage: 'Actions'}),
+                    'aria-label': formatMessage({id: 'post_info.dot_menu.tooltip.actions', defaultMessage: 'Actions'}),
                    children: <DotsHorizontalIcon size={16}/>,
                }}
                menu={{
@@ -510,7 +510,7 @@ export class DotMenuClass extends React.PureComponent<Props, State> {
                }}
                menuButtonTooltip={{
                    id: `PostDotMenu-ButtonTooltip-${this.props.post.id}`,
-                    text: formatMessage({id: 'post_info.dot_menu.tooltip.more_actions', defaultMessage: 'More'}),
+                    text: formatMessage({id: 'post_info.dot_menu.tooltip.more', defaultMessage: 'More'}),
                    class: 'hidden-xs',
                }}
            >
--- a/webapp/channels/src/components/drafts/panel/snapshots/panel_body.test.tsx.snap
+++ b/webapp/channels/src/components/drafts/panel/snapshots/panel_body.test.tsx.snap
@@ -786,7 +786,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
                <Memo(Tag)
                  icon="alert-circle-outline"
                  size="xs"
-                  text="IMPORTANT"
+                  text="Important"
                  uppercase={true}
                  variant="info"
                >
@@ -818,7 +818,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
                        <span
                          className="TagText-bWgUzx kzWPbz"
                        >
-                          IMPORTANT
+                          Important
                        </span>
                      </TagText>
                    </div>
--- a/webapp/channels/src/components/emoji_picker/components/emoji_picker_preview.tsx
+++ b/webapp/channels/src/components/emoji_picker/components/emoji_picker_preview.tsx
@@ -18,7 +18,7 @@ function EmojiPickerPreview({emoji}: Props) {
        return (
            <div className='emoji-picker__preview emoji-picker__preview-placeholder'>
                <FormattedMessage
-                    id='emoji_picker.emojiPicker'
+                    id='emoji_picker.emojiPicker.previewPlaceholder'
                    defaultMessage='Select an Emoji'
                />
            </div>
--- a/webapp/channels/src/components/error_page/error_page.tsx
+++ b/webapp/channels/src/components/error_page/error_page.tsx
@@ -79,7 +79,7 @@ export default class ErrorPage extends React.PureComponent<Props> {
            backButton = (
                <Link to='/'>
                    <FormattedMessage
-                        id='error.generic.link'
+                        id='error.generic.siteLink'
                        defaultMessage='Back to {siteName}'
                        values={{
                            siteName: this.props.siteName,
@@ -123,7 +123,7 @@ export default class ErrorPage extends React.PureComponent<Props> {
            backButton = (
                <Link to='/'>
                    <FormattedMessage
-                        id='error.generic.link'
+                        id='error.generic.siteLink'
                        defaultMessage='Back to {siteName}'
                        values={{
                            siteName: this.props.siteName,
--- a/webapp/channels/src/components/file_preview_modal/file_preview_modal_main_nav/snapshots/file_preview_modal_main_nav.test.tsx.snap
+++ b/webapp/channels/src/components/file_preview_modal/file_preview_modal_main_nav/snapshots/file_preview_modal_main_nav.test.tsx.snap
@@ -14,7 +14,7 @@ exports[`components/file_preview_modal/file_preview_modal_main_nav/FilePreviewMo
      >
        <Memo(MemoizedFormattedMessage)
          defaultMessage="Close"
-          id="generic.previous"
+          id="generic.close"
        />
      </Tooltip>
    }
--- a/webapp/channels/src/components/file_preview_modal/file_preview_modal_main_nav/file_preview_modal_main_nav.tsx
+++ b/webapp/channels/src/components/file_preview_modal/file_preview_modal_main_nav/file_preview_modal_main_nav.tsx
@@ -26,7 +26,7 @@ const FilePreviewModalMainNav: React.FC<Props> = (props: Props) => {
            overlay={
                <Tooltip id='close-icon-tooltip'>
                    <FormattedMessage
-                        id='generic.previous'
+                        id='generic.close'
                        defaultMessage='Close'
                    />
                </Tooltip>
--- a/webapp/channels/src/components/header_footer_template/snapshots/header_footer_template.test.tsx.snap
+++ b/webapp/channels/src/components/header_footer_template/snapshots/header_footer_template.test.tsx.snap
@@ -44,6 +44,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with about link 1
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="About"
              id="web.footer.about"
            />
          </ExternalLink>
@@ -98,6 +99,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with all links 1`
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="About"
              id="web.footer.about"
            />
          </ExternalLink>
@@ -109,6 +111,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with all links 1`
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Privacy Policy"
              id="web.footer.privacy"
            />
          </ExternalLink>
@@ -120,6 +123,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with all links 1`
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Terms"
              id="web.footer.terms"
            />
          </ExternalLink>
@@ -131,6 +135,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with all links 1`
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Help"
              id="web.footer.help"
            />
          </ExternalLink>
@@ -231,6 +236,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with help link 1`
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Help"
              id="web.footer.help"
            />
          </ExternalLink>
@@ -285,6 +291,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with privacy poli
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Privacy Policy"
              id="web.footer.privacy"
            />
          </ExternalLink>
@@ -339,6 +346,7 @@ exports[`components/HeaderFooterTemplate should match snapshot with term of serv
            location="header_footer_template"
          >
            <MemoizedFormattedMessage
+              defaultMessage="Terms"
              id="web.footer.terms"
            />
          </ExternalLink>
--- a/webapp/channels/src/components/header_footer_template/header_footer_template.tsx
+++ b/webapp/channels/src/components/header_footer_template/header_footer_template.tsx
@@ -57,7 +57,10 @@ export default class NotLoggedIn extends React.PureComponent<Props> {
                    location='header_footer_template'
                    href={this.props.config.AboutLink}
                >
-                    <FormattedMessage id='web.footer.about'/>
+                    <FormattedMessage
+                        id='web.footer.about'
+                        defaultMessage='About'
+                    />
                </ExternalLink>,
            );
        }
@@ -71,7 +74,10 @@ export default class NotLoggedIn extends React.PureComponent<Props> {
                    location='header_footer_template'
                    href={this.props.config.PrivacyPolicyLink}
                >
-                    <FormattedMessage id='web.footer.privacy'/>
+                    <FormattedMessage
+                        id='web.footer.privacy'
+                        defaultMessage='Privacy Policy'
+                    />
                </ExternalLink>,
            );
        }
@@ -85,7 +91,10 @@ export default class NotLoggedIn extends React.PureComponent<Props> {
                    location='header_footer_template'
                    href={this.props.config.TermsOfServiceLink}
                >
-                    <FormattedMessage id='web.footer.terms'/>
+                    <FormattedMessage
+                        id='web.footer.terms'
+                        defaultMessage='Terms'
+                    />
                </ExternalLink>,
            );
        }
@@ -99,7 +108,10 @@ export default class NotLoggedIn extends React.PureComponent<Props> {
                    location='header_footer_template'
                    href={this.props.config.HelpLink}
                >
-                    <FormattedMessage id='web.footer.help'/>
+                    <FormattedMessage
+                        id='web.footer.help'
+                        defaultMessage='Help'
+                    />
                </ExternalLink>,
            );
        }
--- a/webapp/channels/src/components/integrations/snapshots/abstract_incoming_hook.test.tsx.snap
+++ b/webapp/channels/src/components/integrations/snapshots/abstract_incoming_hook.test.tsx.snap
@@ -10,7 +10,7 @@ exports[`components/integrations/AbstractIncomingWebhook should call action func
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -271,7 +271,7 @@ exports[`components/integrations/AbstractIncomingWebhook should match snapshot 1
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -532,7 +532,7 @@ exports[`components/integrations/AbstractIncomingWebhook should match snapshot,
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -796,7 +796,7 @@ exports[`components/integrations/AbstractIncomingWebhook should match snapshot,
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -1024,7 +1024,7 @@ exports[`components/integrations/AbstractIncomingWebhook should match snapshot,
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -1252,7 +1252,7 @@ exports[`components/integrations/AbstractIncomingWebhook should match snapshot,
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
--- a/webapp/channels/src/components/integrations/snapshots/abstract_outgoing_webhook.test.jsx.snap
+++ b/webapp/channels/src/components/integrations/snapshots/abstract_outgoing_webhook.test.jsx.snap
@@ -10,7 +10,7 @@ exports[`components/integrations/AbstractOutgoingWebhook should match snapshot 1
    >
      <MemoizedFormattedMessage
        defaultMessage="Outgoing Webhooks"
-        id="installed_outgoing_webhooks.header"
+        id="add_outgoing_webhook.header"
      />
    </Link>
    <MemoizedFormattedMessage
--- a/webapp/channels/src/components/integrations/snapshots/installed_outgoing_webhook.test.jsx.snap
+++ b/webapp/channels/src/components/integrations/snapshots/installed_outgoing_webhook.test.jsx.snap
@@ -34,7 +34,7 @@ exports[`components/integrations/InstalledOutgoingWebhook should match snapshot
          onClick={[Function]}
        >
          <MemoizedFormattedMessage
-            defaultMessage="Regen Token"
+            defaultMessage="Regenerate Token"
            id="installed_integrations.regenToken"
          />
        </button>
--- a/webapp/channels/src/components/integrations/abstract_incoming_webhook.tsx
+++ b/webapp/channels/src/components/integrations/abstract_incoming_webhook.tsx
@@ -184,7 +184,7 @@ export default class AbstractIncomingWebhook extends PureComponent<Props, State>
                <BackstageHeader>
                    <Link to={`/${this.props.team.name}/integrations/incoming_webhooks`}>
                        <FormattedMessage
-                            id='installed_incoming_webhooks.header'
+                            id='incoming_webhooks.header'
                            defaultMessage='Incoming Webhooks'
                        />
                    </Link>
--- a/webapp/channels/src/components/integrations/abstract_outgoing_webhook.jsx
+++ b/webapp/channels/src/components/integrations/abstract_outgoing_webhook.jsx
@@ -249,7 +249,7 @@ export default class AbstractOutgoingWebhook extends React.PureComponent {
                <BackstageHeader>
                    <Link to={`/${this.props.team.name}/integrations/outgoing_webhooks`}>
                        <FormattedMessage
-                            id='installed_outgoing_webhooks.header'
+                            id='add_outgoing_webhook.header'
                            defaultMessage='Outgoing Webhooks'
                        />
                    </Link>
--- a/webapp/channels/src/components/integrations/bots/add_bot/snapshots/add_bot.test.tsx.snap
+++ b/webapp/channels/src/components/integrations/bots/add_bot/snapshots/add_bot.test.tsx.snap
@@ -0,0 +1,362 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components/integrations/bots/AddBot blank 1`] = `
+<div
+  className="backstage-content"
+>
+  <BackstageHeader>
+    <Link
+      to="/DN/integrations/bots"
+    >
+      <MemoizedFormattedMessage
+        defaultMessage="Bot Accounts"
+        id="bots.manage.header"
+      />
+    </Link>
+    <MemoizedFormattedMessage
+      defaultMessage="Add"
+      id="bots.manage.add.add"
+    />
+  </BackstageHeader>
+  <div
+    className="backstage-form"
+  >
+    <form
+      className="form-horizontal"
+      onSubmit={[Function]}
+    >
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="username"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Username"
+            id="bots.add.username"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8"
+        >
+          <input
+            className="form-control"
+            id="username"
+            maxLength={22}
+            onChange={[Function]}
+            type="text"
+            value=""
+          />
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="You can use lowercase letters, numbers, periods, dashes, and underscores."
+              id="bot.add.username.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="boticon"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Bot Icon"
+            id="bots.add.icon"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8"
+        >
+          <div
+            className="bot-img-container"
+          >
+            <img
+              alt="bot image"
+              className="bot-img"
+              src={null}
+              style={
+                Object {
+                  "transform": "",
+                  "transformOrigin": "",
+                }
+              }
+            />
+          </div>
+          <div
+            className="btn btn-sm btn-primary btn-file sel-btn"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="Upload Image"
+              id="bots.image.upload"
+            />
+            <input
+              accept=".jpeg,.jpg,.png,.bmp"
+              onChange={[Function]}
+              type="file"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="displayName"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Display Name"
+            id="bots.add.displayName"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8"
+        >
+          <input
+            className="form-control"
+            id="displayName"
+            maxLength={64}
+            onChange={[Function]}
+            type="text"
+            value=""
+          />
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="(Optional) You can choose to display your bot's full name rather than its username."
+              id="bot.add.display_name.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="description"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Description"
+            id="bot.add.description"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8"
+        >
+          <input
+            className="form-control"
+            id="description"
+            maxLength={1024}
+            onChange={[Function]}
+            type="text"
+            value=""
+          />
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="(Optional) Let others know what this bot does."
+              id="bot.add.description.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="role"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Role"
+            id="bot.add.role"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8"
+        >
+          <select
+            className="form-control"
+            disabled={false}
+            onChange={[Function]}
+            value="Member"
+          >
+            <option
+              value="Member"
+            >
+              Member
+            </option>
+            <option
+              value="System Admin"
+            >
+              System Admin
+            </option>
+          </select>
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="Choose what role the bot should have."
+              id="bot.add.role.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="row bot-profile__section"
+      >
+        <div
+          className="col-md-5 col-sm-8 col-sm-offset-4"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Select additional permissions for the account. <link>Read more about roles and permissions</link>."
+            id="admin.manage_roles.botAdditionalRoles"
+            values={
+              Object {
+                "link": [Function],
+              }
+            }
+          />
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="postAll"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="post:all"
+            id="bot.add.post_all"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8 checkbox"
+        >
+          <div
+            className="checkbox no-padding"
+          >
+            <label
+              htmlFor="postAll"
+            >
+              <input
+                checked={false}
+                disabled={false}
+                id="postAll"
+                onChange={[Function]}
+                type="checkbox"
+              />
+              <MemoizedFormattedMessage
+                defaultMessage="Enabled"
+                id="bot.add.post_all.enabled"
+              />
+            </label>
+          </div>
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="Bot will have access to post to all Mattermost channels including direct messages."
+              id="bot.add.post_all.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="form-group"
+      >
+        <label
+          className="control-label col-sm-4"
+          htmlFor="postChannels"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="post:channels"
+            id="bot.add.post_channels"
+          />
+        </label>
+        <div
+          className="col-md-5 col-sm-8 checkbox"
+        >
+          <div
+            className="checkbox no-padding"
+          >
+            <label
+              htmlFor="postChannels"
+            >
+              <input
+                checked={false}
+                disabled={false}
+                id="postChannels"
+                onChange={[Function]}
+                type="checkbox"
+              />
+              <MemoizedFormattedMessage
+                defaultMessage="Enabled"
+                id="bot.add.post_channels.enabled"
+              />
+            </label>
+          </div>
+          <div
+            className="form__help"
+          >
+            <MemoizedFormattedMessage
+              defaultMessage="Bot will have access to post to all Mattermost public channels."
+              id="bot.add.post_channels.help"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="backstage-form__footer"
+      >
+        <FormError
+          error={null}
+          errors={
+            Array [
+              "",
+            ]
+          }
+          type="backstage"
+        />
+        <Link
+          className="btn btn-link btn-sm"
+          to="/DN/integrations/bots"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Cancel"
+            id="bots.manage.add.cancel"
+          />
+        </Link>
+        <SpinnerButton
+          className="btn btn-primary"
+          id="saveBot"
+          onClick={[Function]}
+          spinning={false}
+          spinningText={
+            <Memo(MemoizedFormattedMessage)
+              defaultMessage="Creating..."
+              id="bots.manage.add.creating"
+            />
+          }
+          type="submit"
+        >
+          <MemoizedFormattedMessage
+            defaultMessage="Create Bot Account"
+            id="bots.manage.add.create"
+          />
+        </SpinnerButton>
+      </div>
+    </form>
+  </div>
+</div>
+`;
--- a/webapp/channels/src/components/integrations/bots/add_bot/add_bot.test.tsx
+++ b/webapp/channels/src/components/integrations/bots/add_bot/add_bot.test.tsx
@@ -3,9 +3,7 @@

 import React from 'react';
 import {shallow} from 'enzyme';
-import {FormattedMessage} from 'react-intl';

-// import TestHelper from 'mattermost-redux/test/test_helper';
 import {TestHelper} from 'utils/test_helper';

 import AddBot from './add_bot';
@@ -49,11 +47,7 @@ describe('components/integrations/bots/AddBot', () => {
                value={''}
            />,
        )).toEqual(true);
-        expect(wrapper.containsMatchingElement(
-            <FormattedMessage
-                id='admin.manage_roles.additionalRoles'
-            />,
-        )).toEqual(true);
+        expect(wrapper).toMatchSnapshot();
    });

    it('edit bot', () => {
--- a/webapp/channels/src/components/integrations/bots/add_bot/add_bot.tsx
+++ b/webapp/channels/src/components/integrations/bots/add_bot/add_bot.tsx
@@ -322,7 +322,7 @@ export default class AddBot extends React.PureComponent<Props, State> {
                        error: (
                            <FormattedMessage
                                id='bots.manage.add.invalid_username'
-                                defaultMessage='Usernames must begin with a lowercase letter and be 3-22 characters long. You can use lowercase letters, numbers, periods, dashes, and underscores.'
+                                defaultMessage='Usernames have to begin with a lowercase letter and be 3-22 characters long. You can use lowercase letters, numbers, periods, dashes, and underscores.'
                            />
                        ),
                    };
@@ -383,7 +383,7 @@ export default class AddBot extends React.PureComponent<Props, State> {
    render() {
        let subtitle = (
            <FormattedMessage
-                id='bots.manage.add'
+                id='bots.manage.add.add'
                defaultMessage='Add'
            />
        );
@@ -630,7 +630,7 @@ export default class AddBot extends React.PureComponent<Props, State> {
                        <div className='row bot-profile__section'>
                            <div className='col-md-5 col-sm-8 col-sm-offset-4'>
                                <FormattedMessage
-                                    id='admin.manage_roles.additionalRoles'
+                                    id='admin.manage_roles.botAdditionalRoles'
                                    defaultMessage='Select additional permissions for the account. <link>Read more about roles and permissions</link>.'
                                    values={{
                                        link: (msg: React.ReactNode) => (
--- a/webapp/channels/src/components/integrations/confirm_integration/snapshots/confirm_integration.test.tsx.snap
+++ b/webapp/channels/src/components/integrations/confirm_integration/snapshots/confirm_integration.test.tsx.snap
@@ -12,7 +12,7 @@ exports[`components/integrations/ConfirmIntegration should match snapshot, comma
    >
      <MemoizedFormattedMessage
        defaultMessage="Slash Commands"
-        id="installed_commands.header"
+        id="slash_commands.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -90,7 +90,7 @@ exports[`components/integrations/ConfirmIntegration should match snapshot, incom
    >
      <MemoizedFormattedMessage
        defaultMessage="Incoming Webhooks"
-        id="installed_incoming_webhooks.header"
+        id="incoming_webhooks.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -168,7 +168,7 @@ exports[`components/integrations/ConfirmIntegration should match snapshot, oauth
    >
      <MemoizedFormattedMessage
        defaultMessage="OAuth 2.0 Applications"
-        id="installed_oauth_apps.header"
+        id="installed_oauth2_apps.header"
      />
    </Link>
    <MemoizedFormattedMessage
@@ -286,7 +286,7 @@ exports[`components/integrations/ConfirmIntegration should match snapshot, outgo
    >
      <MemoizedFormattedMessage
        defaultMessage="Outgoing Webhooks"
-        id="installed_outgoing_webhooks.header"
+        id="add_outgoing_webhook.header"
      />
    </Link>
    <MemoizedFormattedMessage
--- a/webapp/channels/src/components/integrations/confirm_integration/confirm_integration.tsx
+++ b/webapp/channels/src/components/integrations/confirm_integration/confirm_integration.tsx
@@ -63,7 +63,7 @@ const ConfirmIntegration = ({team, location, commands, oauthApps, incomingHooks,

        headerText = (
            <FormattedMessage
-                id={'installed_commands.header'}
+                id={'slash_commands.header'}
                defaultMessage='Slash Commands'
            />
        );
@@ -100,7 +100,7 @@ const ConfirmIntegration = ({team, location, commands, oauthApps, incomingHooks,

        headerText = (
            <FormattedMessage
-                id={'installed_incoming_webhooks.header'}
+                id={'incoming_webhooks.header'}
                defaultMessage='Incoming Webhooks'
            />
        );
@@ -137,7 +137,7 @@ const ConfirmIntegration = ({team, location, commands, oauthApps, incomingHooks,

        headerText = (
            <FormattedMessage
-                id={'installed_outgoing_webhooks.header'}
+                id={'add_outgoing_webhook.header'}
                defaultMessage='Outgoing Webhooks'
            />
        );
@@ -175,7 +175,7 @@ const ConfirmIntegration = ({team, location, commands, oauthApps, incomingHooks,

        headerText = (
            <FormattedMessage
-                id={'installed_oauth_apps.header'}
+                id={'installed_oauth2_apps.header'}
                defaultMessage='OAuth 2.0 Applications'
            />
        );
--- a/webapp/channels/src/components/integrations/installed_oauth_apps/snapshots/installed_oauth_apps.test.tsx.snap
+++ b/webapp/channels/src/components/integrations/installed_oauth_apps/snapshots/installed_oauth_apps.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`components/integrations/InstalledOAuthApps should match snapshot 1`] =
  header={
    <Memo(MemoizedFormattedMessage)
      defaultMessage="OAuth 2.0 Applications"
-      id="installed_oauth_apps.header"
+      id="installed_oauth2_apps.header"
    />
  }
  helpText={
--- a/webapp/channels/src/components/integrations/installed_oauth_apps/installed_oauth_apps.tsx
+++ b/webapp/channels/src/components/integrations/installed_oauth_apps/installed_oauth_apps.tsx
@@ -134,7 +134,7 @@ export default class InstalledOAuthApps extends React.PureComponent<Props, State
            <BackstageList
                header={
                    <FormattedMessage
-                        id='installed_oauth_apps.header'
+                        id='installed_oauth2_apps.header'
                        defaultMessage='OAuth 2.0 Applications'
                    />
                }
--- a/webapp/channels/src/components/integrations/installed_outgoing_webhook.tsx
+++ b/webapp/channels/src/components/integrations/installed_outgoing_webhook.tsx
@@ -167,7 +167,7 @@ export default class InstalledOutgoingWebhook extends React.PureComponent<Props>
                    >
                        <FormattedMessage
                            id='installed_integrations.regenToken'
-                            defaultMessage='Regen Token'
+                            defaultMessage='Regenerate Token'
                        />
                    </button>
                    {' - '}
--- a/webapp/channels/src/components/post_priority/post_priority_label.tsx
+++ b/webapp/channels/src/components/post_priority/post_priority_label.tsx
@@ -26,7 +26,7 @@ export default function PriorityLabel({
                {...rest}
                variant='danger'
                icon={'alert-outline'}
-                text={formatMessage({id: 'post_priority.priority.urgent', defaultMessage: 'URGENT'})}
+                text={formatMessage({id: 'post_priority.priority.urgent', defaultMessage: 'Urgent'})}
                uppercase={true}
            />
        );
@@ -38,7 +38,7 @@ export default function PriorityLabel({
                {...rest}
                variant='info'
                icon={'alert-circle-outline'}
-                text={formatMessage({id: 'post_priority.priority.important', defaultMessage: 'IMPORTANT'})}
+                text={formatMessage({id: 'post_priority.priority.important', defaultMessage: 'Important'})}
                uppercase={true}
            />
        );
--- a/webapp/channels/src/components/profile_popover/snapshots/profile_popover.test.tsx.snap
+++ b/webapp/channels/src/components/profile_popover/snapshots/profile_popover.test.tsx.snap
@@ -79,7 +79,7 @@ exports[`components/ProfilePopover should disable start call button when user is
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -424,7 +424,7 @@ exports[`components/ProfilePopover should hide add-to-channel option if not on t
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -690,7 +690,7 @@ exports[`components/ProfilePopover should match snapshot 1`] = `
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -1039,7 +1039,7 @@ exports[`components/ProfilePopover should match snapshot for shared user 1`] = `
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -1406,7 +1406,7 @@ exports[`components/ProfilePopover should match snapshot when calls are disabled
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -1728,7 +1728,7 @@ exports[`components/ProfilePopover should match snapshot with custom status 1`]
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -2122,7 +2122,7 @@ exports[`components/ProfilePopover should match snapshot with custom status expi
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -2471,7 +2471,7 @@ exports[`components/ProfilePopover should match snapshot with custom status not
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -2757,7 +2757,7 @@ exports[`components/ProfilePopover should match snapshot with last active displa
      >
        <MemoizedFormattedMessage
          defaultMessage="Last online {timestamp}"
-          id="channel_header.lastActive"
+          id="channel_header.lastOnline"
          values={
            Object {
              "timestamp": <Memo(Connect(injectIntl(Timestamp)))
@@ -3753,7 +3753,7 @@ exports[`components/ProfilePopover should show the start call button when isCall
                  >
                    <FormattedMessage
                      defaultMessage="Last online {timestamp}"
-                      id="channel_header.lastActive"
+                      id="channel_header.lastOnline"
                      values={
                        Object {
                          "timestamp": <Memo(Connect(injectIntl(Timestamp)))
--- a/webapp/channels/src/components/profile_popover/profile_popover.tsx
+++ b/webapp/channels/src/components/profile_popover/profile_popover.tsx
@@ -463,7 +463,7 @@ class ProfilePopover extends React.PureComponent<ProfilePopoverProps, ProfilePop
                    key='user-popover-last-active'
                >
                    <FormattedMessage
-                        id='channel_header.lastActive'
+                        id='channel_header.lastOnline'
                        defaultMessage='Last online {timestamp}'
                        values={{
                            timestamp: (
--- a/webapp/channels/src/components/self_hosted_purchase_modal/success_page.tsx
+++ b/webapp/channels/src/components/self_hosted_purchase_modal/success_page.tsx
@@ -17,7 +17,7 @@ import './success_page.scss';
 export default function SuccessPage(props: Props) {
    const title = (
        <FormattedMessage
-            id={'admin.billing.subscription.upgradedSuccess'}
+            id={'admin.billing.subscription.subscribedSuccess'}
            defaultMessage={'You\'re now subscribed to {productName}'}
            values={{productName: props.planName}}
        />
--- a/webapp/channels/src/components/setting_picture.test.tsx
+++ b/webapp/channels/src/components/setting_picture.test.tsx
@@ -10,7 +10,7 @@ import SettingPicture from 'components/setting_picture';

 const helpText: ReactNode = (
    <FormattedMessage
-        id={'setting_picture.help.profile'}
+        id={'setting_picture.help.profile.example'}
        defaultMessage='Upload a picture in BMP, JPG or PNG format. Maximum file size: {max}'
        values={{max: 52428800}}
    />
--- a/webapp/channels/src/components/sidebar/snapshots/add_channels_cta_button.test.tsx.snap
+++ b/webapp/channels/src/components/sidebar/snapshots/add_channels_cta_button.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`components/new_channel_modal should match snapshot 1`] = `
  open={false}
 >
  <button
-    aria-label="Add Channels Dropdown"
+    aria-label="Add Channel Dropdown"
    className="SidebarChannelNavigator__addChannelsCtaLhsButton SidebarChannelNavigator__addChannelsCtaLhsButton--untouched"
    id="addChannelsCta"
    onClick={[Function]}
@@ -48,7 +48,7 @@ exports[`components/new_channel_modal should match snapshot 1`] = `

 exports[`components/new_channel_modal should match snapshot when user has only join channel permissions 1`] = `
 <button
-  aria-label="Add Channels Dropdown"
+  aria-label="Add Channel Dropdown"
  className="SidebarChannelNavigator__addChannelsCtaLhsButton SidebarChannelNavigator__addChannelsCtaLhsButton--untouched"
  id="addChannelsCta"
  onClick={[Function]}
--- a/webapp/channels/src/components/sidebar/add_channels_cta_button.tsx
+++ b/webapp/channels/src/components/sidebar/add_channels_cta_button.tsx
@@ -112,7 +112,7 @@ const AddChannelsCtaButton = (): JSX.Element | null => {
            <button
                className={buttonClass}
                id={'addChannelsCta'}
-                aria-label={intl.formatMessage({id: 'sidebar_left.add_channel_dropdown.dropdownAriaLabel', defaultMessage: 'Add Channels Dropdown'})}
+                aria-label={intl.formatMessage({id: 'sidebar_left.add_channel_dropdown.dropdownAriaLabel', defaultMessage: 'Add Channel Dropdown'})}
                onClick={handleClick}
            >
                <li
--- a/webapp/channels/src/components/suggestion/command_provider/app_command_parser/app_command_parser.ts
+++ b/webapp/channels/src/components/suggestion/command_provider/app_command_parser/app_command_parser.ts
@@ -541,7 +541,7 @@ export class ParsedCommand {
                    if (this.incompleteStart === this.i - 1) {
                        return this.asError(this.intl.formatMessage({
                            id: 'apps.error.parser.empty_value',
-                            defaultMessage: 'Empty values are not allowed.',
+                            defaultMessage: 'Empty values are not allowed',
                        }));
                    }
                    this.i++;
@@ -581,7 +581,7 @@ export class ParsedCommand {
                    if (this.incompleteStart === this.i - 1) {
                        return this.asError(this.intl.formatMessage({
                            id: 'apps.error.parser.empty_value',
-                            defaultMessage: 'Empty values are not allowed.',
+                            defaultMessage: 'Empty values are not allowed',
                        }));
                    }
                    this.i++;
@@ -730,7 +730,7 @@ export class ParsedCommand {
                    if (this.incompleteStart === this.i - 1) {
                        return this.asError(this.intl.formatMessage({
                            id: 'apps.error.parser.empty_value',
-                            defaultMessage: 'empty values are not allowed',
+                            defaultMessage: 'Empty values are not allowed',
                        }));
                    }
                    this.i++;
@@ -770,7 +770,7 @@ export class ParsedCommand {
                    if (this.incompleteStart === this.i - 1) {
                        return this.asError(this.intl.formatMessage({
                            id: 'apps.error.parser.empty_value',
-                            defaultMessage: 'empty values are not allowed',
+                            defaultMessage: 'Empty values are not allowed',
                        }));
                    }
                    this.i++;
@@ -1506,7 +1506,7 @@ export class AppCommandParser {
            const errorResponse = res.error;
            return {error: errorResponse.text || this.intl.formatMessage({
                id: 'apps.error.unknown',
-                defaultMessage: 'Unknown error.',
+                defaultMessage: 'Unknown error occurred.',
            })};
        }

@@ -1822,7 +1822,7 @@ export class AppCommandParser {
            const errorResponse = res.error;
            return this.makeDynamicSelectSuggestionError(errorResponse.text || this.intl.formatMessage({
                id: 'apps.error.unknown',
-                defaultMessage: 'Unknown error.',
+                defaultMessage: 'Unknown error occurred.',
            }));
        }

--- a/webapp/channels/src/components/team_groups_manage_modal/team_groups_manage_modal.tsx
+++ b/webapp/channels/src/components/team_groups_manage_modal/team_groups_manage_modal.tsx
@@ -195,7 +195,7 @@ class TeamGroupsManageModal extends React.PureComponent<Props, State> {
            <>
                <ListModal
                    show={!this.state.showConfirmModal}
-                    titleText={formatMessage({id: 'groups', defaultMessage: '{team} Groups'}, {team: this.props.team.display_name})}
+                    titleText={formatMessage({id: 'team_groups', defaultMessage: '{team} Groups'}, {team: this.props.team.display_name})}
                    searchPlaceholderText={formatMessage({id: 'manage_team_groups_modal.search_placeholder', defaultMessage: 'Search groups'})}
                    renderRow={this.renderRow}
                    loadItems={this.loadItems}
--- a/webapp/channels/src/components/user_settings/general/user_settings_general.tsx
+++ b/webapp/channels/src/components/user_settings/general/user_settings_general.tsx
@@ -1301,7 +1301,7 @@ export class UserSettingsGeneralTab extends React.Component<Props, State> {
                imgSrc = Utils.imageURLForUser(user.id, user.last_picture_update);
                helpText = (
                    <FormattedMessage
-                        id={'setting_picture.help.profile'}
+                        id='setting_picture.help.profile'
                        defaultMessage='Upload a picture in BMP, JPG, JPEG, or PNG format. Maximum file size: {max}'
                        values={{max: Utils.fileSizeToString(this.props.maxFileSize)}}
                    />
--- a/webapp/channels/src/components/user_settings/notifications/email_notification_setting/snapshots/email_notification_setting.test.tsx.snap
+++ b/webapp/channels/src/components/user_settings/notifications/email_notification_setting/snapshots/email_notification_setting.test.tsx.snap
@@ -378,7 +378,7 @@ exports[`components/user_settings/notifications/EmailNotificationSetting should
                  type="radio"
                />
                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Every {count} minutes"
+                  defaultMessage="Every {count, plural, one {minute} other {{count, number} minutes}}"
                  id="user.settings.notifications.email.everyXMinutes"
                  values={
                    Object {
@@ -523,7 +523,7 @@ exports[`components/user_settings/notifications/EmailNotificationSetting should
                      type="radio"
                    />
                    <FormattedMessage
-                      defaultMessage="Every {count} minutes"
+                      defaultMessage="Every {count, plural, one {minute} other {{count, number} minutes}}"
                      id="user.settings.notifications.email.everyXMinutes"
                      values={
                        Object {
--- a/webapp/channels/src/components/user_settings/notifications/email_notification_setting/email_notification_setting.tsx
+++ b/webapp/channels/src/components/user_settings/notifications/email_notification_setting/email_notification_setting.tsx
@@ -284,7 +284,7 @@ export default class EmailNotificationSetting extends React.PureComponent<Props,
                            />
                            <FormattedMessage
                                id='user.settings.notifications.email.everyXMinutes'
-                                defaultMessage='Every {count} minutes'
+                                defaultMessage='Every {count, plural, one {minute} other {{count, number} minutes}}'
                                values={{count: Preferences.INTERVAL_FIFTEEN_MINUTES / SECONDS_PER_MINUTE}}
                            />
                        </label>
--- a/webapp/channels/src/components/view_user_group_modal/view_user_group_modal_header/view_user_group_modal_header.tsx
+++ b/webapp/channels/src/components/view_user_group_modal/view_user_group_modal_header/view_user_group_modal_header.tsx
@@ -90,7 +90,7 @@ const ViewUserGroupModalHeader = (props: Props) => {
                >
                    <FormattedMessage
                        id='user_groups_modal.addPeople'
-                        defaultMessage='AddPeople'
+                        defaultMessage='Add People'
                    />
                </button>
            );