diff --git a/src/domain/AccountSetupViewModel.js b/src/domain/AccountSetupViewModel.js
index 4ad0d8d5..74d680d0 100644
--- a/src/domain/AccountSetupViewModel.js
+++ b/src/domain/AccountSetupViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "./ViewModel.js";
+import {ViewModel} from "./ViewModel";
 import {KeyType} from "../matrix/ssss/index";
 import {Status} from "./session/settings/KeyBackupViewModel.js";
 
diff --git a/src/domain/LogoutViewModel.js b/src/domain/LogoutViewModel.js
index f22637de..24ca440e 100644
--- a/src/domain/LogoutViewModel.js
+++ b/src/domain/LogoutViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "./ViewModel.js";
+import {ViewModel} from "./ViewModel";
 import {Client} from "../matrix/Client.js";
 
 export class LogoutViewModel extends ViewModel {
diff --git a/src/domain/RootViewModel.js b/src/domain/RootViewModel.js
index 70f5b554..642e43f4 100644
--- a/src/domain/RootViewModel.js
+++ b/src/domain/RootViewModel.js
@@ -20,7 +20,7 @@ import {SessionLoadViewModel} from "./SessionLoadViewModel.js";
 import {LoginViewModel} from "./login/LoginViewModel.js";
 import {LogoutViewModel} from "./LogoutViewModel.js";
 import {SessionPickerViewModel} from "./SessionPickerViewModel.js";
-import {ViewModel} from "./ViewModel.js";
+import {ViewModel} from "./ViewModel";
 
 export class RootViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/SessionLoadViewModel.js b/src/domain/SessionLoadViewModel.js
index 24df2546..b23b54bc 100644
--- a/src/domain/SessionLoadViewModel.js
+++ b/src/domain/SessionLoadViewModel.js
@@ -17,7 +17,7 @@ limitations under the License.
 import {AccountSetupViewModel} from "./AccountSetupViewModel.js";
 import {LoadStatus} from "../matrix/Client.js";
 import {SyncStatus} from "../matrix/Sync.js";
-import {ViewModel} from "./ViewModel.js";
+import {ViewModel} from "./ViewModel";
 
 export class SessionLoadViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/SessionPickerViewModel.js b/src/domain/SessionPickerViewModel.js
index e4bbc7ec..6714e96f 100644
--- a/src/domain/SessionPickerViewModel.js
+++ b/src/domain/SessionPickerViewModel.js
@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 import {SortedArray} from "../observable/index.js";
-import {ViewModel} from "./ViewModel.js";
+import {ViewModel} from "./ViewModel";
 import {avatarInitials, getIdentifierColorNumber} from "./avatar.js";
 
 class SessionItemViewModel extends ViewModel {
diff --git a/src/domain/ViewModel.js b/src/domain/ViewModel.ts
similarity index 65%
rename from src/domain/ViewModel.js
rename to src/domain/ViewModel.ts
index 0c665194..99b23918 100644
--- a/src/domain/ViewModel.js
+++ b/src/domain/ViewModel.ts
@@ -1,5 +1,6 @@
 /*
 Copyright 2020 Bruno Windels <bruno@windels.cloud>
+Copyright 2022 The Matrix.org Foundation C.I.C.
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -21,54 +22,70 @@ limitations under the License.
 import {EventEmitter} from "../utils/EventEmitter";
 import {Disposables} from "../utils/Disposables";
 
-export class ViewModel extends EventEmitter {
-    constructor(options = {}) {
+import type {Disposable} from "../utils/Disposables";
+import type {Platform} from "../platform/web/Platform";
+import type {Clock} from "../platform/web/dom/Clock";
+import type {ILogger} from "../logging/types";
+import type {Navigation} from "./navigation/Navigation";
+import type {URLRouter} from "./navigation/URLRouter";
+
+type Options = {
+    platform: Platform
+    logger: ILogger
+    urlCreator: URLRouter
+    navigation: Navigation
+    emitChange?: (params: any) => void
+}
+
+export class ViewModel<O extends Options = Options> extends EventEmitter<{change: never}> {
+    private disposables?: Disposables;
+    private _isDisposed = false;
+    private _options: O;
+
+    constructor(options: O) {
         super();
-        this.disposables = null;
-        this._isDisposed = false;
         this._options = options;
     }
 
-    childOptions(explicitOptions) {
-        const {navigation, urlCreator, platform} = this._options;
-        return Object.assign({navigation, urlCreator, platform}, explicitOptions);
+    childOptions<T extends Object>(explicitOptions: T): T & Options {
+        return Object.assign({}, this._options, explicitOptions);
     }
 
     // makes it easier to pass through dependencies of a sub-view model
-    getOption(name) {
+    getOption<N extends keyof O>(name: N): O[N]  {
         return this._options[name];
     }
 
-    track(disposable) {
+    track<D extends Disposable>(disposable: D): D {
         if (!this.disposables) {
             this.disposables = new Disposables();
         }
         return this.disposables.track(disposable);
     }
 
-    untrack(disposable) {
+    untrack(disposable: Disposable): undefined {
         if (this.disposables) {
             return this.disposables.untrack(disposable);
         }
-        return null;
+        return undefined;
     }
 
-    dispose() {
+    dispose(): void {
         if (this.disposables) {
             this.disposables.dispose();
         }
         this._isDisposed = true;
     }
 
-    get isDisposed() {
+    get isDisposed(): boolean {
         return this._isDisposed;
     }
 
-    disposeTracked(disposable) {
+    disposeTracked(disposable: Disposable | undefined): undefined {
         if (this.disposables) {
             return this.disposables.disposeTracked(disposable);
         }
-        return null;
+        return undefined;
     }
 
     // TODO: this will need to support binding
@@ -76,7 +93,7 @@ export class ViewModel extends EventEmitter {
     // 
     // translated string should probably always be bindings, unless we're fine with a refresh when changing the language?
     // we probably are, if we're using routing with a url, we could just refresh.
-    i18n(parts, ...expr) {
+    i18n(parts: string[], ...expr: any[]) {
         // just concat for now
         let result = "";
         for (let i = 0; i < parts.length; ++i) {
@@ -88,11 +105,11 @@ export class ViewModel extends EventEmitter {
         return result;
     }
 
-    updateOptions(options) {
+    updateOptions(options: O): void {
         this._options = Object.assign(this._options, options);
     }
 
-    emitChange(changedProps) {
+    emitChange(changedProps: any): void {
         if (this._options.emitChange) {
             this._options.emitChange(changedProps);
         } else {
@@ -100,27 +117,23 @@ export class ViewModel extends EventEmitter {
         }
     }
 
-    get platform() {
+    get platform(): Platform {
         return this._options.platform;
     }
 
-    get clock() {
+    get clock(): Clock {
         return this._options.platform.clock;
     }
 
-    get logger() {
+    get logger(): ILogger {
         return this.platform.logger;
     }
 
-    /**
-     * The url router, only meant to be used to create urls with from view models.
-     * @return {URLRouter}
-     */
-    get urlCreator() {
+    get urlCreator(): URLRouter {
         return this._options.urlCreator;
     }
 
-    get navigation() {
+    get navigation(): Navigation {
         return this._options.navigation;
     }
 }
diff --git a/src/domain/login/CompleteSSOLoginViewModel.js b/src/domain/login/CompleteSSOLoginViewModel.js
index daa2aa9f..d41d53ec 100644
--- a/src/domain/login/CompleteSSOLoginViewModel.js
+++ b/src/domain/login/CompleteSSOLoginViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {LoginFailure} from "../../matrix/Client.js";
 
 export class CompleteSSOLoginViewModel extends ViewModel {
diff --git a/src/domain/login/LoginViewModel.js b/src/domain/login/LoginViewModel.js
index b91df4cc..bf77e624 100644
--- a/src/domain/login/LoginViewModel.js
+++ b/src/domain/login/LoginViewModel.js
@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 import {Client} from "../../matrix/Client.js";
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {PasswordLoginViewModel} from "./PasswordLoginViewModel.js";
 import {StartSSOLoginViewModel} from "./StartSSOLoginViewModel.js";
 import {CompleteSSOLoginViewModel} from "./CompleteSSOLoginViewModel.js";
diff --git a/src/domain/login/PasswordLoginViewModel.js b/src/domain/login/PasswordLoginViewModel.js
index 5fd8271f..7c4ff78a 100644
--- a/src/domain/login/PasswordLoginViewModel.js
+++ b/src/domain/login/PasswordLoginViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {LoginFailure} from "../../matrix/Client.js";
 
 export class PasswordLoginViewModel extends ViewModel {
diff --git a/src/domain/login/StartSSOLoginViewModel.js b/src/domain/login/StartSSOLoginViewModel.js
index 54218d22..dba0bcb5 100644
--- a/src/domain/login/StartSSOLoginViewModel.js
+++ b/src/domain/login/StartSSOLoginViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 
 export class StartSSOLoginViewModel extends ViewModel{
     constructor(options) {
diff --git a/src/domain/session/CreateRoomViewModel.js b/src/domain/session/CreateRoomViewModel.js
index 51a9b7a4..12b4fbd5 100644
--- a/src/domain/session/CreateRoomViewModel.js
+++ b/src/domain/session/CreateRoomViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {imageToInfo} from "./common.js";
 import {RoomType} from "../../matrix/room/common";
 
diff --git a/src/domain/session/RoomGridViewModel.js b/src/domain/session/RoomGridViewModel.js
index d89d821a..a7d19054 100644
--- a/src/domain/session/RoomGridViewModel.js
+++ b/src/domain/session/RoomGridViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {addPanelIfNeeded} from "../navigation/index.js";
 
 function dedupeSparse(roomIds) {
diff --git a/src/domain/session/SessionStatusViewModel.js b/src/domain/session/SessionStatusViewModel.js
index 3f2263ac..8f1d0748 100644
--- a/src/domain/session/SessionStatusViewModel.js
+++ b/src/domain/session/SessionStatusViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {createEnum} from "../../utils/enum";
 import {ConnectionStatus} from "../../matrix/net/Reconnector";
 import {SyncStatus} from "../../matrix/Sync.js";
diff --git a/src/domain/session/SessionViewModel.js b/src/domain/session/SessionViewModel.js
index 24276f42..a67df3a7 100644
--- a/src/domain/session/SessionViewModel.js
+++ b/src/domain/session/SessionViewModel.js
@@ -25,7 +25,7 @@ import {SessionStatusViewModel} from "./SessionStatusViewModel.js";
 import {RoomGridViewModel} from "./RoomGridViewModel.js";
 import {SettingsViewModel} from "./settings/SettingsViewModel.js";
 import {CreateRoomViewModel} from "./CreateRoomViewModel.js";
-import {ViewModel} from "../ViewModel.js";
+import {ViewModel} from "../ViewModel";
 import {RoomViewModelObservable} from "./RoomViewModelObservable.js";
 import {RightPanelViewModel} from "./rightpanel/RightPanelViewModel.js";
 
diff --git a/src/domain/session/leftpanel/BaseTileViewModel.js b/src/domain/session/leftpanel/BaseTileViewModel.js
index b360b1d4..e1d6dfff 100644
--- a/src/domain/session/leftpanel/BaseTileViewModel.js
+++ b/src/domain/session/leftpanel/BaseTileViewModel.js
@@ -16,7 +16,7 @@ limitations under the License.
 */
 
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 const KIND_ORDER = ["roomBeingCreated", "invite", "room"];
 
diff --git a/src/domain/session/leftpanel/LeftPanelViewModel.js b/src/domain/session/leftpanel/LeftPanelViewModel.js
index 843ed1ca..2fd3ca7e 100644
--- a/src/domain/session/leftpanel/LeftPanelViewModel.js
+++ b/src/domain/session/leftpanel/LeftPanelViewModel.js
@@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {RoomTileViewModel} from "./RoomTileViewModel.js";
 import {InviteTileViewModel} from "./InviteTileViewModel.js";
 import {RoomBeingCreatedTileViewModel} from "./RoomBeingCreatedTileViewModel.js";
diff --git a/src/domain/session/rightpanel/MemberDetailsViewModel.js b/src/domain/session/rightpanel/MemberDetailsViewModel.js
index f6cbd747..8ee50030 100644
--- a/src/domain/session/rightpanel/MemberDetailsViewModel.js
+++ b/src/domain/session/rightpanel/MemberDetailsViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {RoomType} from "../../../matrix/room/common";
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
 
diff --git a/src/domain/session/rightpanel/MemberListViewModel.js b/src/domain/session/rightpanel/MemberListViewModel.js
index 5b8bb83e..b75a3d1c 100644
--- a/src/domain/session/rightpanel/MemberListViewModel.js
+++ b/src/domain/session/rightpanel/MemberListViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {MemberTileViewModel} from "./MemberTileViewModel.js";
 import {createMemberComparator} from "./members/comparator.js";
 import {Disambiguator} from "./members/disambiguator.js";
diff --git a/src/domain/session/rightpanel/MemberTileViewModel.js b/src/domain/session/rightpanel/MemberTileViewModel.js
index eac6a6d4..9062ea7d 100644
--- a/src/domain/session/rightpanel/MemberTileViewModel.js
+++ b/src/domain/session/rightpanel/MemberTileViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
 
 export class MemberTileViewModel extends ViewModel {
diff --git a/src/domain/session/rightpanel/RightPanelViewModel.js b/src/domain/session/rightpanel/RightPanelViewModel.js
index 3cfe378b..b4b6b4eb 100644
--- a/src/domain/session/rightpanel/RightPanelViewModel.js
+++ b/src/domain/session/rightpanel/RightPanelViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {RoomDetailsViewModel} from "./RoomDetailsViewModel.js";
 import {MemberListViewModel} from "./MemberListViewModel.js";
 import {MemberDetailsViewModel} from "./MemberDetailsViewModel.js";
diff --git a/src/domain/session/rightpanel/RoomDetailsViewModel.js b/src/domain/session/rightpanel/RoomDetailsViewModel.js
index 5e509fd5..97e8588e 100644
--- a/src/domain/session/rightpanel/RoomDetailsViewModel.js
+++ b/src/domain/session/rightpanel/RoomDetailsViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
 
 export class RoomDetailsViewModel extends ViewModel {
diff --git a/src/domain/session/room/ComposerViewModel.js b/src/domain/session/room/ComposerViewModel.js
index 730e1b20..833b17f5 100644
--- a/src/domain/session/room/ComposerViewModel.js
+++ b/src/domain/session/room/ComposerViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 export class ComposerViewModel extends ViewModel {
     constructor(roomVM) {
diff --git a/src/domain/session/room/InviteViewModel.js b/src/domain/session/room/InviteViewModel.js
index 81a08e44..c2ff74e0 100644
--- a/src/domain/session/room/InviteViewModel.js
+++ b/src/domain/session/room/InviteViewModel.js
@@ -16,7 +16,7 @@ limitations under the License.
 */
 
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 export class InviteViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/session/room/LightboxViewModel.js b/src/domain/session/room/LightboxViewModel.js
index f6da39b0..8ce8757a 100644
--- a/src/domain/session/room/LightboxViewModel.js
+++ b/src/domain/session/room/LightboxViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 export class LightboxViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/session/room/RoomBeingCreatedViewModel.js b/src/domain/session/room/RoomBeingCreatedViewModel.js
index f98c86f9..f5c5d3cd 100644
--- a/src/domain/session/room/RoomBeingCreatedViewModel.js
+++ b/src/domain/session/room/RoomBeingCreatedViewModel.js
@@ -16,7 +16,7 @@ limitations under the License.
 */
 
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 export class RoomBeingCreatedViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js
index 2d10c7ca..b7af00ce 100644
--- a/src/domain/session/room/RoomViewModel.js
+++ b/src/domain/session/room/RoomViewModel.js
@@ -19,7 +19,7 @@ import {TimelineViewModel} from "./timeline/TimelineViewModel.js";
 import {ComposerViewModel} from "./ComposerViewModel.js"
 import {avatarInitials, getIdentifierColorNumber, getAvatarHttpUrl} from "../../avatar.js";
 import {tilesCreator} from "./timeline/tilesCreator.js";
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {imageToInfo} from "../common.js";
 
 export class RoomViewModel extends ViewModel {
diff --git a/src/domain/session/room/UnknownRoomViewModel.js b/src/domain/session/room/UnknownRoomViewModel.js
index e7969298..8bb5fb0a 100644
--- a/src/domain/session/room/UnknownRoomViewModel.js
+++ b/src/domain/session/room/UnknownRoomViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 
 export class UnknownRoomViewModel extends ViewModel {
     constructor(options) {
@@ -55,4 +55,4 @@ export class UnknownRoomViewModel extends ViewModel {
     get kind() {
         return "unknown";
     }
-}
\ No newline at end of file
+}
diff --git a/src/domain/session/room/timeline/TimelineViewModel.js b/src/domain/session/room/timeline/TimelineViewModel.js
index 9c936218..2408146d 100644
--- a/src/domain/session/room/timeline/TimelineViewModel.js
+++ b/src/domain/session/room/timeline/TimelineViewModel.js
@@ -32,7 +32,7 @@ to the room timeline, which unload entries from memory.
 when loading, it just reads events from a sortkey backwards or forwards...
 */
 import {TilesCollection} from "./TilesCollection.js";
-import {ViewModel} from "../../../ViewModel.js";
+import {ViewModel} from "../../../ViewModel";
 
 export class TimelineViewModel extends ViewModel {
     constructor(options) {
diff --git a/src/domain/session/room/timeline/tiles/SimpleTile.js b/src/domain/session/room/timeline/tiles/SimpleTile.js
index 4c1c1de0..3497b689 100644
--- a/src/domain/session/room/timeline/tiles/SimpleTile.js
+++ b/src/domain/session/room/timeline/tiles/SimpleTile.js
@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 import {UpdateAction} from "../UpdateAction.js";
-import {ViewModel} from "../../../../ViewModel.js";
+import {ViewModel} from "../../../../ViewModel";
 import {SendStatus} from "../../../../../matrix/room/sending/PendingEvent.js";
 
 export class SimpleTile extends ViewModel {
diff --git a/src/domain/session/settings/KeyBackupViewModel.js b/src/domain/session/settings/KeyBackupViewModel.js
index b44de7e5..243b0d7c 100644
--- a/src/domain/session/settings/KeyBackupViewModel.js
+++ b/src/domain/session/settings/KeyBackupViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {KeyType} from "../../../matrix/ssss/index";
 import {createEnum} from "../../../utils/enum";
 
diff --git a/src/domain/session/settings/SettingsViewModel.js b/src/domain/session/settings/SettingsViewModel.js
index 0b68f168..7464a659 100644
--- a/src/domain/session/settings/SettingsViewModel.js
+++ b/src/domain/session/settings/SettingsViewModel.js
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {ViewModel} from "../../ViewModel.js";
+import {ViewModel} from "../../ViewModel";
 import {KeyBackupViewModel} from "./KeyBackupViewModel.js";
 
 class PushNotificationStatus {
diff --git a/src/lib.ts b/src/lib.ts
index 3e191d45..cc88690c 100644
--- a/src/lib.ts
+++ b/src/lib.ts
@@ -30,6 +30,6 @@ export {Navigation} from "./domain/navigation/Navigation.js";
 export {ComposerViewModel} from "./domain/session/room/ComposerViewModel.js";
 export {MessageComposer} from "./platform/web/ui/session/room/MessageComposer.js";
 export {TemplateView} from "./platform/web/ui/general/TemplateView";
-export {ViewModel} from "./domain/ViewModel.js";
+export {ViewModel} from "./domain/ViewModel";
 export {LoadingView} from "./platform/web/ui/general/LoadingView.js";
 export {AvatarView} from "./platform/web/ui/AvatarView.js";
diff --git a/src/utils/Disposables.ts b/src/utils/Disposables.ts
index 19a5983c..f7c7eb53 100644
--- a/src/utils/Disposables.ts
+++ b/src/utils/Disposables.ts
@@ -1,5 +1,6 @@
 /*
 Copyright 2020 Bruno Windels <bruno@windels.cloud>
+Copyright 2022 The Matrix.org Foundation C.I.C.
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -18,7 +19,7 @@ export interface IDisposable {
     dispose(): void;
 }
 
-type Disposable = IDisposable | (() => void);
+export type Disposable = IDisposable | (() => void);
 
 function disposeValue(value: Disposable): void {
     if (typeof value === "function") {
@@ -33,9 +34,9 @@ function isDisposable(value: Disposable): boolean {
 }
 
 export class Disposables {
-    private _disposables: Disposable[] | null = [];
+    private _disposables?: Disposable[] = [];
 
-    track(disposable: Disposable): Disposable {
+    track<D extends Disposable>(disposable: D): D {
         if (!isDisposable(disposable)) {
             throw new Error("Not a disposable");
         }
@@ -48,16 +49,16 @@ export class Disposables {
         return disposable;
     }
 
-    untrack(disposable: Disposable): null {
+    untrack(disposable: Disposable): undefined {
         if (this.isDisposed) {
             console.warn("Disposables already disposed, cannot untrack");
-            return null;
+            return undefined;
         }
         const idx = this._disposables!.indexOf(disposable);
         if (idx >= 0) {
             this._disposables!.splice(idx, 1);
         }
-        return null;
+        return undefined;
     }
 
     dispose(): void {
@@ -65,17 +66,17 @@ export class Disposables {
             for (const d of this._disposables) {
                 disposeValue(d);
             }
-            this._disposables = null;
+            this._disposables = undefined;
         }
     }
 
     get isDisposed(): boolean {
-        return this._disposables === null;
+        return this._disposables === undefined;
     }
 
-    disposeTracked(value: Disposable): null {
+    disposeTracked(value: Disposable | undefined): undefined {
         if (value === undefined || value === null || this.isDisposed) {
-            return null;
+            return undefined;
         }
         const idx = this._disposables!.indexOf(value);
         if (idx !== -1) {
@@ -84,6 +85,6 @@ export class Disposables {
         } else {
             console.warn("disposable not found, did it leak?", value);
         }
-        return null;
+        return undefined;
     }
 }