Merge branch 'develop' into gsouquet/threads-forceenablelabsflag

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

@@ -15,15 +15,18 @@ limitations under the License.
 */
 
 import { render } from "@testing-library/react";
+import { MatrixEvent, MsgType, RelationType } from "matrix-js-sdk/src/matrix";
 import { MatrixClient, PendingEventOrdering } from "matrix-js-sdk/src/client";
 import { Feature, ServerSupport } from "matrix-js-sdk/src/feature";
 import { NotificationCountType, Room } from "matrix-js-sdk/src/models/room";
+import { ReceiptType } from "matrix-js-sdk/src/@types/read_receipts";
 import React from "react";
 
 import RoomHeaderButtons from "../../../../src/components/views/right_panel/RoomHeaderButtons";
 import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
 import SettingsStore from "../../../../src/settings/SettingsStore";
-import { stubClient } from "../../../test-utils";
+import { mkEvent, stubClient } from "../../../test-utils";
+import { mkThread } from "../../../test-utils/threads";
 
 describe("RoomHeaderButtons-test.tsx", function () {
     const ROOM_ID = "!roomId:example.org";
@@ -35,6 +38,7 @@ describe("RoomHeaderButtons-test.tsx", function () {
 
         stubClient();
         client = MatrixClientPeg.get();
+        client.supportsExperimentalThreads = () => true;
         room = new Room(ROOM_ID, client, client.getUserId() ?? "", {
             pendingEventOrdering: PendingEventOrdering.Detached,
         });
@@ -48,12 +52,12 @@ describe("RoomHeaderButtons-test.tsx", function () {
         return render(<RoomHeaderButtons room={room} excludedRightPanelPhaseButtons={[]} />);
     }
 
-    function getThreadButton(container) {
+    function getThreadButton(container: HTMLElement) {
         return container.querySelector(".mx_RightPanel_threadsButton");
     }
 
-    function isIndicatorOfType(container, type: "red" | "gray") {
-        return container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator").className.includes(type);
+    function isIndicatorOfType(container: HTMLElement, type: "red" | "gray" | "bold") {
+        return container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")!.className.includes(type);
     }
 
     it("shows the thread button", () => {
@@ -76,7 +80,7 @@ describe("RoomHeaderButtons-test.tsx", function () {
         expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
     });
 
-    it("room wide notification does not change the thread button", () => {
+    it("thread notification does change the thread button", () => {
         const { container } = getComponent(room);
 
         room.setThreadUnreadNotificationCount("$123", NotificationCountType.Total, 1);
@@ -91,6 +95,85 @@ describe("RoomHeaderButtons-test.tsx", function () {
         expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
     });
 
+    it("thread activity does change the thread button", async () => {
+        const { container } = getComponent(room);
+
+        // Thread activity should appear on the icon.
+        const { rootEvent, events } = mkThread({
+            room,
+            client,
+            authorId: client.getUserId()!,
+            participantUserIds: ["@alice:example.org"],
+        });
+        expect(isIndicatorOfType(container, "bold")).toBe(true);
+
+        // Sending the last event should clear the notification.
+        let event = mkEvent({
+            event: true,
+            type: "m.room.message",
+            user: client.getUserId()!,
+            room: room.roomId,
+            content: {
+                "msgtype": MsgType.Text,
+                "body": "Test",
+                "m.relates_to": {
+                    event_id: rootEvent.getId(),
+                    rel_type: RelationType.Thread,
+                },
+            },
+        });
+        room.addLiveEvents([event]);
+        await expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
+
+        // Mark it as unread again.
+        event = mkEvent({
+            event: true,
+            type: "m.room.message",
+            user: "@alice:example.org",
+            room: room.roomId,
+            content: {
+                "msgtype": MsgType.Text,
+                "body": "Test",
+                "m.relates_to": {
+                    event_id: rootEvent.getId(),
+                    rel_type: RelationType.Thread,
+                },
+            },
+        });
+        room.addLiveEvents([event]);
+        expect(isIndicatorOfType(container, "bold")).toBe(true);
+
+        // Sending a read receipt on an earlier event shouldn't do anything.
+        let receipt = new MatrixEvent({
+            type: "m.receipt",
+            room_id: room.roomId,
+            content: {
+                [events.at(-1)!.getId()!]: {
+                    [ReceiptType.Read]: {
+                        [client.getUserId()!]: { ts: 1, thread_id: rootEvent.getId() },
+                    },
+                },
+            },
+        });
+        room.addReceipt(receipt);
+        expect(isIndicatorOfType(container, "bold")).toBe(true);
+
+        // Sending a receipt on the latest event should clear the notification.
+        receipt = new MatrixEvent({
+            type: "m.receipt",
+            room_id: room.roomId,
+            content: {
+                [event.getId()!]: {
+                    [ReceiptType.Read]: {
+                        [client.getUserId()!]: { ts: 1, thread_id: rootEvent.getId() },
+                    },
+                },
+            },
+        });
+        room.addReceipt(receipt);
+        expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
+    });
+
     it("does not explode without a room", () => {
         client.canSupport.set(Feature.ThreadUnreadNotifications, ServerSupport.Unsupported);
         expect(() => getComponent()).not.toThrow();