Enable @typescript-eslint/explicit-member-accessibility on /src (#9785)

* Enable `@typescript-eslint/explicit-member-accessibility` on /src

* Prettier

.eslintrc.js

@@ -102,7 +102,6 @@ module.exports = {
             rules: {
                 // temporary disabled
                 "@typescript-eslint/explicit-function-return-type": "off",
-                "@typescript-eslint/explicit-member-accessibility": "off",
 
                 // Things we do that break the ideal style
                 "prefer-promise-reject-errors": "off",
@@ -157,6 +156,14 @@ module.exports = {
                 "@typescript-eslint/no-var-requires": "off",
             },
         },
+        {
+            files: ["test/**/*.{ts,tsx}", "cypress/**/*.ts"],
+            rules: {
+                // We don't need super strict typing in test utilities
+                "@typescript-eslint/explicit-function-return-type": "off",
+                "@typescript-eslint/explicit-member-accessibility": "off",
+            },
+        },
     ],
     settings: {
         react: {

src/@types/polyfill.ts

@@ -48,7 +48,7 @@ export function polyfillTouchEvent() {
             public get scale(): number {
                 return 0.0;
             }
-            constructor(eventType: string, params?: any) {
+            public constructor(eventType: string, params?: any) {
                 super(eventType, params);
             }
         };

src/@types/worker-loader.d.ts

@@ -16,7 +16,7 @@ limitations under the License.
 
 declare module "*.worker.ts" {
     class WebpackWorker extends Worker {
-        constructor();
+        public constructor();
     }
 
     export default WebpackWorker;

src/AddThreepid.ts

@@ -47,7 +47,7 @@ export default class AddThreepid {
     private clientSecret: string;
     private bind: boolean;
 
-    constructor() {
+    public constructor() {
         this.clientSecret = MatrixClientPeg.get().generateClientSecret();
     }
 

src/AsyncWrapper.tsx

@@ -47,7 +47,7 @@ export default class AsyncWrapper extends React.Component<IProps, IState> {
         error: null,
     };
 
-    componentDidMount() {
+    public componentDidMount() {
         // XXX: temporary logging to try to diagnose
         // https://github.com/vector-im/element-web/issues/3148
         logger.log("Starting load of AsyncWrapper for modal");
@@ -69,7 +69,7 @@ export default class AsyncWrapper extends React.Component<IProps, IState> {
             });
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.unmounted = true;
     }
 
@@ -77,7 +77,7 @@ export default class AsyncWrapper extends React.Component<IProps, IState> {
         this.props.onFinished(false);
     };
 
-    render() {
+    public render() {
         if (this.state.component) {
             const Component = this.state.component;
             return <Component {...this.props} />;

src/BasePlatform.ts

@@ -69,7 +69,7 @@ export default abstract class BasePlatform {
     protected notificationCount = 0;
     protected errorDidOccur = false;
 
-    constructor() {
+    public constructor() {
         dis.register(this.onAction);
         this.startUpdateCheck = this.startUpdateCheck.bind(this);
     }

src/BlurhashEncoder.ts

@@ -35,7 +35,7 @@ export class BlurhashEncoder {
     private seq = 0;
     private pendingDeferredMap = new Map<number, IDeferred<string>>();
 
-    constructor() {
+    public constructor() {
         this.worker = new BlurhashWorker();
         this.worker.onmessage = this.onMessage;
     }

src/ContentMessages.ts

@@ -598,7 +598,7 @@ export default class ContentMessages {
             });
     }
 
-    static sharedInstance() {
+    public static sharedInstance() {
         if (window.mxContentMessages === undefined) {
             window.mxContentMessages = new ContentMessages();
         }

src/DecryptionFailureTracker.ts

@@ -23,7 +23,7 @@ import { PosthogAnalytics } from "./PosthogAnalytics";
 export class DecryptionFailure {
     public readonly ts: number;
 
-    constructor(public readonly failedEventId: string, public readonly errorCode: string) {
+    public constructor(public readonly failedEventId: string, public readonly errorCode: string) {
         this.ts = Date.now();
     }
 }
@@ -87,14 +87,14 @@ export class DecryptionFailureTracker {
     public trackInterval: number = null;
 
     // Spread the load on `Analytics` by tracking at a low frequency, `TRACK_INTERVAL_MS`.
-    static TRACK_INTERVAL_MS = 60000;
+    public static TRACK_INTERVAL_MS = 60000;
 
     // Call `checkFailures` every `CHECK_INTERVAL_MS`.
-    static CHECK_INTERVAL_MS = 5000;
+    public static CHECK_INTERVAL_MS = 5000;
 
     // Give events a chance to be decrypted by waiting `GRACE_PERIOD_MS` before counting
     // the failure in `failureCounts`.
-    static GRACE_PERIOD_MS = 4000;
+    public static GRACE_PERIOD_MS = 4000;
 
     /**
      * Create a new DecryptionFailureTracker.

src/HtmlUtils.tsx

@@ -354,7 +354,7 @@ const topicSanitizeHtmlParams: IExtendedSanitizeOptions = {
 };
 
 abstract class BaseHighlighter<T extends React.ReactNode> {
-    constructor(public highlightClass: string, public highlightLink: string) {}
+    public constructor(public highlightClass: string, public highlightLink: string) {}
 
     /**
      * apply the highlights to a section of text

src/IdentityAuthClient.tsx

@@ -44,7 +44,7 @@ export default class IdentityAuthClient {
      * When provided, this class will operate solely within memory, refusing to
      * persist any information such as tokens. Default null (not provided).
      */
-    constructor(identityUrl?: string) {
+    public constructor(identityUrl?: string) {
         if (identityUrl) {
             // XXX: We shouldn't have to create a whole new MatrixClient just to
             // do identity server auth. The functions don't take an identity URL

src/KeyBindingsManager.ts

@@ -105,7 +105,7 @@ export class KeyBindingsManager {
      * To overwrite the default key bindings add a new providers before the default provider, e.g. a provider for
      * customized key bindings.
      */
-    bindingsProviders: IKeyBindingsProvider[] = [defaultBindingsProvider];
+    public bindingsProviders: IKeyBindingsProvider[] = [defaultBindingsProvider];
 
     /**
      * Finds a matching KeyAction for a given KeyboardEvent
@@ -124,56 +124,56 @@ export class KeyBindingsManager {
         return undefined;
     }
 
-    getMessageComposerAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getMessageComposerAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getMessageComposerBindings),
             ev,
         );
     }
 
-    getAutocompleteAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getAutocompleteAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getAutocompleteBindings),
             ev,
         );
     }
 
-    getRoomListAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getRoomListAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getRoomListBindings),
             ev,
         );
     }
 
-    getRoomAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getRoomAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getRoomBindings),
             ev,
         );
     }
 
-    getNavigationAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getNavigationAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getNavigationBindings),
             ev,
         );
     }
 
-    getAccessibilityAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getAccessibilityAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getAccessibilityBindings),
             ev,
         );
     }
 
-    getCallAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getCallAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getCallBindings),
             ev,
         );
     }
 
-    getLabsAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
+    public getLabsAction(ev: KeyboardEvent | React.KeyboardEvent): KeyBindingAction | undefined {
         return this.getAction(
             this.bindingsProviders.map((it) => it.getLabsBindings),
             ev,

src/Login.ts

@@ -37,7 +37,7 @@ export default class Login {
     private defaultDeviceDisplayName: string;
     private tempClient: MatrixClient;
 
-    constructor(hsUrl: string, isUrl: string, fallbackHsUrl?: string, opts?: ILoginOptions) {
+    public constructor(hsUrl: string, isUrl: string, fallbackHsUrl?: string, opts?: ILoginOptions) {
         this.hsUrl = hsUrl;
         this.isUrl = isUrl;
         this.fallbackHsUrl = fallbackHsUrl;

src/Markdown.ts

@@ -117,7 +117,7 @@ export default class Markdown {
     private input: string;
     private parsed: commonmark.Node;
 
-    constructor(input: string) {
+    public constructor(input: string) {
         this.input = input;
 
         const parser = new commonmark.Parser();
@@ -234,7 +234,7 @@ export default class Markdown {
         return parsed;
     }
 
-    isPlainText(): boolean {
+    public isPlainText(): boolean {
         const walker = this.parsed.walker();
 
         let ev: commonmark.NodeWalkingStep;
@@ -257,7 +257,7 @@ export default class Markdown {
         return true;
     }
 
-    toHTML({ externalLinks = false } = {}): string {
+    public toHTML({ externalLinks = false } = {}): string {
         const renderer = new commonmark.HtmlRenderer({
             safe: false,
 
@@ -344,7 +344,7 @@ export default class Markdown {
      * N.B. this does **NOT** render arbitrary MD to plain text - only MD
      * which has no formatting.  Otherwise it emits HTML(!).
      */
-    toPlaintext(): string {
+    public toPlaintext(): string {
         const renderer = new commonmark.HtmlRenderer({ safe: false });
 
         renderer.paragraph = function (node: commonmark.Node, entering: boolean) {

src/NodeAnimator.tsx

@@ -47,7 +47,7 @@ export default class NodeAnimator extends React.Component<IProps> {
         startStyles: [],
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.updateChildren(this.props.children);

src/PasswordReset.ts

@@ -39,7 +39,7 @@ export default class PasswordReset {
      * @param {string} homeserverUrl The URL to the HS which has the account to reset.
      * @param {string} identityUrl The URL to the IS which has linked the email -> mxid mapping.
      */
-    constructor(homeserverUrl: string, identityUrl: string) {
+    public constructor(homeserverUrl: string, identityUrl: string) {
         this.client = createClient({
             baseUrl: homeserverUrl,
             idBaseUrl: identityUrl,

src/PosthogAnalytics.ts

@@ -146,7 +146,7 @@ export class PosthogAnalytics {
         return this._instance;
     }
 
-    constructor(private readonly posthog: PostHog) {
+    public constructor(private readonly posthog: PostHog) {
         const posthogConfig = SdkConfig.getObject("posthog");
         if (posthogConfig) {
             this.posthog.init(posthogConfig.get("project_api_key"), {

src/PosthogTrackers.ts

@@ -107,20 +107,20 @@ export default class PosthogTrackers {
 }
 
 export class PosthogScreenTracker extends PureComponent<{ screenName: ScreenName }> {
-    componentDidMount() {
+    public componentDidMount() {
         PosthogTrackers.instance.trackOverride(this.props.screenName);
     }
 
-    componentDidUpdate() {
+    public componentDidUpdate() {
         // We do not clear the old override here so that we do not send the non-override screen as a transition
         PosthogTrackers.instance.trackOverride(this.props.screenName);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         PosthogTrackers.instance.clearOverride(this.props.screenName);
     }
 
-    render() {
+    public render() {
         return null; // no need to render anything, we just need to hook into the React lifecycle
     }
 }

src/ScalarAuthClient.ts

@@ -36,7 +36,7 @@ export default class ScalarAuthClient {
     private termsInteractionCallback: TermsInteractionCallback;
     private isDefaultManager: boolean;
 
-    constructor(private apiUrl: string, private uiUrl: string) {
+    public constructor(private apiUrl: string, private uiUrl: string) {
         this.scalarToken = null;
         // `undefined` to allow `startTermsFlow` to fallback to a default
         // callback if this is unset.
@@ -72,22 +72,22 @@ export default class ScalarAuthClient {
         return this.readTokenFromStore();
     }
 
-    setTermsInteractionCallback(callback) {
+    public setTermsInteractionCallback(callback) {
         this.termsInteractionCallback = callback;
     }
 
-    connect(): Promise<void> {
+    public connect(): Promise<void> {
         return this.getScalarToken().then((tok) => {
             this.scalarToken = tok;
         });
     }
 
-    hasCredentials(): boolean {
+    public hasCredentials(): boolean {
         return this.scalarToken != null; // undef or null
     }
 
     // Returns a promise that resolves to a scalar_token string
-    getScalarToken(): Promise<string> {
+    public getScalarToken(): Promise<string> {
         const token = this.readToken();
 
         if (!token) {
@@ -169,7 +169,7 @@ export default class ScalarAuthClient {
             });
     }
 
-    registerForToken(): Promise<string> {
+    public registerForToken(): Promise<string> {
         // Get openid bearer token from the HS as the first part of our dance
         return MatrixClientPeg.get()
             .getOpenIdToken()
@@ -256,7 +256,7 @@ export default class ScalarAuthClient {
         }
     }
 
-    getScalarInterfaceUrlForRoom(room: Room, screen: string, id: string): string {
+    public getScalarInterfaceUrlForRoom(room: Room, screen: string, id: string): string {
         const roomId = room.roomId;
         const roomName = room.name;
         let url = this.uiUrl;
@@ -273,7 +273,7 @@ export default class ScalarAuthClient {
         return url;
     }
 
-    getStarterLink(starterLinkUrl: string): string {
+    public getStarterLink(starterLinkUrl: string): string {
         return starterLinkUrl + "?scalar_token=" + encodeURIComponent(this.scalarToken);
     }
 }

src/SecurityManager.ts

@@ -67,7 +67,7 @@ export function isSecretStorageBeingAccessed(): boolean {
 }
 
 export class AccessCancelledError extends Error {
-    constructor() {
+    public constructor() {
         super("Secret storage access canceled");
     }
 }

src/SendHistoryManager.ts

@@ -27,12 +27,12 @@ interface IHistoryItem {
 }
 
 export default class SendHistoryManager {
-    history: Array<IHistoryItem> = [];
-    prefix: string;
-    lastIndex = 0; // used for indexing the storage
-    currentIndex = 0; // used for indexing the loaded validated history Array
+    public history: Array<IHistoryItem> = [];
+    public prefix: string;
+    public lastIndex = 0; // used for indexing the storage
+    public currentIndex = 0; // used for indexing the loaded validated history Array
 
-    constructor(roomId: string, prefix: string) {
+    public constructor(roomId: string, prefix: string) {
         this.prefix = prefix + roomId;
 
         // TODO: Performance issues?
@@ -53,14 +53,14 @@ export default class SendHistoryManager {
         this.currentIndex = this.lastIndex + 1;
     }
 
-    static createItem(model: EditorModel, replyEvent?: MatrixEvent): IHistoryItem {
+    public static createItem(model: EditorModel, replyEvent?: MatrixEvent): IHistoryItem {
         return {
             parts: model.serializeParts(),
             replyEventId: replyEvent ? replyEvent.getId() : undefined,
         };
     }
 
-    save(editorModel: EditorModel, replyEvent?: MatrixEvent) {
+    public save(editorModel: EditorModel, replyEvent?: MatrixEvent) {
         const item = SendHistoryManager.createItem(editorModel, replyEvent);
         this.history.push(item);
         this.currentIndex = this.history.length;
@@ -68,7 +68,7 @@ export default class SendHistoryManager {
         sessionStorage.setItem(`${this.prefix}[${this.lastIndex}]`, JSON.stringify(item));
     }
 
-    getItem(offset: number): IHistoryItem {
+    public getItem(offset: number): IHistoryItem {
         this.currentIndex = clamp(this.currentIndex + offset, 0, this.history.length - 1);
         return this.history[this.currentIndex];
     }

src/SlashCommands.tsx

@@ -138,7 +138,7 @@ export class Command {
     public readonly analyticsName?: SlashCommandEvent["command"];
     private readonly _isEnabled?: () => boolean;
 
-    constructor(opts: ICommandOpts) {
+    public constructor(opts: ICommandOpts) {
         this.command = opts.command;
         this.aliases = opts.aliases || [];
         this.args = opts.args || "";

src/Terms.ts

@@ -34,7 +34,7 @@ export class Service {
      * @param {string} baseUrl The Base URL of the service (ie. before '/_matrix')
      * @param {string} accessToken The user's access token for the service
      */
-    constructor(public serviceType: SERVICE_TYPES, public baseUrl: string, public accessToken: string) {}
+    public constructor(public serviceType: SERVICE_TYPES, public baseUrl: string, public accessToken: string) {}
 }
 
 export interface LocalisedPolicy {

src/UserActivity.ts

@@ -45,12 +45,12 @@ export default class UserActivity {
     private lastScreenX = 0;
     private lastScreenY = 0;
 
-    constructor(private readonly window: Window, private readonly document: Document) {
+    public constructor(private readonly window: Window, private readonly document: Document) {
         this.activeNowTimeout = new Timer(CURRENTLY_ACTIVE_THRESHOLD_MS);
         this.activeRecentlyTimeout = new Timer(RECENTLY_ACTIVE_THRESHOLD_MS);
     }
 
-    static sharedInstance() {
+    public static sharedInstance() {
         if (window.mxUserActivity === undefined) {
             window.mxUserActivity = new UserActivity(window, document);
         }

src/async-components/views/dialogs/eventindex/DisableEventIndexDialog.tsx

@@ -38,7 +38,7 @@ interface IState {
  * Allows the user to disable the Event Index.
  */
 export default class DisableEventIndexDialog extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.state = {
             disabling: false,

src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.tsx

@@ -43,7 +43,7 @@ interface IState {
  * Allows the user to introspect the event index state and disable it.
  */
 export default class ManageEventIndexDialog extends React.Component<IProps, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -56,7 +56,7 @@ export default class ManageEventIndexDialog extends React.Component<IProps, ISta
         };
     }
 
-    updateCurrentRoom = async (room) => {
+    public updateCurrentRoom = async (room) => {
         const eventIndex = EventIndexPeg.get();
         let stats;
 
@@ -84,7 +84,7 @@ export default class ManageEventIndexDialog extends React.Component<IProps, ISta
         });
     };
 
-    componentWillUnmount(): void {
+    public componentWillUnmount(): void {
         const eventIndex = EventIndexPeg.get();
 
         if (eventIndex !== null) {
@@ -92,7 +92,7 @@ export default class ManageEventIndexDialog extends React.Component<IProps, ISta
         }
     }
 
-    async componentDidMount(): Promise<void> {
+    public async componentDidMount(): Promise<void> {
         let eventIndexSize = 0;
         let crawlingRoomsCount = 0;
         let roomCount = 0;
@@ -141,7 +141,7 @@ export default class ManageEventIndexDialog extends React.Component<IProps, ISta
         SettingsStore.setValue("crawlerSleepTime", null, SettingLevel.DEVICE, e.target.value);
     };
 
-    render() {
+    public render() {
         const brand = SdkConfig.get().brand;
 
         let crawlerState;

src/async-components/views/dialogs/security/CreateKeyBackupDialog.tsx

@@ -67,7 +67,7 @@ export default class CreateKeyBackupDialog extends React.PureComponent<IProps, I
     private recoveryKeyNode = createRef<HTMLElement>();
     private passphraseField = createRef<Field>();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/async-components/views/dialogs/security/CreateSecretStorageDialog.tsx

@@ -104,7 +104,7 @@ export default class CreateSecretStorageDialog extends React.PureComponent<IProp
     private recoveryKeyNode = createRef<HTMLElement>();
     private passphraseField = createRef<Field>();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         let passPhraseKeySelected;

src/async-components/views/dialogs/security/ExportE2eKeysDialog.tsx

@@ -48,7 +48,7 @@ type AnyPassphrase = KeysStartingWith<IState, "passphrase">;
 export default class ExportE2eKeysDialog extends React.Component<IProps, IState> {
     private unmounted = false;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/async-components/views/dialogs/security/ImportE2eKeysDialog.tsx

@@ -57,7 +57,7 @@ export default class ImportE2eKeysDialog extends React.Component<IProps, IState>
     private unmounted = false;
     private file = createRef<HTMLInputElement>();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/audio/Playback.ts

@@ -83,7 +83,7 @@ export class Playback extends EventEmitter implements IDestroyable, PlaybackInte
      * @param {number[]} seedWaveform Optional seed waveform to present until the proper waveform
      * can be calculated. Contains values between zero and one, inclusive.
      */
-    constructor(private buf: ArrayBuffer, seedWaveform = DEFAULT_WAVEFORM) {
+    public constructor(private buf: ArrayBuffer, seedWaveform = DEFAULT_WAVEFORM) {
         super();
         // Capture the file size early as reading the buffer will result in a 0-length buffer left behind
         this.fileSize = this.buf.byteLength;

src/audio/PlaybackQueue.ts

@@ -48,7 +48,7 @@ export class PlaybackQueue {
     private currentPlaybackId: string; // event ID, broken out from above for ease of use
     private recentFullPlays = new Set<string>(); // event IDs
 
-    constructor(private room: Room) {
+    public constructor(private room: Room) {
         this.loadClocks();
 
         SdkContextClass.instance.roomViewStore.addRoomListener(this.room.roomId, (isActive) => {

src/audio/RecorderWorklet.ts

@@ -43,7 +43,7 @@ class MxVoiceWorklet extends AudioWorkletProcessor {
     private nextAmplitudeSecond = 0;
     private amplitudeIndex = 0;
 
-    process(inputs, outputs, parameters) {
+    public process(inputs, outputs, parameters) {
         const currentSecond = roundTimeToTargetFreq(currentTime);
         // We special case the first ping because there's a fairly good chance that we'll miss the zeroth
         // update. Firefox for instance takes 0.06 seconds (roughly) to call this function for the first

src/audio/VoiceMessageRecording.ts

@@ -136,7 +136,7 @@ export class VoiceMessageRecording implements IDestroyable {
         return this.voiceRecording.isSupported;
     }
 
-    destroy(): void {
+    public destroy(): void {
         this.playback?.destroy();
         this.voiceRecording.destroy();
     }

src/autocomplete/AutocompleteProvider.tsx

@@ -36,8 +36,8 @@ export interface IAutocompleteOptions {
 }
 
 export default abstract class AutocompleteProvider {
-    commandRegex: RegExp;
-    forcedCommandRegex: RegExp;
+    public commandRegex: RegExp;
+    public forcedCommandRegex: RegExp;
 
     protected renderingType: TimelineRenderingType = TimelineRenderingType.Room;
 
@@ -59,7 +59,7 @@ export default abstract class AutocompleteProvider {
         }
     }
 
-    destroy() {
+    public destroy() {
         // stub
     }
 
@@ -70,7 +70,7 @@ export default abstract class AutocompleteProvider {
      * @param {boolean} force True if the user is forcing completion
      * @return {object} { command, range } where both objects fields are null if no match
      */
-    getCurrentCommand(query: string, selection: ISelectionRange, force = false) {
+    public getCurrentCommand(query: string, selection: ISelectionRange, force = false) {
         let commandRegex = this.commandRegex;
 
         if (force && this.shouldForceComplete()) {
@@ -106,19 +106,19 @@ export default abstract class AutocompleteProvider {
         };
     }
 
-    abstract getCompletions(
+    public abstract getCompletions(
         query: string,
         selection: ISelectionRange,
         force: boolean,
         limit: number,
     ): Promise<ICompletion[]>;
 
-    abstract getName(): string;
+    public abstract getName(): string;
 
-    abstract renderCompletions(completions: React.ReactNode[]): React.ReactNode | null;
+    public abstract renderCompletions(completions: React.ReactNode[]): React.ReactNode | null;
 
     // Whether we should provide completions even if triggered forcefully, without a sigil.
-    shouldForceComplete(): boolean {
+    public shouldForceComplete(): boolean {
         return false;
     }
 }

src/autocomplete/Autocompleter.ts

@@ -59,23 +59,23 @@ export interface IProviderCompletions {
 }
 
 export default class Autocompleter {
-    room: Room;
-    providers: AutocompleteProvider[];
+    public room: Room;
+    public providers: AutocompleteProvider[];
 
-    constructor(room: Room, renderingType: TimelineRenderingType = TimelineRenderingType.Room) {
+    public constructor(room: Room, renderingType: TimelineRenderingType = TimelineRenderingType.Room) {
         this.room = room;
         this.providers = PROVIDERS.map((Prov) => {
             return new Prov(room, renderingType);
         });
     }
 
-    destroy() {
+    public destroy() {
         this.providers.forEach((p) => {
             p.destroy();
         });
     }
 
-    async getCompletions(
+    public async getCompletions(
         query: string,
         selection: ISelectionRange,
         force = false,

src/autocomplete/CommandProvider.tsx

@@ -31,9 +31,9 @@ import { TimelineRenderingType } from "../contexts/RoomContext";
 const COMMAND_RE = /(^\/\w*)(?: .*)?/g;
 
 export default class CommandProvider extends AutocompleteProvider {
-    matcher: QueryMatcher<Command>;
+    public matcher: QueryMatcher<Command>;
 
-    constructor(room: Room, renderingType?: TimelineRenderingType) {
+    public constructor(room: Room, renderingType?: TimelineRenderingType) {
         super({ commandRegex: COMMAND_RE, renderingType });
         this.matcher = new QueryMatcher(Commands, {
             keys: ["command", "args", "description"],
@@ -42,7 +42,7 @@ export default class CommandProvider extends AutocompleteProvider {
         });
     }
 
-    async getCompletions(
+    public async getCompletions(
         query: string,
         selection: ISelectionRange,
         force?: boolean,
@@ -100,11 +100,11 @@ export default class CommandProvider extends AutocompleteProvider {
             });
     }
 
-    getName() {
+    public getName() {
         return "*️⃣ " + _t("Commands");
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill"

src/autocomplete/EmojiProvider.tsx

@@ -72,11 +72,11 @@ function colonsTrimmed(str: string): string {
 }
 
 export default class EmojiProvider extends AutocompleteProvider {
-    matcher: QueryMatcher<ISortedEmoji>;
-    nameMatcher: QueryMatcher<ISortedEmoji>;
+    public matcher: QueryMatcher<ISortedEmoji>;
+    public nameMatcher: QueryMatcher<ISortedEmoji>;
     private readonly recentlyUsed: IEmoji[];
 
-    constructor(room: Room, renderingType?: TimelineRenderingType) {
+    public constructor(room: Room, renderingType?: TimelineRenderingType) {
         super({ commandRegex: EMOJI_REGEX, renderingType });
         this.matcher = new QueryMatcher<ISortedEmoji>(SORTED_EMOJI, {
             keys: [],
@@ -93,7 +93,7 @@ export default class EmojiProvider extends AutocompleteProvider {
         this.recentlyUsed = Array.from(new Set(recent.get().map(getEmojiFromUnicode).filter(Boolean)));
     }
 
-    async getCompletions(
+    public async getCompletions(
         query: string,
         selection: ISelectionRange,
         force?: boolean,
@@ -154,11 +154,11 @@ export default class EmojiProvider extends AutocompleteProvider {
         return [];
     }
 
-    getName() {
+    public getName() {
         return "😃 " + _t("Emoji");
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill"

src/autocomplete/NotifProvider.tsx

@@ -28,11 +28,16 @@ import { TimelineRenderingType } from "../contexts/RoomContext";
 const AT_ROOM_REGEX = /@\S*/g;
 
 export default class NotifProvider extends AutocompleteProvider {
-    constructor(public room: Room, renderingType?: TimelineRenderingType) {
+    public constructor(public room: Room, renderingType?: TimelineRenderingType) {
         super({ commandRegex: AT_ROOM_REGEX, renderingType });
     }
 
-    async getCompletions(query: string, selection: ISelectionRange, force = false, limit = -1): Promise<ICompletion[]> {
+    public async getCompletions(
+        query: string,
+        selection: ISelectionRange,
+        force = false,
+        limit = -1,
+    ): Promise<ICompletion[]> {
         const client = MatrixClientPeg.get();
 
         if (!this.room.currentState.mayTriggerNotifOfType("room", client.credentials.userId)) return [];
@@ -60,11 +65,11 @@ export default class NotifProvider extends AutocompleteProvider {
         return [];
     }
 
-    getName() {
+    public getName() {
         return "❗️ " + _t("Room Notification");
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill mx_Autocomplete_Completion_container_truncate"

src/autocomplete/QueryMatcher.ts

@@ -49,7 +49,7 @@ export default class QueryMatcher<T extends {}> {
     private _options: IOptions<T>;
     private _items: Map<string, { object: T; keyWeight: number }[]>;
 
-    constructor(objects: T[], options: IOptions<T> = { keys: [] }) {
+    public constructor(objects: T[], options: IOptions<T> = { keys: [] }) {
         this._options = options;
 
         this.setObjects(objects);
@@ -61,7 +61,7 @@ export default class QueryMatcher<T extends {}> {
         }
     }
 
-    setObjects(objects: T[]) {
+    public setObjects(objects: T[]) {
         this._items = new Map();
 
         for (const object of objects) {
@@ -96,7 +96,7 @@ export default class QueryMatcher<T extends {}> {
         }
     }
 
-    match(query: string, limit = -1): T[] {
+    public match(query: string, limit = -1): T[] {
         query = this.processQuery(query);
         if (this._options.shouldMatchWordsOnly) {
             query = query.replace(/[^\w]/g, "");

src/autocomplete/RoomProvider.tsx

@@ -48,7 +48,7 @@ function matcherObject(room: Room, displayedAlias: string, matchName = "") {
 export default class RoomProvider extends AutocompleteProvider {
     protected matcher: QueryMatcher<Room>;
 
-    constructor(room: Room, renderingType?: TimelineRenderingType) {
+    public constructor(room: Room, renderingType?: TimelineRenderingType) {
         super({ commandRegex: ROOM_REGEX, renderingType });
         this.matcher = new QueryMatcher([], {
             keys: ["displayedAlias", "matchName"],
@@ -62,7 +62,12 @@ export default class RoomProvider extends AutocompleteProvider {
         return cli.getVisibleRooms().filter((r) => !r.isSpaceRoom());
     }
 
-    async getCompletions(query: string, selection: ISelectionRange, force = false, limit = -1): Promise<ICompletion[]> {
+    public async getCompletions(
+        query: string,
+        selection: ISelectionRange,
+        force = false,
+        limit = -1,
+    ): Promise<ICompletion[]> {
         let completions = [];
         const { command, range } = this.getCurrentCommand(query, selection, force);
         if (command) {
@@ -118,11 +123,11 @@ export default class RoomProvider extends AutocompleteProvider {
         return completions;
     }
 
-    getName() {
+    public getName() {
         return _t("Rooms");
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill mx_Autocomplete_Completion_container_truncate"

src/autocomplete/SpaceProvider.tsx

@@ -27,11 +27,11 @@ export default class SpaceProvider extends RoomProvider {
             .filter((r) => r.isSpaceRoom());
     }
 
-    getName() {
+    public getName() {
         return _t("Spaces");
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill mx_Autocomplete_Completion_container_truncate"

src/autocomplete/UserProvider.tsx

@@ -43,11 +43,11 @@ const USER_REGEX = /\B@\S*/g;
 const FORCED_USER_REGEX = /[^/,:; \t\n]\S*/g;
 
 export default class UserProvider extends AutocompleteProvider {
-    matcher: QueryMatcher<RoomMember>;
-    users: RoomMember[];
-    room: Room;
+    public matcher: QueryMatcher<RoomMember>;
+    public users: RoomMember[];
+    public room: Room;
 
-    constructor(room: Room, renderingType?: TimelineRenderingType) {
+    public constructor(room: Room, renderingType?: TimelineRenderingType) {
         super({
             commandRegex: USER_REGEX,
             forcedCommandRegex: FORCED_USER_REGEX,
@@ -64,7 +64,7 @@ export default class UserProvider extends AutocompleteProvider {
         MatrixClientPeg.get().on(RoomStateEvent.Update, this.onRoomStateUpdate);
     }
 
-    destroy() {
+    public destroy() {
         if (MatrixClientPeg.get()) {
             MatrixClientPeg.get().removeListener(RoomEvent.Timeline, this.onRoomTimeline);
             MatrixClientPeg.get().removeListener(RoomStateEvent.Update, this.onRoomStateUpdate);
@@ -101,7 +101,7 @@ export default class UserProvider extends AutocompleteProvider {
         this.users = null;
     };
 
-    async getCompletions(
+    public async getCompletions(
         rawQuery: string,
         selection: ISelectionRange,
         force = false,
@@ -146,7 +146,7 @@ export default class UserProvider extends AutocompleteProvider {
         return completions;
     }
 
-    getName(): string {
+    public getName(): string {
         return _t("Users");
     }
 
@@ -167,7 +167,7 @@ export default class UserProvider extends AutocompleteProvider {
         this.matcher.setObjects(this.users);
     }
 
-    onUserSpoke(user: RoomMember) {
+    public onUserSpoke(user: RoomMember) {
         if (!this.users) return;
         if (!user) return;
         if (user.userId === MatrixClientPeg.get().credentials.userId) return;
@@ -182,7 +182,7 @@ export default class UserProvider extends AutocompleteProvider {
         this.matcher.setObjects(this.users);
     }
 
-    renderCompletions(completions: React.ReactNode[]): React.ReactNode {
+    public renderCompletions(completions: React.ReactNode[]): React.ReactNode {
         return (
             <div
                 className="mx_Autocomplete_Completion_container_pill"
@@ -194,7 +194,7 @@ export default class UserProvider extends AutocompleteProvider {
         );
     }
 
-    shouldForceComplete(): boolean {
+    public shouldForceComplete(): boolean {
         return true;
     }
 }

src/components/structures/AutoHideScrollbar.tsx

@@ -33,7 +33,7 @@ export type IProps<T extends keyof JSX.IntrinsicElements> = DynamicHtmlElementPr
 };
 
 export default class AutoHideScrollbar<T extends keyof JSX.IntrinsicElements> extends React.Component<IProps<T>> {
-    static defaultProps = {
+    public static defaultProps = {
         element: "div" as keyof ReactHTML,
     };
 

src/components/structures/ContextMenu.tsx

@@ -112,12 +112,12 @@ interface IState {
 export default class ContextMenu extends React.PureComponent<IProps, IState> {
     private readonly initialFocus: HTMLElement;
 
-    static defaultProps = {
+    public static defaultProps = {
         hasBackground: true,
         managed: true,
     };
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {
@@ -447,7 +447,7 @@ export default class ContextMenu extends React.PureComponent<IProps, IState> {
         );
     }
 
-    render(): React.ReactChild {
+    public render(): React.ReactChild {
         if (this.props.mountAsChild) {
             // Render as a child of the current parent
             return this.renderMenu();

src/components/structures/EmbeddedPage.tsx

@@ -48,7 +48,7 @@ export default class EmbeddedPage extends React.PureComponent<IProps, IState> {
     private unmounted = false;
     private dispatcherRef: string = null;
 
-    constructor(props: IProps, context: typeof MatrixClientContext) {
+    public constructor(props: IProps, context: typeof MatrixClientContext) {
         super(props, context);
 
         this.state = {

src/components/structures/FilePanel.tsx

@@ -51,7 +51,7 @@ interface IState {
  * Component which shows the filtered file using a TimelinePanel
  */
 class FilePanel extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
 
     // This is used to track if a decrypted event was a live event and should be
     // added to the timeline.
@@ -59,7 +59,7 @@ class FilePanel extends React.Component<IProps, IState> {
     public noRoom: boolean;
     private card = createRef<HTMLDivElement>();
 
-    state = {
+    public state = {
         timelineSet: null,
         narrow: false,
     };

src/components/structures/GenericErrorPage.tsx

@@ -22,7 +22,7 @@ interface IProps {
 }
 
 export default class GenericErrorPage extends React.PureComponent<IProps> {
-    render() {
+    public render() {
         return (
             <div className="mx_GenericErrorPage">
                 <div className="mx_GenericErrorPage_box">

src/components/structures/IndicatorScrollbar.tsx

@@ -47,7 +47,7 @@ export default class IndicatorScrollbar<T extends keyof JSX.IntrinsicElements> e
     private likelyTrackpadUser: boolean = null;
     private checkAgainForTrackpad = 0; // ts in milliseconds to recheck this._likelyTrackpadUser
 
-    constructor(props: IProps<T>) {
+    public constructor(props: IProps<T>) {
         super(props);
 
         this.state = {

src/components/structures/InteractiveAuth.tsx

@@ -99,7 +99,7 @@ export default class InteractiveAuthComponent extends React.Component<IProps, IS
 
     private unmounted = false;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -155,7 +155,7 @@ export default class InteractiveAuthComponent extends React.Component<IProps, IS
             });
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.unmounted = true;
 
         if (this.intervalId !== null) {
@@ -249,7 +249,7 @@ export default class InteractiveAuthComponent extends React.Component<IProps, IS
         this.authLogic.setEmailSid(sid);
     };
 
-    render() {
+    public render() {
         const stage = this.state.authStage;
         if (!stage) {
             if (this.state.busy) {

src/components/structures/LeftPanel.tsx

@@ -71,7 +71,7 @@ export default class LeftPanel extends React.Component<IProps, IState> {
     private focusedElement = null;
     private isDoingStickyHeaders = false;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/structures/LegacyCallEventGrouper.ts

@@ -75,7 +75,7 @@ export default class LegacyCallEventGrouper extends EventEmitter {
     private call: MatrixCall;
     public state: CallState | CustomCallState;
 
-    constructor() {
+    public constructor() {
         super();
 
         LegacyCallHandler.instance.addListener(LegacyCallHandlerEvent.CallsChanged, this.setCall);

src/components/structures/LoggedInView.tsx

@@ -125,7 +125,7 @@ interface IState {
  * Components mounted below us can access the matrix client via the react context.
  */
 class LoggedInView extends React.Component<IProps, IState> {
-    static displayName = "LoggedInView";
+    public static displayName = "LoggedInView";
 
     protected readonly _matrixClient: MatrixClient;
     protected readonly _roomView: React.RefObject<RoomViewType>;
@@ -136,7 +136,7 @@ class LoggedInView extends React.Component<IProps, IState> {
     protected backgroundImageWatcherRef: string;
     protected resizer: Resizer;
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {
@@ -159,7 +159,7 @@ class LoggedInView extends React.Component<IProps, IState> {
         this.resizeHandler = React.createRef();
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         document.addEventListener("keydown", this.onNativeKeyDown, false);
         LegacyCallHandler.instance.addListener(LegacyCallHandlerEvent.CallState, this.onCallState);
 
@@ -191,7 +191,7 @@ class LoggedInView extends React.Component<IProps, IState> {
         this.refreshBackgroundImage();
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         document.removeEventListener("keydown", this.onNativeKeyDown, false);
         LegacyCallHandler.instance.removeListener(LegacyCallHandlerEvent.CallState, this.onCallState);
         this._matrixClient.removeListener(ClientEvent.AccountData, this.onAccountData);
@@ -621,7 +621,7 @@ class LoggedInView extends React.Component<IProps, IState> {
         }
     };
 
-    render() {
+    public render() {
         let pageElement;
 
         switch (this.props.page_type) {

src/components/structures/MatrixChat.tsx

@@ -210,9 +210,9 @@ interface IState {
 }
 
 export default class MatrixChat extends React.PureComponent<IProps, IState> {
-    static displayName = "MatrixChat";
+    public static displayName = "MatrixChat";
 
-    static defaultProps = {
+    public static defaultProps = {
         realQueryParams: {},
         startingFragmentQueryParams: {},
         config: {},
@@ -237,7 +237,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
     private readonly fontWatcher: FontWatcher;
     private readonly stores: SdkContextClass;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.stores = SdkContextClass.instance;
         this.stores.constructEagerStores();
@@ -417,7 +417,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         window.addEventListener("resize", this.onWindowResized);
     }
 
-    componentDidUpdate(prevProps, prevState) {
+    public componentDidUpdate(prevProps, prevState) {
         if (this.shouldTrackPageChange(prevState, this.state)) {
             const durationMs = this.stopPageChangeTimer();
             PosthogTrackers.instance.trackPageChange(this.state.view, this.state.page_type, durationMs);
@@ -428,7 +428,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         Lifecycle.stopMatrixClient();
         dis.unregister(this.dispatcherRef);
         this.themeWatcher.stop();
@@ -2016,7 +2016,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         return fragmentAfterLogin;
     }
 
-    render() {
+    public render() {
         const fragmentAfterLogin = this.getFragmentAfterLogin();
         let view = null;
 

src/components/structures/MessagePanel.tsx

@@ -214,10 +214,10 @@ interface IReadReceiptForUser {
 /* (almost) stateless UI component which builds the event tiles in the room timeline.
  */
 export default class MessagePanel extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
-    static defaultProps = {
+    public static defaultProps = {
         disableGrouping: false,
     };
 
@@ -272,7 +272,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
     // A map to allow groupers to maintain consistent keys even if their first event is uprooted due to back-pagination.
     public grouperKeyMap = new WeakMap<MatrixEvent, string>();
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {
@@ -296,19 +296,19 @@ export default class MessagePanel extends React.Component<IProps, IState> {
         );
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.calculateRoomMembersCount();
         this.props.room?.currentState.on(RoomStateEvent.Update, this.calculateRoomMembersCount);
         this.isMounted = true;
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.isMounted = false;
         this.props.room?.currentState.off(RoomStateEvent.Update, this.calculateRoomMembersCount);
         SettingsStore.unwatchSetting(this.showTypingNotificationsWatcherRef);
     }
 
-    componentDidUpdate(prevProps, prevState) {
+    public componentDidUpdate(prevProps, prevState) {
         if (prevProps.layout !== this.props.layout) {
             this.calculateRoomMembersCount();
         }
@@ -982,7 +982,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
         }
     }
 
-    render() {
+    public render() {
         let topSpinner;
         let bottomSpinner;
         if (this.props.backPaginating) {
@@ -1057,14 +1057,14 @@ export default class MessagePanel extends React.Component<IProps, IState> {
 }
 
 abstract class BaseGrouper {
-    static canStartGroup = (panel: MessagePanel, ev: MatrixEvent): boolean => true;
+    public static canStartGroup = (panel: MessagePanel, ev: MatrixEvent): boolean => true;
 
     public events: MatrixEvent[] = [];
     // events that we include in the group but then eject out and place above the group.
     public ejectedEvents: MatrixEvent[] = [];
     public readMarker: ReactNode;
 
-    constructor(
+    public constructor(
         public readonly panel: MessagePanel,
         public readonly event: MatrixEvent,
         public readonly prevEvent: MatrixEvent,
@@ -1097,7 +1097,7 @@ abstract class BaseGrouper {
 // Grouping only events sent by the same user that sent the `m.room.create` and only until
 // the first non-state event, beacon_info event or membership event which is not regarding the sender of the `m.room.create` event
 class CreationGrouper extends BaseGrouper {
-    static canStartGroup = function (panel: MessagePanel, ev: MatrixEvent): boolean {
+    public static canStartGroup = function (panel: MessagePanel, ev: MatrixEvent): boolean {
         return ev.getType() === EventType.RoomCreate;
     };
 
@@ -1231,7 +1231,7 @@ class CreationGrouper extends BaseGrouper {
 
 // Wrap consecutive grouped events in a ListSummary
 class MainGrouper extends BaseGrouper {
-    static canStartGroup = function (panel: MessagePanel, ev: MatrixEvent): boolean {
+    public static canStartGroup = function (panel: MessagePanel, ev: MatrixEvent): boolean {
         if (!panel.shouldShowEvent(ev)) return false;
 
         if (ev.isState() && groupedStateEvents.includes(ev.getType() as EventType)) {
@@ -1249,7 +1249,7 @@ class MainGrouper extends BaseGrouper {
         return false;
     };
 
-    constructor(
+    public constructor(
         public readonly panel: MessagePanel,
         public readonly event: MatrixEvent,
         public readonly prevEvent: MatrixEvent,

src/components/structures/NotificationPanel.tsx

@@ -38,11 +38,11 @@ interface IState {
  * Component which shows the global notification list using a TimelinePanel
  */
 export default class NotificationPanel extends React.PureComponent<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
 
     private card = React.createRef<HTMLDivElement>();
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -54,7 +54,7 @@ export default class NotificationPanel extends React.PureComponent<IProps, IStat
         this.setState({ narrow });
     };
 
-    render() {
+    public render() {
         const emptyState = (
             <div className="mx_RightPanel_empty mx_NotificationPanel_empty">
                 <h2>{_t("You're all caught up")}</h2>

src/components/structures/RightPanel.tsx

@@ -60,10 +60,10 @@ interface IState {
 }
 
 export default class RightPanel extends React.Component<IProps, IState> {
-    static contextType = MatrixClientContext;
+    public static contextType = MatrixClientContext;
     public context!: React.ContextType<typeof MatrixClientContext>;
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.state = {

src/components/structures/RoomSearch.tsx

@@ -33,7 +33,7 @@ interface IProps {
 export default class RoomSearch extends React.PureComponent<IProps> {
     private readonly dispatcherRef: string;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.dispatcherRef = defaultDispatcher.register(this.onAction);

src/components/structures/RoomStatusBar.tsx

@@ -89,7 +89,7 @@ export default class RoomStatusBar extends React.PureComponent<IProps, IState> {
     private unmounted = false;
     public static contextType = MatrixClientContext;
 
-    constructor(props: IProps, context: typeof MatrixClientContext) {
+    public constructor(props: IProps, context: typeof MatrixClientContext) {
         super(props, context);
 
         this.state = {

src/components/structures/RoomView.tsx

@@ -371,10 +371,10 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
     private messagePanel: TimelinePanel;
     private roomViewBody = createRef<HTMLDivElement>();
 
-    static contextType = SDKContext;
+    public static contextType = SDKContext;
     public context!: React.ContextType<typeof SDKContext>;
 
-    constructor(props: IRoomProps, context: React.ContextType<typeof SDKContext>) {
+    public constructor(props: IRoomProps, context: React.ContextType<typeof SDKContext>) {
         super(props, context);
 
         const llMembers = context.client.hasLazyLoadMembersEnabled();
@@ -838,7 +838,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         return isManuallyShown && widgets.length > 0;
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.onRoomViewStoreUpdate(true);
 
         const call = this.getCallForRoom();
@@ -851,7 +851,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         window.addEventListener("beforeunload", this.onPageUnload);
     }
 
-    shouldComponentUpdate(nextProps, nextState) {
+    public shouldComponentUpdate(nextProps, nextState) {
         const hasPropsDiff = objectHasDiff(this.props, nextProps);
 
         const { upgradeRecommendation, ...state } = this.state;
@@ -864,7 +864,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         return hasPropsDiff || hasStateDiff;
     }
 
-    componentDidUpdate() {
+    public componentDidUpdate() {
         // Note: We check the ref here with a flag because componentDidMount, despite
         // documentation, does not define our messagePanel ref. It looks like our spinner
         // in render() prevents the ref from being set on first mount, so we try and
@@ -877,7 +877,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         // set a boolean to say we've been unmounted, which any pending
         // promises can use to throw away their results.
         //
@@ -1804,13 +1804,13 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         return this.context.client.getRoom(createEvent.getContent()["predecessor"]["room_id"]);
     }
 
-    getHiddenHighlightCount() {
+    public getHiddenHighlightCount() {
         const oldRoom = this.getOldRoom();
         if (!oldRoom) return 0;
         return oldRoom.getUnreadNotificationCount(NotificationCountType.Highlight);
     }
 
-    onHiddenHighlightsClick = () => {
+    public onHiddenHighlightsClick = () => {
         const oldRoom = this.getOldRoom();
         if (!oldRoom) return;
         dis.dispatch<ViewRoomPayload>({
@@ -1869,7 +1869,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
         );
     }
 
-    render() {
+    public render() {
         if (this.state.room instanceof LocalRoom) {
             if (this.state.room.state === LocalRoomState.CREATING) {
                 return this.renderLocalRoomCreateLoader();

src/components/structures/ScrollPanel.tsx

@@ -195,7 +195,7 @@ export default class ScrollPanel extends React.Component<IProps> {
     private heightUpdateInProgress: boolean;
     private divScroll: HTMLDivElement;
 
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
 
         this.props.resizeNotifier?.on("middlePanelResizedNoisy", this.onResize);

src/components/structures/SearchBox.tsx

@@ -45,7 +45,7 @@ interface IState {
 export default class SearchBox extends React.Component<IProps, IState> {
     private search = createRef<HTMLInputElement>();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/structures/SpaceRoomView.tsx

@@ -611,13 +611,13 @@ const SpaceSetupPrivateInvite = ({ space, onFinished }) => {
 };
 
 export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
-    static contextType = MatrixClientContext;
+    public static contextType = MatrixClientContext;
     public context!: React.ContextType<typeof MatrixClientContext>;
 
     private readonly creator: string;
     private readonly dispatcherRef: string;
 
-    constructor(props: IProps, context: React.ContextType<typeof MatrixClientContext>) {
+    public constructor(props: IProps, context: React.ContextType<typeof MatrixClientContext>) {
         super(props, context);
 
         let phase = Phase.Landing;
@@ -642,11 +642,11 @@ export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
         RightPanelStore.instance.on(UPDATE_EVENT, this.onRightPanelStoreUpdate);
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.context.on(RoomEvent.MyMembership, this.onMyMembership);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         defaultDispatcher.unregister(this.dispatcherRef);
         RightPanelStore.instance.off(UPDATE_EVENT, this.onRightPanelStoreUpdate);
         this.context.off(RoomEvent.MyMembership, this.onMyMembership);
@@ -794,7 +794,7 @@ export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
         }
     }
 
-    render() {
+    public render() {
         const rightPanel =
             this.state.showRightPanel && this.state.phase === Phase.Landing ? (
                 <RightPanel room={this.props.space} resizeNotifier={this.props.resizeNotifier} />

src/components/structures/TabbedView.tsx

@@ -37,7 +37,7 @@ export class Tab {
      * @param {React.ReactNode} body The JSX for the tab container.
      * @param {string} screenName The screen name to report to Posthog.
      */
-    constructor(
+    public constructor(
         public readonly id: string,
         public readonly label: string,
         public readonly icon: string,
@@ -64,7 +64,7 @@ interface IState {
 }
 
 export default class TabbedView extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         const initialTabIdIsValid = props.tabs.find((tab) => tab.id === props.initialTabId);
@@ -73,7 +73,7 @@ export default class TabbedView extends React.Component<IProps, IState> {
         };
     }
 
-    static defaultProps = {
+    public static defaultProps = {
         tabLocation: TabLocation.LEFT,
     };
 

src/components/structures/ThreadView.tsx

@@ -76,7 +76,7 @@ interface IState {
 }
 
 export default class ThreadView extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
     private dispatcherRef: string;
@@ -84,7 +84,7 @@ export default class ThreadView extends React.Component<IProps, IState> {
     private timelinePanel = createRef<TimelinePanel>();
     private card = createRef<HTMLDivElement>();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         const thread = this.props.room.getThread(this.props.mxEvent.getId());

src/components/structures/TimelinePanel.tsx

@@ -227,13 +227,13 @@ interface IEventIndexOpts {
  * Also responsible for handling and sending read receipts.
  */
 class TimelinePanel extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
     // a map from room id to read marker event timestamp
-    static roomReadMarkerTsMap: Record<string, number> = {};
+    public static roomReadMarkerTsMap: Record<string, number> = {};
 
-    static defaultProps = {
+    public static defaultProps = {
         // By default, disable the timelineCap in favour of unpaginating based on
         // event tile heights. (See _unpaginateEvents)
         timelineCap: Number.MAX_VALUE,
@@ -257,7 +257,7 @@ class TimelinePanel extends React.Component<IProps, IState> {
     // A map of <callId, LegacyCallEventGrouper>
     private callEventGroupers = new Map<string, LegacyCallEventGrouper>();
 
-    constructor(props: IProps, context: React.ContextType<typeof RoomContext>) {
+    public constructor(props: IProps, context: React.ContextType<typeof RoomContext>) {
         super(props, context);
         this.context = context;
 
@@ -360,7 +360,7 @@ class TimelinePanel extends React.Component<IProps, IState> {
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         // set a boolean to say we've been unmounted, which any pending
         // promises can use to throw away their results.
         //
@@ -1883,7 +1883,7 @@ class TimelinePanel extends React.Component<IProps, IState> {
         this.callEventGroupers = buildLegacyCallEventGroupers(this.callEventGroupers, events);
     }
 
-    render() {
+    public render() {
         // just show a spinner while the timeline loads.
         //
         // put it in a div of the right class (mx_RoomView_messagePanel) so

src/components/structures/ToastContainer.tsx

@@ -25,7 +25,7 @@ interface IState {
 }
 
 export default class ToastContainer extends React.Component<{}, IState> {
-    constructor(props, context) {
+    public constructor(props, context) {
         super(props, context);
         this.state = {
             toasts: ToastStore.sharedInstance().getToasts(),
@@ -39,7 +39,7 @@ export default class ToastContainer extends React.Component<{}, IState> {
         ToastStore.sharedInstance().on("update", this.onToastStoreUpdate);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         ToastStore.sharedInstance().removeListener("update", this.onToastStoreUpdate);
     }
 
@@ -50,7 +50,7 @@ export default class ToastContainer extends React.Component<{}, IState> {
         });
     };
 
-    render() {
+    public render() {
         const totalCount = this.state.toasts.length;
         const isStacked = totalCount > 1;
         let toast;

src/components/structures/UploadBar.tsx

@@ -57,7 +57,7 @@ export default class UploadBar extends React.PureComponent<IProps, IState> {
     private dispatcherRef: Optional<string>;
     private mounted = false;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         // Set initial state to any available upload in this room - we might be mounting
@@ -65,12 +65,12 @@ export default class UploadBar extends React.PureComponent<IProps, IState> {
         this.state = this.calculateState();
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.dispatcherRef = dis.register(this.onAction);
         this.mounted = true;
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.mounted = false;
         dis.unregister(this.dispatcherRef!);
     }
@@ -103,7 +103,7 @@ export default class UploadBar extends React.PureComponent<IProps, IState> {
         ContentMessages.sharedInstance().cancelUpload(this.state.currentUpload!);
     };
 
-    render() {
+    public render() {
         if (!this.state.currentFile) {
             return null;
         }

src/components/structures/UserMenu.tsx

@@ -93,7 +93,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
     private buttonRef: React.RefObject<HTMLButtonElement> = createRef();
     private voiceBroadcastRecordingStore = VoiceBroadcastRecordingsStore.instance();
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/structures/UserView.tsx

@@ -41,7 +41,7 @@ interface IState {
 }
 
 export default class UserView extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         this.state = {
             loading: true,

src/components/structures/ViewSource.tsx

@@ -40,7 +40,7 @@ interface IState {
 }
 
 export default class ViewSource extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/structures/auth/CompleteSecurity.tsx

@@ -33,7 +33,7 @@ interface IState {
 }
 
 export default class CompleteSecurity extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
         const store = SetupEncryptionStore.sharedInstance();
         store.on("update", this.onStoreUpdate);

src/components/structures/auth/E2eSetup.tsx

@@ -27,7 +27,7 @@ interface IProps {
 }
 
 export default class E2eSetup extends React.Component<IProps> {
-    render() {
+    public render() {
         return (
             <AuthPage>
                 <CompleteSecurityBody>

src/components/structures/auth/ForgotPassword.tsx

@@ -350,7 +350,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         } as any);
     };
 
-    renderEnterEmail(): JSX.Element {
+    public renderEnterEmail(): JSX.Element {
         return (
             <EnterEmail
                 email={this.state.email}
@@ -364,7 +364,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         );
     }
 
-    async renderConfirmLogoutDevicesDialog(): Promise<boolean> {
+    public async renderConfirmLogoutDevicesDialog(): Promise<boolean> {
         const { finished } = Modal.createDialog<[boolean]>(QuestionDialog, {
             title: _t("Warning!"),
             description: (
@@ -395,7 +395,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         return confirmed;
     }
 
-    renderCheckEmail(): JSX.Element {
+    public renderCheckEmail(): JSX.Element {
         return (
             <CheckEmail
                 email={this.state.email}
@@ -407,7 +407,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         );
     }
 
-    renderSetPassword(): JSX.Element {
+    public renderSetPassword(): JSX.Element {
         const submitButtonChild =
             this.state.phase === Phase.ResettingPassword ? <Spinner w={16} h={16} /> : _t("Reset password");
 
@@ -460,7 +460,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         );
     }
 
-    renderDone() {
+    public renderDone() {
         return (
             <>
                 <CheckboxIcon className="mx_Icon mx_Icon_32 mx_Icon_accent" />
@@ -484,7 +484,7 @@ export default class ForgotPassword extends React.Component<Props, State> {
         );
     }
 
-    render() {
+    public render() {
         let resetPasswordJsx: JSX.Element;
 
         switch (this.state.phase) {

src/components/structures/auth/Login.tsx

@@ -110,7 +110,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
 
     private readonly stepRendererMap: Record<string, () => ReactNode>;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -148,7 +148,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         this.initLoginLogic(this.props.serverConfig);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.unmounted = true;
     }
 
@@ -162,9 +162,9 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         }
     }
 
-    isBusy = () => this.state.busy || this.props.busy;
+    public isBusy = () => this.state.busy || this.props.busy;
 
-    onPasswordLogin = async (username, phoneCountry, phoneNumber, password) => {
+    public onPasswordLogin = async (username, phoneCountry, phoneNumber, password) => {
         if (!this.state.serverIsAlive) {
             this.setState({ busy: true });
             // Do a quick liveliness check on the URLs
@@ -264,11 +264,11 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         );
     };
 
-    onUsernameChanged = (username) => {
+    public onUsernameChanged = (username) => {
         this.setState({ username: username });
     };
 
-    onUsernameBlur = async (username) => {
+    public onUsernameBlur = async (username) => {
         const doWellknownLookup = username[0] === "@";
         this.setState({
             username: username,
@@ -315,23 +315,23 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         }
     };
 
-    onPhoneCountryChanged = (phoneCountry) => {
+    public onPhoneCountryChanged = (phoneCountry) => {
         this.setState({ phoneCountry: phoneCountry });
     };
 
-    onPhoneNumberChanged = (phoneNumber) => {
+    public onPhoneNumberChanged = (phoneNumber) => {
         this.setState({
             phoneNumber: phoneNumber,
         });
     };
 
-    onRegisterClick = (ev) => {
+    public onRegisterClick = (ev) => {
         ev.preventDefault();
         ev.stopPropagation();
         this.props.onRegisterClick();
     };
 
-    onTryRegisterClick = (ev) => {
+    public onTryRegisterClick = (ev) => {
         const hasPasswordFlow = this.state.flows?.find((flow) => flow.type === "m.login.password");
         const ssoFlow = this.state.flows?.find((flow) => flow.type === "m.login.sso" || flow.type === "m.login.cas");
         // If has no password flow but an SSO flow guess that the user wants to register with SSO.
@@ -502,7 +502,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         return errorText;
     }
 
-    renderLoginComponentForFlows() {
+    public renderLoginComponentForFlows() {
         if (!this.state.flows) return null;
 
         // this is the ideal order we want to show the flows in
@@ -553,7 +553,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
         );
     };
 
-    render() {
+    public render() {
         const loader =
             this.isBusy() && !this.state.busyLoggingIn ? (
                 <div className="mx_Login_loader">

src/components/structures/auth/Registration.tsx

@@ -125,7 +125,7 @@ export default class Registration extends React.Component<IProps, IState> {
     // `replaceClient` tracks latest serverConfig to spot when it changes under the async method which fetches flows
     private latestServerConfig: ValidatedServerConfig;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -148,13 +148,13 @@ export default class Registration extends React.Component<IProps, IState> {
         });
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.replaceClient(this.props.serverConfig);
         //triggers a confirmation dialog for data loss before page unloads/refreshes
         window.addEventListener("beforeunload", this.unloadCallback);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         window.removeEventListener("beforeunload", this.unloadCallback);
     }
 
@@ -565,7 +565,7 @@ export default class Registration extends React.Component<IProps, IState> {
         }
     }
 
-    render() {
+    public render() {
         let errorText;
         const err = this.state.errorText;
         if (err) {

src/components/structures/auth/SetupEncryptionBody.tsx

@@ -45,7 +45,7 @@ interface IState {
 }
 
 export default class SetupEncryptionBody extends React.Component<IProps, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
         const store = SetupEncryptionStore.sharedInstance();
         store.on("update", this.onStoreUpdate);

src/components/views/audio_messages/AudioPlayerBase.tsx

@@ -42,7 +42,7 @@ export default abstract class AudioPlayerBase<T extends IProps = IProps> extends
     protected seekRef: RefObject<SeekBar> = createRef();
     protected playPauseRef: RefObject<PlayPauseButton> = createRef();
 
-    constructor(props: T) {
+    public constructor(props: T) {
         super(props);
 
         // Playback instances can be reused in the composer

src/components/views/audio_messages/LiveRecordingClock.tsx

@@ -39,14 +39,14 @@ export default class LiveRecordingClock extends React.PureComponent<IProps, ISta
         () => requestAnimationFrame(() => this.scheduledUpdate.trigger()),
     );
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             seconds: 0,
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.recorder.liveData.onUpdate((update: IRecordingUpdate) => {
             this.seconds = update.timeSeconds;
             this.scheduledUpdate.mark();

src/components/views/audio_messages/LiveRecordingWaveform.tsx

@@ -44,14 +44,14 @@ export default class LiveRecordingWaveform extends React.PureComponent<IProps, I
         () => requestAnimationFrame(() => this.scheduledUpdate.trigger()),
     );
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             waveform: arraySeed(0, RECORDING_PLAYBACK_SAMPLES),
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.recorder.liveData.onUpdate((update: IRecordingUpdate) => {
             // The incoming data is between zero and one, so we don't need to clamp/rescale it.
             this.waveform = arrayFastResample(Array.from(update.waveform), RECORDING_PLAYBACK_SAMPLES);

src/components/views/audio_messages/SeekBar.tsx

@@ -56,7 +56,7 @@ export default class SeekBar extends React.PureComponent<IProps, IState> {
         disabled: false,
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/auth/CaptchaForm.tsx

@@ -34,14 +34,14 @@ interface ICaptchaFormState {
  * A pure UI component which displays a captcha form.
  */
 export default class CaptchaForm extends React.Component<ICaptchaFormProps, ICaptchaFormState> {
-    static defaultProps = {
+    public static defaultProps = {
         onCaptchaResponse: () => {},
     };
 
     private captchaWidgetId?: string;
     private recaptchaContainer = createRef<HTMLDivElement>();
 
-    constructor(props: ICaptchaFormProps) {
+    public constructor(props: ICaptchaFormProps) {
         super(props);
 
         this.state = {
@@ -49,7 +49,7 @@ export default class CaptchaForm extends React.Component<ICaptchaFormProps, ICap
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         // Just putting a script tag into the returned jsx doesn't work, annoyingly,
         // so we do this instead.
         if (this.isRecaptchaReady()) {
@@ -69,7 +69,7 @@ export default class CaptchaForm extends React.Component<ICaptchaFormProps, ICap
         }
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         this.resetRecaptcha();
     }
 
@@ -122,7 +122,7 @@ export default class CaptchaForm extends React.Component<ICaptchaFormProps, ICap
         }
     }
 
-    render() {
+    public render() {
         let error = null;
         if (this.state.errorText) {
             error = <div className="error">{this.state.errorText}</div>;

src/components/views/auth/CountryDropdown.tsx

@@ -53,7 +53,7 @@ interface IState {
 }
 
 export default class CountryDropdown extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         let defaultCountry: PhoneNumberCountryDefinition = COUNTRIES[0];

src/components/views/auth/EmailField.tsx

@@ -39,7 +39,7 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
 }
 
 class EmailField extends PureComponent<IProps> {
-    static defaultProps = {
+    public static defaultProps = {
         label: _td("Email"),
         labelRequired: _td("Enter email address"),
         labelInvalid: _td("Doesn't look like a valid email address"),
@@ -60,7 +60,7 @@ class EmailField extends PureComponent<IProps> {
         ],
     });
 
-    onValidate = async (fieldState: IFieldState) => {
+    public onValidate = async (fieldState: IFieldState) => {
         let validate = this.validate;
         if (this.props.validationRules) {
             validate = this.props.validationRules;
@@ -74,7 +74,7 @@ class EmailField extends PureComponent<IProps> {
         return result;
     };
 
-    render() {
+    public render() {
         return (
             <Field
                 id={this.props.id}

src/components/views/auth/InteractiveAuthEntryComponents.tsx

@@ -98,9 +98,9 @@ interface IPasswordAuthEntryState {
 }
 
 export class PasswordAuthEntry extends React.Component<IAuthEntryProps, IPasswordAuthEntryState> {
-    static LOGIN_TYPE = AuthType.Password;
+    public static LOGIN_TYPE = AuthType.Password;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -108,7 +108,7 @@ export class PasswordAuthEntry extends React.Component<IAuthEntryProps, IPasswor
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
     }
 
@@ -136,7 +136,7 @@ export class PasswordAuthEntry extends React.Component<IAuthEntryProps, IPasswor
         });
     };
 
-    render() {
+    public render() {
         const passwordBoxClass = classNames({
             error: this.props.errorText,
         });
@@ -194,9 +194,9 @@ interface IRecaptchaAuthEntryProps extends IAuthEntryProps {
 /* eslint-enable camelcase */
 
 export class RecaptchaAuthEntry extends React.Component<IRecaptchaAuthEntryProps> {
-    static LOGIN_TYPE = AuthType.Recaptcha;
+    public static LOGIN_TYPE = AuthType.Recaptcha;
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
     }
 
@@ -207,7 +207,7 @@ export class RecaptchaAuthEntry extends React.Component<IRecaptchaAuthEntryProps
         });
     };
 
-    render() {
+    public render() {
         if (this.props.busy) {
             return <Spinner />;
         }
@@ -262,9 +262,9 @@ interface ITermsAuthEntryState {
 }
 
 export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITermsAuthEntryState> {
-    static LOGIN_TYPE = AuthType.Terms;
+    public static LOGIN_TYPE = AuthType.Terms;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         // example stageParams:
@@ -320,7 +320,7 @@ export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITerms
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
     }
 
@@ -349,7 +349,7 @@ export class TermsAuthEntry extends React.Component<ITermsAuthEntryProps, ITerms
         }
     };
 
-    render() {
+    public render() {
         if (this.props.busy) {
             return <Spinner />;
         }
@@ -423,9 +423,9 @@ export class EmailIdentityAuthEntry extends React.Component<
     IEmailIdentityAuthEntryProps,
     IEmailIdentityAuthEntryState
 > {
-    static LOGIN_TYPE = AuthType.Email;
+    public static LOGIN_TYPE = AuthType.Email;
 
-    constructor(props: IEmailIdentityAuthEntryProps) {
+    public constructor(props: IEmailIdentityAuthEntryProps) {
         super(props);
 
         this.state = {
@@ -434,11 +434,11 @@ export class EmailIdentityAuthEntry extends React.Component<
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
     }
 
-    render() {
+    public render() {
         let errorSection;
         // ignore the error when errcode is M_UNAUTHORIZED as we expect that error until the link is clicked.
         if (this.props.errorText && this.props.errorCode !== "M_UNAUTHORIZED") {
@@ -549,13 +549,13 @@ interface IMsisdnAuthEntryState {
 }
 
 export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsisdnAuthEntryState> {
-    static LOGIN_TYPE = AuthType.Msisdn;
+    public static LOGIN_TYPE = AuthType.Msisdn;
 
     private submitUrl: string;
     private sid: string;
     private msisdn: string;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -565,7 +565,7 @@ export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsi
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
 
         this.setState({ requestingToken: true });
@@ -646,7 +646,7 @@ export class MsisdnAuthEntry extends React.Component<IMsisdnAuthEntryProps, IMsi
         }
     };
 
-    render() {
+    public render() {
         if (this.state.requestingToken) {
             return <Spinner />;
         } else {
@@ -704,16 +704,16 @@ interface ISSOAuthEntryState {
 }
 
 export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEntryState> {
-    static LOGIN_TYPE = AuthType.Sso;
-    static UNSTABLE_LOGIN_TYPE = AuthType.SsoUnstable;
+    public static LOGIN_TYPE = AuthType.Sso;
+    public static UNSTABLE_LOGIN_TYPE = AuthType.SsoUnstable;
 
-    static PHASE_PREAUTH = 1; // button to start SSO
-    static PHASE_POSTAUTH = 2; // button to confirm SSO completed
+    public static PHASE_PREAUTH = 1; // button to start SSO
+    public static PHASE_POSTAUTH = 2; // button to confirm SSO completed
 
     private ssoUrl: string;
     private popupWindow: Window;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         // We actually send the user through fallback auth so we don't have to
@@ -729,11 +729,11 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
         };
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(SSOAuthEntry.PHASE_PREAUTH);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         window.removeEventListener("message", this.onReceiveMessage);
         if (this.popupWindow) {
             this.popupWindow.close();
@@ -770,7 +770,7 @@ export class SSOAuthEntry extends React.Component<ISSOAuthEntryProps, ISSOAuthEn
         this.props.submitAuthDict({});
     };
 
-    render() {
+    public render() {
         let continueButton = null;
         const cancelButton = (
             <AccessibleButton
@@ -825,7 +825,7 @@ export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
     private popupWindow: Window;
     private fallbackButton = createRef<HTMLButtonElement>();
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         // we have to make the user click a button, as browsers will block
@@ -834,11 +834,11 @@ export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
         window.addEventListener("message", this.onReceiveMessage);
     }
 
-    componentDidMount() {
+    public componentDidMount() {
         this.props.onPhaseChange(DEFAULT_PHASE);
     }
 
-    componentWillUnmount() {
+    public componentWillUnmount() {
         window.removeEventListener("message", this.onReceiveMessage);
         if (this.popupWindow) {
             this.popupWindow.close();
@@ -865,7 +865,7 @@ export class FallbackAuthEntry extends React.Component<IAuthEntryProps> {
         }
     };
 
-    render() {
+    public render() {
         let errorSection;
         if (this.props.errorText) {
             errorSection = (

src/components/views/auth/PassphraseConfirmField.tsx

@@ -35,7 +35,7 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
 }
 
 class PassphraseConfirmField extends PureComponent<IProps> {
-    static defaultProps = {
+    public static defaultProps = {
         label: _td("Confirm password"),
         labelRequired: _td("Confirm password"),
         labelInvalid: _td("Passwords don't match"),
@@ -65,7 +65,7 @@ class PassphraseConfirmField extends PureComponent<IProps> {
         return result;
     };
 
-    render() {
+    public render() {
         return (
             <Field
                 id={this.props.id}

src/components/views/auth/PassphraseField.tsx

@@ -41,7 +41,7 @@ interface IProps extends Omit<IInputProps, "onValidate"> {
 }
 
 class PassphraseField extends PureComponent<IProps> {
-    static defaultProps = {
+    public static defaultProps = {
         label: _td("Password"),
         labelEnterPassword: _td("Enter password"),
         labelStrongPassword: _td("Nice, strong password!"),
@@ -94,7 +94,7 @@ class PassphraseField extends PureComponent<IProps> {
         ],
     });
 
-    onValidate = async (fieldState: IFieldState) => {
+    public onValidate = async (fieldState: IFieldState) => {
         const result = await this.validate(fieldState);
         if (this.props.onValidate) {
             this.props.onValidate(result);
@@ -102,7 +102,7 @@ class PassphraseField extends PureComponent<IProps> {
         return result;
     };
 
-    render() {
+    public render() {
         return (
             <Field
                 id={this.props.id}

src/components/views/auth/PasswordLogin.tsx

@@ -66,7 +66,7 @@ enum LoginField {
  * The email/username/phone fields are fully-controlled, the password field is not.
  */
 export default class PasswordLogin extends React.PureComponent<IProps, IState> {
-    static defaultProps = {
+    public static defaultProps = {
         onUsernameChanged: function () {},
         onUsernameBlur: function () {},
         onPhoneCountryChanged: function () {},
@@ -75,7 +75,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
         disableSubmit: false,
     };
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             // Field error codes by field ID
@@ -363,7 +363,7 @@ export default class PasswordLogin extends React.PureComponent<IProps, IState> {
         }
     }
 
-    render() {
+    public render() {
         let forgotPasswordJsx;
 
         if (this.props.onForgotPasswordClick) {

src/components/views/auth/RegistrationForm.tsx

@@ -95,12 +95,12 @@ interface IState {
  * A pure UI component which displays a registration form.
  */
 export default class RegistrationForm extends React.PureComponent<IProps, IState> {
-    static defaultProps = {
+    public static defaultProps = {
         onValidationChange: logger.error,
         canSubmit: true,
     };
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -468,7 +468,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
         );
     }
 
-    renderPasswordConfirm() {
+    public renderPasswordConfirm() {
         return (
             <PassphraseConfirmField
                 id="mx_RegistrationForm_passwordConfirm"
@@ -482,7 +482,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
         );
     }
 
-    renderPhoneNumber() {
+    public renderPhoneNumber() {
         if (!this.showPhoneNumber()) {
             return null;
         }
@@ -508,7 +508,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
         );
     }
 
-    renderUsername() {
+    public renderUsername() {
         return (
             <Field
                 id="mx_RegistrationForm_username"
@@ -524,7 +524,7 @@ export default class RegistrationForm extends React.PureComponent<IProps, IState
         );
     }
 
-    render() {
+    public render() {
         const registerButton = (
             <input className="mx_Login_submit" type="submit" value={_t("Register")} disabled={!this.props.canSubmit} />
         );

src/components/views/avatars/DecoratedRoomAvatar.tsx

@@ -82,7 +82,7 @@ export default class DecoratedRoomAvatar extends React.PureComponent<IProps, ISt
     private isUnmounted = false;
     private isWatchingTimeline = false;
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/avatars/RoomAvatar.tsx

@@ -54,7 +54,7 @@ export default class RoomAvatar extends React.Component<IProps, IState> {
         oobData: {},
     };
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/context_menus/DialpadContextMenu.tsx

@@ -34,7 +34,7 @@ interface IState {
 export default class DialpadContextMenu extends React.Component<IProps, IState> {
     private numberEntryFieldRef: React.RefObject<Field> = createRef();
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {
@@ -42,7 +42,7 @@ export default class DialpadContextMenu extends React.Component<IProps, IState>
         };
     }
 
-    onDigitPress = (digit: string, ev: ButtonEvent) => {
+    public onDigitPress = (digit: string, ev: ButtonEvent) => {
         this.props.call.sendDtmfDigit(digit);
         this.setState({ value: this.state.value + digit });
 
@@ -54,22 +54,22 @@ export default class DialpadContextMenu extends React.Component<IProps, IState>
         }
     };
 
-    onCancelClick = () => {
+    public onCancelClick = () => {
         this.props.onFinished();
     };
 
-    onKeyDown = (ev) => {
+    public onKeyDown = (ev) => {
         // Prevent Backspace and Delete keys from functioning in the entry field
         if (ev.code === "Backspace" || ev.code === "Delete") {
             ev.preventDefault();
         }
     };
 
-    onChange = (ev) => {
+    public onChange = (ev) => {
         this.setState({ value: ev.target.value });
     };
 
-    render() {
+    public render() {
         return (
             <ContextMenu {...this.props}>
                 <div className="mx_DialPadContextMenuWrapper">

src/components/views/context_menus/GenericElementContextMenu.tsx

@@ -29,7 +29,7 @@ interface IProps {
  * menu.
  */
 export default class GenericElementContextMenu extends React.Component<IProps> {
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
     }
 

src/components/views/context_menus/LegacyCallContextMenu.tsx

@@ -26,27 +26,27 @@ interface IProps extends IContextMenuProps {
 }
 
 export default class LegacyCallContextMenu extends React.Component<IProps> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
     }
 
-    onHoldClick = () => {
+    public onHoldClick = () => {
         this.props.call.setRemoteOnHold(true);
         this.props.onFinished();
     };
 
-    onUnholdClick = () => {
+    public onUnholdClick = () => {
         LegacyCallHandler.instance.setActiveCallRoomId(this.props.call.roomId);
 
         this.props.onFinished();
     };
 
-    onTransferClick = () => {
+    public onTransferClick = () => {
         LegacyCallHandler.instance.showTransferDialog(this.props.call);
         this.props.onFinished();
     };
 
-    render() {
+    public render() {
         const holdUnholdCaption = this.props.call.isRemoteOnHold() ? _t("Resume") : _t("Hold");
         const handler = this.props.call.isRemoteOnHold() ? this.onUnholdClick : this.onHoldClick;
 

src/components/views/context_menus/MessageContextMenu.tsx

@@ -135,12 +135,12 @@ interface IState {
 }
 
 export default class MessageContextMenu extends React.Component<IProps, IState> {
-    static contextType = RoomContext;
+    public static contextType = RoomContext;
     public context!: React.ContextType<typeof RoomContext>;
 
     private reactButtonRef = createRef<any>(); // XXX Ref to a functional component
 
-    constructor(props: IProps) {
+    public constructor(props: IProps) {
         super(props);
 
         this.state = {

src/components/views/dialogs/BaseDialog.tsx

@@ -88,7 +88,7 @@ export default class BaseDialog extends React.Component<IProps> {
         fixedWidth: true,
     };
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.matrixClient = MatrixClientPeg.get();

src/components/views/dialogs/BugReportDialog.tsx

@@ -54,7 +54,7 @@ interface IState {
 export default class BugReportDialog extends React.Component<IProps, IState> {
     private unmounted: boolean;
 
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             sendLogs: true,

src/components/views/dialogs/ChangelogDialog.tsx

@@ -30,7 +30,7 @@ interface IProps {
 const REPOS = ["vector-im/element-web", "matrix-org/matrix-react-sdk", "matrix-org/matrix-js-sdk"];
 
 export default class ChangelogDialog extends React.Component<IProps> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
 
         this.state = {};

src/components/views/dialogs/ConfirmAndWaitRedactDialog.tsx

@@ -45,7 +45,7 @@ interface IState {
  * To avoid this, we keep the dialog open as long as /redact is in progress.
  */
 export default class ConfirmAndWaitRedactDialog extends React.PureComponent<IProps, IState> {
-    constructor(props) {
+    public constructor(props) {
         super(props);
         this.state = {
             isRedacting: false,

src/components/views/dialogs/ConfirmRedactDialog.tsx

@@ -31,7 +31,7 @@ interface IProps {
  * A dialog for confirming a redaction.
  */
 export default class ConfirmRedactDialog extends React.Component<IProps> {
-    render() {
+    public render() {
         return (
             <TextInputDialog
                 onFinished={this.props.onFinished}