3 files changed, 34 insertions, 28 deletions

diff --git a/web/react/utils/channel_intro_mssages.jsx b/web/react/utils/channel_intro_messages.jsx
index 6f83778c9..9685f94b0 100644
--- a/web/react/utils/channel_intro_mssages.jsx
+++ b/web/react/utils/channel_intro_messages.jsx
@@ -2,6 +2,7 @@
 // See License.txt for license information.
 
 import * as Utils from './utils.jsx';
+import ChannelInviteModal from '../components/channel_invite_modal.jsx';
 import EditChannelHeaderModal from '../components/edit_channel_header_modal.jsx';
 import ToggleModalButton from '../components/toggle_modal_button.jsx';
 import UserProfile from '../components/user_profile.jsx';
@@ -10,15 +11,15 @@ import Constants from '../utils/constants.jsx';
 import TeamStore from '../stores/team_store.jsx';
 import * as EventHelpers from '../dispatcher/event_helpers.jsx';
 
-export function createChannelIntroMessage(channel, showInviteModal) {
+export function createChannelIntroMessage(channel) {
     if (channel.type === 'D') {
         return createDMIntroMessage(channel);
     } else if (ChannelStore.isDefault(channel)) {
         return createDefaultIntroMessage(channel);
     } else if (channel.name === Constants.OFFTOPIC_CHANNEL) {
-        return createOffTopicIntroMessage(channel, showInviteModal);
+        return createOffTopicIntroMessage(channel);
     } else if (channel.type === 'O' || channel.type === 'P') {
-        return createStandardIntroMessage(channel, showInviteModal);
+        return createStandardIntroMessage(channel);
     }
 }
 
@@ -62,7 +63,7 @@ export function createDMIntroMessage(channel) {
     );
 }
 
-export function createOffTopicIntroMessage(channel, showInviteModal) {
+export function createOffTopicIntroMessage(channel) {
     return (
         <div className='channel-intro'>
             <h4 className='channel-intro__title'>{'Beginning of ' + channel.display_name}</h4>
@@ -71,13 +72,7 @@ export function createOffTopicIntroMessage(channel, showInviteModal) {
                 <br/>
             </p>
             {createSetHeaderButton(channel)}
-            <a
-                href='#'
-                className='intro-links'
-                onClick={showInviteModal}
-            >
-                <i className='fa fa-user-plus'></i>{'Invite others to this channel'}
-            </a>
+            {createInviteChannelMemberButton(channel, 'channel')}
         </div>
     );
 }
@@ -122,7 +117,7 @@ export function createDefaultIntroMessage(channel) {
     );
 }
 
-export function createStandardIntroMessage(channel, showInviteModal) {
+export function createStandardIntroMessage(channel) {
     var uiName = channel.display_name;
     var creatorName = '';
 
@@ -162,17 +157,23 @@ export function createStandardIntroMessage(channel, showInviteModal) {
                 <br/>
             </p>
             {createSetHeaderButton(channel)}
-            <a
-                className='intro-links'
-                href='#'
-                onClick={showInviteModal}
-            >
-                <i className='fa fa-user-plus'></i>{'Invite others to this ' + uiType}
-            </a>
+            {createInviteChannelMemberButton(channel, uiType)}
         </div>
     );
 }
 
+function createInviteChannelMemberButton(channel, uiType) {
+    return (
+        <ToggleModalButton
+            className='intro-links'
+            dialogType={ChannelInviteModal}
+            dialogProps={{channel}}
+        >
+            <i className='fa fa-user-plus'></i>{'Invite others to this ' + uiType}
+        </ToggleModalButton>
+    );
+}
+
 function createSetHeaderButton(channel) {
     return (
         <ToggleModalButton
diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx
index 8164095b9..b641e966b 100644
--- a/web/react/utils/constants.jsx
+++ b/web/react/utils/constants.jsx
@@ -55,6 +55,7 @@ export default {
 
         SUGGESTION_PRETEXT_CHANGED: null,
         SUGGESTION_RECEIVED_SUGGESTIONS: null,
+        SUGGESTION_CLEAR_SUGGESTIONS: null,
         SUGGESTION_COMPLETE_WORD: null,
         SUGGESTION_SELECT_NEXT: null,
         SUGGESTION_SELECT_PREVIOUS: null
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index 788d8a45c..0a52f5b37 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -695,15 +695,19 @@ export function applyTheme(theme) {
 }
 
 export function applyFont(fontName) {
-    const body = document.querySelector('body');
-    const keys = Object.getOwnPropertyNames(body.classList);
-    keys.forEach((k) => {
-        const className = body.classList[k];
-        if (className && className.lastIndexOf('font') === 0) {
-            body.classList.remove(className);
+    const body = $('body');
+
+    for (const key of Reflect.ownKeys(Constants.FONTS)) {
+        const className = Constants.FONTS[key];
+
+        if (fontName === key) {
+            if (!body.hasClass(className)) {
+                body.addClass(className);
+            }
+        } else {
+            body.removeClass(className);
         }
-    });
-    body.classList.add(Constants.FONTS[fontName]);
+    }
 }
 
 export function changeCss(className, classValue, classRepeat) {
@@ -1238,4 +1242,4 @@ export function getPostTerm(post) {
 
 export function isFeatureEnabled(feature) {
     return PreferenceStore.getPreference(Constants.Preferences.CATEGORY_ADVANCED_SETTINGS, Constants.FeatureTogglePrefix + feature.label, {value: 'false'}).value === 'true';
-}
\ No newline at end of file
+}