David LangleyandGitHub a0639bfc4b Add unread toast to room list sections (#33961)
* Forward the scroller element and scroll handle through VirtualizedList

The room list needs two things the generic list did not expose: the underlying
scroll container (to observe which items are genuinely visible) and the imperative
scroll handle (to scroll an item into view). Forward an optional scrollerRef from
useVirtualizedList and pass scrollHandleRef through FlatVirtualizedList, mirroring
what GroupedVirtualizedList already exposes. Both are additive and optional, so other
consumers are unaffected.

Signed-off-by: David Langley <langley.dave@gmail.com>

* Add an unread-activity toast to the room list

Show a clickable "You have unread activity" pill when there are unread rooms
scrolled below the visible fold, including unreads hidden inside collapsed sections
whose header is below the fold. Clicking it scrolls the next such unread into view.

The visible fold is tracked with an IntersectionObserver over the rendered item
elements, so the toast appears as soon as a room crosses the fold rather than only
once it leaves Virtuoso's overscan buffer. The toast click is wired through an
imperative scroll handle the view registers with the view model.

Signed-off-by: David Langley <langley.dave@gmail.com>

* Change toast to target notifications only, not unread activity.

* Fix formatting and refresh Toast snapshots for compound-web 9.7.0

- Apply oxfmt to the room list view model and virtualized view.
- Refresh the RoomListToast/RoomListView story snapshots: compound-web
  9.7.0 moves the typography classes onto the toast .content element and
  rebuilds the Toast CSS module hashes.
- Add the missing UnreadActivityToast render snapshot baseline.

* Add e2e tests for the room list unread activity toast

Cover the unread-activity toast end to end:
- it appears for a notifying room scrolled below the fold and clicking it
  scrolls that room into view (then the toast clears);
- a room with only an unread-activity dot (no notification count) does not
  raise it;
- a collapsed section hiding a notifying room raises it, and clicking
  scrolls the section header into view.

* Add visual snapshot baselines for the unread-activity toast stories

* Converge room-list toast codepaths into a single state-driven toast

Reviewer feedback: the unread-activity toast and the transient event toasts
(section_created / chat_moved) should share one mechanism, with toast
lifecycle and precedence owned by the view model rather than split across a
separate snapshot flag and a view-level ternary.

- RoomListViewModel now reconciles the transient event toast and the derived
  unread-activity state into a single snapshot.toast via recomputeToast(); the
  event toast still takes precedence and auto-dismisses, and the unread toast
  reappears once it clears. Drops hasUnreadActivityBelow from the snapshot.
- RoomListView renders a single RoomListToast driven by snapshot.toast; the
  ToastType union gains 'unread_activity'. The standalone UnreadActivityToast
  component is folded into RoomListToast (clickable arrow-down variant).
- Adds VM tests for the unread-activity toast and the event/unread precedence.

* Pre-bundle the room-list dnd-kit + virtuoso graph in vitest browser mode

The room-list suites (RoomListView, VirtualizedRoomListView,
RoomListItemMoreOptionsMenu) import a heavy @dnd-kit + react-virtuoso graph.
Only @dnd-kit/abstract was pinned in optimizeDeps.include; @dnd-kit/dom,
@dnd-kit/react, @dnd-kit/abstract/modifiers and react-virtuoso were left to
runtime discovery. Under CI load the browser-mode dep optimizer can discover
them late, re-bundle and reload the page, which fails the in-flight
setupTests.ts import for those suites. Pinning the whole graph forces it into
the initial optimize pass so no re-run happens while tests load.

---------

Signed-off-by: David Langley <langley.dave@gmail.com>
2026-06-29 08:55:26 +00:00
2026-05-29 08:26:59 +00:00
2026-06-08 10:32:55 +01:00
2026-06-17 09:07:21 +00:00
2026-06-05 07:42:26 +00:00
2025-10-29 10:59:33 +00:00
2026-06-23 13:31:56 +00:00
2026-05-29 08:26:59 +00:00
2026-03-24 12:59:24 +00:00
2026-04-16 15:25:52 +00:00
2026-06-23 10:03:31 +00:00
2026-04-10 17:39:46 +01:00
2026-03-24 13:33:49 +00:00

Chat Tests Static Analysis Localazy Quality Gate Status Coverage Vulnerabilities Bugs

Element

Element (formerly known as Vector and Riot) is a Matrix web & desktop client built using the Matrix JS SDK.

Supported Environments

Element has several tiers of support for different environments:

  • Supported
    • Definition:
      • Issues actively triaged, regressions block the release
    • Last 2 major versions of Chrome, Firefox, and Edge on desktop OSes
    • Last 2 versions of Safari
    • Latest release of official Element Desktop app on desktop OSes
    • Desktop OSes means macOS, Windows, and Linux versions for desktop devices that are actively supported by the OS vendor and receive security updates
  • Best effort
    • Definition:
      • Issues accepted, regressions do not block the release
      • The wider Element Products (including Element Call and the Enterprise Server Suite) do still not officially support these browsers.
      • The element web project and its contributors should keep the client functioning and gracefully degrade where other sibling features (E.g. Element Call) may not function.
    • Last major release of Firefox ESR and Chrome/Edge Extended Stable
  • Community Supported
    • Definition:
      • Issues accepted, regressions do not block the release
      • Community contributions are welcome to support these issues
    • Mobile web for current stable version of Chrome, Firefox, and Safari on Android, iOS, and iPadOS
  • Not supported
    • Definition: Issues only affecting unsupported environments are closed
    • Everything else

The period of support for these tiers should last until the releases specified above, plus 1 app release cycle(2 weeks). In the case of Firefox ESR this is extended further to allow it land in Debian Stable.

For accessing Element on an Android or iOS device, we currently recommend the native apps element-x-android and element-x-ios.

Getting Started

The easiest way to test Element is to just use the hosted copy at https://app.element.io. The develop branch is continuously deployed to https://develop.element.io for those who like living dangerously.

To host your own instance of Element see Installing Element Web.

To install Element as a desktop application, see Running as a desktop app below.


Monorepo

This repository is a monorepo hosting Element Web and other related projects in various subdirectories. You can read more about the structure here.

Element Web

To learn more about Element Web click here

Running as a Desktop app

Element can also be run as a desktop app, wrapped in Electron. You can download a pre-built version from https://element.io/get-started or, if you prefer, build it yourself.

To build it yourself, follow the instructions at https://github.com/element-hq/element-web/tree/develop/apps/desktop.

Many thanks to @aviraldg for the initial work on the Electron integration.

The configuration docs show how to override the desktop app's default settings if desired.

Development

Please read through the following:

  1. Developer guide
  2. Code style
  3. Contribution guide

Translations

To add a new translation, head to the translating doc.

For a developer guide, see the translating dev doc.

Triaging issues

Issues are triaged by community members and the Web App Team, following the triage process.

We use issue labels to sort all incoming issues.

Copyright (c) 2014-2017 OpenMarket Ltd Copyright (c) 2017 Vector Creations Ltd Copyright (c) 2017-2025 New Vector Ltd

This software is multi licensed by New Vector Ltd (Element). It can be used either:

(1) for free under the terms of the GNU Affero General Public License (as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version); OR

(2) for free under the terms of the GNU General Public License (as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version); OR

(3) under the terms of a paid-for Element Commercial License agreement between you and Element (the terms of which may vary depending on what you and Element have agreed to). Unless required by applicable law or agreed to in writing, software distributed under the Licenses is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the Licenses for the specific language governing permissions and limitations under the Licenses.

Please contact licensing@element.io to purchase an Element commercial license for this software.

S
Description
No description provided
Readme AGPL-3.0
1.5 GiB
2026-05-13 14:01:59 +00:00
Languages
TypeScript 93.8%
CSS 4.6%
JavaScript 0.7%
HTML 0.6%