From 58be44ad9edb31bc05244f301c4f2e4ff7e34dd2 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Thu, 21 Jun 2018 13:51:39 +0100
Subject: [PATCH 1/3] factor out conditional LanguageSelector as functional
 component and reuse in Login, ForgotPassword and Registration views

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 .../structures/login/ForgotPassword.js        |  4 +-
 .../structures/login/LanguageSelector.js      | 38 +++++++++++++++++++
 src/components/structures/login/Login.js      | 25 ++----------
 .../structures/login/Registration.js          |  3 ++
 4 files changed, 48 insertions(+), 22 deletions(-)
 create mode 100644 src/components/structures/login/LanguageSelector.js

diff --git a/src/components/structures/login/ForgotPassword.js b/src/components/structures/login/ForgotPassword.js
index ca50b9db6e..cf054a4e6e 100644
--- a/src/components/structures/login/ForgotPassword.js
+++ b/src/components/structures/login/ForgotPassword.js
@@ -1,6 +1,6 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
-Copyright 2017 New Vector Ltd
+Copyright 2017, 2018 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -26,6 +26,7 @@ import MatrixClientPeg from "../../../MatrixClientPeg";
 import SdkConfig from "../../../SdkConfig";
 
 import PasswordReset from "../../../PasswordReset";
