Commit graph

1631 commits

Author SHA1 Message Date
David Baker
1696c5cd0a
Change avatarsetting componment to use a menu (#12585)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* Fix room profile display

* Update edit icon on avatarsetting comnponent

* Change avatarsetting componment to use a menu

As per the designs, remove the 'remove' link and instead have a menu
pop up to either upload a new file or remove the avatar.

This also changes the room profile viw, since that uses the same view.

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year

* Switch to useMatrixClientContext

* Fix other test

* Make clickable with no avatar again and fix tests

and renmove a test for the remove button which is no longer there

* Put back missing CSS to make the menu entry red

* Fix type error

* Fix tests

* Supply open / onOpenChange props

* Fix tests

* There is no hover anymore

* Use the computed name, not the name which may be null

* Fix room avatar remove behaviour

* Remove redundant else
2024-06-07 13:25:21 +00:00
David Baker
3c8010b719
Fix display of no avatar in avatar setting controls (#12558)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* Fix room profile display

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year

* Switch to useMatrixClientContext

* Fix other test
2024-06-06 17:35:44 +00:00
David Baker
cfa322cd62
New user profile UI in User Settings (#12548)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix room profile display

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year
2024-06-06 13:56:38 +00:00
Michael Telatynski
1677ed1be0
MSC4108 support OIDC QR code login (#12370)
Co-authored-by: Hugh Nimmo-Smith <hughns@matrix.org>
2024-06-06 09:57:28 +01:00
Michael Telatynski
ca7760789b
Use LegacyRendezvousFailureReason over RendezvousFailureReason (#12578) 2024-06-06 09:19:49 +01:00
Florian Duros
679b170bc5
Close the release announcement when a dialog is opened (#12559)
* Fire `ModalManagerEvent.Closed` when a dialog is closed

* Listen to modal events in the RA

* Fix first RA test
2024-05-29 07:22:50 +00:00
Florian Duros
17ab522942
Tooltip: close field tooltip when ESC is pressed (#12553)
* Close field tooltip when ESC is pressed

* Use `Key.ESCAPE`
2024-05-28 12:55:47 +00:00
Michael Telatynski
148a360598
Avoid using deprecated exports, fields, and duplicate code (#12555) 2024-05-28 08:41:20 +01:00
Florian Duros
d9f718e589
Add more test for ReactionsRowButton.tsx 2024-05-22 16:24:09 +02:00
Florian Duros
8f07672da1
Add more tests for ReadReceiptGroup.tsx 2024-05-22 15:56:12 +02:00
Florian Duros
b6132db68f
Merge branch 'develop' into florianduros/tooltip/legacy-tooltip 2024-05-22 15:12:34 +02:00
Florian Duros
04741ae6a6
Add tests for ReadReceiptGroup.tsx 2024-05-22 15:07:57 +02:00
Florian Duros
1190de9028
Migrate TooltipTarget usage to compound Tooltip (#12542)
* Use new tooltip in `RoomTopic.tsx`

* Use new tooltip in `MLocationBody.tsx`

* Fix room topic

* Update location snapshot

* Use new tooltip in `AppPermission.tsx`

* Remove `TooltipTarget`

* Add tests for `RoomTopic`
2024-05-22 12:15:07 +00:00
Florian Duros
a6907a033e
Use compound tooltip in ReactionRowButton 2024-05-22 11:27:01 +02:00
David Baker
3342aa5ff8
Refactor some logic into common AvatarSetting component (#12544)
* Refactor some logic into common AvatarSetting component

We duplicated some of the logic of setting avatars between profiles &
rooms. This pulls some of that logic into the AvatarSetting component
and hopefully make things a little simpler.

* Unsed import

* Convert JS based hover to CSS

* Remove unnecessary container

* Test avatar-as-file path

* Test file upload

* Unused imports

* Add test for RoomProfileSettings

* Test removing room avatar

* Move upload control CSS too

* Remove commented code

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

* Prettier

* Coments & move style to inline as per PR suggestion

* Better test names

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

* Fix test

Upload input doesn't have that class anymore

---------

Co-authored-by: Florian Duros <florianduros@element.io>
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-21 10:37:02 +00:00
Florian Duros
75562b1d1b
Tooltip: migrate remaining tooltips from AccessibleTooltipButton to AccessibleButton (#12522)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton`

* Update snapshots

* Update @vector-im/compound-web

* Update composer

* Update formating buttons

* Update snapshots

* Update `ContextMenuTooltipButton.tsx`

* Fix placement

* Update tests

* Remove placement

* Update space panel snapshot

* Remove default placement

* Update snapshots

* Update snapshots

* Use kbd

* Update ``@vector-im/compound-web`

* Migrate remaining files

* Remove `AccessibleTooltipButton.tsx`

* Add test to `InteractiveAuthEntryComponents`

* Add test to `InteractiveAuthEntryComponents`

* Back to old RoomList-test.tsx

* Improve `InteractiveAuthEntryComponent` tests

* Review changes
2024-05-17 14:11:07 +00:00
Florian Duros
8f3c8b3515
Use RovingAccessibleButton instead of RovingAccessibleTooltipButton (#12539) 2024-05-17 10:29:30 +00:00
Hubert Chathi
eed8d1538b
Add more encryption properties to PostHog (#12415)
* report time to decrypt an event if it's slow

* add more stats

* fix some tests

* keep original timestamp, and report non-visible decryption failures

* add statistic for whether the user trusts their own device

* revert local playwright docker changes

* apply changes from review

* also remove logout event handler on logout

* apply changes from review

* make eventDecrypted callback private
2024-05-16 00:25:58 +00:00
Michael Telatynski
113c365563
Stop using deprecated methods, fields & exports (#12524)
* Remove legacy `threepidCreds` field

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

* Remove `user` field legacy UIA fallback

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

* Update imports

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

* Fix test

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-15 14:58:28 +00:00
Florian Duros
bec8fdb3d3
Tooltip: Improve accessibility for context menus (#12462)
* Update `ContextMenuTooltipButton.tsx`

* Fix placement

* Update tests

* Update space panel snapshot

* Remove default placement

* Update snapshots

* Fix tooltip child rerender

* Remove useless props title
2024-05-15 14:25:30 +00:00
Florian Duros
580bc8771c
Fix avatar in chat export (#12537)
* Update `@vector-im/compound-web`

* Update test snapshots
2024-05-15 13:34:27 +00:00
Florian Duros
77a724526e
Tooltip: Improve the accessibility of the composer and the rich text editor (#12459)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton`

* Update snapshots

* Update @vector-im/compound-web

* Update composer

* Update formating buttons

* Update snapshots

* Remove placement

* Update snapshots

* Use kbd

* Update ``@vector-im/compound-web`
2024-05-15 08:32:53 +00:00
Michael Telatynski
eee0b2a9c3
Add room topic to right panel room info (#12503)
* Add room topic to right panel room info

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

* Tweak styles

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

* Update snapshot

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

* Iterate

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

* Update snapshots

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

* Iterate

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

* Add snapshot tests

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

* Update snapshots

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-10 10:00:43 +00:00
R Midhun Suresh
706c4b7101
Use h tag for widget title instead of b tag (#12504)
* Change b tag to h3 tag

* Remove margin

* Update snapshots
2024-05-08 13:57:17 +00:00
Michael Telatynski
580bb5537d
OIDC: pass id_token via id_token_hint on Manage Account interaction (#12499)
* Store id_token rather than just id_token_claims

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

* Pass id_token via `id_token_hint` on `Manage Account` interaction

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

* Fix tests

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-07 11:27:37 +00:00
Florian Duros
febb60ee45
Tooltip: improve accessibility for call and voice messages (#12489)
* Move to `AccessibilityButton`

* Update snapshots

* Add tests

* Update snapshots
2024-05-07 10:20:52 +00:00
David Baker
18ef97161a
Move the active tab in user settings to the dialog title (#12481)
* Convert tabbedview to functional component

The 'Tab' is still a class, so now it's a functional component that
has a supporting class, which is maybe a bit... jarring, but I think
is actually perfectly logical.

* put comment back

* Fix bad tab ID behaviour

* Make TabbedView a controlled component

This does mean the logic of keeping what tab is active is now in each
container component, but for a functional component, this is a single
line. It makes TabbedView simpler and the container components always
know exactly what tab is being displayed rather than having to effectively
keep the state separately themselves if they wanted it.

Based on https://github.com/matrix-org/matrix-react-sdk/pull/12478

* Move the active tab in user settings to the dialog title

Separated by a colon, as per the new design.

* Update snapshots

* Update a playwright test

* Fix more tests / snapshots

* Attempt to test all the cases of titleForTabID

* More tests
2024-05-07 09:32:24 +00:00
Florian Duros
f8e040a890
Tooltip: Remove extra data attribute (#12483)
* Update `@vector-im/compound-web`

* Update snapshots

* Update jest snapshotss

* Update snapshots
2024-05-06 08:54:40 +00:00
David Baker
9684dd5145
Make TabbedView a controlled component (#12480)
* Convert tabbedview to functional component

The 'Tab' is still a class, so now it's a functional component that
has a supporting class, which is maybe a bit... jarring, but I think
is actually perfectly logical.

* put comment back

* Fix bad tab ID behaviour

* Make TabbedView a controlled component

This does mean the logic of keeping what tab is active is now in each
container component, but for a functional component, this is a single
line. It makes TabbedView simpler and the container components always
know exactly what tab is being displayed rather than having to effectively
keep the state separately themselves if they wanted it.

Based on https://github.com/matrix-org/matrix-react-sdk/pull/12478

* Fix some types & unused prop

* Remove weird behaviour of using first tab is active isn't valid

* Don't pass initialTabID here now it no longer has the prop

* Fix test

* bleh... id, not icon

* Change to sub-components

and use contitional call syntax

* Comments

* Fix element IDs

* Fix merge

* Test DesktopCapturerSourcePicker

to make sonarcloud the right colour

* Use custom hook for the fllback tab behaviour
2024-05-03 15:01:01 +00:00
Florian Duros
2f3c84f1f4
Tooltip: improve accessibility of spaces (#12497)
* Migrate to `AccessibleButtons`

* Update snapshots
2024-05-03 14:07:11 +00:00
Florian Duros
95ee2979c8
Tooltip: improve accessibility of the right panel (#12490)
* Move to `AccessibleButton`

* Update snapshots

* Update playwright snapshots
2024-05-03 08:44:04 +00:00
Travis Ralston
d25d529e86
Extract functions for service worker usage, and add initial MSC3916 playwright test (when supported) (#12414)
* Send user credentials to service worker for MSC3916 authentication

* appease linter

* Add initial test

The test fails, seemingly because the service worker isn't being installed or because the network mock can't reach that far.

* Remove unsafe access token code

* Split out base IDB operations to avoid importing `document` in serviceworkers

* Use safe crypto access for service workers

* Fix tests/unsafe access

* Remove backwards compatibility layer & appease linter

* Add docs

* Fix tests

* Appease the linter

* Iterate tests

* Factor out pickle key handling for service workers

* Enable everything we can about service workers

* Appease the linter

* Add docs

* Rename win32 image to linux in hopes of it just working

* Use actual image

* Apply suggestions from code review

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

* Improve documentation

* Document `??` not working

* Try to appease the tests

* Add some notes

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-02 22:19:55 +00:00
David Baker
374cee9080
Fix flaky jest tests (#12486)
...and remove the code that causes them to be retried in CI. Most of
these were just lack of waiting for async things to happen, mostly
lazy loading components, hence whythey worked on the retry: because
the code had been loaded by then.
2024-05-02 14:53:35 +00:00
Florian Duros
7193d4c695
TAC: Fix accessibility issue when the Release announcement is displayed (#12482)
* Update `@vector-im/compound-web`

* Update TAC snapshots

* Update space panel snapshots
2024-05-02 13:23:25 +00:00
Florian Duros
6a3741b779
TAC: Close Release Announcement when TAC button is clicked (#12475)
* Close RA when TAC button is clicked

* Update snapshots
2024-05-02 08:14:50 +00:00
Florian Duros
ad7f626e22
Do not render tooltip when RA is displayed on TAC (#12472) 2024-05-01 20:39:08 +00:00
David Baker
906c9dd948
Convert UserSettings to functional component (#12474)
* Convert UserSettings to functional component

* Put comment back

* Fix test

* Unused imports
2024-04-30 18:52:32 +00:00
Michael Telatynski
641a20ce63
Prepare for OIDC QR Login PR (#12463)
* Move LoginWithQRSection to the top of the settings tab

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

* Refactor LoginWithQRSection to a Functional Component

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

* Extract LoginWithQR types

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

* Update LoginWithQRFlow styling & copy

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

* Re-add missing buttons and update snapshots

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

* Use compound spacings

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-04-30 17:18:55 +00:00
Florian Duros
2df946b5b1
Tooltip: Use AccessibleButton in RovingAccessibleTooltipButton (#12458)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton`

* Update snapshots

* Update @vector-im/compound-web

* Update playwright

* Remove placement
2024-04-30 09:35:58 +00:00
Florian Duros
44e2a6d070
Tooltip: Use AccessibleButton in reusable elements (#12461)
* Update reusable elements

* Update tests

* Make right as default tooltip placement

* Add tests
2024-04-29 17:19:05 +00:00
Hubert Chathi
d5bf1022e9
Use a different error message for UTDs when you weren't in the room. (#12453)
* Use different messages for UTDs sent before login

* Playwright test for historical events

* Add some tests

* initial work on pre-join UTDs

* add playwright tests and remove old pre-join UTD logic

* run i18n script

* fix type error

* use different error code in PostHog for pre-join UTD

* don't remove old pre-join UTD logic yet

---------

Co-authored-by: Richard van der Hoff <richard@matrix.org>
2024-04-29 17:18:57 +00:00
David Baker
281916fd96
Take the Threads Activity Centre out of labs (#12439)
* Take the TAC out of labs!

Requires https://github.com/matrix-org/matrix-react-sdk/pull/12438
and ideally https://github.com/matrix-org/matrix-react-sdk/pull/12418

* i18n

* Add test method

That's needed now we we don't include threads in the notif count in the tests

* One less labs setting

* Update snapshot

* Disable release announcement

* Unused import

* Fix some screenshots

* Fix all the unread test cases now room unreads don't include threads

* Fix more tests

* Even more test fixes

* Still more test fixes

* Oh goodness, it's more test fixes

* Fix selectors now there are 2 buttons called Threads

* Disable some tests that aren't passing

for reasons that don't appear releated to any of the TAC work, as
per the comment.

* Remove debugging

* Oops, removed too much
2024-04-29 15:30:19 +00:00
Florian Duros
264e202ccd
Add extra attribute to AccessibleButton (#12456)
* Update snapshots

* Add extra attribute to `AccessibleButton`
2024-04-26 09:10:15 +00:00
Richard van der Hoff
bd7ce7cda9
Expected UTDs: use a different message for UTDs sent before login (#12391)
* Use different messages for UTDs sent before login

* Playwright test for historical events

* Add some tests

* Don't show "verify" message if backup is working

* Apply suggestions from code review
2024-04-25 08:11:41 +00:00
Florian Duros
700b3955a4
Add Tooltip to AccessibleButton (#12443)
* Deprecate AccessibleTooltipButton

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

* Fix tests

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

* Fix tests

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

* Deprecate AccessibleTooltipButton

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

* Fix tests

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

* Iterate

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

* Fix `UserInfo-test.tsx`

* Update `LoginWithQRFlow-test.tsx` snapshot

* Remove tooltip provider from test

* Fix `AccessibleButton`

* Update snapshots

* Revert to original import

* Use title to populate aria-label

* Rollback AccessibleButton or Tooltip changes. Will come in another PR

* Rollback en.json change

* Update snapshots

* Fix `UserInfo`

* Update snapshots

* Use label instead of title in test

* Use label instead of title in TAC test

* Use label instead of title in read-receipt test

* Remove tooltip for ContextMenu

* Add extra information for caption field

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2024-04-24 12:24:25 +00:00
David Baker
cc7edade21
Move the TAC to above the button (#12438)
* Move the TAC to above the button

This isn't what the designs say, but there is a (bug/feature)* in
radix where it will turn a mouseup event within the menu into a
click so that it activates the menu option that's under your cursor
when you lift the button, even if you pressed the button down on
a different item. Unfortunately it forgot to check that the mouse
down happened in the menu, so if the menu appears under the cursor,
the cursor, it will immediately select whatever option appeared under
the cursor.

I think the simplest solution here is to just move the menu above the
TAC button. This also makes it consistent† with quick settings.

*delete as applicable
†Not actually consistent because it fades in a different way

* Update snapshots
2024-04-19 09:04:48 +00:00
Florian Duros
9b5d4716e2
Merge branch 'develop' into florianduros/tooltip-update 2024-04-17 11:57:12 +02:00
David Baker
06e0404639
Make empty state copy for TAC depend on the value of the setting (#12419)
* Make empty state copy for TAC depend on the value of the setting

* Update test snapshot

* Fix snapshot

Run the whole file or the radix IDs will br wrong 🤦

* Simplify to a ternary
2024-04-16 11:38:20 +00:00
Richard van der Hoff
5ed68efa6c
New context for local device verification (#12417)
* New context for local device verification

* Fix up tests

* Use PropsWithChildren
2024-04-16 09:43:27 +00:00
Florian Duros
e53b175a6b
Merge branch 'develop' into florianduros/tooltip-update 2024-04-16 09:51:05 +02:00