Commit Graph

223 Commits

Author SHA1 Message Date
ElementRobot 29b9c04d20 [create-pull-request] automated change (#33952)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-06-24 07:46:07 +00:00
ElementRobot 19d2161bce [create-pull-request] automated change (#33905)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-06-22 08:04:53 +00:00
Florian Duros 338c18df16 Room list: add release announcement for sections (#33800)
* feat: add release announcement for sections

* test: update screenshot

* test: update tests

* test: add release annoucement utils to close it

* test: close release announcement in custom section tests

* test: update release announcement e2e test

* test: add more tests

* feat: update Ra labels

* test: update screenshot

* chore: remove stale screenshot
2026-06-19 12:06:58 +00:00
David Baker 43b9bc9458 Fix long display / user names in UserMenu (#33900)
* Fix long display / user names in UserMenu

And add a playwright test to assert (see playwright screenshot for
after photo).

* Dave installs the oxfmt extension

* snapshots
2026-06-19 11:14:57 +00:00
R Midhun Suresh 0980ef0284 Make the separator container smaller (#33869)
Currently the scrollbar is broken
2026-06-17 12:04:20 +00:00
ElementRobot ecbab6d137 [create-pull-request] automated change (#33882)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-06-17 09:02:55 +00:00
Michael Telatynski eca2f39dbb Switch from prettier to oxfmt (#33844)
* Switch from prettier to oxfmt

* Make knip happy

* Make knip happy

* Apply suggestion from @t3chguy

* Rename .oxfmtrc.json to .oxfmtrc.jsonc

* Make oxfmt happier
2026-06-16 12:17:18 +00:00
David Baker 3ab233940c User status in user menu (#33797)
* Add user status on user profile icon

Currently unstyled & no tests

* Style the user status icon

* Update snapshot

for avatar wrapper

* More snapshot updates

* add if braces

* Split out user status functions

to avoid circular dep which has the weird effect of just breaking
jest's mocking.

* type imports

* Update imports

* Update snapshot

* Tests

* baseline image

* Just snapshot the component itself

* User status in user menu

first pass, unstyled

* fix export

* superstylin'

* snapshots

* Add story & test

* Snapshots

and re-use the repeated rules

* Tests

* Fix jest lcov projectRoot config

* Change tooltip text to just 'clear'

* Add comment & fix console warn

* Remove all options screenshot

as it's not really particularly useful as a preset story

* remove stale screenshot

* fix imports

---------

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-06-16 09:01:34 +00:00
Florian Duros 1c8654e394 Room list: add notifications to section headers (#33826)
* feat(sc): add notification decoration to header

* feat(vm): add notification decoration to vm

* test(e2e): add test
2026-06-15 18:05:51 +00:00
Zack 0f0f8c6ba2 Refactor UnreadNotificationBadge to shared MVVM view (#33672)
* Refactor notification badge to shared MVVM view

* Bage icons Images

* Narrow unread notification badge refactor scope

* Align unread badge MVVM pattern

* Reduce unread badge viewmodel duplication

* Document unread badge viewmodel props

* Remove legacy badge classes from shared view

* Update css for knocked door

* Update thread badge e2e selector

* Update read receipt badge e2e selectors
2026-06-15 10:20:27 +00:00
ElementRobot 48af8cad02 [create-pull-request] automated change (#33830)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-06-12 08:17:35 +00:00
Florian Duros 36a39f7fd6 Room list: fix keyboard navigation on sections (#33809)
* fix: keyboard navigation on sections

* test: add e2e test for keyboard navigation

* fix: add more keyboard navigation

* test: add e2e tests

* chore: remove useless check
2026-06-11 16:14:36 +00:00
rbondesson 8a21fdb127 Move the AutoHideScrollbar to shared components (#33777)
* First version of shared component

* Refactor as a functional component

* Add unit tests and more documentation

* Fix problem where wrappedRef was used by parent before assignment was performed.

* Use the shared component in app/web

* Clean up unused styling

* Added scrollbar-gutters as default styling in shared component

* Make sure the legacy mx_AutoHideScrollbar is set in app/web

* Updated snapshots

* Removing default style, scrollbar-gutter: stable;

* Updated snapshots

* useRef on wrapperRef to avoid loop in rendering

* scrollbar-width does not propagate

* Add AutoHideScrollbar to RoomListView

* Fix Prettier issue

* Updated snapshots

* Updated snapshot after merge

* Fix Sonar issue
2026-06-11 07:08:24 +00:00
t3chguy f5ba03da4b [create-pull-request] automated change 2026-06-10 07:44:21 +00:00
Florian Duros 5fa2da2a91 Room list: improve section in room list context menu (#33733)
* fix: hide section separator in context menu when there is no section

* fix: truncate long section name

* feat: add remove from section entry to room list item context menu

* test: update tests and stories

* test: add new test

* test: use same mocks

* test: add e2e test for "Remove from section"
2026-06-09 10:11:02 +00:00
Florian Duros c99590dcb1 Room list: remove checkmark in section toast (#33779)
* feat: remove checkmark in section toast

* test: update playwright screenshots

* chore: add figma link to room list toast sory
2026-06-08 15:39:17 +00:00
Florian Duros 1f6319b651 Room list: add fade effect to room list item being dragged (#33696)
* feat: tweak opacity of dragged room in room list

* feat: put test as primary when room item is dragged

* test: update screenshots
2026-06-08 15:35:08 +00:00
David Baker 5ab5fa1e04 Limit width of the display name in user menu (#33746)
* Limit width of the display name in user menu

Fixes https://github.com/element-hq/element-web/issues/33726

* Change js-sdk moduleNameMapper to apps/web (#33734)

Turns out the pnpm link has to be set to apps/web to actually work, so update the moduleNameMapper to look there too.

* update screenshots

* Update snapshot

* Update other snapshots

* Snapshot

* More snapshots
2026-06-05 09:49:28 +00:00
ElementRobot 1b81b04ab9 [create-pull-request] automated change (#33755)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-06-05 08:24:02 +00:00
David Baker bb07f84e41 Add user status on user profile icon (#33653)
* Add user status on user profile icon

Currently unstyled & no tests

* Style the user status icon

* Update snapshot

for avatar wrapper

* More snapshot updates

* add if braces

* Split out user status functions

to avoid circular dep which has the weird effect of just breaking
jest's mocking.

* type imports

* Update imports

* Update snapshot

* Tests

* baseline image

* Just snapshot the component itself

---------

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2026-06-04 15:15:19 +00:00
Florian Duros 96549b1edc Room list: add expand all icon to room list header (#33732)
* feat: add expand all icon to room list header

* test: add screenshot

* test: add snapshot tests
2026-06-03 15:38:24 +00:00
R Midhun Suresh 2c8fafdec4 Implement new separator design (#33599)
* Remove `onFocus` and `onBlur` handlers

react-resizable-panels fixed the issue where focus-visible was not
working as expected, so we no longer need this bit of code.

* Implement new hover/focus separator

* Collapse the panel when clicking on the new focus separator

* Remove `isFocusedViaKeyboard` from snapshot

* Update tests and storybook

* Expand panel only on double click

* Add animation

* Fix tests

* Don't render border when type is bar

* Single click to expand, double click to collapse

* Change focus separator color
2026-06-03 12:29:49 +00:00
ElementRobot 918a2dc738 [create-pull-request] automated change (#33681)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-06-03 08:19:24 +00:00
Zack 9df1a616a1 Phase 1: Add shared MImageReplyBody view (#33517)
* Add shared image reply body view

* Added storybook screens

* Fix Prettier

* Add image reply body view coverage

* Show image reply banner in visual story

* fix annotation issue with stories

* stop blurhush from reanimating to pass CI image diff
2026-06-03 08:08:21 +00:00
Zack 1c04814c2b Refactor EventPreview to shared MVVM (#33646)
* Refactor EventPreview to shared MVVM

* Fix EventPreviewView export formatting

* Snapshots images for stories

* Deduplicate event preview formatting

* Handle event preview update failures

* Coalesce event preview updates

* Wait for event preview test expectations
2026-06-02 08:36:28 +00:00
rbondesson fc23fcad47 Make shared-components tiles render identically outside Element Web - #4 (#33622)
* Use shared MessageTimestampView in edit history

* Move timestamp typography into shared component

* Updated snapshots

* Update comments after clean up

* Fixed sonar issue and added tests for improved coverage

* Fix Prettier issue

* Fix font-size on timestamps and toolbar button sizing

* Updated snapshots

* Updated Storybook screenshots

* Updated screenshots

* Clean up app/web unused/redundant styling for disambiguated profile

* Fix merge error

* Fixes after merge

* Fixes after merge
2026-06-01 05:47:59 +00:00
Zack 92383e3f50 Removing the wierd blue border color when focused + adjusted the bord… (#33630)
* Removing the wierd blue border color when focused + adjusted the border to show when squeezed at the end of border

* Update snapshots

* Update edited code block screenshot
2026-05-29 09:00:23 +00:00
rbondesson 7ff2bc3e40 Extracting RovingGridIndex from EmojiPicker and move to shared components (#33650)
* Add shared roving grid navigation provider

* Add RovingTabIndex stories and update RovingGridIndex stories

* Handle multiple toolbars/grids in on roving group

* Refactor EmojiPicker to use shared roving grid navigation

* Exclude the roving stories from playwright tests

* Fix Sonar issues
2026-05-29 08:54:58 +00:00
ElementRobot 1fb6784c1a [create-pull-request] automated change (#33657)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-05-29 08:14:34 +00:00
rbondesson 8aa5c175ad Fix story book title (#33644) 2026-05-28 11:28:00 +00:00
Zack 3bb9cb2234 Refactor ThreadSummary to MVVM (#33603)
* Refactor ThreadSummary to MVVM

* Stories Snapshot images

* Add ThreadSummary ViewModel coverage

* Fix ThreadSummary preview avatar rendering

* Remove ThreadSummary classnames helper

* Fix Prettier

* Match ThreadMessagePreview typography

* Move folder to correct path and fix storybook path

* Catch ThreadSummary preview refresh errors

* Update snapshot images + fix prettier

* Fix ThreadSummary classNames import

* Update Images

* Remove wrong path
2026-05-28 08:57:55 +00:00
Zack 34c388f760 Refactor E2eMessageSharedIcon to MVVM (#33544)
* Refactor E2eMessageSharedIcon to MVVM

* FIx Prettier and i18n

* Fix prettier

* Remove legacy E2eMessageSharedIcon component

* Cover E2eMessageSharedIcon MVVM updates

* Fix prettier

* Update apps/web/src/components/views/rooms/EventTile.tsx

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

* Skip unknown E2E shared icon visual

* Track E2E shared icon listener disposal

* Remove E2E shared icon room state guard

* Remove E2E shared icon client resync

* Use built-in disposables for shared icon VM

* Update shared icon VM without React key

---------

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>
2026-05-28 08:01:39 +00:00
Florian Duros abe383d996 Room list: improve custom sections in Spaces (#33523)
* feat: display empty custom sections in the space where they were created

* test: update tests

* fix: room can't be drag in to a section if a section is created before

* fix: re-render issue when section is created
2026-05-27 09:43:59 +00:00
ElementRobot 517b0d0edb [create-pull-request] automated change (#33628)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-05-27 08:00:49 +00:00
David Baker d533522663 Fix misaligned display name on desktop (#33623)
* Fix misaligned display name on desktop

Move the usermenu custom class to the whole thing, not just the button

* Update comment

* Update snapshot
2026-05-26 14:02:01 +00:00
R Midhun Suresh bc7ac39d5b Use the separator as border between roomlist and main panel (#33598)
* Remove border from roomlist container

The separator will act as the border so we no longer need the roomlist
border.

* Use pointer events to detect click event

Otherwise the onClick handler would run when you resize the panel.

* Support showing the border in separator

* Update tests

* Disable double click behaviour on separator

* Fix screenshot tests failing
2026-05-26 11:22:41 +01:00
Zack 384db1faaf Move E2ePadlock icon colors to CSS module (#33577)
* Move E2ePadlock icon colors to CSS module

* update react id labelling

* Update E2eMessageSharedIcon snapshots
2026-05-26 07:13:15 +00:00
ElementRobot f3bbf2c67a [create-pull-request] automated change (#33508)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-05-26 06:12:35 +00:00
rbondesson 7285293b7b Make shared-components tiles render identically outside Element Web - # 3 (#33529)
* Clean up unused app/web styling for ReactionsRow

* Align shared Storybook theme root with app/web

* Move PlayPauseButton styling into shared component

* Use closest compound icon color for all crypto events in both app/web and Storybook

* Updated snapshot

* Experimental strict color matching threshold for playwright

* Experimental color matching threshold for playwright

* Revert color matching threshold for playwright to the default value

* Updated screenshots after matching icon size in audio player with other media body components

* Changed icon color for crypto events accroding to recommendation from the design team

* Use --cpd-color-icon-primary for all crypto events

* Updated snapshots and screenshots after icon color changes

* Updated app/web snapshots and screenshots
2026-05-22 16:00:38 +00:00
Florian Duros 375fc140a6 Room list: reduce font size of sections (#33580)
* feat: reduce font size of section

* test: update existing screenshots

* test: update playwright screenshots
2026-05-22 15:55:27 +00:00
rbondesson 80024991aa Stabilise React useId values in DOM snapshots in element-web (#33579)
* Stabilise React useId values in DOM snapshots - app/web

* Stabilise React useId values in DOM snapshots - shared components

* Update additional snapshots

* Added comments and changed replace pattern to 'react-use-id-N'
2026-05-21 13:30:05 +01:00
Zack 223a861535 Move E2ePadlock to shared components (#33538)
* Move E2ePadlock to shared components

* Add storybook images

* Move translation to shared components

* Fix E2ePadlock story accessibility

* Update E2eMessageSharedIcon test for padlock role
2026-05-20 13:20:17 +00:00
David Baker 0140563b64 Tweak new user menu design (#33444)
* Tweak new user menu design

* Update screenshots

* More screenshots

* Add story with no avatar

* add story to test

* Expand the menu so it actually shows what it's supposed to show

* Use the open parameter

which is the param to open the menu

* snapshot

* Add test for normal open menu version

* Move menu to the right of the avatar

and make it appear on top of the display name

* Fix user menu layout

* screenshots

* snapshot

* screenshots

* more screenshots

* Shift toasts to the left slightly

So they completely cover the display name of the user menu when
it's expanded. Also down slightly so they're level with the user menu.

* Tweak toast border radius & position

to match & sit on top of the user menu

* Close toasts in cider tests

* Only close the toast if it's actually there

* Fix some toasts to be dismissed & update screenshots

more to come though

* Make closeKeyStorageToast actually optional

* Fix some more toasts & races

* Screenshots again again (again)

* More screenshots

* Convert to rejectToast

* Fix toast rejectors to not wait and update screenshots

* Apparently 1ms is not long enough
2026-05-19 13:10:14 +00:00
Will Hunt 02b6520f09 Module API for adding new file upload mechanisms (#33355)
* Initial reword of upload to MVVM.

* Update tests

* More incremental improvements

* Refactor tests to use helper method for composer uploads.

* Add drag and drop tests

* lint

* Add commentary

* fixup test

* More precise selector

* Retarget uploads

* lint

* fixup

* one more type

* update snap

* Fixup composerUploadFiles

* fix import

* lint

* Copy and paste fixes too

* Add tests for pasting

* Add tests for pasting files.

* Remove redundant fn

* rm comment

* tidy up

* Test cleanup

* More clean up

* another fix

* Begin fleshing out

* Park changes

* More stuff

* Use condensed version

* Cleanup tests

* more cleaning

* last bity

* Add a test for the composer

* Park up changes

* Rewrite Measured to be a functional component

* Add tests to cover narrow viewports

* lint

* breakpoint is optional

* Cleanup

* Support narrow mode

* fixup

* begone

* Provide default value

* add label

* fixup test

* update copyright

* cleanup

* Be a bit more lazy with FileDropTarget

* remove a debug statement

* Fixup

* fix two snaps

* Update screenshot

* and the other one

* Update snaps

* unfake CIDER

* update screens again

* remove extra test

* Undo accidental snapshots

* Bit of tidyup

* fixup

* even more tidyup

* may drag and drop file

* tidy up again

* snap snap snap

* Use load to make sonarQube happy

* Bunch of refactors

* More cleanup

* cleanup debug code

* tweaks

* remove a test we no longer need

* make it happy

* fix import

* fixup

* Update snaps

* typo

* one off

* Add tests

* lint

* remove only

* Reduce screenshot scope

* fix snapshot usage

* cleanup
2026-05-18 21:41:38 +00:00
rbondesson 297ad9bb8d Make shared-components tiles render identically outside Element Web - # 2 (#33485)
* Adding correct layout/density attributes to unit tests

* Move app/web styling to FileBodyView

* Unify styling for MediaBody wrapped components

* Fix prettier issues

* Update app/web snapshots

* Wrap file download and audio loading states in MediaBody

* Revert the MediaBody for download buttons.

* Revert changes for MediaBody wrappers

* Updated snaphots for MediaBody components
2026-05-18 05:59:03 +00:00
R Midhun Suresh 435acf1ba7 Call Tile - Support declined call tile (#33371)
* Extract shared types and css

* Add CallDeclinedTileView

* Add storybook and view tests

* Support declined event in view model

* Render declined view from tile factory

* Update snapshots

* Add 10px padding to top and bottom

* Distinguish between call declined by us and other users

* Support `isCallDeclinedByUs` in view model

* Update tests

* Add better comments

* Rename getInitial to generateSnapshot
2026-05-14 14:12:05 +00:00
ElementRobot 92aa3202e3 [create-pull-request] automated change (#33486)
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
2026-05-14 10:41:06 +00:00
Robin c4c32b8334 Make it possible to scroll overflowing hidden events again (#33481)
* Make it possible to scroll overflowing hidden events again

* Make hidden events scrollable without any CSS hacks
2026-05-13 13:30:11 +00:00
Zack 8400f56004 Fix edited reply quote collapse (#33487)
* Fix edited reply quote collapse

* Add regression test for edited reply quotes
2026-05-13 10:23:56 +00:00
Florian Duros 85aca65a81 Room list: drag and drop rooms into sections (#33366)
* chore: add dnd kit deps

* chore: patch dnd kit to fix ts error

* feat(sc): add drag-and-drop to room list item and wrapper

* feat(sc): make the room list header a droppable element

* feat(sc): add dnd to room list view

* feat(tags): can tag room as CHAT

* feat(vm): implement `changeRoomSection`

* feat(sc): disable dragging in flat list

* fix: disable keyboard navigation when dragging element

* test(sc): update snapshots

* test(sc): add dnd test

* test(e2e): add e2e tests for room drag and drop

* test(vm): add tests for changeRoomSection

* fix: remove focus visible when dropping with the mouse

* test(playwright): update existing screenshots

* chore(sc): move numbers out of main build

The Ew RecorderWorklet imports shared component bundle. However if the
bundle uses some deps using document/window which, the worklet will not
work.

The solution is to put the used functions into a separate bundle.

* doc(sc): add subpath import into README

* doc: typo barrel/bundle

* test: improve test expect

* refactor: add utils to section tag

* fix: incorrect check in tagRoom

* fix: add doc about dndkit tunning
2026-05-13 09:06:22 +00:00