Rewrite doesRoomOrThreadHaveUnreadMessages to use the receipt rewrite from js-sdk (#11903)

* Rewrite doesRoomOrThreadHaveUnreadMessages to use the receipt rewrite from js-sdk

* Remove unit tests that rely on receipt timestamps

Previously, if we found a receipt for an unknown event, we would use the
receipt timestamp and declare all events before that time to be read.
Now, we ignore such "dangling" receipts until we find the event they
refer to.

This new behaviour is more correct, but does lead to more messages being
considered unread.

This commit deletes tests that checked for the old behaviour.

* Check for a missing thread in determineUnreadState

* Fix incorrect way to find room timeline

* More realistic test setup to support new receipt code

* Update snapshot to expect a room to be unread when there are no receipts

* Formatting fixes

* Update snapshot to show menu and notif button

* Disable some flaky tests

* Disable some flaky tests

* Fix test to make a threaded receipt for an event that is actually in the thread

---------

Co-authored-by: Florian Duros <florianduros@element.io>
Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

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

@@ -105,6 +105,7 @@ describe("LegacyRoomHeaderButtons-test.tsx", function () {
             client,
             authorId: client.getUserId()!,
             participantUserIds: ["@alice:example.org"],
+            length: 5,
         });
         // We need some receipt, otherwise we treat this thread as
         // "older than all threaded receipts" and consider it read.
@@ -112,7 +113,7 @@ describe("LegacyRoomHeaderButtons-test.tsx", function () {
             type: "m.receipt",
             room_id: room.roomId,
             content: {
-                [events[0].getId()!]: {
+                [events[1].getId()!]: {
                     // Receipt for the first event in the thread
                     [ReceiptType.Read]: {
                         [client.getUserId()!]: { ts: 1, thread_id: rootEvent.getId() },
@@ -139,7 +140,7 @@ describe("LegacyRoomHeaderButtons-test.tsx", function () {
             },
         });
         room.addLiveEvents([event]);
-        await expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
+        expect(container.querySelector(".mx_RightPanel_threadsButton .mx_Indicator")).toBeNull();
 
         // Mark it as unread again.
         event = mkEvent({

test/components/views/rooms/EventTile-test.tsx

@@ -94,6 +94,7 @@ describe("EventTile", () => {
 
         room = new Room(ROOM_ID, client, client.getSafeUserId(), {
             pendingEventOrdering: PendingEventOrdering.Detached,
+            timelineSupport: true,
         });
 
         jest.spyOn(client, "getRoom").mockReturnValue(room);

test/components/views/rooms/RoomTile-test.tsx

@@ -378,6 +378,7 @@ describe("RoomTile", () => {
                     {
                         lastReply: () => null,
                         timeline: [],
+                        findEventById: () => {},
                     } as Thread,
                 ]);
             });

test/components/views/rooms/__snapshots__/RoomTile-test.tsx.snap

@@ -78,7 +78,7 @@ exports[`RoomTile when message previews are enabled and there is a message in th
 <DocumentFragment>
   <div
     aria-describedby="mx_RoomTile_messagePreview_!1:example.org"
-    aria-label="!1:​example.org"
+    aria-label="!1:​example.org Unread messages."
     aria-selected="false"
     class="mx_AccessibleButton mx_RoomTile"
     role="treeitem"
@@ -102,7 +102,7 @@ exports[`RoomTile when message previews are enabled and there is a message in th
       class="mx_RoomTile_titleContainer"
     >
       <div
-        class="mx_RoomTile_title mx_RoomTile_titleWithSubtitle"
+        class="mx_RoomTile_title mx_RoomTile_titleWithSubtitle mx_RoomTile_titleHasUnreadEvents"
         tabindex="-1"
         title="!1:​example.org"
       >
@@ -127,7 +127,15 @@ exports[`RoomTile when message previews are enabled and there is a message in th
     <div
       aria-hidden="true"
       class="mx_RoomTile_badgeContainer"
-    />
+    >
+      <div
+        class="mx_NotificationBadge mx_NotificationBadge_visible mx_NotificationBadge_dot"
+      >
+        <span
+          class="mx_NotificationBadge_count"
+        />
+      </div>
+    </div>
     <div
       aria-expanded="false"
       aria-haspopup="true"