5689 Commits

Author SHA1 Message Date
Michael Telatynski
3848d570be
Inhibit keyboard highlights in dialogs when effector is not in focus (#31181)
* Inhibit keyboard highlight in spotlight dialog when effector is not in focus

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

* Inhibit keyboard highlight in forward dialog when effector is not in focus

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

* Fix search box height bouncing on focus/blur

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

* Update screenshot

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-11-06 16:32:46 +00:00
David Baker
42f8247c2e
Experimental Module API Additions (#30863)
* Module API experiments

* Move ResizerNotifier into SDKContext

so we don't have to pass it into RoomView

* Add the MultiRoomViewStore

* Make RoomViewStore able to take a roomId prop

* Different interface to add space panel items

A bit less flexible but probably simpler and will help keep things
actually consistent rather than just allowing modules to stick any
JSX into the space panel (which means they also have to worry about
styling if they *do* want it to be consistent).

* Allow space panel items to be updated

and manage which one is selected, allowing module "spaces" to be
considered spaces

* Remove fetchRoomFn from SpaceNotificationStore

which didn't really seem to have any point as it was only called from
one place

* Switch to using module api via .instance

* Fairly awful workaround

to actually break the dependency nightmare

* Add test for multiroomviewstore

* add test

* Make room names deterministic

So the tests don't fail if you add other tests or run them individually

* Add test for builtinsapi

* Update module api

* RVS is not needed as prop anymore

Since it's passed through context

* Add roomId to prop

* Remove RoomViewStore from state

This is now accessed through class field

* Fix test

* No need to pass RVS from LoggedInView

* Add RoomContextType

* Implement new builtins api

* Add tests

* Fix import

* Fix circular dependency issue

* Fix import

* Add more tests

* Improve comment

* room-id is optional

* Update license

* Add implementation for AccountDataApi

* Add implementation for Room

* Add implementation for ClientApi

* Create ClientApi in Api.ts

* Write tests

* Use nullish coalescing assignment

* Implement openRoom in NavigationApi

* Write tests

* Add implementation for StoresApi

* Write tests

* Fix circular dependency

* Add comments in lieu of type

and fix else block

* Change to class field

---------

Co-authored-by: R Midhun Suresh <hi@midhun.dev>
2025-11-05 07:24:26 +00:00
David Langley
4e57b80556
Change polls to use fieldset/legend markup (#31160)
* Change polls to use fieldset/legend markup

* Update MPollEndBody-test.tsx.snap

* Fix letter spacing in legend

* Update PollHistory-test.tsx.snap
2025-11-04 09:55:35 +00:00
David Baker
b0cdbf5eff
Make shared component build work in isolation (#31066)
* Make shared component build work in isolation

 * Add deps that were missing because they were getting picked up
   from element-web main but shared-components needs itself
 * Exclude test files from dts generation
 * Bump version

* Change all the shared-component import to be the built artifact

* Don't randomly inhale eslint configs in parent dirs please

* maybe we don't need this anymore?

* maybe fix build

* Maybe fix docker build

* More build faff

 * build:res on the parent as part of shared component prepare
 * link shared component repo inn docker build

* 💅

* 💅x2

* Try converting the translation keys to a .d.ts file manually

so it gets bundled rather than left as a relative import to the json
file

* add the script

* Add this back for 2nd time now I think

* Shouldn't need this anymore

* patch-package on prepare

because we're patching a dev dependency so it won't be there if we're
installed as a dependency

* Unused import

* Prettier compliance

* Only use counterpart from shared components

as per comment

* Import shared components CSS

* Prettier

* Call the one from shared components

rather than recurse infinitely

* Hopefully make tests work

* wake up, comment goes before import

* Fix lint errors

* Fix dupe TranslationKey export

* Update compound-web to fix type error

An update to @types.react adds the 'hint' value to the enum of the
'popover' attribute and this version of compound-web uses the maching
verson of @types/react so they don't conflict.

* Maybe, hopefully, get the types working?

Please?

* Add copyright header to i18nkeys

as eslint complains otherwise since it's now in src

* prettier

* stop running shared-component tests in EW

* update snapshots

because flex is now from an external stylesheet I guess

* More snapshots

* Manual class update

* Avoid bundling compound bits

Because a) it's silly and b) it means we end up bundling a copy of
floating-ui too which causes absolute madness with its useDelayGroup
contexts.

* ignore test util files for coverage

* Add !important

because the styles are being applied in a different order now

* Another !important because css order has changed

* Try adding it here to make the test files ignored

* More !important

* commit yarn lock change

* Add shared components coverage file

* Update snapshots

Because the line height was being overridden to 22.5px somehow by
something I can't find, and now isn't: surely the normal 1.5rem is
more sensible.

* Update snapshots, attempt 2

* Another !important

* More snapshot updates

* Add test for i18n wrappers

& add test script

* lint

* Prettier

* Hopefully run shared component tests

* don't need this bit for non-matrix

* install ew deps

* rigfht coverage location

* Rename job here too

* Try different coverage filename

* Fix copyrights & comment

* Typo

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2025-11-03 16:26:47 +00:00
David Langley
36ccc1ae9a
Fix screen readers not indicating the emoji picker search field is focused. (#31128)
* Only set active descendant when the user starts typing.

* Fix jest tests.

* Remove aria-hidden

It was failing code quality checks and it actually wasn't addressing the issue.

* Only show highlight on arrow key navigation or updating the search query.

* Update screenshots

* Enter should not select an emoji if it is not highlighted.

* On clearing a query and using arrow kets again the highlighted emoji should be reset to the first.

* Update selector in picker tests
2025-10-31 17:10:02 +00:00
Michael Telatynski
017aee9a8f
Fix emoji picker highlight missing when not active element (#31148)
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-10-31 15:20:57 +00:00
David Langley
3ae91d69da
Make emoji picker height responsive. (#31130)
* Make the height of the emoji picker responsive.

* Add screenshots for the emoji picker and a one with reduced height.

* prettier
2025-10-30 09:31:02 +00:00
Hubert Chathi
b7db85146f
Add a devtool for looking at users and their devices (#30983)
* add devtool for viewing users and their devices

* show number of devices

* apply changes from review

* Fix typo

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2025-10-28 20:18:10 +00:00
Michael Telatynski
f6731ec318
Show hover elements when keyboard focus is within an event tile (#31078)
* Show timestamps when keyboard focus is within an event tile

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

* Ensure toolbar navigation pattern works in MessageActionBar

This requires all buttons within to be roving by using the ref callback given by useRovingTabIndex

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

* Use PureComponent in EventTile to avoid mass re-rendering due to transitive onFocus/onBlur calls

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

* Remove unused timestamp event tile prop

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

* Use MessageTimestamp to generate the wrapping anchor so that focusing it brings up the tooltip

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

* Tweak MessageTimestamp

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

* Switch back to Component as we specify a shouldComponentUpdate already

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

* Update jest tests

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

* Update playwright timestamp masks

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

* Revert snapshot

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

* Update snapshot

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

* Fix IRC layout

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

* Use PureComponent in EventTile to avoid mass re-rendering due to transitive onFocus/onBlur calls

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

* Remove unused timestamp event tile prop

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

* Use MessageTimestamp to generate the wrapping anchor so that focusing it brings up the tooltip

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

* Tweak MessageTimestamp

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

* Switch back to Component as we specify a shouldComponentUpdate already

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

* Update jest tests

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

* Update playwright timestamp masks

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

* Revert snapshot

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

* Update snapshot

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

* Fix IRC layout

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

* Lint styles

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

* Fix layout picker

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

* Update snapshots

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

* Update screenshots

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

* Fix pcss comment

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

* Iterate Playwright

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

* Iterate

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

* Iterate Playwright

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-10-28 09:33:02 +00:00
Michael Telatynski
b3188b47be
Simplify favicons and other web icons (#31000)
* Simplify favicons and other web icons

browserconfig.xml seems to have died with Internet Explorer
`apple-touch-icon` is awfully documented but seems like larger sizes are now preferred
Use PNG for the favicon as things now support it across the board, we could even consider moving to SVG favicons in the future

Optimised using oxipng, this is to simplify icon replacement in `element-web-bin`

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

* Fix paths

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

* Update tests

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

* Remove border around favicons

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

* Add test

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

* Add test

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-10-14 13:08:52 +00:00
Michael Telatynski
bc7b50f97c
Fix platform settings race condition and make auto-launch tri-state (#30977)
* Fix race condition with platform settings not being read correctly

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

* Allow Desktop app to be auto-started minimised or focused

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

* i18n

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

* Iterate

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

* Use onChange prop

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

* Iterate

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

* Iterate

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

* Add tests

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

* Update res/css/views/elements/_SettingsDropdown.pcss

Co-authored-by: Florian Duros <florianduros@element.io>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: Florian Duros <florianduros@element.io>
2025-10-09 13:20:53 +00:00
Florian Duros
9cecd52477
Improve invite dialog ui - Part 2 (#30836)
* feat: add `Pill` component

* chore: add `react-merge-refs` lib

* feat: add `PillInput` component

* feat: use new pills component in invite dialog

* test: update invite dialog selector

* test(e2e): update test locators

* test(e2e): update screenshot
2025-10-01 09:03:43 +00:00
Florian Duros
b89de61e12
Improve invite dialog ui - Part 1 (#30764)
* refactor: move `humanize` in shared components

* feat: add `RichItem` component

* feat: add `RichList` component

* refactor: use `RichList` and `RichItem` in `InviteDialog`

* fix: exclude `InviteDialog` button to css override

* test: update selector in invite dialog

* test(e2e): update crypto test to use correct selector

* test(e2e): update invite dialog

* test: add test for `humanize.ts`

* fix: add space between the list and the input when the list is scrollable

* test(e2e): update screenshots
2025-09-23 12:29:22 +00:00
beatdemon
e3dceb3718
Add files via upload (#30804) 2025-09-22 12:56:13 +00:00
Will Hunt
b4ba350770
Add new and improved ringtone (#30761)
* Fix racy ringing sound

* Add new ringtone from ECall

* Drop use of promise

* Add a comment.

* lint
2025-09-17 12:02:57 +00:00
Florian Duros
155c0b6a0c
Room list: make the filter resize correctly (#30788)
* fix: make the filter resize correctly

* test: update snapshot
2025-09-16 15:55:02 +00:00
Timo
0783f27f33
Add decline button to call notification toast (use new notification event) (#30729)
* Add decline button to call notification toast (use new notification event)

 - This make EW incompatible with the old style notify events.

Signed-off-by: Timo K <toger5@hotmail.de>

* update styling for call toast

Signed-off-by: Timo K <toger5@hotmail.de>

* skip lobby on join button click / dont skip lobby on toast click

Signed-off-by: Timo K <toger5@hotmail.de>

* dismiss toast on remote decline

Signed-off-by: Timo K <toger5@hotmail.de>

* fixup docstring and event_id

Signed-off-by: Timo K <toger5@hotmail.de>

* Add tests
Signed-off-by: Timo K <toger5@hotmail.de>

* remove unused var

Signed-off-by: Timo K <toger5@hotmail.de>

* test that decline event gets sent

Signed-off-by: Timo K <toger5@hotmail.de>

* make "go to lobby" accessible via keyboard (fix sonar cloud)

Signed-off-by: Timo K <toger5@hotmail.de>

* remove keyboard input

Signed-off-by: Timo K <toger5@hotmail.de>

* fix lint

Signed-off-by: Timo K <toger5@hotmail.de>

* use actual button

Signed-off-by: Timo K <toger5@hotmail.de>

* review style + toggle for join immediately

Signed-off-by: Timo K <toger5@hotmail.de>

* fix `getNotificationEventSendTs`

Signed-off-by: Timo K <toger5@hotmail.de>

* use story component

Signed-off-by: Timo K <toger5@hotmail.de>

* english text

Signed-off-by: Timo K <toger5@hotmail.de>

* dont use legacy toggle

Signed-off-by: Timo K <toger5@hotmail.de>

* fix lint

Signed-off-by: Timo K <toger5@hotmail.de>

* review

Signed-off-by: Timo K <toger5@hotmail.de>

* review (mostly docs)

Signed-off-by: Timo K <toger5@hotmail.de>

---------

Signed-off-by: Timo K <toger5@hotmail.de>
2025-09-16 10:41:44 +00:00
Hubert Chathi
9ad239f87f
"Verify this device" redesign (#30596)
* add variant of ResetIdentityBody for when the user has no verif. methods

* no longer distinguish between the using having a passphrase or not

* use vertical stack of buttons via EncryptionCard

and update wording

* swap logic order to match rendering order

* use the same dialog when no verification options available

* make it agree with the design more

* allow signing out on initial login

* apply styling changes and remove duplicate elements

* fix and add tests

* add missing snapshot

* Apply suggestions from code review

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* use a boolean property to disable blurring instead of adding a class

* change string identifiers

* apply changes from review -- simplify logic

* change class name to avoid confusion

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2025-09-12 18:37:14 +00:00
Florian Duros
7fc0cb242c
Align default avatar and fix colors in composer pills (#30739)
* fix: align default avatar in composer pills

* fix: use correct color for avatar in composer pills when there is no image

* test(e2e): add test for cider mention

* chore: fix typo
2025-09-11 13:44:08 +00:00
Will Hunt
07c253d11f
Add Playwright tests for settings toggles (#30318)
* Add playwright tests

* import pages/ remove duplicate create-room

* Update screenshots

* Fix accessibility for devtools

* Disable region test

* Fixup headers

* remove extra test

* Fix permissions dialog

* fixup tests

* update snapshot

* Update jest tests

* Clear up playwright tests

* update widget screenshot

* Fix wrong snaps from using wrong compound version

* Revert mistaken s/checkbox/switch/
2025-09-04 07:12:24 +00:00
David Baker
cba341f824
Release announcement for new room list (#30675)
* Release announcement for new room list

* Update snapshots

* Update release announcement tests

* worryingly large snapshot update

* Remove the pinned message release anncounement

* Hopefully fix e2e tests

add missing e2e screenshot and remove one for removed test

* Remove unused i18n strings

* Fix screenshot

* Try straight on the quick settings button

* unused import

* update snapshots

* Fix settings location
2025-09-03 15:25:49 +00:00
Florian Duros
eb086bd795
A11y: improve accessibility of pinned messages (#30558)
* fix: improve aria role and label on pinned message banner

* fix: change pinned message badge background for contrast

* fix: link pinned message button to content

* test: update tests

* fix: add aria-describedby on pinned message badge

* feat: use `aria-describedby` instead of `aria-description`

* test: update room view snapshot

* test: update snapshot

* fix: put id only textual body upper div

* fix: use lodash uniqueId

* test: update snapshots
2025-09-02 13:03:01 +00:00
AlirezaMrtz
a112dfe1db
Fix: Allow triple-click text selection to flow around pills (#30349)
* Fix: Allow triple-click text selection to flow around keyword pills

* Fix: Remove unnecessary align-items property from Pill component

* Change display property of .mx_Pill from inline to inline-block to fix rendering issue in Playwright tests

* Add test for triple-click message selection with pills
2025-08-27 08:06:01 +00:00
Richard van der Hoff
e8c88918cb
Show a "progress" dialog while invites are being sent (#30561)
* InviteDialog: show some words and a spinner while invites are being sent

* MultiInviter-test: avoid building unhandled rejected promises

If we don't handle rejected promises, jest gets confused by them. Instead,
let's create them on-demand.

* Open a "progress" dialog while invites are being sent

* Inhibit invite progress dialog when RoomUpgradeWarning dialog is kept open

... otherwise the `RoomUpgradeWarning` dialog disappears during the invites,
and the tests that assert that it is showing the correct thing fail.
 enter the commit message for your changes. Lines starting

* Switch to compound CSS variables instead of old pcss vars

* update playwright screenshots

* Revert "update playwright screenshots"

This reverts commit b0a15d97f35a088fe5b67009085eab46be1316fd.

* Another go at updating screenshots

* Address review comments

* remove redundant Props
2025-08-22 15:10:42 +00:00
David Langley
c842b615db
Move the room list to the new ListView(backed by react-virtuoso) (#30515)
* Move Room List to ListView

- Also remove Space/Enter handing from keyboard navigation we can just leave the default behaviour of those keys and handle via onClick

* Update rooms when the primary filter changes

Otherwise when changing spaces, the filter does not reset until the next update to the RVS is made.

* Fix stickyRow/scrollIntoView when switiching space or changing filters

- Also remove the rest of space/enter keyboard handling use

* Remove the rest of space/enter keyboard handling use

* Remove useCombinedRef and add @radix-ui/react-compose-refs as we already depend on it

- Also remove eact-virtualized dep

* Update RoomList unit test

* Update snapshots and unit tests

* Fix e2e tests

* Remove react-virtualized from tests

* Fix e2e flake

* Update more screenshots

* Fix e2e test case where were should scroll to the top when the active room is no longer in the list

* Move from gitpkg to package-patch

* Update to latest react virtuoso release/api.

Also pass spaceId to the room list and scroll the activeIndex into view when spaceId or primaryFilter change.

* Use listbox/option roles to improve ScreenReader experience

* Change onKeyDown e.stopPropogation to cover context menu

* lint

* Remove unneeded exposure of the listView ref

Also move scrollIntoViewOnChange to useCallback

* Update unit test and snapshot

* Fix e2e tests and update screenshots

* Fix unit test and snapshot

* Update more unit tests

* Fix keyboard shortcuts and e2e test

* Fix another e2e and unit test

* lint

* Improve the naming for RoomResult and the documentation on it's fields meaning.

Also update the login in RoomList to check for any change in filters, this is a bit more future proof for when we introduce multi select than using activePrimaryFilter.

* Put back and fix landmark tests

* Fix test import

* Add comment regarding context object getting rendered.

* onKeyDown should be optional

* Use SpaceKey type on RoomResult

* lint
2025-08-21 14:43:40 +00:00
Richard van der Hoff
08ec6166c7
Add some comments in _font-sizes.pcss (#30563)
... to let people know that these things shouldn't be used any more.
2025-08-14 15:28:48 +00:00
Andy Balaam
362c7d2aac
Hide recovery key when re-entering it while creating or changing it (#30499)
* Hide recovery key when asked to re-enter it when creating or changing key

* Use align-self to centre the eye icon

Co-authored-by: R Midhun Suresh <hi@midhun.dev>

* Use CSS vars for padding

Co-authored-by: R Midhun Suresh <hi@midhun.dev>

* Use CSS classes to avoid needing the highly specific rule

* Use a Compound variable for border width

* Add classes to snapshots

* Update screenshots

---------

Co-authored-by: R Midhun Suresh <hi@midhun.dev>
2025-08-14 15:02:10 +00:00
Florian Duros
31506ef864
Fix e2e warning icon should be white (#30539)
* fix: e2e warning icon should be white

* tests: add e2e warning screenshot test
2025-08-12 18:26:56 +00:00
Michael Telatynski
d2e4631a14
Fix line wrap around emoji verification (#30523)
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-08-11 09:03:34 +00:00
Florian Duros
8086262e04
Move AudioPlayer to shared components (#30386)
* feat: add `PlayPauseButton` to storybook

* feat: add generic media body

* feat: add seekbar component

* chore: add ViewWrapper to help writing stories with vm

* refactor: move `formatBytes` from `formattingUtils` into shared component

* refactor: add `className` props to `Clock`

* feat: add new audio player component

* test(e2e): add screenshots for new shared components

* feat: add AudioPlayerViewModel

* feat: use new audio player in `MAudioBody`

* refactor: remove old audio player

* test(e2e): update existing tests

* refactor: remove unused `DurationClock`

* refactor: rename `SeekBar` into `LegacySeekBar`
2025-08-07 09:02:49 +00:00
renovate[bot]
a668216e20
Update dependency stylelint-config-standard to v39 (#30497)
* Update dependency stylelint-config-standard to v39

* Iterate

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>
2025-08-06 12:59:04 +00:00
Andy Balaam
c1a163cbc9
Hide recovery key when prompting for verification (#30471)
* Separate security_key_title from security_key_label since they differ in designs

See https://www.figma.com/design/ZodBLtGnKmRTGJo5SGLnH3/ER-137--Excluding-Insecure-Devices?node-id=92-8818&t=02JILBe2n7sx7ljU-1

In parallel with this, I have updated security_key_title in localazy.

* Hide recovery key on entry screen after login
2025-08-05 14:57:40 +00:00
Florian Duros
c98358cb26
Fix e2e shield being invisible in white mode for encrypted room (#30408)
* fix: e2e icon for encrypted room

* test(e2e): add screenshot for grey shield in encrypted room
2025-07-25 10:56:21 +00:00
Florian Duros
1e689ac098
Move Flex & Box component into shared component folder (#30357)
* refactor: move Flex component in shared components

* refactor: update imports

* refactor: remove Flex pcss file

* fix: Flex component css override

* test: update snapshots

* fix: html export

* chore: add css module support to jest

* chore: keep old copyright

* refactor: change `mx_Flex` in `ErrorView` to `mx_ErrorView_flexContainer`

* test: update snapshots

* refactor: move Box component in shared components

* refactor: update import and css override

* test: update snapshots
2025-07-22 16:25:45 +00:00
Florian Duros
774e0e8f7b
Fix color of icon button with outline (#30361)
* fix: room list header button color

* fix: room member list invite button

* test: update room list search snapshot

* test(e2e): update screenshots
2025-07-22 14:11:13 +00:00
Florian Duros
5b659fe2e5
fix: force ED titlebar color for new room list (#30332) 2025-07-18 13:24:19 +00:00
Florian Duros
55c8256900
fix:put a background color to the left panel when the new room list is enabled (#30328) 2025-07-16 19:13:49 +00:00
David Baker
4bbcb8bb5d
Initial structure for shared component views (#30216)
* Very first pass at shared component views

Turn the trivial TextualEvent into a shared component with a separate view
model for element web. Args to view model will probably change to be more
specific and VM typer needs abstracting out into an interface, but should
give the general idea.

* Remove old TextualEvent

* Pass showHiddenEvents

Because we used it anyway, we just cheated by getting it from the context

* Factor out common view model stuff

* Move ViewModel interface into the shared components

* Add tiny wrapper hook

* Move showHiddenEvents into props fully

* Fill in stories / test

* chore: setup storybook

cherry pick edc5e8705674b8708d986910b02b5d2545777fb3
from florianduros/storybook

* Add TextualEvent component to storybook

* Add mock view model & snapshot

* Remove old style stories entry

* Change import

* Change import

* Prettier

* Add paxckage patch to @types/mdx

for React 19 compat

* Pass getSnapshot as getServerSnapshot too

* Maybe make sonar regognise tests as tests

* Typo

* Use storybook reacvt-vite

There's no reason to use the react-webpack plugin just because our app
is stuck on webpack, it just means we have vite as a dependency too.

* Change here too

* Workaround for incomatible types in rollup

https://github.com/rollup/rollup/issues/5199

* Remove webpack styling addon

Not necessary now we're using vite

* Hopefully do screenshot testing...

* need newer node

* quote issues

* Make it an npm script

* colons

* use right port

* Install playwright browsers

* Try without the if

* Oh right, we need the headless shell

* Pass flag to store received screenshots

and upload diffs too

* Update snapshot from received

* Include platform in snapshot / received dir

because font rendering differs between platforms

* Suffix snapshots with platform instead

like we do for playwright

* Remove unnecessary env vars

and better name

* Add some comments

* Prettier

* Fix yarn.lock

* Memoise vm creation

Co-authored-by: Florian Duros <florianduros@element.io>

* Add implements

Co-authored-by: Florian Duros <florianduros@element.io>

* Fix listener interface

* Add implements

Co-authored-by: Florian Duros <florianduros@element.io>

* Fix types

* Fix more types

* Revert useMemo

as this isn't a hook

* Unused import

* Add missing playwright step

* Add return type annotation

* Change to add / remove subscription callback

* Change to 'add' rather than 'subs.subscribe'

* Add cache specifier for only shell playwright browsers

* Add copyright headers

---------

Co-authored-by: Florian Duros <florian.duros@ormaz.fr>
Co-authored-by: Florian Duros <florianduros@element.io>
2025-07-14 13:13:02 +00:00
Florian Duros
a05ca97409
Fix e2e icon colour (#30299)
* fix: remove white background on e2e verification icon and put white on the checkmark

* test(e2e): add non regression tests

* chore: remove unused CSS mask
2025-07-10 13:50:18 +00:00
Banbuii
aa2dc8e574
Fix transparent verification checkmark in dark mode (#30235)
* Fix transparent verification checkmark in dark mode

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

* Add white background to E2E Warning Icon

Also adapted the testcases to the new background.
2025-07-07 11:35:03 +00:00
Hubert Chathi
9095ebdb1b
Avoid using accessSecretStorage to create 4S (#30244)
* remove resetCrossSigning flag, which is no longer in use

* drop unnecessary check for cross-signing

The only place where verifyUser is called already checks that cross-signing is
set up.  (The function name is also incorrect, since it checks for the
cross-signing key, and not for 4S.)

* avoid calling accessSecretStorage to set up cross-signing or 4S

Send the user to the Encryption settings tab instead

* only create secret storage when specifically asked to

* deprecate using accessSecretStorage to create new 4S

* also remove the obsolete snapshot

* add tests

* Tweak comment

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2025-07-03 13:34:05 +00:00
Hubert Chathi
af984c0e80
Prompt users to set up recovery (#30075)
* Show indicator in settings dialog when user doesn't have recovery set up

* Update settings headers to use red dot for recommended settings

* update recovery setup toast and remember if the user dismisses it

* update playwright snapshots

* use typed event emitters

* reverse logic for the account data flag

* fix comment and type
2025-06-18 16:20:17 +00:00
Florian Duros
1e3fd9d3aa
Update IconButton colors (#30124)
* chore: update `@vector-im/compound-web` to 8.0.0

* refactor(IconButton): use `kind="secondary"` instead of `subtleBackground` props

* test: update snapshots

* fix: force color on room header toggle

* fix: TAC button color

* test(e2e): update release announcement screenshot
2025-06-13 08:28:43 +00:00
Florian Duros
389a0e689e
New room list: filter list can be collapsed (#29992)
* feat: add new hook to check if a node is visible

* feat: filters in new room list can be collapsed

* feat: add animation to filter list

* feat: hide chevron when list fit on one line

* fix: use correct label for expand button

* test: update room list panel snapshots

* test: add tests for useIsNodeVisible

* chore: update i18n

* test: add tests for primary filters

* test(e2e): update existing screenshots

* test(e2e): update primary filter tests

* chore: typo in css file

* refactor: replace ternary by if in filter condition

* feat: compute filter height instead of hardcoded value

* fix: floor floating computation on filter

* refactor: move hooks to dedicated files

* test: update tests

* feat: rework collapse feature

* test: remove room list panel snapshot

* test: update room list primary filter tests

* test(e2e): update screenshots

* test(e2e): update screenshots

* test(e2e): fix favourite filter in scroll behaviour test

* fix: accessibility order when tabbing
2025-06-11 13:49:20 +00:00
Richard van der Hoff
3e8599bba0
AccessSecretStorageDialog: various fixes (#30093)
* AccessSecretStorageDialog: clear notice when input is empty

* AccessSecretStorageDialog: Simplify logic for calculating feedback

No functional changes, just simplification

* AccessSecretStorageDialog: use the right icon

Should be a ! in a circle, not an X. Also requires use of `Flex` to fix the
vertical alignment.

* AccessSecretStorageDialog: fix resizing when key is correct

* AccessSecretStorageDialog: remove confirmation on dialog close

Per discussion on https://github.com/element-hq/element-web/issues/30024, we
don't want this any more.
2025-06-09 10:27:14 +00:00
Florian Duros
f85d0c95b8
New room list: remove color gradient in space panel (#29721)
* feat: remove blur effect in space

* feat: remove user menu border and align

* test(e2e): update snapshots
2025-05-29 07:39:02 +00:00
Hubert Chathi
45182172b8
EW: Modernize the recovery key input modal (#29819)
* initial application of recovery key input redesign

* update styling to agree more with design, and fix jest tests

* look for the right element for entering the key

* fix more playwright tests

* use return value of validation function instead of state
2025-05-23 21:06:00 +00:00
Andy Balaam
b539eda4fe
Prompt the user when key storage is unexpectedly off (#29912)
* Assert that we set backup_disabled when turning off key storage

* Prompt the user when key storage is unexpectedly off

* Playwright tests for the Turn on key storage toast
2025-05-20 12:28:22 +00:00
Florian Duros
22c7bf346c
New room list: move sort menu in room list header (#29983)
* feat: move sort and preview into room list header vm

* feat: move sort menu into room list header

* test: update tests

* test:update snapshots

* chore: remove secondary filter tests

* test(e2e): update screenshots
2025-05-19 13:25:12 +00:00
Florian Duros
b56b0f2bd0
New room list: rework spacing of room list item (#29965)
* feat: rework spacing of room list item

* test: update snapshot

* test(e2e): regenerate room list panel screenshots

* test(e2e): regenerate room list screenshots

* test(e2e): update filter screenshot
2025-05-16 12:29:52 +00:00