Redesign: Remaining bits after both user and room settings are implemented

[turt2live]

Part 0 (already fixed prior to grouping):

• Fixed dialog size / scrolling improvements - PR: Have the settings dialog be fixed in size matrix-org/matrix-react-sdk#2501
• Positive wording for settings (avoid double negatives  #6435) - PR: Be more positive with setting labels matrix-org/matrix-react-sdk#2504
• Transitions on toggle switches - PR: Add simple animations to toggle switches matrix-org/matrix-react-sdk#2505
• Fix Settings Redesign: Label on theme control looks strange #8249 (CSS for disabled selects) - PR: Override UA/OS styles for disabled Field selects matrix-org/matrix-react-sdk#2502
• Fix Redesign: Fields without placeholder don't match the design #8250 (no placeholders) - PR: Default a Field's placeholder to the label matrix-org/matrix-react-sdk#2503
• Fix code style on net-new CSS - PR: Fix indentation on all new settings CSS matrix-org/matrix-react-sdk#2528
• Fix Redesign: Need design for field selects #8264 (field selects on macOS)

Part 1 (PR: matrix-org/matrix-react-sdk#2526):

• Fix Redesign: Start chat with Riot Bot button is weird #8265 (riot bot button)
• Improved padding on user preferences tab (and everywhere else)
• Fix colours/sizing of notification settings table
• Fix Redesign: Arial is leaking into Settings #8275 (semibold is wrong)

Part 2 (PR: matrix-org/matrix-react-sdk#2549):

• Fix margin on header of settings dialogs
• Fix the Settings title and the modal close X in position
• Other misc stuff to do with the layout of the dialogs (short viewports, long viewports, etc)
• Fix As a user I should be able to mash the escape key to escape settings #8328 (escape should escape)
• Fix Room settings should be named room settings #8329 (name of room settings)

Part 3 (PR: matrix-org/matrix-react-sdk#2553):

• Publish room to directory button
• Fix Remove flair from general user settings tab #8327 (flair on general tab)
• Fix Requesting WebRTC media permissions from UserSettings leaves the camera permenantly turned on. #8340 (webcam left on)

Part 4 (PR: matrix-org/matrix-react-sdk#2554):

• Removing temporary tab for visiting old settings
• Removing the old user settings entirely
• Removing the old room settings entirely
• Remove labs flag

Priority 2 problems ("would be really nice if..." items):

• Fix Power level options are sub-par #8804 (squished power level options) - PR: Convert PowerSelector to use mxField instead matrix-org/matrix-react-sdk#2725
• EditableItemList should be using Field, not whatever it currently is (aliases, related groups)
  • See Missing spacing in Settings > Room Addresses #8591
  • Fix Fix AliasSettings and RelatedGroups #8803
  • PR: Fix AliasSettings and RelatedGroups UX matrix-org/matrix-react-sdk#2679
• Fix the need for a DragDropContext over the flair settings - PR: Maintenance: Clean up some stuff around settings matrix-org/matrix-react-sdk#2685
• Fix Dialogs in tabbed settings return you to the wrong tab (unmount causes reset) #8371 (unmount causes return to general tab) - PR: Support stacking dialogs to prevent unmounting matrix-org/matrix-react-sdk#2724
• Fix Settings don't scroll correctly on firefox #8408 (firefox scrolling) - PR: Fix firefox scrolling settings tabs differently matrix-org/matrix-react-sdk#2579
• Fix textarea placeholder text in settings isn't always greyed out #8440 (textarea disabled not visible) - PR: Render disabled mxField textareas as disabled matrix-org/matrix-react-sdk#2591
• Fix direct manipulation radiobuttons for changing room visibility are very very sluggish #8406 (localecho on settings) - PR: Local echo on room access settings matrix-org/matrix-react-sdk#2593
• Fix 'no alias' warning in join rules setting warns even if the room does have an alias #8434 (alias warning) - PR: Local echo on room access settings matrix-org/matrix-react-sdk#2593
• Fix publish room to directory switch doesn't stick #8432 (publish room doesn't work) - PR: Ensure toggle switches listen to property changes matrix-org/matrix-react-sdk#2590

Priority 3 problems ("if someone gets bored and has time..." items):

• Fix Add a way to select to which email we want the email notifs to go #5496 ? (Email address notifications)
  • Includes Fully decommission UserSettingsStore #8424
  • PR: Support multiple email pushers and remove the legacy UserSettingsStore matrix-org/matrix-react-sdk#2727
• Fix After setting displayname in User Settings and hitting Save, the Save button ungreys itself #8569 (profile save button) - PR: Don't re-enable the save button after saving profiles matrix-org/matrix-react-sdk#2726
• The tabs and the icons look a bit small - PR: Scale up settings UI to be easier to read matrix-org/matrix-react-sdk#2604
• The default settings font is small, especially next to the relatively large toggles - PR: Scale up settings UI to be easier to read matrix-org/matrix-react-sdk#2604

Priority 4 problems ("Eventually, we will fix..." items):

• Fix access_token details and cache flushing should be somewhere more discoverable than "Help and About" in usersettings #8438 (move access_token somewhere else)
• Fix unit tests for Room Settings (and add more for other settings) - Re-add tests for room settings, and add tests for other settings #9005
• Review 3pid management (https://github.com/matrix-org/matrix-react-sdk/blob/experimental/src/components/views/settings/EmailAddresses.js#L28-L38) - Review settings UI/UX #9004
• Fix devices table design
  • Unsquish devices table in security settings
  • Make the devices list less jumpy when you select a checkbox
  • Style the device names in the device list so that they look editable
  • See Settings device list rework #8319

[lampholder]

• Fix the Settings title and the modal close X in position
• Slightly increase the space between settings
• Make the devices list less jumpy when you select a checkbox
• Style the device names in the device list so that they look editable
• Hide the theme dropdown (since it can't be changed and looks pretty broken atm [macOS, firefox])
  
• SUBJECTIVE: I think the tabs and the icons look a bit small
• SUBJECTIVE: I think the default settings font is small, especially next to the relatively large toggles
• SUGGESTION: let's move flair to its own tab, not because it makes sense, but because it lets us put a slow-loading bit of UI off the main path

[turt2live]

@lampholder feedback incorporated into the main post.

On the specific items:

Hide the theme dropdown (since it can't be changed and looks pretty broken atm [macOS, firefox])

See #8249

let's move flair to its own tab, not because it makes sense, but because it lets us put a slow-loading bit of UI off the main path

I've opened this as #8268 (as per our discussion)

Make the devices list less jumpy when you select a checkbox
Style the device names in the device list so that they look editable

Both of these I've put under "fix the device table design" (it's squishy, and that causes a lot of problems)

[lampholder]

Having thought about the device list UI a little over the past few days, I've uploaded my most recent sketch of a cards-based device list #8319

[lampholder]

I've also spotted another UX issue - when the flow returns a user to settings after they've diverted elsewhere (via the E2E beta warning modal when enabling encryption in a room, or via the key backup UX when configuring key backup on an account) the user lands on the first page of settings, not the page they were on before.

How easy is this to fix? It's certainly jarring landing on an unexpected page, but I can also see it might be tricky to address quickly.

[lampholder]

And one more issue - I don't think it's possible to delete an avatar any more. I'd suggest putting the delete X we have in other places as close as possible to the avatar square (with the 'Remove Avatar' tooltip we have in the /app build of riot)

[lampholder]

And another one - can we enable Esc closing the settings modal?

[turt2live]

How easy is this to fix? It's certainly jarring landing on an unexpected page, but I can also see it might be tricky to address quickly.

I'd rather not fix our dialog system this week, and would classify the problem as Very Hard to fix.

And another one - can we enable Esc closing the settings modal?

Already planned by proxy for Part 2 fixes.

[turt2live]

I'd suggest putting the delete X we have in other places as close as possible to the avatar square (with the 'Remove Avatar' tooltip we have in the /app build of riot)

We should avoid an X at all costs - it confuses everyone. I'd like to get Nad in on this decision.

[turt2live]

Removing avatars is being tracked outside of this: #8456

[turt2live]

I'm considering this done enough to take it off my top priority list. The remaining work I've shuffled into "p4" (which is relative to the items on this issue). I've also made a note to come back to it in a few months if we haven't managed to make our way around to it.

[turt2live]

I think most of this is now just bugs or things we fixed by changing the design (accidentally and sometimes on purpose). Closing in favour of the already-open issues.

We also don't really use epics like this anymore, so this is potentially lost to time 😬