Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Change avatar setting component to use a menu #12585

Merged
merged 58 commits into from
Jun 7, 2024
Merged

Change avatar setting component to use a menu #12585

merged 58 commits into from
Jun 7, 2024

Conversation

dbkr
Copy link
Member

@dbkr dbkr commented Jun 7, 2024

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 view, since that uses the same view.

Checklist

  • Tests written for new code (and old code if feasible).
  • New or updated public/exported symbols have accurate TSDoc documentation.
  • Linter and other CI checks pass.
  • Sign-off given on the changes (see CONTRIBUTING.md).

dbkr added 30 commits May 21, 2024 15:04
@dbkr
New user profile UI in User Settings
06896dc 
Using new Edit In Place component.
@dbkr
Show avatar upload error
f16cb80
@dbkr
Fix avatar upload error
1b60ea8
@dbkr
Wire up errors & feedback for display name setting
d0624af
@dbkr
Implement avatar upload / remove progress toast
ac46104
@dbkr
Add 768px breakpoint
a01d94a
@dbkr
Fix display of no avatar in avatar setting controls
5da2969 
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.
@dbkr
Fix room profile display
236de62
@dbkr
Update edit icon on avatarsetting comnponent
aba6a6a
@dbkr
Change avatarsetting componment to use a menu
8e0b017 
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.
@dbkr
Update to released compund-web with required components / fixes
6786697
@dbkr
Require compound-web 4.4.0
237570e 
because we do need it
@dbkr
Update snapshots
500fb3a 
Because of course all the auto-generated IDs of unrelated things
have changed.
@dbkr
Fix duplicate import
f0c9d83
@dbkr
Fix CSS comment
513687c
@dbkr
Update snapshot
c93ab3d
@dbkr
Run all the tests so the ids stay the same
be18de1
@dbkr
Start of a test for ProfileSettings
7330b34
@dbkr
More tests
b244866
@dbkr
Test that a toast appears
137df66
@dbkr
Test ToastRack
48a3d39
@dbkr
Update snapshots
a99dced
@dbkr
Add the usernamee control
605555a
@dbkr
Fix playwright tests
0f56520 
 * 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
@dbkr
Put ^ back on compound-web version
96802a7
@dbkr
Split CSS for room & user profile settings
304836d 
and name the components correspondingly
@dbkr
Fix playwright test
d97d8d9
@dbkr
Update room settings screenshot
6a8a981
@dbkr
Use original screenshot instead
b2a7f8a
@dbkr
Merge branch 'dbkr/new_profilesettings' into dbkr/fix_blank_avatar_di…
41bee22 
…splay
@dbkr dbkr marked this pull request as ready for review June 7, 2024 12:17
@dbkr dbkr requested a review from a team as a code owner June 7, 2024 12:17
@dbkr dbkr requested review from t3chguy and florianduros June 7, 2024 12:17
t3chguy
t3chguy approved these changes Jun 7, 2024
View reviewed changes
Copy link
Member

@t3chguy t3chguy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane otherwise

