Move the room list to the new ListView(backed by react-virtuoso) (#30515)

* Move Room List to ListView

- Also remove Space/Enter handing from keyboard navigation we can just leave the default behaviour of those keys and handle via onClick

* Update rooms when the primary filter changes

Otherwise when changing spaces, the filter does not reset until the next update to the RVS is made.

* Fix stickyRow/scrollIntoView when switiching space or changing filters

- Also remove the rest of space/enter keyboard handling use

* Remove the rest of space/enter keyboard handling use

* Remove useCombinedRef and add @radix-ui/react-compose-refs as we already depend on it

- Also remove eact-virtualized dep

* Update RoomList unit test

* Update snapshots and unit tests

* Fix e2e tests

* Remove react-virtualized from tests

* Fix e2e flake

* Update more screenshots

* Fix e2e test case where were should scroll to the top when the active room is no longer in the list

* Move from gitpkg to package-patch

* Update to latest react virtuoso release/api.

Also pass spaceId to the room list and scroll the activeIndex into view when spaceId or primaryFilter change.

* Use listbox/option roles to improve ScreenReader experience

* Change onKeyDown e.stopPropogation to cover context menu

* lint

* Remove unneeded exposure of the listView ref

Also move scrollIntoViewOnChange to useCallback

* Update unit test and snapshot

* Fix e2e tests and update screenshots

* Fix unit test and snapshot

* Update more unit tests

* Fix keyboard shortcuts and e2e test

* Fix another e2e and unit test

* lint

* Improve the naming for RoomResult and the documentation on it's fields meaning.

Also update the login in RoomList to check for any change in filters, this is a bit more future proof for when we introduce multi select than using activePrimaryFilter.

* Put back and fix landmark tests

* Fix test import

* Add comment regarding context object getting rendered.

* onKeyDown should be optional

* Use SpaceKey type on RoomResult

* lint

test/unit-tests/components/viewmodels/roomlist/RoomListHeaderViewModel-test.tsx

@@ -209,7 +209,7 @@ describe("useRoomListHeaderViewModel", () => {
             const rooms = range(10).map((i) => mkStubRoom(`foo${i}:matrix.org`, `Foo ${i}`, undefined));
             const fn = jest
                 .spyOn(RoomListStoreV3.instance, "getSortedRoomsInActiveSpace")
-                .mockImplementation(() => [...rooms]);
+                .mockImplementation(() => ({ spaceId: "home", rooms: [...rooms] }));
             return { rooms, fn };
         }
 

test/unit-tests/components/viewmodels/roomlist/RoomListViewModel-test.tsx

@@ -30,7 +30,7 @@ describe("RoomListViewModel", () => {
         const rooms = range(10).map((i) => mkStubRoom(`foo${i}:matrix.org`, `Foo ${i}`, undefined));
         const fn = jest
             .spyOn(RoomListStoreV3.instance, "getSortedRoomsInActiveSpace")
-            .mockImplementation(() => [...rooms]);
+            .mockImplementation(() => ({ spaceId: "home", rooms: [...rooms] }));
         return { rooms, fn };
     }
 
@@ -42,9 +42,9 @@ describe("RoomListViewModel", () => {
         const { rooms } = mockAndCreateRooms();
         const { result: vm } = renderHook(() => useRoomListViewModel());
 
-        expect(vm.current.rooms).toHaveLength(10);
+        expect(vm.current.roomsResult.rooms).toHaveLength(10);
         for (const room of rooms) {
-            expect(vm.current.rooms).toContain(room);
+            expect(vm.current.roomsResult.rooms).toContain(room);
         }
     });
 
@@ -57,7 +57,7 @@ describe("RoomListViewModel", () => {
         await act(() => RoomListStoreV3.instance.emit(LISTS_UPDATE_EVENT));
 
         await waitFor(() => {
-            expect(vm.current.rooms).toContain(newRoom);
+            expect(vm.current.roomsResult.rooms).toContain(newRoom);
         });
     });
 
@@ -176,7 +176,7 @@ describe("RoomListViewModel", () => {
     describe("Sticky room and active index", () => {
         function expectActiveRoom(vm: ReturnType<typeof useRoomListViewModel>, i: number, roomId: string) {
             expect(vm.activeIndex).toEqual(i);
-            expect(vm.rooms[i].roomId).toEqual(roomId);
+            expect(vm.roomsResult.rooms[i].roomId).toEqual(roomId);
         }
 
         it("active index is calculated with the last opened room in a space", () => {
@@ -187,9 +187,9 @@ describe("RoomListViewModel", () => {
 
             const rooms = range(10).map((i) => mkStubRoom(`foo${i}:matrix.org`, `Foo ${i}`, undefined));
             // Let's say all the rooms are in space1
-            const roomsInSpace1 = [...rooms];
+            const roomsInSpace1 = { spaceId: currentSpace, rooms: [...rooms] };
             // Let's say all rooms with even index are in space 2
-            const roomsInSpace2 = [...rooms].filter((_, i) => i % 2 === 0);
+            const roomsInSpace2 = { spaceId: "!space2:matrix.org", rooms: [...rooms].filter((_, i) => i % 2 === 0) };
             jest.spyOn(RoomListStoreV3.instance, "getSortedRoomsInActiveSpace").mockImplementation(() =>
                 currentSpace === "!space1:matrix.org" ? roomsInSpace1 : roomsInSpace2,
             );