New room list: add empty state (#29512)

* refactor: extract room creation and right verification

* refactor: update `RoomListHeaderViewModel` to use utils

* feat(room list filter): add filter key to `PrimaryFilter` model

* feat(room list filter): return active primary filter

* feat(room list): add create room action and rights verification

* test: update room list tests

* feat(empty room list): add empty room list

* test(empty room list): add empty room list tests

* feat(room list): use empty room list in `RoomListView`

* test(room list panel): update tests

* test(e2e): add e2e tests for empty room list

* test(e2e): update room list header snapshot

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

@@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
 
 import { range } from "lodash";
 import { act, renderHook, waitFor } from "jest-matrix-react";
+import { mocked } from "jest-mock";
 
 import RoomListStoreV3 from "../../../../../src/stores/room-list-v3/RoomListStoreV3";
 import { mkStubRoom } from "../../../../test-utils";
@@ -17,6 +18,14 @@ import { SecondaryFilters } from "../../../../../src/components/viewmodels/rooml
 import { SortingAlgorithm } from "../../../../../src/stores/room-list-v3/skip-list/sorters";
 import { SortOption } from "../../../../../src/components/viewmodels/roomlist/useSorter";
 import SettingsStore from "../../../../../src/settings/SettingsStore";
+import { hasCreateRoomRights, createRoom } from "../../../../../src/components/viewmodels/roomlist/utils";
+import dispatcher from "../../../../../src/dispatcher/dispatcher";
+import { Action } from "../../../../../src/dispatcher/actions";
+
+jest.mock("../../../../../src/components/viewmodels/roomlist/utils", () => ({
+    hasCreateRoomRights: jest.fn().mockReturnValue(false),
+    createRoom: jest.fn(),
+}));
 
 describe("RoomListViewModel", () => {
     function mockAndCreateRooms() {
@@ -139,6 +148,19 @@ describe("RoomListViewModel", () => {
             );
         });
 
+        it("should return the current active primary filter", async () => {
+            // Let's say that the user's preferred sorting is alphabetic
+            mockAndCreateRooms();
+            const { result: vm } = renderHook(() => useRoomListViewModel());
+            // Toggle people filter
+            const i = vm.current.primaryFilters.findIndex((f) => f.name === "People");
+            expect(vm.current.primaryFilters[i].active).toEqual(false);
+            act(() => vm.current.primaryFilters[i].toggle());
+
+            // The active primary filter should be the People filter
+            expect(vm.current.activePrimaryFilter).toEqual(vm.current.primaryFilters[i]);
+        });
+
         const testcases: Array<[string, { secondary: SecondaryFilters; filterKey: FilterKey }, string]> = [
             [
                 "Mentions only",
@@ -240,4 +262,31 @@ describe("RoomListViewModel", () => {
             expect(fn).toHaveBeenCalled();
         });
     });
+
+    describe("Create room and chat", () => {
+        it("should be canCreateRoom=false if hasCreateRoomRights=false", () => {
+            mocked(hasCreateRoomRights).mockReturnValue(false);
+            const { result } = renderHook(() => useRoomListViewModel());
+            expect(result.current.canCreateRoom).toBe(false);
+        });
+
+        it("should be canCreateRoom=true if hasCreateRoomRights=true", () => {
+            mocked(hasCreateRoomRights).mockReturnValue(true);
+            const { result } = renderHook(() => useRoomListViewModel());
+            expect(result.current.canCreateRoom).toBe(true);
+        });
+
+        it("should call createRoom", () => {
+            const { result } = renderHook(() => useRoomListViewModel());
+            result.current.createRoom();
+            expect(mocked(createRoom)).toHaveBeenCalled();
+        });
+
+        it("should dispatch Action.CreateChat", () => {
+            const spy = jest.spyOn(dispatcher, "fire");
+            const { result } = renderHook(() => useRoomListViewModel());
+            result.current.createChatRoom();
+            expect(spy).toHaveBeenCalledWith(Action.CreateChat);
+        });
+    });
 });