RoomList: add back Favourites and Low Priority filters when sections are disabled (#34162)

* Add back Favourites and Low Priority filter into shared components

* Wireup RoomList.showSections and filters in room list vm

* Add e2e test for filters and showSection setting
This commit is contained in:
Florian Duros
2026-07-09 10:25:45 +00:00
committed by GitHub
parent 707d5a4353
commit f21a3f5413
6 changed files with 155 additions and 2 deletions
@@ -64,10 +64,30 @@ const filterKeyToIdMap: Map<FilterEnum, FilterId> = new Map([
[FilterEnum.UnreadFilter, "unread"],
[FilterEnum.PeopleFilter, "people"],
[FilterEnum.RoomsFilter, "rooms"],
[FilterEnum.FavouriteFilter, "favourite"],
[FilterEnum.MentionsFilter, "mentions"],
[FilterEnum.InvitesFilter, "invites"],
[FilterEnum.LowPriorityFilter, "low_priority"],
]);
/**
* Filters that are redundant when sections are enabled: Favourites and Low Priority rooms
* already have their own sections, so these filters are only shown as chips when sectioning
* is disabled (see {@link getVisibleFilterIds}).
*/
const SECTION_ONLY_FILTER_IDS: ReadonlySet<FilterId> = new Set<FilterId>(["favourite", "low_priority"]);
/**
* Compute the filter ids to display as primary filter chips.
* When sections are enabled, the Favourites and Low Priority filters are hidden because those
* rooms are surfaced as dedicated sections instead.
*/
function getVisibleFilterIds(): FilterId[] {
const areSectionsEnabled = SettingsStore.getValue("RoomList.showSections");
const filterIds = [...filterKeyToIdMap.values()];
return areSectionsEnabled ? filterIds.filter((id) => !SECTION_ONLY_FILTER_IDS.has(id)) : filterIds;
}
const TAG_TO_TITLE_MAP: Record<string, string> = {
[DefaultTagID.Favourite]: _t("room_list|section|favourites"),
[CHATS_TAG]: _t("room_list|section|chats"),
@@ -144,7 +164,7 @@ export class RoomListViewModel
const roomsResult = RoomListStoreV3.instance.getSortedRoomsInActiveSpace(undefined);
const canCreateRoom = hasCreateRoomRights(props.client, activeSpace);
const filterIds = [...filterKeyToIdMap.values()];
const filterIds = getVisibleFilterIds();
// By default, all sections are expanded
const { sections, isFlatList } = computeSections(roomsResult, (tag) => true);
@@ -214,6 +234,10 @@ export class RoomListViewModel
dispatcher.unregister(dispatcherRef);
});
// Recompute the lis when setting changes
const showSectionsRef = SettingsStore.watchSetting("RoomList.showSections", null, this.onShowSectionsChange);
this.disposables.track(() => SettingsStore.unwatchSetting(showSectionsRef));
// Track cleanup of all child view models
this.disposables.track(() => {
for (const viewModel of this.roomItemViewModels.values()) {
@@ -249,6 +273,20 @@ export class RoomListViewModel
this.updateRoomListData();
};
/**
* Handle changes to the {@link RoomList.showSections} setting.
* Toggling sections is a rare action, so we simply reset the filters and rebuild
* the list from scratch rather than trying to reconcile the previous state.
*/
private readonly onShowSectionsChange = (): void => {
this.activeFilter = undefined;
this.clearViewModels();
this.roomsResult = RoomListStoreV3.instance.getSortedRoomsInActiveSpace();
this.updateRoomsMap(this.roomsResult);
this.snapshot.merge({ filterIds: getVisibleFilterIds() });
this.updateRoomListData();
};
/**
* Add rooms from the RoomsResult to the roomsMap for quick lookup.
* This does not clear the roomsMap.