src/components/views/settings/AvatarSetting.tsx Outdated Show resolved Hide resolved
@dbkr dbkr added this pull request to the merge queue Jun 7, 2024
Merged via the queue into develop with commit 1696c5c Jun 7, 2024
30 checks passed
@dbkr dbkr deleted the dbkr/avatarsetting_menu branch June 7, 2024 13:48
@t3chguy t3chguy changed the title Change avatarsetting componment to use a menu Change avatar setting component to use a menu Jun 11, 2024
bmwiedemann pushed a commit to bmwiedemann/openSUSE that referenced this pull request Jun 21, 2024
@bmwiedemann
Update element-web to version 1.11.69 / rev 57 via SR 1182468
f9a59ec 
https://build.opensuse.org/request/show/1182468
by user dheidler + anag+factory
- Version 1.11.69
  ## ✨ Features

  * Change avatar setting component to use a menu (matrix-org/matrix-react-sdk#12585). Contributed by @dbkr.
  * New user profile UI in User Settings (matrix-org/matrix-react-sdk#12548). Contributed by @dbkr.
  * MSC4108 support OIDC QR code login (matrix-org/matrix-react-sdk#12370). Contributed by @t3chguy.

  ## 🐛 Bug Fixes

  * Fix image upload preview size (matrix-org/matrix-react-sdk#12612). Contributed by @RiotRobot.
  * Fix screen sharing in recent Chrome (matrix-org/matrix-js-sdk#4243).
  * Fix roving tab index crash `compareDocumentPosition` (matrix-org/matrix-react-sdk#12594). Contributed by @t3chgu
bmwiedemann pushed a commit to bmwiedemann/openSUSE that referenced this pull request Jun 21, 2024
@bmwiedemann
Update element-desktop to version 1.11.69 / rev 58 via SR 1182469
102e84b 
https://build.opensuse.org/request/show/1182469
by user dheidler + anag+factory
- Disable dysfunctional spellchecker
  * disable-spellchecker.patch

- Version 1.11.69
  ## ✨ Features

  * Change avatar setting component to use a menu (matrix-org/matrix-react-sdk#12585). Contributed by @dbkr.
  * New user profile UI in User Settings (matrix-org/matrix-react-sdk#12548). Contributed by @dbkr.
  * MSC4108 support OIDC QR code login (matrix-org/matrix-react-sdk#12370). Contributed by @t3chguy.

  ## 🐛 Bug Fixes

  * Fix image upload preview size (matrix-org/matrix-react-sdk#12612). Contributed by @RiotRobot.
  * Fix screen sharing in recent Chrome (matrix-org/matrix-js-sdk#4243).
  * Fix roving tab index crash `compareDocumentPosition` (https://githu
netbsd-srcmastr pushed a commit to NetBSD/pkgsrc that referenced this pull request Jul 6, 2024
@Midar
Update devel/element-web to 1.11.69
aece2de 
Changes in [1.11.69](https://github.com/element-hq/element-web/releases/tag/v1.11.69) (2024-06-18)
==================================================================================================
## ✨ Features

* Change avatar setting component to use a menu ([#12585](matrix-org/matrix-react-sdk#12585)). Contributed by @dbkr.
* New user profile UI in User Settings ([#12548](matrix-org/matrix-react-sdk#12548)). Contributed by @dbkr.
* MSC4108 support OIDC QR code login ([#12370](matrix-org/matrix-react-sdk#12370)). Contributed by @t3chguy.

## 🐛 Bug Fixes

* Fix image upload preview size ([#12612](matrix-org/matrix-react-sdk#12612)). Contributed by @RiotRobot.
* Fix screen sharing in recent Chrome (matrix-org/matrix-js-sdk#4243).
* Fix roving tab index crash `compareDocumentPosition` ([#12594](matrix-org/matrix-react-sdk#12594)). Contributed by @t3chguy.
* Keep dialog glass border on narrow screens ([#12591](matrix-org/matrix-react-sdk#12591)). Contributed by @dbkr.
* Add missing a11y label to dismiss onboarding button in room list ([#12587](matrix-org/matrix-react-sdk#12587)). Contributed by @t3chguy.
* Add hover / active state on avatar setting upload button ([#12590](matrix-org/matrix-react-sdk#12590)). Contributed by @dbkr.
* Fix EditInPlace button styles ([#12589](matrix-org/matrix-react-sdk#12589)). Contributed by @dbkr.
* Fix incorrect assumptions about required fields in /search response ([#12575](matrix-org/matrix-react-sdk#12575)). Contributed by @t3chguy.
* Fix display of no avatar in avatar setting controls ([#12558](matrix-org/matrix-react-sdk#12558)). Contributed by @dbkr.
* Element-R: pass pickleKey in as raw key for indexeddb encryption ([#12543](matrix-org/matrix-react-sdk#12543)). Contributed by @richvdh.



Changes in [1.11.68](https://github.com/element-hq/element-web/releases/tag/v1.11.68) (2024-06-04)
==================================================================================================
## ✨ Features

* Tooltip: Improve accessibility for  context menus ([#12462](matrix-org/matrix-react-sdk#12462)). Contributed by @florianduros.
* Tooltip: Improve accessibility of space panel ([#12525](matrix-org/matrix-react-sdk#12525)). Contributed by @florianduros.

## 🐛 Bug Fixes

* Close the release announcement when a dialog is opened ([#12559](matrix-org/matrix-react-sdk#12559)). Contributed by @florianduros.
* Tooltip: close field tooltip when ESC is pressed ([#12553](matrix-org/matrix-react-sdk#12553)). Contributed by @florianduros.
* Fix tabbedview breakpoint width ([#12556](matrix-org/matrix-react-sdk#12556)). Contributed by @dbkr.
* Fix E2E icon display in room header ([#12545](matrix-org/matrix-react-sdk#12545)). Contributed by @florianduros.
* Tooltip: Improve placement for space settings ([#12541](matrix-org/matrix-react-sdk#12541)). Contributed by @florianduros.
* Fix deformed avatar in a call in a narrow timeline ([#12538](matrix-org/matrix-react-sdk#12538)). Contributed by @florianduros.
* Shown own sent state indicator even when showReadReceipts is disabled ([#12540](matrix-org/matrix-react-sdk#12540)). Contributed by @t3chguy.
* Ensure we do not fire the verification mismatch modal multiple times ([#12526](matrix-org/matrix-react-sdk#12526)). Contributed by @t3chguy.
* Fix avatar in chat export ([#12537](matrix-org/matrix-react-sdk#12537)). Contributed by @florianduros.
* Use `*` for italics as it doesn't break when used mid-word ([#12523](matrix-org/matrix-react-sdk#12523)). Contributed by @t3chguy.


Changes in [1.11.67](https://github.com/element-hq/element-web/releases/tag/v1.11.67) (2024-05-22)
==================================================================================================
## ✨ Features

* Tooltip: Improve the accessibility of the composer and the rich text editor ([#12459](matrix-org/matrix-react-sdk#12459)). Contributed by @florianduros.
* Allow explicit configuration of OIDC dynamic registration metadata ([#12514](matrix-org/matrix-react-sdk#12514)). Contributed by @t3chguy.
* Tooltip: improve accessibility for messages ([#12487](matrix-org/matrix-react-sdk#12487)). Contributed by @florianduros.
* Collapse UserSettings tabs to just icons on narrow screens ([#12505](matrix-org/matrix-react-sdk#12505)). Contributed by @dbkr.
* Add room topic to right panel room info ([#12503](matrix-org/matrix-react-sdk#12503)). Contributed by @t3chguy.
* OIDC: pass `id_token` via `id_token_hint` on Manage Account interaction ([#12499](matrix-org/matrix-react-sdk#12499)). Contributed by @t3chguy.
* Tooltip: improve accessibility in room ([#12493](matrix-org/matrix-react-sdk#12493)). Contributed by @florianduros.
* Tooltip: improve accessibility for call and voice messages ([#12489](matrix-org/matrix-react-sdk#12489)). Contributed by @florianduros.
* Move the active tab in user settings to the dialog title ([#12481](matrix-org/matrix-react-sdk#12481)). Contributed by @dbkr.
* Tooltip: improve accessibility of spaces ([#12497](matrix-org/matrix-react-sdk#12497)). Contributed by @florianduros.
* Tooltip: improve accessibility of the right panel ([#12490](matrix-org/matrix-react-sdk#12490)). Contributed by @florianduros.
* MSC3575 (Sliding Sync) add well-known proxy support ([#12307](matrix-org/matrix-react-sdk#12307)). Contributed by @EdGeraghty.

## 🐛 Bug Fixes

* Reuse single PlaybackWorker between Playback instances ([#12520](matrix-org/matrix-react-sdk#12520)). Contributed by @t3chguy.
* Fix well-known lookup for sliding sync labs check ([#12519](matrix-org/matrix-react-sdk#12519)). Contributed by @t3chguy.
* Fix `element-desktop-ssoid being` included in OIDC Authorization call ([#12495](matrix-org/matrix-react-sdk#12495)). Contributed by @t3chguy.
* Fix beta notifications reconciliation for intentional mentions push rules ([#12510](matrix-org/matrix-react-sdk#12510)). Contributed by @t3chguy.
* fix avatar stretched on 1:1 call ([#12494](matrix-org/matrix-react-sdk#12494)). Contributed by @I-lander.
* Check native sliding sync support against an unstable feature flag ([#12498](matrix-org/matrix-react-sdk#12498)). Contributed by @turt2live.
* Use OPTIONS for sliding sync detection poke ([#12492](matrix-org/matrix-react-sdk#12492)). Contributed by @turt2live.
* TAC: hide tooltip when the release announcement is displayed ([#12472](matrix-org/matrix-react-sdk#12472)). Contributed by @florianduros.



Changes in [1.11.66](https://github.com/element-hq/element-web/releases/tag/v1.11.66) (2024-05-07)
==================================================================================================
## ✨ Features

* Use a different error message for UTDs when you weren't in the room. ([#12453](matrix-org/matrix-react-sdk#12453)). Contributed by @uhoreg.
* Take the Threads Activity Centre out of labs ([#12439](matrix-org/matrix-react-sdk#12439)). Contributed by @dbkr.
* Expected UTDs: use a different message for UTDs sent before login ([#12391](matrix-org/matrix-react-sdk#12391)). Contributed by @richvdh.
* Add `Tooltip` to `AccessibleButton` ([#12443](matrix-org/matrix-react-sdk#12443)). Contributed by @florianduros.
* Add analytics to activity toggles ([#12418](matrix-org/matrix-react-sdk#12418)). Contributed by @dbkr.
* Decrypt events in reverse order without copying the array ([#12445](matrix-org/matrix-react-sdk#12445)). Contributed by @Johennes.
* Use new compound tooltip ([#12416](matrix-org/matrix-react-sdk#12416)). Contributed by @florianduros.
* Expected UTDs: report a different Posthog code ([#12389](matrix-org/matrix-react-sdk#12389)). Contributed by @richvdh.

## 🐛 Bug Fixes

* TAC: Fix accessibility issue when the Release announcement is displayed ([#12484](matrix-org/matrix-react-sdk#12484)). Contributed by @RiotRobot.
* TAC: Close Release Announcement when TAC button is clicked ([#12485](matrix-org/matrix-react-sdk#12485)). Contributed by @florianduros.
* MenuItem: fix caption usage ([#12455](matrix-org/matrix-react-sdk#12455)). Contributed by @florianduros.
* Show the local echo in previews ([#12451](matrix-org/matrix-react-sdk#12451)). Contributed by @langleyd.
* Fixed the drag and drop of X #27186 ([#12450](matrix-org/matrix-react-sdk#12450)). Contributed by @asimdelvi.
* Move the TAC to above the button ([#12438](matrix-org/matrix-react-sdk#12438)). Contributed by @dbkr.
* Use the same logic in previews as the timeline to hide events that should be hidden ([#12434](matrix-org/matrix-react-sdk#12434)). Contributed by @langleyd.
* Fix selector so maths support doesn't mangle divs ([#12433](matrix-org/matrix-react-sdk#12433)). Contributed by @uhoreg.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@t3chguy t3chguy t3chguy approved these changes

@florianduros florianduros Awaiting requested review from florianduros florianduros is a code owner automatically assigned from matrix-org/element-web-reviewers

Assignees
No one assigned
Labels
T-Enhancement New features, changes in functionality, performance boosts, user-facing improvements
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@dbkr @t3chguy