From 2449557aa8a4f8b7073d6793b9df882e284b1819 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 17:12:32 +0530 Subject: [PATCH 01/12] Add implementation for AccountDataApi --- src/modules/AccountDataApi.ts | 54 +++++++++++++++++++++++++++++++++++ 1 file changed, 54 insertions(+) create mode 100644 src/modules/AccountDataApi.ts diff --git a/src/modules/AccountDataApi.ts b/src/modules/AccountDataApi.ts new file mode 100644 index 0000000000..cf1dba513d --- /dev/null +++ b/src/modules/AccountDataApi.ts @@ -0,0 +1,54 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { Watchable, type AccountDataApi as IAccountDataApi } from "@element-hq/element-web-module-api"; +import { ClientEvent, type MatrixEvent, type MatrixClient } from "matrix-js-sdk/src/matrix"; + +import { MatrixClientPeg } from "../MatrixClientPeg"; + +export class AccountDataApi implements IAccountDataApi { + public get(eventType: string): Watchable { + const cli = MatrixClientPeg.safeGet(); + return new AccountDataWatchable(cli, eventType); + } + + public async set(eventType: string, content: any): Promise { + const cli = MatrixClientPeg.safeGet(); + //@ts-expect-error: JS-SDK accepts known event-types, intentionally allow arbitrary types. + await cli.setAccountData(eventType, content); + } + + public async delete(eventType: string): Promise { + const cli = MatrixClientPeg.safeGet(); + //@ts-expect-error: JS-SDK accepts known event-types, intentionally allow arbitrary types. + await cli.deleteAccountData(eventType); + } +} + +class AccountDataWatchable extends Watchable { + public constructor( + private cli: MatrixClient, + private eventType: string, + ) { + //@ts-expect-error: JS-SDK accepts known event-types, intentionally allow arbitrary types. + super(cli.getAccountData(eventType)?.getContent()); + } + + private onAccountData = (event: MatrixEvent): void => { + if (event.getType() === this.eventType) { + this.value = event.getContent(); + } + }; + + protected onFirstWatch(): void { + this.cli.on(ClientEvent.AccountData, this.onAccountData); + } + + protected onLastWatch(): void { + this.cli.off(ClientEvent.AccountData, this.onAccountData); + } +} From 335491eabc88ab25bf6fe989e530a1446102c7c5 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 17:13:14 +0530 Subject: [PATCH 02/12] Add implementation for Room --- src/modules/models/Room.ts | 45 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 src/modules/models/Room.ts diff --git a/src/modules/models/Room.ts b/src/modules/models/Room.ts new file mode 100644 index 0000000000..e317c0dc03 --- /dev/null +++ b/src/modules/models/Room.ts @@ -0,0 +1,45 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { type Room as IRoom, Watchable } from "@element-hq/element-web-module-api"; +import { RoomEvent, type Room as SdkRoom } from "matrix-js-sdk/src/matrix"; + +export class Room implements IRoom { + public name: Watchable; + + public constructor(private sdkRoom: SdkRoom) { + this.name = new WatchableName(sdkRoom); + } + + public getLastActiveTimestamp(): number { + return this.sdkRoom.getLastActiveTimestamp(); + } + + public get id(): string { + return this.sdkRoom.roomId; + } +} + +/** + * A custom watchable for room name. + */ +class WatchableName extends Watchable { + public constructor(private sdkRoom: SdkRoom) { + super(sdkRoom.name); + } + + private onNameUpdate = (): void => { + super.value = this.sdkRoom.name; + }; + protected onFirstWatch(): void { + this.sdkRoom.on(RoomEvent.Name, this.onNameUpdate); + } + + protected onLastWatch(): void { + this.sdkRoom.off(RoomEvent.Name, this.onNameUpdate); + } +} From 3be766d79c96d781bf936be8f373595052ded8fc Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 17:13:39 +0530 Subject: [PATCH 03/12] Add implementation for ClientApi --- src/modules/ClientApi.ts | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) create mode 100644 src/modules/ClientApi.ts diff --git a/src/modules/ClientApi.ts b/src/modules/ClientApi.ts new file mode 100644 index 0000000000..3f5272bb67 --- /dev/null +++ b/src/modules/ClientApi.ts @@ -0,0 +1,27 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ +import type { ClientApi as IClientApi, Room } from "@element-hq/element-web-module-api"; +import { Room as ModuleRoom } from "./models/Room"; +import { AccountDataApi } from "./AccountDataApi"; +import { MatrixClientPeg } from "../MatrixClientPeg"; + +export class ClientApi implements IClientApi { + private accountDataApi?: AccountDataApi; + + public getRoom(roomId: string): Room | null { + const sdkRoom = MatrixClientPeg.safeGet().getRoom(roomId); + if (sdkRoom) return new ModuleRoom(sdkRoom); + return null; + } + + public get accountData(): AccountDataApi { + if (!this.accountDataApi) { + this.accountDataApi = new AccountDataApi(); + } + return this.accountDataApi; + } +} From c2d68f8dc0cbdfb31f2ed40cc142ba1876c5f7ff Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 17:13:57 +0530 Subject: [PATCH 04/12] Create ClientApi in Api.ts --- src/modules/Api.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/modules/Api.ts b/src/modules/Api.ts index d51f051df1..8e4ab554c7 100644 --- a/src/modules/Api.ts +++ b/src/modules/Api.ts @@ -28,6 +28,7 @@ import { openDialog } from "./Dialog.tsx"; import { overwriteAccountAuth } from "./Auth.ts"; import { ElementWebExtrasApi } from "./ExtrasApi.ts"; import { ElementWebBuiltinsApi } from "./BuiltinsApi.tsx"; +import { ClientApi } from "./ClientApi.ts"; const legacyCustomisationsFactory = (baseCustomisations: T) => { let used = false; @@ -84,6 +85,7 @@ export class ModuleApi implements Api { public readonly extras = new ElementWebExtrasApi(); public readonly builtins = new ElementWebBuiltinsApi(); public readonly rootNode = document.getElementById("matrixchat")!; + public readonly client = new ClientApi(); public createRoot(element: Element): Root { return createRoot(element); From b94d40f166623fe0350a31b20b7e8914a4495730 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 17:14:14 +0530 Subject: [PATCH 05/12] Write tests --- test/test-utils/test-utils.ts | 1 + .../unit-tests/modules/AccountDataApi-test.ts | 72 +++++++++++++++++++ test/unit-tests/modules/ClientApi-test.ts | 20 ++++++ test/unit-tests/modules/models/Room-test.ts | 50 +++++++++++++ 4 files changed, 143 insertions(+) create mode 100644 test/unit-tests/modules/AccountDataApi-test.ts create mode 100644 test/unit-tests/modules/ClientApi-test.ts create mode 100644 test/unit-tests/modules/models/Room-test.ts diff --git a/test/test-utils/test-utils.ts b/test/test-utils/test-utils.ts index d96ee1d045..8f70d089dd 100644 --- a/test/test-utils/test-utils.ts +++ b/test/test-utils/test-utils.ts @@ -650,6 +650,7 @@ export function mkStubRoom( getJoinedMembers: jest.fn().mockReturnValue([]), getLiveTimeline: jest.fn().mockReturnValue(stubTimeline), getLastLiveEvent: jest.fn().mockReturnValue(undefined), + getLastActiveTimestamp: jest.fn().mockReturnValue(1183140000), getMember: jest.fn().mockReturnValue({ userId: "@member:domain.bla", name: "Member", diff --git a/test/unit-tests/modules/AccountDataApi-test.ts b/test/unit-tests/modules/AccountDataApi-test.ts new file mode 100644 index 0000000000..d7b72d7bce --- /dev/null +++ b/test/unit-tests/modules/AccountDataApi-test.ts @@ -0,0 +1,72 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { ClientEvent } from "matrix-js-sdk/src/matrix"; + +import { AccountDataApi } from "../../../src/modules/AccountDataApi"; +import { mkEvent, stubClient } from "../../test-utils/test-utils"; + +describe("AccountDataApi", () => { + describe("AccountDataWatchable", () => { + it("should return content of account data event on get()", () => { + const cli = stubClient(); + const api = new AccountDataApi(); + // Mock cli to return a event + const content = { foo: "bar" }; + const event = mkEvent({ content, type: "m.test", user: "@foobar:matrix.org", event: true }); + cli.getAccountData = () => event; + expect(api.get("m.test").value).toStrictEqual(content); + }); + + it("should update value on event", () => { + const cli = stubClient(); + const api = new AccountDataApi(); + // Mock cli to return a event + const content = { foo: "bar" }; + const event = mkEvent({ content, type: "m.test", user: "@foobar:matrix.org", event: true }); + cli.getAccountData = () => event; + + const watchable = api.get("m.test"); + expect(watchable.value).toStrictEqual(content); + + const fn = jest.fn(); + watchable.watch(fn); + + // Let's say that the account data event changed + const event2 = mkEvent({ + content: { foo: "abc" }, + type: "m.test", + user: "@foobar:matrix.org", + event: true, + }); + cli.emit(ClientEvent.AccountData, event2); + // Watchable value should have been updated + expect(watchable.value).toStrictEqual({ foo: "abc" }); + // Watched callbacks should be called + expect(fn).toHaveBeenCalledTimes(1); + + // Make sure unwatch removed the event listener + cli.off = jest.fn(); + watchable.unwatch(fn); + expect(cli.off).toHaveBeenCalledTimes(1); + }); + }); + + it("should set account data via js-sdk on set()", async () => { + const cli = stubClient(); + const api = new AccountDataApi(); + await api.set("m.test", { foo: "bar" }); + expect(cli.setAccountData).toHaveBeenCalledTimes(1); + }); + + it("should delete account data via js-sdk on set()", async () => { + const cli = stubClient(); + const api = new AccountDataApi(); + await api.delete("m.test"); + expect(cli.deleteAccountData).toHaveBeenCalledTimes(1); + }); +}); diff --git a/test/unit-tests/modules/ClientApi-test.ts b/test/unit-tests/modules/ClientApi-test.ts new file mode 100644 index 0000000000..22f55d7d37 --- /dev/null +++ b/test/unit-tests/modules/ClientApi-test.ts @@ -0,0 +1,20 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { ClientApi } from "../../../src/modules/ClientApi"; +import { Room } from "../../../src/modules/models/Room"; +import { stubClient } from "../../test-utils/test-utils"; + +describe("ClientApi", () => { + it("should return module room from getRoom()", () => { + stubClient(); + const client = new ClientApi(); + const moduleRoom = client.getRoom("!foo:matrix.org"); + expect(moduleRoom).toBeInstanceOf(Room); + expect(moduleRoom?.id).toStrictEqual("!foo:matrix.org"); + }); +}); diff --git a/test/unit-tests/modules/models/Room-test.ts b/test/unit-tests/modules/models/Room-test.ts new file mode 100644 index 0000000000..d149c8cdf0 --- /dev/null +++ b/test/unit-tests/modules/models/Room-test.ts @@ -0,0 +1,50 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { Room } from "../../../../src/modules/models/Room"; +import { mkRoom, stubClient } from "../../../test-utils"; + +describe("Room", () => { + it("should return id from sdk room", () => { + const cli = stubClient(); + const sdkRoom = mkRoom(cli, "!foo:m.org"); + const room = new Room(sdkRoom); + expect(room.id).toStrictEqual("!foo:m.org"); + }); + + it("should return last timestamp from sdk room", () => { + const cli = stubClient(); + const sdkRoom = mkRoom(cli, "!foo:m.org"); + const room = new Room(sdkRoom); + expect(room.getLastActiveTimestamp()).toStrictEqual(sdkRoom.getLastActiveTimestamp()); + }); + + describe("watchableName", () => { + it("should return name from sdkRoom", () => { + const cli = stubClient(); + const sdkRoom = mkRoom(cli, "!foo:m.org"); + sdkRoom.name = "Foo Name"; + const room = new Room(sdkRoom); + expect(room.name.value).toStrictEqual("Foo Name"); + }); + + it("should add/remove event listener on sdk room", () => { + const cli = stubClient(); + const sdkRoom = mkRoom(cli, "!foo:m.org"); + sdkRoom.name = "Foo Name"; + + const room = new Room(sdkRoom); + const fn = jest.fn(); + + room.name.watch(fn); + expect(sdkRoom.on).toHaveBeenCalledTimes(1); + + room.name.unwatch(fn); + expect(sdkRoom.off).toHaveBeenCalledTimes(1); + }); + }); +}); From 507eaa02dfe026a5108759ecf3914cdbdba92305 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 18:02:19 +0530 Subject: [PATCH 06/12] Use nullish coalescing assignment --- src/modules/ClientApi.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/modules/ClientApi.ts b/src/modules/ClientApi.ts index 3f5272bb67..ef692fbad6 100644 --- a/src/modules/ClientApi.ts +++ b/src/modules/ClientApi.ts @@ -19,9 +19,7 @@ export class ClientApi implements IClientApi { } public get accountData(): AccountDataApi { - if (!this.accountDataApi) { - this.accountDataApi = new AccountDataApi(); - } + this.accountDataApi ??= new AccountDataApi(); return this.accountDataApi; } } From f4e8e79af829d11f3fb89c65f4fec659ce08da0a Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 18:32:53 +0530 Subject: [PATCH 07/12] Implement openRoom in NavigationApi --- src/modules/Navigation.ts | 39 ++++++++++++++++++++------------------- 1 file changed, 20 insertions(+), 19 deletions(-) diff --git a/src/modules/Navigation.ts b/src/modules/Navigation.ts index 52bdb5aee9..fff87156b6 100644 --- a/src/modules/Navigation.ts +++ b/src/modules/Navigation.ts @@ -5,8 +5,11 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com Please see LICENSE files in the repository root for full details. */ -import { type LocationRenderFunction, type NavigationApi as INavigationApi } from "@element-hq/element-web-module-api"; - +import type { + LocationRenderFunction, + NavigationApi as INavigationApi, + OpenRoomOptions, +} from "@element-hq/element-web-module-api"; import { navigateToPermalink } from "../utils/permalinks/navigator.ts"; import { parsePermalink } from "../utils/permalinks/Permalinks.ts"; import dispatcher from "../dispatcher/dispatcher.ts"; @@ -21,27 +24,25 @@ export class NavigationApi implements INavigationApi { const parts = parsePermalink(link); if (parts?.roomIdOrAlias) { - if (parts.roomIdOrAlias.startsWith("#")) { - dispatcher.dispatch({ - action: Action.ViewRoom, - room_alias: parts.roomIdOrAlias, - via_servers: parts.viaServers ?? undefined, - auto_join: join, - metricsTrigger: undefined, - }); - } else { - dispatcher.dispatch({ - action: Action.ViewRoom, - room_id: parts.roomIdOrAlias, - via_servers: parts.viaServers ?? undefined, - auto_join: join, - metricsTrigger: undefined, - }); - } + this.openRoom(parts.roomIdOrAlias, { + viaServers: parts.viaServers ?? undefined, + autoJoin: join, + }); } } public registerLocationRenderer(path: string, renderer: LocationRenderFunction): void { this.locationRenderers.set(path, renderer); } + + public openRoom(roomIdOrAlias: string, opts: OpenRoomOptions = {}): void { + const key = roomIdOrAlias.startsWith("#") ? "room_alias" : "room_id"; + dispatcher.dispatch({ + action: Action.ViewRoom, + [key]: roomIdOrAlias, + via_servers: opts.viaServers, + auto_join: opts.autoJoin, + metricsTrigger: undefined, + }); + } } From 6dc1431270b303eb014993ed242d29ceaffed5a9 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 18:33:07 +0530 Subject: [PATCH 08/12] Write tests --- test/unit-tests/modules/Navigation-test.ts | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/test/unit-tests/modules/Navigation-test.ts b/test/unit-tests/modules/Navigation-test.ts index 3fafdf0fa6..ee0a70e9cf 100644 --- a/test/unit-tests/modules/Navigation-test.ts +++ b/test/unit-tests/modules/Navigation-test.ts @@ -37,5 +37,25 @@ describe("NavigationApi", () => { }), ); }); + + it("should dispatch correct action on openRoom", () => { + const spy = jest.spyOn(defaultDispatcher, "dispatch"); + // Non alias + api.openRoom("!foo:m.org"); + expect(spy).toHaveBeenCalledWith( + expect.objectContaining({ + action: "view_room", + room_id: "!foo:m.org", + }), + ); + // Alias + api.openRoom("#bar:m.org"); + expect(spy).toHaveBeenCalledWith( + expect.objectContaining({ + action: "view_room", + room_alias: "#bar:m.org", + }), + ); + }); }); }); From 044a275135ef4e140c2a6f575001482c9ec0cacd Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 19:14:37 +0530 Subject: [PATCH 09/12] Add implementation for StoresApi --- src/modules/Api.ts | 2 ++ src/modules/StoresApi.ts | 65 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 67 insertions(+) create mode 100644 src/modules/StoresApi.ts diff --git a/src/modules/Api.ts b/src/modules/Api.ts index 8e4ab554c7..2ff85c968f 100644 --- a/src/modules/Api.ts +++ b/src/modules/Api.ts @@ -29,6 +29,7 @@ import { overwriteAccountAuth } from "./Auth.ts"; import { ElementWebExtrasApi } from "./ExtrasApi.ts"; import { ElementWebBuiltinsApi } from "./BuiltinsApi.tsx"; import { ClientApi } from "./ClientApi.ts"; +import { StoresApi } from "./StoresApi.ts"; const legacyCustomisationsFactory = (baseCustomisations: T) => { let used = false; @@ -86,6 +87,7 @@ export class ModuleApi implements Api { public readonly builtins = new ElementWebBuiltinsApi(); public readonly rootNode = document.getElementById("matrixchat")!; public readonly client = new ClientApi(); + public readonly stores = new StoresApi(); public createRoot(element: Element): Root { return createRoot(element); diff --git a/src/modules/StoresApi.ts b/src/modules/StoresApi.ts new file mode 100644 index 0000000000..2c1341e3b9 --- /dev/null +++ b/src/modules/StoresApi.ts @@ -0,0 +1,65 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ +import { + type StoresApi as IStoresApi, + type RoomListStoreApi as IRoomListStore, + type Room, + Watchable, +} from "@element-hq/element-web-module-api"; + +import RoomListStoreV3, { LISTS_LOADED_EVENT, LISTS_UPDATE_EVENT } from "../stores/room-list-v3/RoomListStoreV3"; +import { Room as ModuleRoom } from "./models/Room"; + +class RoomListStoreApi implements IRoomListStore { + public getRooms(): RoomsWatchable { + return new RoomsWatchable(); + } + + public async waitForReady(): Promise { + // Check if RLS is already loaded + if (!RoomListStoreV3.instance.isLoadingRooms) return; + + // Return a promise that resolves when RLS has loaded + let resolve: () => void; + const promise: Promise = new Promise((_resolve) => { + resolve = _resolve; + }); + RoomListStoreV3.instance.once(LISTS_LOADED_EVENT, () => { + resolve(); + }); + return promise; + } +} + +class RoomsWatchable extends Watchable { + public constructor() { + super(RoomListStoreV3.instance.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom))); + } + + private onRlsUpdate = (): void => { + this.value = RoomListStoreV3.instance.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom)); + }; + + protected onFirstWatch(): void { + RoomListStoreV3.instance.on(LISTS_UPDATE_EVENT, this.onRlsUpdate); + } + + protected onLastWatch(): void { + RoomListStoreV3.instance.off(LISTS_UPDATE_EVENT, this.onRlsUpdate); + } +} + +export class StoresApi implements IStoresApi { + private roomListStoreApi?: IRoomListStore; + + public get roomListStore(): IRoomListStore { + if (!this.roomListStoreApi) { + this.roomListStoreApi = new RoomListStoreApi(); + } + return this.roomListStoreApi; + } +} From 353609c05d602467f029ccc7a7058b6f6d4abd9c Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 19:16:38 +0530 Subject: [PATCH 10/12] Write tests --- test/unit-tests/modules/StoresApi-test.ts | 77 +++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 test/unit-tests/modules/StoresApi-test.ts diff --git a/test/unit-tests/modules/StoresApi-test.ts b/test/unit-tests/modules/StoresApi-test.ts new file mode 100644 index 0000000000..10d0cd6078 --- /dev/null +++ b/test/unit-tests/modules/StoresApi-test.ts @@ -0,0 +1,77 @@ +/* +Copyright 2025 Element Creations Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial +Please see LICENSE files in the repository root for full details. +*/ + +import { waitFor } from "jest-matrix-react"; + +import { StoresApi } from "../../../src/modules/StoresApi"; +import RoomListStoreV3, { + LISTS_LOADED_EVENT, + LISTS_UPDATE_EVENT, +} from "../../../src/stores/room-list-v3/RoomListStoreV3"; +import { mkRoom, stubClient } from "../../test-utils/test-utils"; +import { Room } from "../../../src/modules/models/Room"; +import {} from "../../../src/stores/room-list/algorithms/Algorithm"; + +describe("StoresApi", () => { + describe("RoomListStoreApi", () => { + it("should return promise that resolves when RLS is ready", async () => { + jest.spyOn(RoomListStoreV3.instance, "isLoadingRooms", "get").mockReturnValue(true); + const store = new StoresApi(); + let hasResolved = false; + // The following async function will set hasResolved to false + // only when waitForReady resolves. + (async () => { + await store.roomListStore.waitForReady(); + hasResolved = true; + })(); + // Shouldn't have resolved yet. + expect(hasResolved).toStrictEqual(false); + // Emit the loaded event. + RoomListStoreV3.instance.emit(LISTS_LOADED_EVENT); + // Should resolve now. + await waitFor(() => { + expect(hasResolved).toStrictEqual(true); + }); + }); + + describe("getRooms()", () => { + it("should return rooms from RLS", () => { + const cli = stubClient(); + const room1 = mkRoom(cli, "!foo1:m.org"); + const room2 = mkRoom(cli, "!foo2:m.org"); + const room3 = mkRoom(cli, "!foo3:m.org"); + jest.spyOn(RoomListStoreV3.instance, "getSortedRooms").mockReturnValue([room1, room2, room3]); + + const store = new StoresApi(); + const watchable = store.roomListStore.getRooms(); + expect(watchable.value).toHaveLength(3); + expect(watchable.value[0]).toBeInstanceOf(Room); + }); + + it("should update from RLS", () => { + const cli = stubClient(); + const room1 = mkRoom(cli, "!foo1:m.org"); + const room2 = mkRoom(cli, "!foo2:m.org"); + const rooms = [room1, room2]; + + jest.spyOn(RoomListStoreV3.instance, "getSortedRooms").mockReturnValue(rooms); + + const store = new StoresApi(); + const watchable = store.roomListStore.getRooms(); + const fn = jest.fn(); + watchable.watch(fn); + expect(watchable.value).toHaveLength(2); + + const room3 = mkRoom(cli, "!foo3:m.org"); + rooms.push(room3); + RoomListStoreV3.instance.emit(LISTS_UPDATE_EVENT); + expect(fn).toHaveBeenCalledTimes(1); + expect(watchable.value).toHaveLength(3); + }); + }); + }); +}); From fdbe41415240bac9e205e7602063e635cee0c0a3 Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Thu, 30 Oct 2025 21:30:32 +0530 Subject: [PATCH 11/12] Fix circular dependency --- src/modules/StoresApi.ts | 79 +++++++++++++++++------ test/unit-tests/modules/StoresApi-test.ts | 13 +++- 2 files changed, 70 insertions(+), 22 deletions(-) diff --git a/src/modules/StoresApi.ts b/src/modules/StoresApi.ts index 2c1341e3b9..f1d6add95e 100644 --- a/src/modules/StoresApi.ts +++ b/src/modules/StoresApi.ts @@ -11,45 +11,86 @@ import { Watchable, } from "@element-hq/element-web-module-api"; -import RoomListStoreV3, { LISTS_LOADED_EVENT, LISTS_UPDATE_EVENT } from "../stores/room-list-v3/RoomListStoreV3"; +import type { RoomListStoreV3Class, RoomListStoreV3Event } from "../stores/room-list-v3/RoomListStoreV3"; import { Room as ModuleRoom } from "./models/Room"; -class RoomListStoreApi implements IRoomListStore { +interface RlsEvents { + LISTS_LOADED_EVENT: RoomListStoreV3Event.ListsLoaded; + LISTS_UPDATE_EVENT: RoomListStoreV3Event.ListsUpdate; +} + +export class RoomListStoreApi implements IRoomListStore { + private rls?: RoomListStoreV3Class; + private LISTS_LOADED_EVENT?: RoomListStoreV3Event.ListsLoaded; + private LISTS_UPDATE_EVENT?: RoomListStoreV3Event.ListsUpdate; + public readonly moduleLoadPromise: Promise; + + public constructor() { + this.moduleLoadPromise = this.init(); + } + + /** + * Load the RLS through a dynamic import. This is necessary to prevent + * circular dependency issues. + */ + private async init(): Promise { + const module = await import("../stores/room-list-v3/RoomListStoreV3"); + this.rls = module.default.instance; + this.LISTS_LOADED_EVENT = module.LISTS_LOADED_EVENT; + this.LISTS_UPDATE_EVENT = module.LISTS_UPDATE_EVENT; + } + public getRooms(): RoomsWatchable { - return new RoomsWatchable(); + return new RoomsWatchable(this.roomListStore, this.events); + } + + private get events(): RlsEvents { + if (!this.LISTS_LOADED_EVENT || !this.LISTS_UPDATE_EVENT) { + throw new Error("Event type was not loaded correctly, did you forget to await waitForReady()?"); + } + return { LISTS_LOADED_EVENT: this.LISTS_LOADED_EVENT, LISTS_UPDATE_EVENT: this.LISTS_UPDATE_EVENT }; + } + + private get roomListStore(): RoomListStoreV3Class { + if (!this.rls) { + throw new Error("rls is undefined, did you forget to await waitForReady()?"); + } + return this.rls; } public async waitForReady(): Promise { - // Check if RLS is already loaded - if (!RoomListStoreV3.instance.isLoadingRooms) return; + // Wait for the module to load first + await this.moduleLoadPromise; - // Return a promise that resolves when RLS has loaded - let resolve: () => void; - const promise: Promise = new Promise((_resolve) => { - resolve = _resolve; - }); - RoomListStoreV3.instance.once(LISTS_LOADED_EVENT, () => { - resolve(); - }); - return promise; + // Check if RLS is already loaded + if (!this.roomListStore.isLoadingRooms) return; + + // Await a promise that resolves when RLS has loaded + const { promise, resolve } = Promise.withResolvers(); + const { LISTS_LOADED_EVENT } = this.events; + this.roomListStore.once(LISTS_LOADED_EVENT, resolve); + await promise; } } class RoomsWatchable extends Watchable { - public constructor() { - super(RoomListStoreV3.instance.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom))); + public constructor( + private readonly rls: RoomListStoreV3Class, + private readonly events: RlsEvents, + ) { + super(rls.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom))); } private onRlsUpdate = (): void => { - this.value = RoomListStoreV3.instance.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom)); + this.value = this.rls.getSortedRooms().map((sdkRoom) => new ModuleRoom(sdkRoom)); }; protected onFirstWatch(): void { - RoomListStoreV3.instance.on(LISTS_UPDATE_EVENT, this.onRlsUpdate); + this.rls.on(this.events.LISTS_UPDATE_EVENT, this.onRlsUpdate); } protected onLastWatch(): void { - RoomListStoreV3.instance.off(LISTS_UPDATE_EVENT, this.onRlsUpdate); + this.rls.off(this.events.LISTS_UPDATE_EVENT, this.onRlsUpdate); } } diff --git a/test/unit-tests/modules/StoresApi-test.ts b/test/unit-tests/modules/StoresApi-test.ts index 10d0cd6078..ba8a0c83da 100644 --- a/test/unit-tests/modules/StoresApi-test.ts +++ b/test/unit-tests/modules/StoresApi-test.ts @@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details. import { waitFor } from "jest-matrix-react"; -import { StoresApi } from "../../../src/modules/StoresApi"; +import { type RoomListStoreApi, StoresApi } from "../../../src/modules/StoresApi"; import RoomListStoreV3, { LISTS_LOADED_EVENT, LISTS_UPDATE_EVENT, @@ -30,6 +30,9 @@ describe("StoresApi", () => { })(); // Shouldn't have resolved yet. expect(hasResolved).toStrictEqual(false); + + // Wait for the module to load so that we can test the listener. + await (store.roomListStore as RoomListStoreApi).moduleLoadPromise; // Emit the loaded event. RoomListStoreV3.instance.emit(LISTS_LOADED_EVENT); // Should resolve now. @@ -39,28 +42,32 @@ describe("StoresApi", () => { }); describe("getRooms()", () => { - it("should return rooms from RLS", () => { + it("should return rooms from RLS", async () => { const cli = stubClient(); const room1 = mkRoom(cli, "!foo1:m.org"); const room2 = mkRoom(cli, "!foo2:m.org"); const room3 = mkRoom(cli, "!foo3:m.org"); jest.spyOn(RoomListStoreV3.instance, "getSortedRooms").mockReturnValue([room1, room2, room3]); + jest.spyOn(RoomListStoreV3.instance, "isLoadingRooms", "get").mockReturnValue(false); const store = new StoresApi(); + await store.roomListStore.waitForReady(); const watchable = store.roomListStore.getRooms(); expect(watchable.value).toHaveLength(3); expect(watchable.value[0]).toBeInstanceOf(Room); }); - it("should update from RLS", () => { + it("should update from RLS", async () => { const cli = stubClient(); const room1 = mkRoom(cli, "!foo1:m.org"); const room2 = mkRoom(cli, "!foo2:m.org"); const rooms = [room1, room2]; jest.spyOn(RoomListStoreV3.instance, "getSortedRooms").mockReturnValue(rooms); + jest.spyOn(RoomListStoreV3.instance, "isLoadingRooms", "get").mockReturnValue(false); const store = new StoresApi(); + await store.roomListStore.waitForReady(); const watchable = store.roomListStore.getRooms(); const fn = jest.fn(); watchable.watch(fn); From 5f8aa3201539ecd923713b413198f07307ba643b Mon Sep 17 00:00:00 2001 From: R Midhun Suresh Date: Tue, 4 Nov 2025 16:58:27 +0530 Subject: [PATCH 12/12] Change to class field --- src/modules/ClientApi.ts | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/src/modules/ClientApi.ts b/src/modules/ClientApi.ts index ef692fbad6..7b5ccd2828 100644 --- a/src/modules/ClientApi.ts +++ b/src/modules/ClientApi.ts @@ -10,16 +10,11 @@ import { AccountDataApi } from "./AccountDataApi"; import { MatrixClientPeg } from "../MatrixClientPeg"; export class ClientApi implements IClientApi { - private accountDataApi?: AccountDataApi; + public readonly accountData = new AccountDataApi(); public getRoom(roomId: string): Room | null { const sdkRoom = MatrixClientPeg.safeGet().getRoom(roomId); if (sdkRoom) return new ModuleRoom(sdkRoom); return null; } - - public get accountData(): AccountDataApi { - this.accountDataApi ??= new AccountDataApi(); - return this.accountDataApi; - } }