sorb/ThreadNet-Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

Remove legacy room list (#34040)

Browse Source 
* refactor(room-list): migrate SpaceStore off the legacy room list store

SpaceStore.setActiveRoomInSpace iterated the legacy RoomListStore's
`orderedLists` in `TAG_ORDER`; switch it to the space-aware
RoomListStoreV3.getSortedRoomsInActiveSpace() accessor. This drops the
last non-UI dependency on the legacy store and on `TAG_ORDER` (exported
from LegacyRoomList, deleted next).

* feat(room-list)!: remove the legacy room list UI

Delete the old sublist-based room list and its components now that the
new RoomListPanel is the default. Removed: LegacyRoomList,
LegacyRoomListHeader, RoomSublist, ExtraTile, RoomTile (+ Subtitle/
CallSummary), RoomBreadcrumbs and RoomSearch, plus their styles and
tests.

LeftPanel collapses to the RoomListPanel-only path. The shared
`contextMenuBelow` helper is relocated into RoomResultContextMenus (its
only remaining consumer).

* feat(room-list)!: remove the legacy RoomListStore

The legacy sublist-based room list UI is gone, so the old
`stores/room-list` store (Algorithm, sorters, filters, layout store,
space
watcher) has no remaining consumers. Delete the directory and its tests.

MatrixChat.forgetRoom no longer calls the legacy `manualRoomUpdate`; the
new room list store removes the room on the `AfterForgetRoom` dispatch
that still fires. Drop the `mxRoomListStore`/`mxRoomListLayoutStore`
globals and the now-dead test imports.

* feat(room-list)!: remove the feature_new_room_list labs flag

The new room list is now the only room list, so remove the
feature_new_room_list labs flag and make its enabled behaviour
unconditional everywhere it was gated:

- LoggedInView: always use the resizable layout and
NEW_ROOM_LIST_MIN_WIDTH;
  drop the collapsible/minimized legacy path.
- SpaceStore: People and Favourites are dropped from metaSpaceOrder (per
the
  long-standing TODO on the removed accessor).
- MessagePreviewStore: stop appending thread replies to previews.
- Settings, SidebarUserSettingsTab, PreferencesUserSettingsTab,
  QuickSettingsButton, SpacePanel, LandmarkNavigation: drop the flag
reads and
  legacy branches.

Update the tests that toggled the flag; the People/Favourites meta space
tests covered behaviour that the flag (default on) already disabled.

* feat(room-list)!: remove the dead legacy left-panel resizer

LoggedInView still built the old `Resizer`/`CollapseDistributor` over an
`lp-resizer` ResizeHandle and persisted `mx_lhs_size`. That handle is no
longer rendered (the resizable layout is now driven by
LeftResizablePanelView + ResizerViewModel, which persists its own state
via RoomList.panelSize/RoomList.isPanelCollapsed), so the old resizer
was
inert dead code left over from the legacy room list.

Remove createResizer/loadResizer/loadResizerPreferences, the
_resizeContainer/resizeHandler refs, the ResizeHandle render, the
mx_lhs_size handling and NEW_ROOM_LIST_MIN_WIDTH, plus the unit tests
that
exercised the mocked resizer.

* feat(room-list)!: update i18n files

* refactor(room-list): remove the now-unused collapseLhs state

`collapseLhs` is write-only since the left panel no longer collapses: it
was last read by LoggedInView's `shouldUseMinimizedUI`, removed with the
feature_new_room_list flag. Drop it from MatrixChat's IState (and its
assignments), collapsing the hide/show_left_panel handlers to just the
`notifyLeftHandleResized()` call they still need, and from
LoggedInView's
IProps and the test props.

* fix(room-list): instantiate message previewers lazily

Removing the unused SettingsStore import from MessagePreviewStore (when
the
feature_new_room_list flag was dropped) changed module load order and
exposed a latent circular dependency: ReactionEventPreview imports
MessagePreviewStore, which eagerly did `new ReactionEventPreview()` at
module-eval — so importing ReactionEventPreview first (as its unit test
does) hit "ReactionEventPreview is not a constructor".

Construct the previewers lazily on first use (cached) instead of at
module
load, so nothing dereferences a mid-evaluation module. Fixes
ReactionEventPreview-test.

* test(room-list): remove `feature_new_room_list` labs flag in e2e tests

* chore: remove remaining `newRoomList` flag

* chore: cleanup theme files

* fix: restore the re-resizable TouchEvent polyfill

* chore: remove usage of breadcrumbs settings in BreadcrumbStore

* Revert "fix(room-list): instantiate message previewers lazily"

This reverts commit 4e6eedfff0449c68a96c0470a4eb425b5aec5512.

* chore: remove unused function in BreadCrumbStore

* test: remove unused fuction of BreadcrumStore in tests

