88 Commits

Author SHA1 Message Date
Michael Telatynski
30f442208a
Fix React hydration issues (#32958)
* Add more playwright axe tests to settings dialogs

* Add utility to jest setupTests to detect React hydration errors

* Iterate jest utility

* Fix axe issue heading-order

* Fix div-in-p issues

* Fix setupTests.ts

* Fix heading order

* Make types happier

* Fix hydration issues of thead containing text nodes

* Update tests

* Fix form-in-form React hydration issues

* Fix li-in-li React hydration issues

* Fix checked in form without onChange React hydration issue

* Fix styling bleeding from _common.pcss

* Update snapshots

* Fix more remaining issues

* Remove _common.pcss h2 rule altogether

* Fix test

* Update snapshots

* Iterate

* Iterate

* Update snapshots

* Simplify diff

* Test

* Update screenshots

* Update screenshot
2026-04-16 13:35:40 +00:00
Michael Telatynski
64d3802efe
Fall back to OIDC response_mode query if fragment unsupported (#33169)
* Fall back to OIDC response_mode query if fragment unsupported

* Tidy comments

* Fix test
2026-04-16 11:07:39 +00:00
Michael Telatynski
de4a1e6d35
Switch OIDC to response_mode=fragment (#33100)
* Refactor: kill off `parseQs` in favour of URLSearchParams

* Consolidate app-load url parameter handling

* Switch to responseMode=fragment
2026-04-15 09:35:02 +00:00
Zack
80cf9e5b4a
Shared Components Restructure, Cherry Picked | Room Shell Structure (#32917)
* refactor(shared-components): move composer and right-panel tree

* refactor: cleanup remaining structure leftovers

* test(shared-components): add room shell visual baselines

* Correct Path
2026-04-14 13:20:15 +00:00
Florian Duros
23b11aaf86
Update compound web and compound design tokens (#33120)
* chore: update compound web and compound design tokens

* test: update SC snapshots

* test: update EW snapshots

* test: update EW screenshots
2026-04-13 15:40:24 +00:00
Richard van der Hoff
eef8cad229
Update to compound-web 9.0.1 (#33095)
* Update to compound-web 9.0.1

There are a couple of breaking changes in v9, leading to the changes in
`BugReportDialog` and `EncryptionCard`.

Most of these updates, however, are snapshot updates, due to changes in the CSS
class names in compound web (which happens due to updates in the CSS content in
those classes; `postcss-modules` generates class names based on the hash of the
CSS).

* update playwright screenshots
2026-04-13 10:16:34 +00:00
Richard van der Hoff
4186b8e8e8
Convert TextualBody-test to out-of-line snapshots (#33104)
Sonar complains about duplication in the inline snapshots
2026-04-10 15:52:59 +00:00
Jefta
7b9e586c3a
Hide spoilers from desktop notifications (#31699)
* Hide spoilers from desktop notifications

* Replace unicode blocks with spoiler tag

* Run prettier

* Add comments
2026-04-10 15:45:25 +00:00
Richard van der Hoff
4c4bfcde7e
Inline inviteMultipleToRoom (#33027)
This two-line method serves mostly to obfuscate, imho. Let's get rid of it.
2026-04-09 22:11:12 +00:00
Florian Duros
a5e09ebb53
feat: expand sections when filter is toggled (#33077) 2026-04-09 13:14:41 +00:00
Will Hunt
b4d0c21abf
Update URL Preview settings (#32992)
* Remove ability for url previews to be set per-room

* Add ability to enable E2EE URL Previews globally

* Remove old migration

* Cleanup

* Remove room account handler

* update snap

* screenshot updated

* Add a test
2026-04-09 12:32:50 +00:00
Robin
253dcb44dd
Show a 'grab' cursor on picture-in-picture view (#33079)
* Remove unused 'draggable' prop from PictureInPictureDragger

* Show a 'grab' cursor on picture-in-picture view

To give it a proper affordance for dragging.
2026-04-09 12:25:14 +00:00
Zack
70e40009a3
Fix issues with /me emote two liner (#33081)
* Fix issues with me emote liner

* Fix Prettier
2026-04-09 12:13:02 +00:00
Joao Pedro Antunes Borie
5ba09a5f90
Fix #32727: Ensure VoiceRecording uses the selected microphone (#32887)
Voice messages were being recorded using the system default microphone
instead of the device selected in Element settings.

This was fixed by ensuring the preferred deviceId is correctly passed
to the MediaStream constraints in VoiceRecording.ts.

Added unit tests in VoiceRecording-test.ts to verify that the
application correctly requests the user-selected device.

Co-authored-by: Will Hunt <2072976+Half-Shot@users.noreply.github.com>
2026-04-09 11:07:32 +00:00
Florian Duros
121c2d18e9
Room list: fix expanded/collapse state of sections (#33074)
* fix: section being empty in flat list mode

When switching space (or removing a section later), if the Chat section
is collpased and the room list is in flat list mode in the other space,
the room list is empty.

The fix forces the section to be in expanded state if in flat list mode

* fix: store section expanded state by space
2026-04-08 13:44:52 +00:00
Zack
d197fb4e30
Refactor and Move TileErrorBoundary to Shared Components (#32793)
* creation of stories and view in shared-components

* migrate EventTile error fallback to shared TileErrorView MVVM

* Fix lint errors and unused import

* Update tests because of the refactoring

* Update snapshots + stories

* removal of mxEvent since it never changes in timeline

* Update packages/shared-components/src/message-body/TileErrorView/TileErrorView.stories.tsx

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

* Update apps/web/src/viewmodels/message-body/TileErrorViewModel.ts

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

* Update apps/web/src/viewmodels/message-body/TileErrorViewModel.ts

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

* docs: add TileErrorView tsdoc

* docs: add TileErrorViewModel tsdoc

* docs: add view source label tsdoc

* refactor: move tile error layout into vm

* docs: add TileErrorView story view docs

* docs: move tile error story list wrapper

* refactor: remove unused tile error event setter

* Update packages/shared-components/src/message-body/TileErrorView/TileErrorView.stories.tsx

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>

* docs: add tsdoc for event tile error fallback props

* refactor: rely on snapshot merge no-op checks

* remove unessecery if statment

* test: restore EventTile mocks in afterEach

* test(shared-components): move TileErrorView baselines

---------

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>
2026-04-08 09:05:31 +00:00
renovate[bot]
6e9fc9b8fa
Update npm non-major dependencies (#33001)
* Update npm non-major dependencies

* Update snapshot

* Patch plist for compatibility with updated @xmldom/xmldom

* Lockfile

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-04-08 07:40:43 +00:00
R Midhun Suresh
edea3fffdf
Collapsible Left Panel - Ensure that panels have non-fractional widths (#33052)
* Expand panel to full width

* Write tests

* Resize to nearest whole number if necessary

* Update screenshots

* Early return when resizing to whole width

* Update screenshot
2026-04-07 15:44:51 +00:00
Michael Telatynski
6c1dc7051f
Accessibility improvements in settings (#32968)
* Add more playwright axe tests to settings dialogs

* Fix axe issue heading-order

* Fix heading order

* Iterate

* Update snapshots

* Iterate

* Update snapshots

* Iterate

* Update screenshot

* Iterate

* Iterate

* Update snapshot
2026-04-07 15:17:59 +00:00
Will Hunt
5de316b752
Move Low Bandwidth feature to devtools. (#32797)
* Move and rename low bandwidth mode.

* Still in use.

* remove string

* Add a test for low bandwidth mode

* Test requests too

* update snaps

* New year!
2026-04-07 12:16:35 +00:00
R Midhun Suresh
6b00466a85
Collapsible Left Panel - Clicking on separator should expand to 100% when no width is available in settings (#33053)
* Expand panel to full width

* Write tests
2026-04-07 12:05:36 +00:00
renovate[bot]
2bef316bed
Update dependency caniuse-lite to v1.0.30001781 (#32996)
* Update dependency caniuse-lite to v1.0.30001781

* Update tests

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-04-07 10:02:33 +00:00
Florian Duros
46bff1f9e6
Room list: add activity marker to sections (#33024)
* feat: add unread status to section view

* feat: add unread tracking in room list section

* feat: populate rooms into section header vm

* test: add units for unread in section view model

* test(e2e): add unread tests
2026-04-06 19:05:45 +00:00
Richard van der Hoff
5e140768f0
InviteDialog: remove broken checks for unknown users (#33026)
* InviteDialog: remove broken checks for unknown users

Per https://github.com/element-hq/element-web/issues/33020, this doesn't
actually work, and if we were to bring it back, we'd design it differently.

* Remove now-unused `UserProfilesStore.getProfileLookupError`

This was only used in `InviteDialog.checkProfileAndStartDm`, which has now been
removed.
2026-04-02 15:31:29 +00:00
Michael Telatynski
2d3e2fcb70
Remove global h2 css rule in favour of heading styles/components (#32969)
* Remove global h2 css rule in favour of heading styles/components

* Use Compound Heading in shared-components

and forbid hX elements

* Use Compound Heading in settings

add back margin to some legacy headings

* Tweak some headings

* Update screenshots

* Update screenshots

* Update snapshots

* Tweak .gitignore

* Update snapshots

* Iterate

* Update screenshots

* Update screenshots

* Update screenshot
2026-04-02 16:13:17 +00:00
rbondesson
4315038346
Refactor MessageActionBar using MVVM and move to shared-components (#32784)
* Refactor MessageActionBar into MVVM ActionBarView

* Adding tooltips for menu items and correct i18n strings

* Layout changes

* Renaming some properties

* Rename property

* Create a first version of the view model and refactor media visibility logic

* Refactor view to take options and rections menu as optional properties

* Cleaner interface between view and view model

* Refactor view properties and replace Menu and MenuItem

* Bugfixes and switching to ActionBarView instead of MessageActionBar in element-web

* Avoid creating view models and render toolbar until it is actually shown

* Added unit and playwright tests and documented the view

* Added view model unit tests and updated snapshots of dependant tests

* Remove unused components and unnecessary css

* Remove unused language tags

* Fix for handling join-rules correctly

* Prettier

* Add handling of stale view model in async calls

* Prettier

* Split the element-web css into two different. One for legacy components and one for the ActionBarView

* Missing variables used for linting

* Fix for showing ActionBarView when using keyboard for navigation

* Handle visibility on context menu closing

* ThreadPanel uses the ActionBarView so restore css rule

* Fix for visibility of the ActionBarView in Thread panel

* Fix for ActionBarVuew visibility when closing right-click context menu and not still hovering

* Add roving index to function as a toolbar

* Adjust the RoomView test to send hover to the EventTile instead of the message text

* Fix SonarCloud issues

* Fix for SonarCloud issue

* Merge fix

* Rename mx_LegacyActionBar to mx_ThreadActionBar

* Added documentation and simplified join rules

* Generalize the ActionBarView and move logic to view model

* Add the four new buttons to the ActionBarView

* Update view model and tests to use the updated ActionBarView

* Refactor element-web to use ActionBarView

* Clean up styling in element-web

* Clean up and updating snaps and screenshots

* Added unit-tests for better coverage

* Moving ActionBarView to the correct folder in shared components

* Update snaps in element-web

* Better documentation in stories

* Merge fixes

* Updates after review comments

* Review comment fixes

* Added documentation to view models and updated snaps

* Hide button had the wrong label

* Replace createRef with useRef
2026-04-01 12:27:03 +00:00
Zack
0391543bbc
Refactor and move MVideoBody to shared components (#32849)
* init MVideoBody to shared components, including test, stories and view

* fix prettier and other warnings

* move video message body to shared view + app viewmodel

* Fix prettier warnings and masking spinner for tests

* stabilize VideoBodyView screenshots with local media asset

* Disable spinner from changing image all the time

* Added mask over video spinner to prevent issues with new generated images on playwright tests

* Update prettier fix

* Update snapshot

* Add tests to cover different states of Video

* Update code to prevent the previous component Hack fix regarding jumps on the timeline.

* Update snapshot

* Update code to improve code quality for Sonar + update snapshot

* adde documentation snippets

* refactor: move m.video rendering into body factory

* docs: add tsdoc for video body view model

* docs: add thumbnail tsdoc for video body view model

* docs: add content-url tsdoc for video body view model

* docs: add dimensions tsdoc for video body view model

* docs: add aspect-ratio tsdoc for video body view model

* docs: add tsdoc for video body view state

* refactor: replace video body view state enum

* refactor: remove duplicate video body state init

* refactor: drop unused video body view state attribute

* Fix Prettier

* Update snapshot screenshot

* test: restore video story screenshot mask

* chore: refresh PR head

* Add mask to screenshot to pass CI tests

* test: narrow video story mask hook

* Fix easy Sonar warnings in video body components

* Move shared message body views into event-tile layout

* Move shared message body visual baselines

* Revert unrelated shared message body moves
2026-04-01 09:48:22 +00:00
JephDiel
3e04b24d1e
Allow Element Call to use MSC4039 (#32755)
* Allow Element Call to use MSC4039

Allow Element Call to use MSC4039 so it can
download avatars if it can't authenticate with the
server directly.

* Test Allowing Element Call to use MSC4039

---------

Co-authored-by: Valere Fedronic <bill.carson@valrsoft.com>
2026-04-01 08:14:16 +00:00
Florian Duros
0f515f581e
Room list: add default sections (#32785)
* feat: add sections to RLSV3

* feat: add sections in vms

* feat: add room list section labs flag

* fix: wrong margin for room list item when in sections

* feat: hide favourites and low priority filters

* fix: crash when changing filter

* feat: support sticky room in sections

* test: update SC snapshot

* test: update SC screenshot

* test: update RLS tests

* test: add tests to RoomListSectionHeaderViewModel

* test: fix existing test in RoomListViewModel

* test: add sections tests for RoomListViewModel

* test: add e2e tests for sections

* fix: incorrect selected room when expanding/collasping a section

* fix: typo in `roomSkipList`

* feat: use one skip list with all filters instead of one list by tag

* chore: put back comment about `roomIndexInSection`

* chore: add missing `readonly`

* chore: add doc about possible undefined value for room item vm
2026-03-31 18:43:32 +00:00
Zack
dda9ec061b
Shared Components Restructure, Cherry Picked | Room Timeline (#32916)
* refactor(shared-components): move room timeline tree

* refactor(web): move room timeline viewmodels

* Prettier FIx

* fix(refactor): align newer imports with room timeline paths

* test(shared-components): add room timeline visual baselines

* test(shared-components): drop stale timeline baseline paths
2026-03-30 15:15:21 +00:00
Will Hunt
e0cf78b5b8
Add analytics tracking for URL previews (#32659)
* Add analytics tracking.

* fix import

* fix other import too

* fixup type

* Add test case

* Add better testing

* make it happier

* update lock
2026-03-30 10:10:46 +00:00
R Midhun Suresh
1dbad6101e
Collapsible Room List - Clicking on separator should expand to last set width (#32909)
* Expand panel to last known width

* Update test
2026-03-29 12:23:53 +00:00
Florian Duros
b3299dfbb3
Fix icon size of badges in right panel (#32952)
* fix: icon size of badges in right panel

* test: update snapshot

* test: update screenshot
2026-03-26 20:29:21 +00:00
Robin
5a074e637a
Fix room list often showing the wrong icons for calls (#32881)
* Give rooms with calls a proper accessible description

Besides improving accessibility, this makes it possible to check for the presence of a call indicator in the room list in Playwright tests.

* Make room list react to calls in a room, even when not connected to them

To use the results of CallStore.getRoom reactively, you need to listen for Call events, not ConnectedCalls events.

* Don't assume that every call starts off as a video call

If a Call object is created by way of someone starting a voice call, then of course the call's initial type needs to be 'voice'.

* Make room list items react to changes in call type

The type of a call may change over time; therefore room list items explicitly need to react to the changes.

* Update a call's type before notifying listeners of the change

If we notify listeners of a change in a call's type before actually making that change, the listeners will be working with glitched state. This would cause the room list to show the wrong call type in certain situations.

* Ignore the Vitest attachments directory
2026-03-26 10:28:48 +00:00
Florian Duros
441b292353
RoomList: improve performance (#32919)
* perf: add memo to room avatar view

* perf: batch rlsV3 emit

* perf: avoid to re-render the room list if the room list state and sections are same

* perf: listen only message preview of the specific room

* perf: avoid to re-render the room list item if the notification or the content is same

* chore: replace useState and useEffect by useMemo in virtualized list

* fix: listen to room name event in RoomAvatar

* fix: room avatar re-render when room is low priority
2026-03-25 19:52:45 +00:00
Michael Telatynski
ec47986ef5
Fix emoticon slash commands including stale buffers (#32928) 2026-03-25 17:06:35 +00:00
Florian Duros
1025d60001
Avoid excessive re-render when setting same reference/value in snapshot (#32918)
* perf: avoid excessive re-render when setting same value in snapshot

* test: update tests
2026-03-25 15:23:11 +00:00
Michael Telatynski
4d72aa22e3
Update links to old repo
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2026-03-24 13:33:49 +00:00
Zack
4f3a1a2cc6
Refactor and Move RedactedBodyView To Shared Components (#32772)
* refactoring and creation of shared-components for reductedBodyView

* move redacted message rendering to shared MVVM view

* Update snapshots + fix lint errors

* Remove MatrixClientPeg and use reguler react matrix client context

* Stop resyncing redacted body view models with mxEvent

* Fix redacted_because test fixtures for stricter event typing

* Simplify redacted body client access

* Watch timestamp setting in redacted body view model

* Refactor redacted and decryption failure body factories into MBodyFactory

* Prettier Fix

* Refactor FileBody into same pattern for consitancy
2026-03-24 10:02:07 +00:00
DLCSharp
54d3ab9e69
Fix presence indicators not showing without cache (#32880)
* Fix presence indicators not showing on initial login without cache

* Fix lint exhaustive-deps : useEffect room
2026-03-23 18:09:42 +00:00
Gustavo Ribeiro
4530635db9
Show space name instead of 'Empty room' after creation (#32886)
* Fix #32682: Show space name instead of 'Empty room' after creation

When creating a new space, the setup screens showed 'Empty room' or
'New room' instead of the chosen name.

The 'createSpace' function nested 'name' and 'topic' inside
'createOpts'. However, the creation flow expects them at the top
level of the options object. This caused the name to be undefined.

This patch modifies SpaceCreateMenu.tsx to move these properties to
the top-level. It also updates SpaceCreateMenu-test.tsx with a
regression test to verify the fix and prevent future regressions.

* fix: format SpaceCreateMenu test with prettier
2026-03-23 17:55:39 +00:00
Éloi Rivard
aecdbc38cf
fix: strip ephemeral query params from OIDC redirect URI (#32875)
getOidcCallbackUrl() was building the redirect_uri from window.location.href,
which may contain ephemeral params such as `updated` (appended on auto-update of element-web).
This caused a redirect_uri mismatch on authorization servers.
2026-03-23 15:21:03 +00:00
R Midhun Suresh
99e6ede9f1
Implement collapsible panels for the new room list (#32742)
* Add `react-resizable-panels` library

* Implement a custom SeparatorView

* Add a `LeftResizablePanelView`

* Add a custom `GroupView`

* Export everything from shared-components

* Make it possible to track width/collapse state through settings

* Add a view model to drive the views

* Render views without disrupting the old room list

* Fix lint error

* Disable user interaction on collapsed panel

* Prevent widgets fron hijacking pointer events

* Expand to full width on separator click

* Separator should be shown when focused via keyboard

* Update tests

* Use data-attribute for hover

* Write stories for SeperatorView

* Write vite tests for SeparatorView

* Write tests for LeftResizablePanelView

* More tests

* Fix lint errors

* Fix flakey border on the roomlst

* Fix storybook axe violation

* Update snapshots

* Fix playwright tests

* Fix sonarcloud issues

* Use translated string

* Add better js-doc comments

* Rename `ResizerSnapshot` to `ResizerViewSnapshot`

* Externalize react-resizable-panels

* Link figma designs to stories

* Write playwright tests

* Update screenshots

* Fix lint errors

* Update more screenshots

* Update more screenshots

* Fix flaky toast test

* Update apps/web/playwright/e2e/crypto/toasts.spec.ts

Co-authored-by: Andy Balaam <andy.balaam@matrix.org>

* Fix indentation

---------

Co-authored-by: Andy Balaam <andy.balaam@matrix.org>
2026-03-23 13:33:32 +00:00
renovate[bot]
b2c19d4ed9
Update dependency caniuse-lite to v1.0.30001780 (#32835)
* Update dependency caniuse-lite to v1.0.30001780

* Update test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-03-20 13:56:25 +00:00
Florian Duros
9358096ac6
Fix soft crash of room list when trying to open a room (#32864)
* fix: soft crash of room list trying to get item vm

* test: add test to check roomMap recovery and cleared when needed
2026-03-20 13:36:58 +00:00
ElementRobot
8a38a2fe4a
Localazy Download (#32808)
* [create-pull-request] automated change

* test: update SC tests

* test: update SC screenshots

* test: update EW snapshots

* test: update EW tests

* test: update EW e2e tests

---------

Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
Co-authored-by: Florian Duros <florian.duros@ormaz.fr>
2026-03-18 15:53:28 +00:00
Andy Balaam
2128c1884c
Hide the names of banned users behind a spoiler tag (attempt 2) (#32636) 2026-03-18 10:47:16 +00:00
Florian Duros
136bb78c15
Tidy up snapshot, actions and vm names according to MVVM doc (#32819)
* chore: rename snapshot, actions and vm according to MVVM doc

* doc: add naming conventions

* chore: fix UrlGroupView naming, folders and children

* chore: remove `Example` column

* refactor: rename `UrlPreviewGroupViewPreview` into `UrlPreview`
2026-03-17 14:20:52 +00:00
Florian Duros
ee5d2609df
Room list: add sections to shared components (#32735)
* feat: add section header

* refactor: remove index and role related to list box from RoomListItemView

* feat: add wrapper to RoomListItemView to handle different accessiblity pattern

* feat: add section support to VirtualizedRoomListView

* feat: add sections support to RoomListView

* test: add screenshot for sections header

* test: add/update screenshots for sections

* feat: force flat list on view model

This is an intermediary step before implementing sections in the vm. We
force the flat list but we use the underneath the view supporting
sections.

* test: update RoomListViewModel test

* test: fix breaking test

* chore: rename `getSectionViewModel` to `getSectionHeaderViewModel`

* chore: add missing `RoomListItemAccessibilityWrapper` export

* chore: merge `react` imports

* chore: simplify and add comment to `getItemKey` and `getHeaderKey`

* chore add comments to `getItemComponent` variants

* chore: fix typo in example doc
2026-03-16 16:40:12 +00:00
Andy Balaam
d18aa31d7d
Change 'Verify' to 'Continue' in verify this device toast (#32813) 2026-03-16 15:07:57 +00:00