Kerry/summary card header

cypress/e2e/crypto/crypto.spec.ts

@@ -269,7 +269,7 @@ describe("Cryptography", function () {
         // Assert that verified icon is rendered
         cy.findByRole("button", { name: "Room members" }).click();
         cy.findByRole("button", { name: "Room information" }).click();
-        cy.get(".mx_RoomSummaryCard_e2ee_verified").should("exist");
+        cy.get('.mx_RoomSummaryCard_badges [data-kind="success"]').should("contain.text", "Encrypted");
 
         // Take a snapshot of RoomSummaryCard with a verified E2EE icon
         cy.get(".mx_RightPanel").percySnapshotElement("RoomSummaryCard - with a verified E2EE icon", {

test/components/views/right_panel/RoomSummaryCard-test.tsx

@@ -15,8 +15,9 @@ limitations under the License.
 */
 
 import React from "react";
-import { render, fireEvent } from "@testing-library/react";
-import { MatrixEvent, Room } from "matrix-js-sdk/src/matrix";
+import { render, fireEvent, screen } from "@testing-library/react";
+import { EventType, MatrixEvent, Room, MatrixClient, JoinRule } from "matrix-js-sdk/src/matrix";
+import { mocked, MockedObject } from "jest-mock";
 
 import DMRoomMap from "../../../../src/utils/DMRoomMap";
 import RoomSummaryCard from "../../../../src/components/views/right_panel/RoomSummaryCard";
@@ -28,56 +29,67 @@ import * as settingsHooks from "../../../../src/hooks/useSettings";
 import Modal from "../../../../src/Modal";
 import RightPanelStore from "../../../../src/stores/right-panel/RightPanelStore";
 import { RightPanelPhases } from "../../../../src/stores/right-panel/RightPanelStorePhases";
-import { getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../test-utils";
+import { flushPromises, getMockClientWithEventEmitter, mockClientMethodsUser } from "../../../test-utils";
 import { PollHistoryDialog } from "../../../../src/components/views/dialogs/PollHistoryDialog";
 import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks";
 import { _t } from "../../../../src/languageHandler";
 
 describe("<RoomSummaryCard />", () => {
     const userId = "@alice:domain.org";
-    const mockClient = getMockClientWithEventEmitter({
-        ...mockClientMethodsUser(userId),
-        isRoomEncrypted: jest.fn(),
-        getRoom: jest.fn(),
-    });
+
     const roomId = "!room:domain.org";
-    const room = new Room(roomId, mockClient, userId);
-    const roomCreateEvent = new MatrixEvent({
-        type: "m.room.create",
-        room_id: roomId,
-        sender: userId,
-        content: {
-            creator: userId,
-            room_version: "5",
-        },
-        state_key: "",
-    });
-    room.currentState.setStateEvents([roomCreateEvent]);
-    const defaultProps = {
-        room,
-        onClose: jest.fn(),
-        permalinkCreator: new RoomPermalinkCreator(room),
-    };
-    const getComponent = (props = {}) =>
-        render(<RoomSummaryCard {...defaultProps} {...props} />, {
+    let mockClient!: MockedObject<MatrixClient>;
+    let room!: Room;
+
+    const getComponent = (props = {}) => {
+        const defaultProps = {
+            room,
+            onClose: jest.fn(),
+            permalinkCreator: new RoomPermalinkCreator(room),
+        };
+
+        return render(<RoomSummaryCard {...defaultProps} {...props} />, {
             wrapper: ({ children }) => (
                 <MatrixClientContext.Provider value={mockClient}>{children}</MatrixClientContext.Provider>
             ),
         });
-
-    const modalSpy = jest.spyOn(Modal, "createDialog");
-    const dispatchSpy = jest.spyOn(defaultDispatcher, "dispatch");
-    const rightPanelCardSpy = jest.spyOn(RightPanelStore.instance, "pushCard");
-    const featureEnabledSpy = jest.spyOn(settingsHooks, "useFeatureEnabled");
+    };
 
     beforeEach(() => {
+        mockClient = getMockClientWithEventEmitter({
+            ...mockClientMethodsUser(userId),
+            getAccountData: jest.fn(),
+            isRoomEncrypted: jest.fn(),
+            getOrCreateFilter: jest.fn().mockResolvedValue({ filterId: 1 }),
+            getRoom: jest.fn(),
+        });
+        room = new Room(roomId, mockClient, userId);
+        const roomCreateEvent = new MatrixEvent({
+            type: "m.room.create",
+            room_id: roomId,
+            sender: userId,
+            content: {
+                creator: userId,
+                room_version: "5",
+            },
+            state_key: "",
+        });
+        room.currentState.setStateEvents([roomCreateEvent]);
+
+        jest.spyOn(Modal, "createDialog");
+        jest.spyOn(RightPanelStore.instance, "pushCard");
+        jest.spyOn(settingsHooks, "useFeatureEnabled").mockReturnValue(false);
+        jest.spyOn(defaultDispatcher, "dispatch");
         jest.clearAllMocks();
         DMRoomMap.makeShared(mockClient);
 
         mockClient.getRoom.mockReturnValue(room);
         jest.spyOn(room, "isElementVideoRoom").mockRestore();
         jest.spyOn(room, "isCallRoom").mockRestore();
-        featureEnabledSpy.mockReset().mockReturnValue(false);
+    });
+
+    afterEach(() => {
+        jest.restoreAllMocks();
     });
 
     it("renders the room summary", () => {
@@ -101,44 +113,47 @@ describe("<RoomSummaryCard />", () => {
 
         fireEvent.click(getByText("People"));
 
-        expect(rightPanelCardSpy).toHaveBeenCalledWith({ phase: RightPanelPhases.RoomMemberList }, true);
+        expect(RightPanelStore.instance.pushCard).toHaveBeenCalledWith(
+            { phase: RightPanelPhases.RoomMemberList },
+            true,
+        );
     });
 
     it("opens room file panel on button click", () => {
         const { getByText } = getComponent();
 
         fireEvent.click(getByText("Files"));
 
-        expect(rightPanelCardSpy).toHaveBeenCalledWith({ phase: RightPanelPhases.FilePanel }, true);
+        expect(RightPanelStore.instance.pushCard).toHaveBeenCalledWith({ phase: RightPanelPhases.FilePanel }, true);
     });
 
     it("opens room export dialog on button click", () => {
         const { getByText } = getComponent();
 
         fireEvent.click(getByText("Export chat"));
 
-        expect(modalSpy).toHaveBeenCalledWith(ExportDialog, { room });
+        expect(Modal.createDialog).toHaveBeenCalledWith(ExportDialog, { room });
     });
 
     it("opens share room dialog on button click", () => {
         const { getByText } = getComponent();
 
         fireEvent.click(getByText("Share room"));
 
-        expect(modalSpy).toHaveBeenCalledWith(ShareDialog, { target: room });
+        expect(Modal.createDialog).toHaveBeenCalledWith(ShareDialog, { target: room });
     });
 
     it("opens room settings on button click", () => {
         const { getByText } = getComponent();
 
         fireEvent.click(getByText("Room settings"));
 
-        expect(dispatchSpy).toHaveBeenCalledWith({ action: "open_room_settings" });
+        expect(defaultDispatcher.dispatch).toHaveBeenCalledWith({ action: "open_room_settings" });
     });
 
     describe("pinning", () => {
         it("renders pins options when pinning feature is enabled", () => {
-            featureEnabledSpy.mockImplementation((feature) => feature === "feature_pinning");
+            mocked(settingsHooks.useFeatureEnabled).mockImplementation((feature) => feature === "feature_pinning");
             const { getByText } = getComponent();
 
             expect(getByText("Pinned")).toBeInTheDocument();
@@ -153,22 +168,23 @@ describe("<RoomSummaryCard />", () => {
         });
 
         it("opens poll history dialog on button click", () => {
-            const { getByText } = getComponent();
+            const permalinkCreator = new RoomPermalinkCreator(room);
+            const { getByText } = getComponent({ permalinkCreator });
 
             fireEvent.click(getByText("Poll history"));
 
-            expect(modalSpy).toHaveBeenCalledWith(PollHistoryDialog, {
+            expect(Modal.createDialog).toHaveBeenCalledWith(PollHistoryDialog, {
                 room,
                 matrixClient: mockClient,
-                permalinkCreator: defaultProps.permalinkCreator,
+                permalinkCreator: permalinkCreator,
             });
         });
     });
 
     describe("video rooms", () => {
         it("does not render irrelevant options for element video room", () => {
             jest.spyOn(room, "isElementVideoRoom").mockReturnValue(true);
-            featureEnabledSpy.mockImplementation(
+            mocked(settingsHooks.useFeatureEnabled).mockImplementation(
                 (feature) => feature === "feature_video_rooms" || feature === "feature_pinning",
             );
             const { queryByText } = getComponent();
@@ -181,7 +197,7 @@ describe("<RoomSummaryCard />", () => {
 
         it("does not render irrelevant options for element call room", () => {
             jest.spyOn(room, "isCallRoom").mockReturnValue(true);
-            featureEnabledSpy.mockImplementation(
+            mocked(settingsHooks.useFeatureEnabled).mockImplementation(
                 (feature) =>
                     feature === "feature_element_call_video_rooms" ||
                     feature === "feature_video_rooms" ||
@@ -195,4 +211,49 @@ describe("<RoomSummaryCard />", () => {
             expect(queryByText("Export chat")).not.toBeInTheDocument();
         });
     });
+
+    describe("public room label", () => {
+        beforeEach(() => {
+            jest.spyOn(room.currentState, "getJoinRule").mockReturnValue(JoinRule.Public);
+        });
+
+        it("does not show public room label for a DM", async () => {
+            mockClient.getAccountData.mockImplementation(
+                (eventType) =>
+                    ({
+                        [EventType.Direct]: new MatrixEvent({
+                            type: EventType.Direct,
+                            content: {
+                                "@bob:sesame.st": ["some-room-id"],
+                                // this room is a DM with ernie
+                                "@ernie:sesame.st": ["some-other-room-id", room.roomId],
+                            },
+                        }),
+                    }[eventType]),
+            );
+            getComponent();
+
+            await flushPromises();
+
+            expect(screen.queryByText("Public room")).not.toBeInTheDocument();
+        });
+
+        it("does not show public room label for non public room", async () => {
+            jest.spyOn(room.currentState, "getJoinRule").mockReturnValue(JoinRule.Invite);
+            getComponent();
+
+            await flushPromises();
+
+            expect(screen.queryByText("Public room")).not.toBeInTheDocument();
+        });
+
+        it("shows a public room label for a public room", async () => {
+            jest.spyOn(room.currentState, "getJoinRule").mockReturnValue(JoinRule.Public);
+            getComponent();
+
+            await flushPromises();
+
+            expect(screen.queryByText("Public room")).toBeInTheDocument();
+        });
+    });
 });