feat: Room Order & Subspace Categorization

[North-West-Wind]

Feature Description

As described in the Matrix specification, rooms can be ordered using the order property in m.space.child event, which is already part of SpaceChild in Matrix Dart SDK. Therefore, we can sort the rooms in lib/pages/chat_list/space_view.dart.

In addition to room ordering, I also want a way to display subspaces as categories.

Rationale

As mentioned, ordering is already part of the Matrix specification. It would be nice to stay consistent with other clients.

Categorization of subspaces would be useful for category-based room organization like Discord. This is extremely useful for spaces created by Matrix Discord bridges.

Mockup

I have already implemented them in #1323. Regardless, here are the mockups actual screenshots.

Normal sorting (no room priority):

Rooms on top:

Categorized:

Space display option menu:

Additional Context

This is a rewrite of #1155, to include additional features and mockups.

The categorization feature is inspired by Cinny. In this screenshot, "MAIN", "SPLATOON" and "OTHER STUFF" are subspaces.

[North-West-Wind]

And I guess I'll explain the low-level mockup modifications as well.

This mainly involves modifying the joinedRooms and SliverList.builder in lib/pages/chat_list/space_view.dart. Instead of using room.client.rooms.where to filter the rooms in the space, I pair each room.spaceChildren with their corresponding room from room.client.rooms and sort it according to the Matrix spec using SpaceChild#order.

For categorization, rooms within a space are first separated into chat rooms and subspaces. For each subspace, I use a modified ChatListItem called ChatListSpaceItem that includes an ExpansionTile with a ListView.builder similar to how the SliverList is built in space_view.dart