Absorb the matrix-react-sdk repository (#28192)

Co-authored-by: github-merge-queue <118344674+github-merge-queue@users.noreply.github.com> Co-authored-by: github-merge-queue <github-merge-queue@users.noreply.github.com> Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Florian Duros <florian.duros@ormaz.fr> Co-authored-by: Kim Brose <kim.brose@nordeck.net> Co-authored-by: Florian Duros <florianduros@element.io> Co-authored-by: R Midhun Suresh <hi@midhun.dev> Co-authored-by: dbkr <986903+dbkr@users.noreply.github.com> Co-authored-by: ElementRobot <releases@riot.im> Co-authored-by: dbkr <dbkr@users.noreply.github.com> Co-authored-by: David Baker <dbkr@users.noreply.github.com> Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com> Co-authored-by: David Langley <davidl@element.io> Co-authored-by: Michael Weimann <michaelw@matrix.org> Co-authored-by: Timshel <Timshel@users.noreply.github.com> Co-authored-by: Sahil Silare <32628578+sahil9001@users.noreply.github.com> Co-authored-by: Will Hunt <will@half-shot.uk> Co-authored-by: Hubert Chathi <hubert@uhoreg.ca> Co-authored-by: Andrew Ferrazzutti <andrewf@element.io> Co-authored-by: Robin <robin@robin.town> Co-authored-by: Tulir Asokan <tulir@maunium.net>
2026-11-03 06:55:44 +00:00 · 2024-10-16 13:31:55 +01:00
parent 2b99496025
commit c05c429803
3280 changed files with 586617 additions and 905 deletions
@@ -0,0 +1,273 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import React from "react";
+import { fireEvent, getByLabelText, getByText, render, screen, waitFor } from "jest-matrix-react";
+import { EventTimeline, JoinRule, Room } from "matrix-js-sdk/src/matrix";
+import { KnownMembership } from "matrix-js-sdk/src/types";
+
+import { SDKContext, SdkContextClass } from "../../../../../../src/contexts/SDKContext";
+import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../../../test-utils";
+import {
+    CallGuestLinkButton,
+    JoinRuleDialog,
+} from "../../../../../../src/components/views/rooms/RoomHeader/CallGuestLinkButton";
+import Modal from "../../../../../../src/Modal";
+import SdkConfig from "../../../../../../src/SdkConfig";
+import ShareDialog from "../../../../../../src/components/views/dialogs/ShareDialog";
+import { _t } from "../../../../../../src/languageHandler";
+import SettingsStore from "../../../../../../src/settings/SettingsStore";
+
+describe("<CallGuestLinkButton />", () => {
+    const roomId = "!room:server.org";
+    let sdkContext!: SdkContextClass;
+    let modalSpy: jest.SpyInstance;
+    let modalResolve: (value: unknown[] | PromiseLike<unknown[]>) => void;
+    let room: Room;
+
+    const targetUnencrypted =
+        "https://guest_spa_url.com/room/#/!room:server.org?roomId=%21room%3Aserver.org&viaServers=example.org";
+    const targetEncrypted =
+        "https://guest_spa_url.com/room/#/!room:server.org?roomId=%21room%3Aserver.org&perParticipantE2EE=true&viaServers=example.org";
+    const expectedShareDialogProps = {
+        target: targetEncrypted,
+        customTitle: "Conference invite link",
+        subtitle: "Link for external users to join the call without a matrix account:",
+    };
+
+    /**
+     * Create a room using mocked client
+     * And mock isElementVideoRoom
+     */
+    const makeRoom = (isVideoRoom = true): Room => {
+        const room = new Room(roomId, sdkContext.client!, sdkContext.client!.getSafeUserId());
+        jest.spyOn(room, "isElementVideoRoom").mockReturnValue(isVideoRoom);
+        // stub
+        jest.spyOn(room, "getPendingEvents").mockReturnValue([]);
+        return room;
+    };
+    function mockRoomMembers(room: Room, count: number) {
+        const members = Array(count)
+            .fill(0)
+            .map((_, index) => ({
+                userId: `@user-${index}:example.org`,
+                roomId: room.roomId,
+                membership: KnownMembership.Join,
+            }));
+
+        room.currentState.setJoinedMemberCount(members.length);
+        room.getJoinedMembers = jest.fn().mockReturnValue(members);
+    }
+
+    const getComponent = (room: Room) =>
+        render(<CallGuestLinkButton room={room} />, {
+            wrapper: ({ children }) => <SDKContext.Provider value={sdkContext}>{children}</SDKContext.Provider>,
+        });
+
+    const oldGet = SdkConfig.get;
+    beforeEach(() => {
+        const client = getMockClientWithEventEmitter({
+            ...mockClientMethodsUser(),
+            sendStateEvent: jest.fn(),
+        });
+        sdkContext = new SdkContextClass();
+        sdkContext.client = client;
+        const modalPromise = new Promise<unknown[]>((resolve) => {
+            modalResolve = resolve;
+        });
+        modalSpy = jest.spyOn(Modal, "createDialog").mockReturnValue({ finished: modalPromise, close: jest.fn() });
+        room = makeRoom();
+        mockRoomMembers(room, 3);
+
+        jest.spyOn(SdkConfig, "get").mockImplementation((key) => {
+            if (key === "element_call") {
+                return { guest_spa_url: "https://guest_spa_url.com", url: "https://spa_url.com" };
+            }
+            return oldGet(key);
+        });
+        jest.spyOn(room, "hasEncryptionStateEvent").mockReturnValue(true);
+        jest.spyOn(SdkContextClass.instance.roomViewStore, "isViewingCall").mockReturnValue(true);
+    });
+    afterEach(() => {
+        jest.restoreAllMocks();
+    });
+
+    it("shows the JoinRuleDialog on click with private join rules", async () => {
+        getComponent(room);
+        fireEvent.click(screen.getByRole("button", { name: "Share call link" }));
+        expect(modalSpy).toHaveBeenCalledWith(JoinRuleDialog, { room, canInvite: false });
+        // pretend public was selected
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Public);
+        modalResolve([]);
+        await new Promise(process.nextTick);
+        const callParams = modalSpy.mock.calls[1];
+        expect(callParams[0]).toEqual(ShareDialog);
+        expect(callParams[1].target.toString()).toEqual(expectedShareDialogProps.target);
+        expect(callParams[1].subtitle).toEqual(expectedShareDialogProps.subtitle);
+        expect(callParams[1].customTitle).toEqual(expectedShareDialogProps.customTitle);
+    });
+
+    it("shows the ShareDialog on click with public join rules", () => {
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Public);
+        getComponent(room);
+        fireEvent.click(screen.getByRole("button", { name: "Share call link" }));
+        const callParams = modalSpy.mock.calls[0];
+        expect(callParams[0]).toEqual(ShareDialog);
+        expect(callParams[1].target.toString()).toEqual(expectedShareDialogProps.target);
+        expect(callParams[1].subtitle).toEqual(expectedShareDialogProps.subtitle);
+        expect(callParams[1].customTitle).toEqual(expectedShareDialogProps.customTitle);
+    });
+
+    it("shows the ShareDialog on click with knock join rules", () => {
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Knock);
+        jest.spyOn(room, "canInvite").mockReturnValue(true);
+        getComponent(room);
+        fireEvent.click(screen.getByRole("button", { name: "Share call link" }));
+        const callParams = modalSpy.mock.calls[0];
+        expect(callParams[0]).toEqual(ShareDialog);
+        expect(callParams[1].target.toString()).toEqual(expectedShareDialogProps.target);
+        expect(callParams[1].subtitle).toEqual(expectedShareDialogProps.subtitle);
+        expect(callParams[1].customTitle).toEqual(expectedShareDialogProps.customTitle);
+    });
+
+    it("don't show external conference button if room not public nor knock and the user cannot change join rules", () => {
+        // preparation for if we refactor the related code to not use currentState.
+        jest.spyOn(room, "getLiveTimeline").mockReturnValue({
+            getState: jest.fn().mockReturnValue({
+                maySendStateEvent: jest.fn().mockReturnValue(false),
+            }),
+        } as unknown as EventTimeline);
+        jest.spyOn(room.currentState, "maySendStateEvent").mockReturnValue(false);
+        getComponent(room);
+        expect(screen.queryByLabelText("Share call link")).not.toBeInTheDocument();
+    });
+
+    it("don't show external conference button if now guest spa link is configured", () => {
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Public);
+        jest.spyOn(SdkContextClass.instance.roomViewStore, "isViewingCall").mockReturnValue(true);
+
+        jest.spyOn(SdkConfig, "get").mockImplementation((key) => {
+            if (key === "element_call") {
+                return { url: "https://example2.com" };
+            }
+            return oldGet(key);
+        });
+
+        getComponent(room);
+        // We only change the SdkConfig and show that this everything else is
+        // configured so that the call link button is shown.
+        expect(screen.queryByLabelText("Share call link")).not.toBeInTheDocument();
+
+        jest.spyOn(SdkConfig, "get").mockImplementation((key) => {
+            if (key === "element_call") {
+                return { guest_spa_url: "https://guest_spa_url.com", url: "https://example2.com" };
+            }
+            return oldGet(key);
+        });
+
+        getComponent(room);
+        expect(getByLabelText(document.body, "Share call link")).toBeInTheDocument();
+    });
+
+    it("opens the share dialog with the correct share link in an encrypted room", () => {
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Public);
+        jest.spyOn(SdkContextClass.instance.roomViewStore, "isViewingCall").mockReturnValue(true);
+
+        getComponent(room);
+        const modalSpy = jest.spyOn(Modal, "createDialog");
+        fireEvent.click(getByLabelText(document.body, _t("voip|get_call_link")));
+        // const target =
+        //     "https://guest_spa_url.com/room/#/!room:server.org?roomId=%21room%3Aserver.org&perParticipantE2EE=true&viaServers=example.org";
+        expect(modalSpy).toHaveBeenCalled();
+        const arg0 = modalSpy.mock.calls[0][0];
+        const arg1 = modalSpy.mock.calls[0][1] as any;
+        expect(arg0).toEqual(ShareDialog);
+        const { customTitle, subtitle } = arg1;
+        expect({ customTitle, subtitle }).toEqual({
+            customTitle: "Conference invite link",
+            subtitle: _t("share|share_call_subtitle"),
+        });
+        expect(arg1.target.toString()).toEqual(targetEncrypted);
+    });
+
+    it("share dialog has correct link in an unencrypted room", () => {
+        jest.spyOn(room, "getJoinRule").mockReturnValue(JoinRule.Public);
+        jest.spyOn(room, "hasEncryptionStateEvent").mockReturnValue(false);
+        jest.spyOn(SdkContextClass.instance.roomViewStore, "isViewingCall").mockReturnValue(true);
+
+        getComponent(room);
+        const modalSpy = jest.spyOn(Modal, "createDialog");
+        fireEvent.click(getByLabelText(document.body, _t("voip|get_call_link")));
+        const arg1 = modalSpy.mock.calls[0][1] as any;
+        expect(arg1.target.toString()).toEqual(targetUnencrypted);
+    });
+
+    describe("<JoinRuleDialog />", () => {
+        const onFinished = jest.fn();
+
+        const getComponent = (room: Room, canInvite: boolean = true) =>
+            render(<JoinRuleDialog room={room} canInvite={canInvite} onFinished={onFinished} />, {
+                wrapper: ({ children }) => <SDKContext.Provider value={sdkContext}>{children}</SDKContext.Provider>,
+            });
+
+        beforeEach(() => {
+            // feature_ask_to_join enabled
+            jest.spyOn(SettingsStore, "getValue").mockReturnValue(true);
+        });
+
+        it("shows ask to join if feature is enabled", () => {
+            const { container } = getComponent(room);
+            expect(getByText(container, "Ask to join")).toBeInTheDocument();
+        });
+        it("font show ask to join if feature is enabled but cannot invite", () => {
+            getComponent(room, false);
+            expect(screen.queryByText("Ask to join")).not.toBeInTheDocument();
+        });
+        it("doesn't show ask to join if feature is disabled", () => {
+            jest.spyOn(SettingsStore, "getValue").mockReturnValue(false);
+            getComponent(room);
+            expect(screen.queryByText("Ask to join")).not.toBeInTheDocument();
+        });
+
+        it("sends correct state event on click", async () => {
+            const sendStateSpy = jest.spyOn(sdkContext.client!, "sendStateEvent");
+            let container;
+            container = getComponent(room).container;
+            fireEvent.click(getByText(container, "Ask to join"));
+            expect(sendStateSpy).toHaveBeenCalledWith(
+                "!room:server.org",
+                "m.room.join_rules",
+                { join_rule: "knock" },
+                "",
+            );
+            expect(sendStateSpy).toHaveBeenCalledTimes(1);
+            await waitFor(() => expect(onFinished).toHaveBeenCalledTimes(1));
+            onFinished.mockClear();
+            sendStateSpy.mockClear();
+
+            container = getComponent(room).container;
+            fireEvent.click(getByText(container, "Public"));
+            expect(sendStateSpy).toHaveBeenLastCalledWith(
+                "!room:server.org",
+                "m.room.join_rules",
+                { join_rule: "public" },
+                "",
+            );
+            expect(sendStateSpy).toHaveBeenCalledTimes(1);
+            container = getComponent(room).container;
+            await waitFor(() => expect(onFinished).toHaveBeenCalledTimes(1));
+            onFinished.mockClear();
+            sendStateSpy.mockClear();
+
+            fireEvent.click(getByText(container, _t("update_room_access_modal|no_change")));
+            await waitFor(() => expect(onFinished).toHaveBeenCalledTimes(1));
+            // Don't call sendStateEvent if no change is clicked.
+            expect(sendStateSpy).toHaveBeenCalledTimes(0);
+        });
+    });
+});
@@ -0,0 +1,126 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import React from "react";
+import { MockedObject } from "jest-mock";
+import { Room } from "matrix-js-sdk/src/matrix";
+import { fireEvent, render, screen, waitFor } from "jest-matrix-react";
+
+import { VideoRoomChatButton } from "../../../../../../src/components/views/rooms/RoomHeader/VideoRoomChatButton";
+import { SDKContext, SdkContextClass } from "../../../../../../src/contexts/SDKContext";
+import RightPanelStore from "../../../../../../src/stores/right-panel/RightPanelStore";
+import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../../../test-utils";
+import { RoomNotificationState } from "../../../../../../src/stores/notifications/RoomNotificationState";
+import { NotificationLevel } from "../../../../../../src/stores/notifications/NotificationLevel";
+import { NotificationStateEvents } from "../../../../../../src/stores/notifications/NotificationState";
+import { RightPanelPhases } from "../../../../../../src/stores/right-panel/RightPanelStorePhases";
+
+describe("<VideoRoomChatButton />", () => {
+    const roomId = "!room:server.org";
+    let sdkContext!: SdkContextClass;
+    let rightPanelStore!: MockedObject<RightPanelStore>;
+
+    /**
+     * Create a room using mocked client
+     * And mock isElementVideoRoom
+     */
+    const makeRoom = (isVideoRoom = true): Room => {
+        const room = new Room(roomId, sdkContext.client!, sdkContext.client!.getSafeUserId());
+        jest.spyOn(room, "isElementVideoRoom").mockReturnValue(isVideoRoom);
+        // stub
+        jest.spyOn(room, "getPendingEvents").mockReturnValue([]);
+        return room;
+    };
+
+    const mockRoomNotificationState = (room: Room, level: NotificationLevel): RoomNotificationState => {
+        const roomNotificationState = new RoomNotificationState(room, false);
+
+        // @ts-ignore ugly mocking
+        roomNotificationState._level = level;
+        jest.spyOn(sdkContext.roomNotificationStateStore, "getRoomState").mockReturnValue(roomNotificationState);
+        return roomNotificationState;
+    };
+
+    const getComponent = (room: Room) =>
+        render(<VideoRoomChatButton room={room} />, {
+            wrapper: ({ children }) => <SDKContext.Provider value={sdkContext}>{children}</SDKContext.Provider>,
+        });
+
+    beforeEach(() => {
+        const client = getMockClientWithEventEmitter({
+            ...mockClientMethodsUser(),
+        });
+        rightPanelStore = {
+            showOrHidePhase: jest.fn(),
+        } as unknown as MockedObject<RightPanelStore>;
+        sdkContext = new SdkContextClass();
+        sdkContext.client = client;
+        jest.spyOn(sdkContext, "rightPanelStore", "get").mockReturnValue(rightPanelStore);
+    });
+
+    afterEach(() => {
+        jest.restoreAllMocks();
+    });
+
+    it("toggles timeline in right panel on click", () => {
+        const room = makeRoom();
+        getComponent(room);
+
+        fireEvent.click(screen.getByRole("button", { name: "Chat" }));
+
+        expect(sdkContext.rightPanelStore.showOrHidePhase).toHaveBeenCalledWith(RightPanelPhases.Timeline);
+    });
+
+    it("renders button with an unread marker when room is unread", () => {
+        const room = makeRoom();
+        mockRoomNotificationState(room, NotificationLevel.Activity);
+        getComponent(room);
+
+        // snapshot includes `data-indicator` attribute
+        expect(screen.getByRole("button", { name: "Chat" })).toMatchSnapshot();
+        expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy();
+    });
+
+    it("adds unread marker when room notification state changes to unread", async () => {
+        const room = makeRoom();
+        // start in read state
+        const notificationState = mockRoomNotificationState(room, NotificationLevel.None);
+        getComponent(room);
+
+        // no unread marker
+        expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeFalsy();
+
+        // @ts-ignore ugly mocking
+        notificationState._level = NotificationLevel.Highlight;
+        notificationState.emit(NotificationStateEvents.Update);
+
+        // unread marker
+        await waitFor(() =>
+            expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy(),
+        );
+    });
+
+    it("clears unread marker when room notification state changes to read", async () => {
+        const room = makeRoom();
+        // start in unread state
+        const notificationState = mockRoomNotificationState(room, NotificationLevel.Highlight);
+        getComponent(room);
+
+        // unread marker
+        expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeTruthy();
+
+        // @ts-ignore ugly mocking
+        notificationState._level = NotificationLevel.None;
+        notificationState.emit(NotificationStateEvents.Update);
+
+        // unread marker cleared
+        await waitFor(() =>
+            expect(screen.getByRole("button", { name: "Chat" }).hasAttribute("data-indicator")).toBeFalsy(),
+        );
+    });
+});
@@ -0,0 +1,31 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<VideoRoomChatButton /> renders button with an unread marker when room is unread 1`] = `
+<button
+  aria-label="Chat"
+  aria-labelledby="floating-ui-6"
+  class="_icon-button_bh2qc_17"
+  data-indicator="default"
+  role="button"
+  style="--cpd-icon-button-size: 32px;"
+  tabindex="0"
+>
+  <div
+    class="_indicator-icon_133tf_26"
+    data-indicator="default"
+    style="--cpd-icon-button-size: 100%;"
+  >
+    <svg
+      fill="currentColor"
+      height="1em"
+      viewBox="0 0 24 24"
+      width="1em"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2.95 16.3 1.5 21.25a.936.936 0 0 0 .25 1 .936.936 0 0 0 1 .25l4.95-1.45a10.23 10.23 0 0 0 2.1.712c.717.159 1.45.238 2.2.238a9.737 9.737 0 0 0 3.9-.788 10.098 10.098 0 0 0 3.175-2.137c.9-.9 1.613-1.958 2.137-3.175A9.738 9.738 0 0 0 22 12a9.738 9.738 0 0 0-.788-3.9 10.099 10.099 0 0 0-2.137-3.175c-.9-.9-1.958-1.612-3.175-2.137A9.737 9.737 0 0 0 12 2a9.737 9.737 0 0 0-3.9.788 10.099 10.099 0 0 0-3.175 2.137c-.9.9-1.612 1.958-2.137 3.175A9.738 9.738 0 0 0 2 12a10.179 10.179 0 0 0 .95 4.3Z"
+      />
+    </svg>
+  </div>
+</button>
+`;