Room list: add custom section creation (#33155)

* feat: add creation section dialog

* feat: add in skip list a method to change filters

* feat: add helper to creation section

* feat: add custom sections data to Settings

* feat: add custom section to room list store v3

* feat: update header and room list item vms

* feat: add toast to room list vm

* feat: add new translation

* chore: move util functions of room list specs

* test: add custom section playwright tests

* chore: call loadCustomSections in RoomListStoreV3 ctor

apps/web/test/viewmodels/room-list/RoomListHeaderViewModel-test.ts

@@ -61,6 +61,7 @@ describe("RoomListHeaderViewModel", () => {
             if (settingName === "RoomList.preferredSorting") return SortingAlgorithm.Recency;
             if (settingName === "feature_video_rooms") return true;
             if (settingName === "feature_element_call_video_rooms") return true;
+            if (settingName === "RoomList.OrderedCustomSections") return [];
             return false;
         });
     });
@@ -159,6 +160,23 @@ describe("RoomListHeaderViewModel", () => {
             vm = new RoomListHeaderViewModel({ matrixClient, spaceStore: SpaceStore.instance });
             expect(vm.getSnapshot().isMessagePreviewEnabled).toBe(true);
         });
+
+        it.each([
+            [true, true, false],
+            [false, false, true],
+        ])(
+            "when feature_room_list_sections is %s: canCreateSection=%s, useComposeIcon=%s",
+            (featureEnabled, expectedCanCreateSection, expectedUseComposeIcon) => {
+                jest.spyOn(SettingsStore, "getValue").mockImplementation((settingName: string) => {
+                    if (settingName === "feature_room_list_sections") return featureEnabled;
+                    return false;
+                });
+
+                vm = new RoomListHeaderViewModel({ matrixClient, spaceStore: SpaceStore.instance });
+                expect(vm.getSnapshot().canCreateSection).toBe(expectedCanCreateSection);
+                expect(vm.getSnapshot().useComposeIcon).toBe(expectedUseComposeIcon);
+            },
+        );
     });
 
     describe("event listeners", () => {
@@ -296,6 +314,13 @@ describe("RoomListHeaderViewModel", () => {
             );
         });
 
+        it("should call createSection on RoomListStoreV3 when createSection is called", () => {
+            const createSectionSpy = jest.spyOn(RoomListStoreV3.instance, "createSection").mockResolvedValue();
+            vm = new RoomListHeaderViewModel({ matrixClient, spaceStore: SpaceStore.instance });
+            vm.createSection();
+            expect(createSectionSpy).toHaveBeenCalled();
+        });
+
         it("should toggle message preview from enabled to disabled", () => {
             jest.spyOn(SettingsStore, "getValue").mockImplementation((settingName: string) => {
                 if (settingName === "RoomList.showMessagePreview") return true;