+import makeLanguageSelector from "./LanguageSelector";
 
 module.exports = React.createClass({
     displayName: 'ForgotPassword',
@@ -233,6 +234,7 @@ module.exports = React.createClass({
                     <a className="mx_Login_create" onClick={this.props.onRegisterClick} href="#">
                         { _t('Create an account') }
                     </a>
+                    { makeLanguageSelector() }
                     <LoginFooter />
                 </div>
             </div>
diff --git a/src/components/structures/login/LanguageSelector.js b/src/components/structures/login/LanguageSelector.js
new file mode 100644
index 0000000000..1e576bdbb8
--- /dev/null
+++ b/src/components/structures/login/LanguageSelector.js
@@ -0,0 +1,38 @@
+/*
+Copyright 2018 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import SdkConfig from "../../../SdkConfig";
+import {getCurrentLanguage} from "../../../languageHandler";
+import SettingsStore, {SettingLevel} from "../../../settings/SettingsStore";
+import PlatformPeg from "../../../PlatformPeg";
+import sdk from '../../../index';
+import React from 'react';
+
+function onChange(newLang) {
+    if (getCurrentLanguage() !== newLang) {
+        SettingsStore.setValue("language", null, SettingLevel.DEVICE, newLang);
+        PlatformPeg.get().reload();
+    }
+}
+
+export default function makeLanguageSelector() {
+    if (SdkConfig.get()['disable_login_language_selector']) return <div />;
+
+    const LanguageDropdown = sdk.getComponent('views.elements.LanguageDropdown');
+    return <div className="mx_Login_language_div">
+        <LanguageDropdown onOptionChange={onChange} className="mx_Login_language" value={getCurrentLanguage()} />
+    </div>;
+}
diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js
index 1332f52f97..60e4e51f04 100644
--- a/src/components/structures/login/Login.js
+++ b/src/components/structures/login/Login.js
@@ -1,6 +1,7 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
 Copyright 2017 Vector Creations Ltd
+Copyright 2018 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -20,12 +21,11 @@ limitations under the License.
 import React from 'react';
 import PropTypes from 'prop-types';
 import { _t } from '../../../languageHandler';
-import * as languageHandler from '../../../languageHandler';
 import sdk from '../../../index';
 import Login from '../../../Login';
-import PlatformPeg from '../../../PlatformPeg';
 import SdkConfig from '../../../SdkConfig';
-import SettingsStore, {SettingLevel} from "../../../settings/SettingsStore";
+import SettingsStore from "../../../settings/SettingsStore";
+import makeLanguageSelector from "./LanguageSelector";
 
 // For validating phone numbers without country codes
 const PHONE_NUMBER_REGEX = /^[0-9\(\)\-\s]*$/;
@@ -370,23 +370,6 @@ module.exports = React.createClass({
         );
     },
 
-    _onLanguageChange: function(newLang) {
-        if (languageHandler.getCurrentLanguage() !== newLang) {
-            SettingsStore.setValue("language", null, SettingLevel.DEVICE, newLang);
-            PlatformPeg.get().reload();
-        }
-    },
-
-    _renderLanguageSetting: function() {
-        const LanguageDropdown = sdk.getComponent('views.elements.LanguageDropdown');
-        return <div className="mx_Login_language_div">
-            <LanguageDropdown onOptionChange={this._onLanguageChange}
-                          className="mx_Login_language"
-                          value={languageHandler.getCurrentLanguage()}
-            />
-        </div>;
-    },
-
     render: function() {
         const Loader = sdk.getComponent("elements.Spinner");
         const LoginPage = sdk.getComponent("login.LoginPage");
@@ -461,7 +444,7 @@ module.exports = React.createClass({
                         </a>
                         { loginAsGuestJsx }
                         { returnToAppJsx }
-                        { !SdkConfig.get().disable_login_language_selector ? this._renderLanguageSetting() : '' }
+                        { makeLanguageSelector() }
                         <LoginFooter />
                     </div>
                 </div>
diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js
index 62a3ee4f68..377cffc576 100644
--- a/src/components/structures/login/Registration.js
+++ b/src/components/structures/login/Registration.js
@@ -1,6 +1,7 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
 Copyright 2017 Vector Creations Ltd
+Copyright 2018 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -29,6 +30,7 @@ import RtsClient from '../../../RtsClient';
 import { _t } from '../../../languageHandler';
 import SdkConfig from '../../../SdkConfig';
 import SettingsStore from "../../../settings/SettingsStore";
+import makeLanguageSelector from "./LanguageSelector";
 
 const MIN_PASSWORD_LENGTH = 6;
 
@@ -432,6 +434,7 @@ module.exports = React.createClass({
                     { signIn }
                     { errorText }
                     { returnToAppJsx }
+                    { makeLanguageSelector() }
                     <LoginFooter />
                 </div>
             </LoginPage>

From f32da97a3abef96808c9c9e60b76559456fad874 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Thu, 21 Jun 2018 14:04:08 +0100
Subject: [PATCH 2/3] delint and run generate-eslint-error-ignore-file

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 .eslintignore.errorfiles                      | 12 ++---
 .../structures/login/ForgotPassword.js        | 14 +++---
 src/components/structures/login/Login.js      | 50 +++++++++----------
 .../structures/login/Registration.js          | 34 +++++--------
 4 files changed, 49 insertions(+), 61 deletions(-)

diff --git a/.eslintignore.errorfiles b/.eslintignore.errorfiles
index 42818244b3..3886b3f728 100644
--- a/.eslintignore.errorfiles
+++ b/.eslintignore.errorfiles
@@ -13,8 +13,6 @@ src/components/structures/HomePage.js
 src/components/structures/LeftPanel.js
 src/components/structures/LoggedInView.js
 src/components/structures/login/ForgotPassword.js
-src/components/structures/login/Login.js
-src/components/structures/login/Registration.js
 src/components/structures/LoginBox.js
 src/components/structures/MessagePanel.js
 src/components/structures/NotificationPanel.js
@@ -26,12 +24,11 @@ src/components/structures/ScrollPanel.js
 src/components/structures/SearchBox.js
 src/components/structures/TimelinePanel.js
 src/components/structures/UploadBar.js
+src/components/structures/UserSettings.js
 src/components/structures/ViewSource.js
 src/components/views/avatars/BaseAvatar.js
-src/components/views/avatars/GroupAvatar.js
 src/components/views/avatars/MemberAvatar.js
 src/components/views/create_room/RoomAlias.js
-src/components/views/dialogs/BugReportDialog.js
 src/components/views/dialogs/ChangelogDialog.js
 src/components/views/dialogs/ChatCreateOrReuseDialog.js
 src/components/views/dialogs/DeactivateAccountDialog.js
@@ -47,6 +44,7 @@ src/components/views/elements/InlineSpinner.js
 src/components/views/elements/MemberEventListSummary.js
 src/components/views/elements/Spinner.js
 src/components/views/elements/TintableSvg.js
+src/components/views/elements/UserInfo.js
 src/components/views/elements/UserSelector.js
 src/components/views/globals/MatrixToolbar.js
 src/components/views/globals/NewVersionBar.js
@@ -65,7 +63,6 @@ src/components/views/room_settings/UrlPreviewSettings.js
 src/components/views/rooms/Autocomplete.js
 src/components/views/rooms/AuxPanel.js
 src/components/views/rooms/EntityTile.js
-src/components/views/rooms/EventTile.js
 src/components/views/rooms/LinkPreviewWidget.js
 src/components/views/rooms/MemberDeviceInfo.js
 src/components/views/rooms/MemberInfo.js
@@ -73,12 +70,11 @@ src/components/views/rooms/MemberList.js
 src/components/views/rooms/MemberTile.js
 src/components/views/rooms/MessageComposer.js
 src/components/views/rooms/MessageComposerInput.js
+src/components/views/rooms/PinnedEventTile.js
 src/components/views/rooms/RoomDropTarget.js
 src/components/views/rooms/RoomList.js
 src/components/views/rooms/RoomPreviewBar.js
 src/components/views/rooms/RoomSettings.js
-src/components/views/rooms/RoomTile.js
-src/components/views/rooms/RoomTooltip.js
 src/components/views/rooms/SearchableEntityList.js
 src/components/views/rooms/SearchBar.js
 src/components/views/rooms/SearchResultTile.js
@@ -92,6 +88,7 @@ src/components/views/settings/DevicesPanel.js
 src/components/views/settings/IntegrationsManager.js
 src/components/views/settings/Notifications.js
 src/ContentMessages.js
+src/GroupAddressPicker.js
 src/HtmlUtils.js
 src/ImageUtils.js
 src/languageHandler.js
@@ -135,6 +132,7 @@ test/components/structures/TimelinePanel-test.js
 test/components/views/dialogs/InteractiveAuthDialog-test.js
 test/components/views/login/RegistrationForm-test.js
 test/components/views/rooms/MessageComposerInput-test.js
+test/components/views/rooms/RoomSettings-test.js
 test/mock-clock.js
 test/notifications/ContentRules-test.js
 test/notifications/PushRuleVectorState-test.js
diff --git a/src/components/structures/login/ForgotPassword.js b/src/components/structures/login/ForgotPassword.js
index cf054a4e6e..bbee4c3207 100644
--- a/src/components/structures/login/ForgotPassword.js
+++ b/src/components/structures/login/ForgotPassword.js
@@ -15,8 +15,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
 import PropTypes from 'prop-types';
 import { _t } from '../../../languageHandler';
@@ -46,6 +44,8 @@ module.exports = React.createClass({
             enteredHomeserverUrl: this.props.customHsUrl || this.props.defaultHsUrl,
             enteredIdentityServerUrl: this.props.customIsUrl || this.props.defaultIsUrl,
             progress: null,
+            password: null,
+            password2: null,
         };
     },
 
@@ -104,7 +104,7 @@ module.exports = React.createClass({
                     </div>,
                 button: _t('Continue'),
                 extraButtons: [
-                    <button className="mx_Dialog_primary"
+                    <button key="export_keys" className="mx_Dialog_primary"
                             onClick={this._onExportE2eKeysClicked}>
                         { _t('Export E2E room keys') }
                     </button>,
@@ -170,7 +170,8 @@ module.exports = React.createClass({
         } else if (this.state.progress === "sent_email") {
             resetPasswordJsx = (
                 <div className="mx_Login_prompt">
-                    { _t("An email has been sent to %(emailAddress)s. Once you've followed the link it contains, click below.", { emailAddress: this.state.email }) }
+                    { _t("An email has been sent to %(emailAddress)s. Once you've followed the link it contains, " +
+                        "click below.", { emailAddress: this.state.email }) }
                     <br />
                     <input className="mx_Login_submit" type="button" onClick={this.onVerify}
                         value={_t('I have verified my email address')} />
@@ -180,14 +181,15 @@ module.exports = React.createClass({
             resetPasswordJsx = (
                 <div className="mx_Login_prompt">
                     <p>{ _t('Your password has been reset') }.</p>
-                    <p>{ _t('You have been logged out of all devices and will no longer receive push notifications. To re-enable notifications, sign in again on each device') }.</p>
+                    <p>{ _t('You have been logged out of all devices and will no longer receive push notifications. ' +
+                        'To re-enable notifications, sign in again on each device') }.</p>
                     <input className="mx_Login_submit" type="button" onClick={this.props.onComplete}
                         value={_t('Return to login screen')} />
                 </div>
             );
         } else {
             let serverConfigSection;
-            if (!SdkConfig.get().disable_custom_urls) {
+            if (!SdkConfig.get()['disable_custom_urls']) {
                 serverConfigSection = (
                     <ServerConfig ref="serverConfig"
                         withToggleButton={true}
diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js
index 60e4e51f04..c4a5b8ba57 100644
--- a/src/components/structures/login/Login.js
+++ b/src/components/structures/login/Login.js
@@ -28,7 +28,7 @@ import SettingsStore from "../../../settings/SettingsStore";
 import makeLanguageSelector from "./LanguageSelector";
 
 // For validating phone numbers without country codes
-const PHONE_NUMBER_REGEX = /^[0-9\(\)\-\s]*$/;
+const PHONE_NUMBER_REGEX = /^[0-9()\-\s]*$/;
 
 /**
  * A wire component which glues together login UI components and Login logic
@@ -113,10 +113,10 @@ module.exports = React.createClass({
 
             // Some error strings only apply for logging in
             const usingEmail = username.indexOf("@") > 0;
-            if (error.httpStatus == 400 && usingEmail) {
+            if (error.httpStatus === 400 && usingEmail) {
                 errorText = _t('This Home Server does not support login using email address.');
             } else if (error.httpStatus === 401 || error.httpStatus === 403) {
-                if (SdkConfig.get().disable_custom_urls) {
+                if (SdkConfig.get()['disable_custom_urls']) {
                     errorText = (
                         <div>
                             <div>{ _t('Incorrect username and/or password.') }</div>
@@ -143,7 +143,7 @@ module.exports = React.createClass({
                 // but the login API gives a 403 https://matrix.org/jira/browse/SYN-744
                 // mentions this (although the bug is for UI auth which is not this)
                 // We treat both as an incorrect password
-                loginIncorrect: error.httpStatus === 401 || error.httpStatus == 403,
+                loginIncorrect: error.httpStatus === 401 || error.httpStatus === 403,
             });
         }).finally(() => {
             if (this._unmounted) {
@@ -231,7 +231,7 @@ module.exports = React.createClass({
         hsUrl = hsUrl || this.state.enteredHomeserverUrl;
         isUrl = isUrl || this.state.enteredIdentityServerUrl;
 
-        const fallbackHsUrl = hsUrl == this.props.defaultHsUrl ? this.props.fallbackHsUrl : null;
+        const fallbackHsUrl = hsUrl === this.props.defaultHsUrl ? this.props.fallbackHsUrl : null;
 
         const loginLogic = new Login(hsUrl, isUrl, fallbackHsUrl, {
             defaultDeviceDisplayName: this.props.defaultDeviceDisplayName,
@@ -310,19 +310,27 @@ module.exports = React.createClass({
                  !this.state.enteredHomeserverUrl.startsWith("http"))
             ) {
                 errorText = <span>
-                    {
-                        _t("Can't connect to homeserver via HTTP when an HTTPS URL is in your browser bar. " +
-                            "Either use HTTPS or <a>enable unsafe scripts</a>.",
-                            {},
-                            { 'a': (sub) => { return <a href="https://www.google.com/search?&q=enable%20unsafe%20scripts">{ sub }</a>; } },
+                    { _t("Can't connect to homeserver via HTTP when an HTTPS URL is in your browser bar. " +
+                        "Either use HTTPS or <a>enable unsafe scripts</a>.", {},
+                        {
+                            'a': (sub) => {
+                                return <a href="https://www.google.com/search?&q=enable%20unsafe%20scripts">
+                                    { sub }
+                                </a>;
+                            },
+                        },
                     ) }
                 </span>;
             } else {
                 errorText = <span>
-                    {
-                        _t("Can't connect to homeserver - please check your connectivity, ensure your <a>homeserver's SSL certificate</a> is trusted, and that a browser extension is not blocking requests.",
-                            {},
-                            { 'a': (sub) => { return <a href={this.state.enteredHomeserverUrl}>{ sub }</a>; } },
+                    { _t("Can't connect to homeserver - please check your connectivity, ensure your " +
+                        "<a>homeserver's SSL certificate</a> is trusted, and that a browser extension " +
+                        "is not blocking requests.", {},
+                        {
+                            'a': (sub) => {
+                                return <a href={this.state.enteredHomeserverUrl}>{ sub }</a>;
+                            },
+                        },
                     ) }
                 </span>;
             }
@@ -386,21 +394,10 @@ module.exports = React.createClass({
                 </a>;
         }
 
-        let returnToAppJsx;
-        /*
-        // with the advent of ILAG I don't think we need this any more
-        if (this.props.onCancelClick) {
-            returnToAppJsx =
-                <a className="mx_Login_create" onClick={this.props.onCancelClick} href="#">
-                    { _t('Return to app') }
-                </a>;
-        }
-        */
-
         let serverConfig;
         let header;
 
-        if (!SdkConfig.get().disable_custom_urls) {
+        if (!SdkConfig.get()['disable_custom_urls']) {
             serverConfig = <ServerConfig ref="serverConfig"
                 withToggleButton={true}
                 customHsUrl={this.props.customHsUrl}
@@ -443,7 +440,6 @@ module.exports = React.createClass({
                             { _t('Create an account') }
                         </a>
                         { loginAsGuestJsx }
-                        { returnToAppJsx }
                         { makeLanguageSelector() }
                         <LoginFooter />
                     </div>
diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js
index 377cffc576..409234e2ed 100644
--- a/src/components/structures/login/Registration.js
+++ b/src/components/structures/login/Registration.js
@@ -23,7 +23,6 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import sdk from '../../../index';
-import ServerConfig from '../../views/login/ServerConfig';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 import RegistrationForm from '../../views/login/RegistrationForm';
 import RtsClient from '../../../RtsClient';
@@ -64,6 +63,12 @@ module.exports = React.createClass({
         onLoginClick: PropTypes.func.isRequired,
         onCancelClick: PropTypes.func,
         onServerConfigChange: PropTypes.func.isRequired,
+
+        rtsClient: PropTypes.shape({
+            getTeamsConfig: PropTypes.func.isRequired,
+            trackReferral: PropTypes.func.isRequired,
+            getTeam: PropTypes.func.isRequired,
+        }),
     },
 
     getInitialState: function() {
@@ -135,7 +140,7 @@ module.exports = React.createClass({
             newState.isUrl = config.isUrl;
         }
         this.props.onServerConfigChange(config);
-        this.setState(newState, function() {
+        this.setState(newState, () => {
             this._replaceClient();
         });
     },
@@ -161,11 +166,11 @@ module.exports = React.createClass({
             let msg = response.message || response.toString();
             // can we give a better error message?
             if (response.required_stages && response.required_stages.indexOf('m.login.msisdn') > -1) {
-                let msisdn_available = false;
+                let msisdnAvailable = false;
                 for (const flow of response.available_flows) {
-                    msisdn_available |= flow.stages.indexOf('m.login.msisdn') > -1;
+                    msisdnAvailable |= flow.stages.indexOf('m.login.msisdn') > -1;
                 }
-                if (!msisdn_available) {
+                if (!msisdnAvailable) {
                     msg = _t('This server does not support authentication with a phone number.');
                 }
             }
@@ -244,7 +249,7 @@ module.exports = React.createClass({
         return matrixClient.getPushers().then((resp)=>{
             const pushers = resp.pushers;
             for (let i = 0; i < pushers.length; ++i) {
-                if (pushers[i].kind == 'email') {
+                if (pushers[i].kind === 'email') {
                     const emailPusher = pushers[i];
                     emailPusher.data = { brand: this.props.brand };
                     matrixClient.setPusher(emailPusher).done(() => {
@@ -269,7 +274,7 @@ module.exports = React.createClass({
                 errMsg = _t('Passwords don\'t match.');
                 break;
             case "RegistrationForm.ERR_PASSWORD_LENGTH":
-                errMsg = _t('Password too short (min %(MIN_PASSWORD_LENGTH)s).', {MIN_PASSWORD_LENGTH: MIN_PASSWORD_LENGTH});
+                errMsg = _t('Password too short (min %(MIN_PASSWORD_LENGTH)s).', {MIN_PASSWORD_LENGTH});
                 break;
             case "RegistrationForm.ERR_EMAIL_INVALID":
                 errMsg = _t('This doesn\'t look like a valid email address.');
@@ -355,7 +360,7 @@ module.exports = React.createClass({
             registerBody = <Spinner />;
         } else {
             let serverConfigSection;
-            if (!SdkConfig.get().disable_custom_urls) {
+            if (!SdkConfig.get()['disable_custom_urls']) {
                 serverConfigSection = (
                     <ServerConfig ref="serverConfig"
                         withToggleButton={true}
@@ -387,18 +392,6 @@ module.exports = React.createClass({
             );
         }
 
-        let returnToAppJsx;
-        /*
-        // with the advent of ILAG I don't think we need this any more
-        if (this.props.onCancelClick) {
-            returnToAppJsx = (
-                <a className="mx_Login_create" onClick={this.props.onCancelClick} href="#">
-                    { _t('Return to app') }
-                </a>
-            );
-        }
-        */
-
         let header;
         let errorText;
         // FIXME: remove hardcoded Status team tweaks at some point
@@ -433,7 +426,6 @@ module.exports = React.createClass({
                     { registerBody }
                     { signIn }
                     { errorText }
-                    { returnToAppJsx }
                     { makeLanguageSelector() }
                     <LoginFooter />
                 </div>

From 548a06cad2a77fbe33ad71b502be52c86fa59beb Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Fri, 22 Jun 2018 14:47:57 +0100
Subject: [PATCH 3/3] use JSX and import via sdk rather than directly

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 src/components/structures/login/ForgotPassword.js   | 5 +++--
 src/components/structures/login/LanguageSelector.js | 2 +-
 src/components/structures/login/Login.js            | 5 +++--
 src/components/structures/login/Registration.js     | 5 +++--
 4 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/structures/login/ForgotPassword.js b/src/components/structures/login/ForgotPassword.js
index bbee4c3207..7e0cd5da8e 100644
--- a/src/components/structures/login/ForgotPassword.js
+++ b/src/components/structures/login/ForgotPassword.js
@@ -24,7 +24,6 @@ import MatrixClientPeg from "../../../MatrixClientPeg";
 import SdkConfig from "../../../SdkConfig";
 
 import PasswordReset from "../../../PasswordReset";
-import makeLanguageSelector from "./LanguageSelector";
 
 module.exports = React.createClass({
     displayName: 'ForgotPassword',
@@ -202,6 +201,8 @@ module.exports = React.createClass({
                 );
             }
 
+            const LanguageSelector = sdk.getComponent('structures.login.LanguageSelector');
+
             resetPasswordJsx = (
             <div>
                 <div className="mx_Login_prompt">
@@ -236,7 +237,7 @@ module.exports = React.createClass({
                     <a className="mx_Login_create" onClick={this.props.onRegisterClick} href="#">
                         { _t('Create an account') }
                     </a>
-                    { makeLanguageSelector() }
+                    <LanguageSelector />
                     <LoginFooter />
                 </div>
             </div>
diff --git a/src/components/structures/login/LanguageSelector.js b/src/components/structures/login/LanguageSelector.js
index 1e576bdbb8..965d8334d9 100644
--- a/src/components/structures/login/LanguageSelector.js
+++ b/src/components/structures/login/LanguageSelector.js
@@ -28,7 +28,7 @@ function onChange(newLang) {
     }
 }
 
-export default function makeLanguageSelector() {
+export default function LanguageSelector() {
     if (SdkConfig.get()['disable_login_language_selector']) return <div />;
 
     const LanguageDropdown = sdk.getComponent('views.elements.LanguageDropdown');
diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js
index c4a5b8ba57..bc04434bb2 100644
--- a/src/components/structures/login/Login.js
+++ b/src/components/structures/login/Login.js
@@ -25,7 +25,6 @@ import sdk from '../../../index';
 import Login from '../../../Login';
 import SdkConfig from '../../../SdkConfig';
 import SettingsStore from "../../../settings/SettingsStore";
-import makeLanguageSelector from "./LanguageSelector";
 
 // For validating phone numbers without country codes
 const PHONE_NUMBER_REGEX = /^[0-9()\-\s]*$/;
@@ -427,6 +426,8 @@ module.exports = React.createClass({
             );
         }
 
+        const LanguageSelector = sdk.getComponent('structures.login.LanguageSelector');
+
         return (
             <LoginPage>
                 <div className="mx_Login_box">
@@ -440,7 +441,7 @@ module.exports = React.createClass({
                             { _t('Create an account') }
                         </a>
                         { loginAsGuestJsx }
-                        { makeLanguageSelector() }
+                        <LanguageSelector />
                         <LoginFooter />
                     </div>
                 </div>
diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js
index 409234e2ed..462063406f 100644
--- a/src/components/structures/login/Registration.js
+++ b/src/components/structures/login/Registration.js
@@ -29,7 +29,6 @@ import RtsClient from '../../../RtsClient';
 import { _t } from '../../../languageHandler';
 import SdkConfig from '../../../SdkConfig';
 import SettingsStore from "../../../settings/SettingsStore";
-import makeLanguageSelector from "./LanguageSelector";
 
 const MIN_PASSWORD_LENGTH = 6;
 
@@ -413,6 +412,8 @@ module.exports = React.createClass({
             );
         }
 
+        const LanguageSelector = sdk.getComponent('structures.login.LanguageSelector');
+
         return (
             <LoginPage>
                 <div className="mx_Login_box">
@@ -426,7 +427,7 @@ module.exports = React.createClass({
                     { registerBody }
                     { signIn }
                     { errorText }
-                    { makeLanguageSelector() }
+                    <LanguageSelector />
                     <LoginFooter />
                 </div>
             </LoginPage>