Step 1: Remove all usage of @replaceableComponent

src/components/views/auth/AuthBody.tsx

@@ -16,9 +16,6 @@ limitations under the License.
 
 import React from 'react';
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
-
-@replaceableComponent("views.auth.AuthBody")
 export default class AuthBody extends React.PureComponent {
     public render(): React.ReactNode {
         return <div className="mx_AuthBody">

src/components/views/auth/AuthFooter.tsx

@@ -19,9 +19,7 @@ limitations under the License.
 import React from 'react';
 
 import { _t } from '../../../languageHandler';
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 
-@replaceableComponent("views.auth.AuthFooter")
 export default class AuthFooter extends React.Component {
     public render(): React.ReactNode {
         return (

src/components/views/auth/AuthHeader.tsx

@@ -17,7 +17,6 @@ limitations under the License.
 
 import React from 'react';
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import AuthHeaderLogo from "./AuthHeaderLogo";
 import LanguageSelector from "./LanguageSelector";
 
@@ -25,7 +24,6 @@ interface IProps {
     disableLanguageSelector?: boolean;
 }
 
-@replaceableComponent("views.auth.AuthHeader")
 export default class AuthHeader extends React.Component<IProps> {
     public render(): React.ReactNode {
         return (

src/components/views/auth/AuthHeaderLogo.tsx

@@ -16,9 +16,6 @@ limitations under the License.
 
 import React from 'react';
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
-
-@replaceableComponent("views.auth.AuthHeaderLogo")
 export default class AuthHeaderLogo extends React.PureComponent {
     public render(): React.ReactNode {
         return <div className="mx_AuthHeaderLogo">

src/components/views/auth/AuthPage.tsx

@@ -18,10 +18,8 @@ limitations under the License.
 
 import React from 'react';
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import AuthFooter from "./AuthFooter";
 
-@replaceableComponent("views.auth.AuthPage")
 export default class AuthPage extends React.PureComponent {
     public render(): React.ReactNode {
         return (

src/components/views/auth/CaptchaForm.tsx

@@ -18,7 +18,6 @@ import React, { createRef } from 'react';
 import { logger } from "matrix-js-sdk/src/logger";
 
 import { _t } from '../../../languageHandler';
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 
 const DIV_ID = 'mx_recaptcha';
 
@@ -35,7 +34,6 @@ interface ICaptchaFormState {
 /**
  * A pure UI component which displays a captcha form.
  */
-@replaceableComponent("views.auth.CaptchaForm")
 export default class CaptchaForm extends React.Component<ICaptchaFormProps, ICaptchaFormState> {
     static defaultProps = {
         onCaptchaResponse: () => {},

src/components/views/auth/CompleteSecurityBody.tsx

@@ -16,9 +16,6 @@ limitations under the License.
 
 import React from 'react';
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
-
-@replaceableComponent("views.auth.CompleteSecurityBody")
 export default class CompleteSecurityBody extends React.PureComponent {
     public render(): React.ReactNode {
         return <div className="mx_CompleteSecurityBody">

src/components/views/auth/CountryDropdown.tsx

@@ -19,7 +19,6 @@ import React from 'react';
 import { COUNTRIES, getEmojiFlag, PhoneNumberCountryDefinition } from '../../../phonenumber';
 import SdkConfig from "../../../SdkConfig";
 import { _t } from "../../../languageHandler";
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import Dropdown from "../elements/Dropdown";
 
 const COUNTRIES_BY_ISO2 = {};
@@ -53,7 +52,6 @@ interface IState {
     defaultCountry: PhoneNumberCountryDefinition;
 }
 
-@replaceableComponent("views.auth.CountryDropdown")
 export default class CountryDropdown extends React.Component<IProps, IState> {
     constructor(props: IProps) {
         super(props);

src/components/views/auth/EmailField.tsx

@@ -16,7 +16,6 @@ limitations under the License.
 
 import React, { PureComponent, RefCallback, RefObject } from "react";
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import Field, { IInputProps } from "../elements/Field";
 import { _t, _td } from "../../../languageHandler";
 import withValidation, { IFieldState, IValidationResult } from "../elements/Validation";
@@ -39,7 +38,6 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
     onValidate?(result: IValidationResult): void;
 }
 
-@replaceableComponent("views.auth.EmailField")
 class EmailField extends PureComponent<IProps> {
     static defaultProps = {
         label: _td("Email"),

src/components/views/auth/InteractiveAuthEntryComponents.tsx

@@ -24,7 +24,6 @@ import { _t } from '../../../languageHandler';
 import SettingsStore from "../../../settings/SettingsStore";
 import AccessibleButton from "../elements/AccessibleButton";
 import Spinner from "../elements/Spinner";
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import { LocalisedPolicy, Policies } from '../../../Terms';
 import Field from '../elements/Field';
 import CaptchaForm from "./CaptchaForm";
@@ -93,7 +92,6 @@ interface IPasswordAuthEntryState {
     password: string;
 }
 
-@replaceableComponent("views.auth.PasswordAuthEntry")
 export class PasswordAuthEntry extends React.Component<IAuthEntryProps, IPasswordAuthEntryState> {
     static LOGIN_TYPE = AuthType.Password;
 
@@ -191,7 +189,6 @@ interface IRecaptchaAuthEntryProps extends IAuthEntryProps {
 }
 /* eslint-enable camelcase */
 
-@replaceableComponent("views.auth.RecaptchaAuthEntry")
 export class RecaptchaAuthEntry extends React.Component<IRecaptchaAuthEntryProps> {
     static LOGIN_TYPE = AuthType.Recaptcha;
 
@@ -262,7 +259,6 @@ interface ITermsAuthEntryState {
     errorText?: string;
 }
 
-@replaceableComponent("views.auth.TermsAuthEntry")
 export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITermsAuthEntryState> {
     static LOGIN_TYPE = AuthType.Terms;
 
@@ -409,7 +405,6 @@ interface IEmailIdentityAuthEntryProps extends IAuthEntryProps {
     };
 }
 
-@replaceableComponent("views.auth.EmailIdentityAuthEntry")
 export class EmailIdentityAuthEntry extends React.Component<IEmailIdentityAuthEntryProps> {
     static LOGIN_TYPE = AuthType.Email;
 
@@ -472,7 +467,6 @@ interface IMsisdnAuthEntryState {
     errorText: string;
 }
 
-@replaceableComponent("views.auth.MsisdnAuthEntry")
 export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsisdnAuthEntryState> {
     static LOGIN_TYPE = AuthType.Msisdn;
 
@@ -623,7 +617,6 @@ interface ISSOAuthEntryState {
     attemptFailed: boolean;
 }
 
-@replaceableComponent("views.auth.SSOAuthEntry")
 export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEntryState> {
     static LOGIN_TYPE = AuthType.Sso;
     static UNSTABLE_LOGIN_TYPE = AuthType.SsoUnstable;
@@ -743,7 +736,6 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
     }
 }
 
-@replaceableComponent("views.auth.FallbackAuthEntry")
 export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
     private popupWindow: Window;
     private fallbackButton = createRef<HTMLButtonElement>();

src/components/views/auth/PassphraseConfirmField.tsx

@@ -16,7 +16,6 @@ limitations under the License.
 
 import React, { PureComponent, RefCallback, RefObject } from "react";
 
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import Field, { IInputProps } from "../elements/Field";
 import withValidation, { IFieldState, IValidationResult } from "../elements/Validation";
 import { _t, _td } from "../../../languageHandler";
@@ -35,7 +34,6 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
     onValidate?(result: IValidationResult);
 }
 
-@replaceableComponent("views.auth.EmailField")
 class PassphraseConfirmField extends PureComponent<IProps> {
     static defaultProps = {
         label: _td("Confirm password"),

src/components/views/auth/PassphraseField.tsx

@@ -22,7 +22,6 @@ import SdkConfig from "../../../SdkConfig";
 import withValidation, { IFieldState, IValidationResult } from "../elements/Validation";
 import { _t, _td } from "../../../languageHandler";
 import Field, { IInputProps } from "../elements/Field";
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 
 interface IProps extends Omit<IInputProps, "onValidate"> {
     autoFocus?: boolean;
@@ -41,7 +40,6 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
     onValidate?(result: IValidationResult);
 }
 
-@replaceableComponent("views.auth.PassphraseField")
 class PassphraseField extends PureComponent<IProps> {
     static defaultProps = {
         label: _td("Password"),

src/components/views/auth/PasswordLogin.tsx

@@ -24,7 +24,6 @@ import AccessibleButton from "../elements/AccessibleButton";
 import withValidation, { IValidationResult } from "../elements/Validation";
 import Field from "../elements/Field";
 import CountryDropdown from "./CountryDropdown";
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import EmailField from "./EmailField";
 
 // For validating phone numbers without country codes
@@ -66,7 +65,6 @@ enum LoginField {
  * A pure UI component which displays a username/password form.
  * The email/username/phone fields are fully-controlled, the password field is not.
  */
-@replaceableComponent("views.auth.PasswordLogin")
 export default class PasswordLogin extends React.PureComponent<IProps, IState> {
     static defaultProps = {
         onUsernameChanged: function() {},

src/components/views/auth/RegistrationForm.tsx

@@ -31,7 +31,6 @@ import EmailField from "./EmailField";
 import PassphraseField from "./PassphraseField";
 import Field from '../elements/Field';
 import RegistrationEmailPromptDialog from '../dialogs/RegistrationEmailPromptDialog';
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import CountryDropdown from "./CountryDropdown";
 import PassphraseConfirmField from "./PassphraseConfirmField";
 
@@ -92,7 +91,6 @@ interface IState {
 /*
  * A pure UI component which displays a registration form.
  */
-@replaceableComponent("views.auth.RegistrationForm")
 export default class RegistrationForm extends React.PureComponent<IProps, IState> {
     static defaultProps = {
         onValidationChange: logger.error,

src/components/views/auth/Welcome.tsx

@@ -23,7 +23,6 @@ import AuthPage from "./AuthPage";
 import { _td } from "../../../languageHandler";
 import SettingsStore from "../../../settings/SettingsStore";
 import { UIFeature } from "../../../settings/UIFeature";
-import { replaceableComponent } from "../../../utils/replaceableComponent";
 import LanguageSelector from "./LanguageSelector";
 
 // translatable strings for Welcome pages
@@ -33,7 +32,6 @@ interface IProps {
 
 }
 
-@replaceableComponent("views.auth.Welcome")
 export default class Welcome extends React.PureComponent<IProps> {
     public render(): React.ReactNode {
         // FIXME: Using an import will result in wrench-element-tests failures