* test: add tests for RoomResultContextMenu
This commit is contained in:
Florian Duros
2026-07-02 09:07:37 +00:00
committed by GitHub
parent 522ec3aa57
commit b68ecdb860
103 changed files with 91 additions and 11086 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/res/css/structures/_BackdropPanel.pcss
-29
View File
@@ -1,29 +0,0 @@
/*
Copyright 2021-2024 New Vector Ltd.
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
.mx_BackdropPanel {
position: absolute;
left: 0;
top: 0;
height: 100vh;
width: 100%;
overflow: hidden;
filter: blur(var(--lp-background-blur));
/* Force a new layer for the backdropPanel so it's better hardware supported */
transform: translateZ(0);
}
.mx_BackdropPanel--image {
position: absolute;
top: 0;
left: 0;
min-height: 100%;
z-index: 0;
pointer-events: none;
overflow: hidden;
user-select: none;
}
apps/web/res/css/structures/_LeftPanel.pcss
+4 -139
View File
@@ -43,7 +43,6 @@ Please see LICENSE files in the repository root for full details.
height: 100%; /* ensure space panel is still scrollable with an outer wrapper */
.mx_LeftPanel_wrapper--user {
background-color: $roomlist-bg-color;
display: flex;
overflow: hidden;
position: relative;
@@ -57,7 +56,10 @@ Please see LICENSE files in the repository root for full details.
}
.mx_LeftPanel {
background-color: $roomlist-bg-color;
background-color: var(--cpd-color-bg-canvas-default);
/* The room list is not designed to be collapsed to just icons. */
/* 224 + 68(spaces bar) was deemed by design to be a good minimum for the left panel. */
--collapsedWidth: 224px;
/* Create a row-based flexbox for the space panel and the room list */
display: flex;
@@ -66,119 +68,12 @@ Please see LICENSE files in the repository root for full details.
flex-grow: 1;
overflow: hidden;
/* Note: The 'room list' in this context is actually everything that isn't the tag */
/* panel, such as the menu options, breadcrumbs, filtering, etc */
.mx_LeftPanel_roomListContainer {
background-color: $roomlist-bg-color;
flex: 1 0 0;
min-width: 0;
/* Create another flexbox (this time a column) for the room list components */
display: flex;
flex-direction: column;
.mx_LeftPanel_userHeader {
/* 12px top, 12px sides, 20px bottom (using 13px bottom to account
* for internal whitespace in the breadcrumbs)
*/
padding: 12px;
flex-shrink: 0; /* to convince safari's layout engine the flexbox is fine */
/* Create another flexbox column for the rows to stack within */
display: flex;
flex-direction: column;
}
.mx_LeftPanel_breadcrumbsContainer {
overflow-y: hidden;
overflow-x: scroll;
margin: 12px 12px 0 12px;
flex: 0 0 auto;
/* Create yet another flexbox, this time within the row, to ensure items stay */
/* aligned correctly. This is also a row-based flexbox. */
display: flex;
align-items: center;
contain: content;
&.mx_IndicatorScrollbar_leftOverflow {
mask-image: linear-gradient(90deg, transparent, black 5%);
}
&.mx_IndicatorScrollbar_rightOverflow {
mask-image: linear-gradient(90deg, black, black 95%, transparent);
}
&.mx_IndicatorScrollbar_rightOverflow.mx_IndicatorScrollbar_leftOverflow {
mask-image: linear-gradient(90deg, transparent, black 5%, black 95%, transparent);
}
}
.mx_LeftPanel_filterContainer {
margin: 0 12px;
padding: 12px 0 8px;
border-bottom: 1px solid $quinary-content;
flex-shrink: 0; /* to convince safari's layout engine the flexbox is fine */
/* Create a flexbox to organize the inputs */
display: flex;
align-items: center;
& + .mx_LegacyRoomListHeader {
margin-top: 12px;
}
.mx_LeftPanel_dialPadButton,
.mx_LeftPanel_exploreButton {
width: 20px;
height: 20px;
padding: var(--cpd-space-1-5x);
border-radius: 8px;
background-color: $panel-actions;
margin-left: 8px;
/* For enhanced visibility under contrast control */
outline: 1px solid transparent;
svg {
width: inherit;
height: inherit;
display: block;
color: $secondary-content;
}
&:hover {
background-color: $tertiary-content;
svg {
color: $background;
}
}
}
}
.mx_LegacyRoomListHeader:first-child {
margin-top: 12px;
}
.mx_LeftPanel_roomListWrapper {
/* Make the y-scrollbar more responsive */
padding-right: 2px;
overflow: hidden;
margin-top: 10px; /* so we're not up against the search/filter */
flex: 1 0 0; /* needed in Safari to properly set flex-basis */
&.mx_LeftPanel_roomListWrapper_stickyBottom {
padding-bottom: 32px;
}
&.mx_LeftPanel_roomListWrapper_stickyTop {
padding-top: 32px;
}
}
.mx_LeftPanel_actualRoomListContainer {
position: relative; /* for sticky headers */
height: 100%; /* ensure scrolling still works */
}
}
/* These styles override the defaults for the minimized (66px) layout */
@@ -189,40 +84,10 @@ Please see LICENSE files in the repository root for full details.
.mx_LeftPanel_roomListContainer {
width: var(--collapsedWidth);
.mx_LeftPanel_userHeader {
flex-direction: row;
justify-content: center;
}
.mx_LeftPanel_filterContainer {
/* Organize the flexbox into a centered column layout */
flex-direction: column;
justify-content: center;
.mx_LeftPanel_dialPadButton {
margin-left: 0;
margin-top: 8px;
background-color: transparent;
}
.mx_LeftPanel_exploreButton {
margin-left: 0;
margin-top: 8px;
}
}
}
}
}
.mx_LeftPanel_newRoomList {
/* Thew new rooms list is not designed to be collapsed to just icons. */
/* 224 + 68(spaces bar) was deemed by design to be a good minimum for the left panel. */
--collapsedWidth: 224px;
/* Important to force the color on ED titlebar until we remove the old room list */
background-color: var(--cpd-color-bg-canvas-default) !important;
}
#left-panel .mx_LeftPanel_wrapper--user {
/*
* Disable background when using the new room list.
apps/web/res/css/structures/_QuickSettingsButton.pcss
-2
View File
@@ -110,9 +110,7 @@ Please see LICENSE files in the repository root for full details.
display: flex;
}
}
}
.mx_QuickSettingsButton_ContextMenuWrapper_new_room_list {
.mx_QuickThemeSwitcher {
margin-top: var(--cpd-space-2x);
}
apps/web/res/css/structures/_RoomSearch.pcss
-93
View File
@@ -1,93 +0,0 @@
/*
Copyright 2024 New Vector Ltd.
Copyright 2020 The Matrix.org Foundation C.I.C.
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
/* Note: this component expects to be contained within a flexbox */
.mx_RoomSearch {
flex: 1;
min-width: 0;
border-radius: 8px;
background-color: $panel-actions;
/* keep border thickness consistent to prevent movement */
border: 1px solid transparent;
height: 28px;
padding: 1px;
/* Create a flexbox for the icons (easier to manage) */
display: flex;
align-items: center;
cursor: pointer;
.mx_RoomSearch_icon {
width: 20px;
height: 20px;
color: $secondary-content;
margin-left: var(--cpd-space-2x);
flex-shrink: 0;
}
.mx_RoomSearch_spotlightTriggerText {
color: var(--cpd-color-text-secondary);
flex: 1;
min-width: 0;
/* the following rules are to match that of a real input field */
overflow: hidden;
margin: 9px;
font: var(--cpd-font-body-sm-semibold);
}
.mx_RoomSearch_shortcutPrompt {
border-radius: 6px;
background-color: $panel-actions;
padding: 2px 4px;
user-select: none;
font-size: $font-12px;
line-height: $font-15px;
font-family: inherit;
font-weight: var(--cpd-font-weight-semibold);
color: $light-fg-color;
margin-right: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&.mx_RoomSearch_minimized {
height: 32px;
min-height: 32px;
width: 32px;
box-sizing: border-box;
.mx_RoomSearch_icon {
margin: 0 auto;
padding: 1px;
align-self: center;
}
.mx_RoomSearch_shortcutPrompt {
display: none;
}
}
&:hover {
background-color: $tertiary-content;
.mx_RoomSearch_spotlightTriggerText {
color: $background;
}
.mx_RoomSearch_shortcutPrompt {
background-color: $background;
color: $secondary-content;
}
.mx_RoomSearch_icon {
color: $background;
}
}
}
apps/web/res/css/structures/_SpacePanel.pcss
+2 -6
View File
@@ -14,7 +14,8 @@ Please see LICENSE files in the repository root for full details.
--height-nested: 24px;
--height-topLevel: 32px;
background-color: $spacePanel-bg-color;
background-color: var(--cpd-color-bg-canvas-default);
border-right: 1px solid var(--cpd-color-bg-subtle-primary);
flex: 0 0 auto;
padding: 0;
margin: 0;
@@ -33,11 +34,6 @@ Please see LICENSE files in the repository root for full details.
width: 68px;
}
&.newUi {
background-color: var(--cpd-color-bg-canvas-default);
border-right: 1px solid var(--cpd-color-bg-subtle-primary);
}
.mx_SpacePanel_toggleCollapse {
position: absolute;
width: 18px;