This changes the styles of buttons, other form controls, and tabs in settings to:
1. Improve their usage of semantic colors, so that they adapt correctly to custom themes
2. Make them more visually coherent with the new Compound design system, as we integrate more of it into the app
This is a re-introduction of https://github.com/matrix-org/matrix-react-sdk/pull/12241 with the difference that we're now using our branding colors again on form colors, and buttons have become rounded to match the appearance of new Compound buttons.
* Mock subtle crypto in OIDC test
To unblock upgrade to oidc-client-ts
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update dependency oidc-client-ts to v3
* delint
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Ensure oidc-client-ts 3.0.1 to drop crypto-js
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---------
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
* Enable custom themes to theme Compound
* Remove the now redundant username color variables
They are replaced by the Compound theming options (specifically, username colors can be themed by changing the color of Compound's decorative color tokens).
* Upgrade compound-web
I forgot to include this in https://github.com/matrix-org/matrix-react-sdk/pull/12209, which has caused avatar and username colors to be out of sync and sometimes revert to plain black/white.
* Update tests
* Update tests
* Add `Thread Activity centre` labs flag
* Rename translation string
* WIP Thread Activity Centre
* Update supportedLevels
* css lint
* i18n lint
* Fix labs subsection test
* Update Threads Activity Centre label
* Rename Thread Activity Centre to Threads Activity Centre
* Use compound `MenuItem` instead of custom button
* Color thread icon when hovered
* Make the pop-up scrollable and add a max height
* Remove Math.random in key
* Remove unused class
* Change add comments on `mx_ThreadsActivityRows` and `mx_ThreadsActivityRow`
* Make threads activity centre labs flag split out unread counts
Just shows notif & unread counts for main thread if the TAC is enabled.
* Fix tests
* Simpler fix
* Open thread panel when thread clicke in Threads Activity Centre
Hopefully this is a sensible enough way. The panel will stay open of
course (ie. if you go to a different room & come back), but that's the
nature of the right panel.
* Dynamic state of room
* Add doc
* Use the StatelessNotificationBadge component in ThreadsActivityCentre
and re-use the existing NotificationLevel
* Remove unused style
* Add room sorting
* Fix `ThreadsActivityRow` props doc
* Pass in & cache the status of the TAC labs flag
* Pass includeThreads as setting to doesRoomHaveUnreadMessages too
* Fix tests
* Add analytics to the TAC (#12179)
* Update TAC label (#12186)
* Add `IndicatorIcon` to the TAC button (#12182)
Add `IndicatorIcon` to the TAC button
* Threads don't have activity if the room is muted
This makes it match the computation in determineUnreadState.
Ideally this logic should all be in one place.
* Re-use doesRoomHaveUnreadThreads for useRoomThreadNotifications
This incorporates the logic of not showing unread dots if the room
is muted
* Add TAC description in labs (#12197)
* Fox position & size of dot on the tac button
IndicatorIcon doesn't like having the size of its icon adjusted and
we probably shouldn't do it anyway: better to specify to the component
what size we want it.
* TAC: Utils tests (#12200)
* Add tests for `doesRoomHaveUnreadThreads`
* Add tests for `getThreadNotificationLevel`
* Add test for the ThreadsActivityCentre component
* Add snapshot test
* Fix narrow hover background on TAC button
Make the button 32x32 (and the inner icon 24x24)
* Add caption for empty TAC
* s/tac/threads_activity_centre/
* Fix i18n & add tests
* Add playwright tests for the TAC (#12227)
* Fox comments
---------
Co-authored-by: David Baker <dbkr@users.noreply.github.com>
* Use new semantic tokens for username colors
To match the tokens now used by the Compound Web avatar component
* Fix incorrect lock icon
* Update screenshots
* Fix StorageManager checks for rust migration manual opt-in
* fix restricted imports
* Moved utility to check db internals into js-sdk
* fix typos and test names
* more timeout for migration test
(cherry picked from commit cdfcd37b94)
* Fix StorageManager checks for rust migration manual opt-in
* fix restricted imports
* Moved utility to check db internals into js-sdk
* fix typos and test names
* more timeout for migration test
* Update to compound-web 3.0.1
Pulls in a fix to make the indicator icon dot black/white rather than
grey for activity.
* Update snapshots
* More snapshots
* Add notification dots to thread summary icons
Adopts new IndicatorIcon from compound to have threads icons with
indicator dot (that aren't also buttons). Adds green & red dots on
the threads icon in the thread summary to indicate notifications.
Changes the notification level dots colours in the threads panel to
be green to match.
* Update test for new CSS class
* Update snapshots with new class name
* Another snapshot update for new class name
* Replace more uses of old class name in tests
* More snapshot updates for new class name
* Unsure how this ever worked in chronological mode
* More snapshot updates
* Fix dot colours
* Upgrade to compound-web 3
* Fix computed notification levels
* Add test for notificationLevelToIndicator
* Update dependency @vector-im/compound-web to v2
* Update Tooltip props
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Include TooltipProvider in MatrixChat
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix pillify & tooltipify
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update tests to use TooltipProvider where necessary
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix tooltips in Modals, ContextMenus, PersistedElements, Spoiler, HtmlExport
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update tests
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* delint
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update tests
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix tooltips in HTMLExport
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Don't pass mountAsChild to DOM
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* prettier
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Stabilise test
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>
* Install playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Add foundations for writing tests under Playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* .gitignore juggling
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Add tsconfig and fix eslint rules
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Add docker & synapse plugins
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Add login.spec.ts
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Wire up fixture which sets up ElementAppPage & bakes config.json
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove launch test, it has served its purpose
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove test which has been ported to Playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix test not cleaning up after itself
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Move registerUser to the Homeserver interface
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove unused fixture param
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove redundant launch test
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Add newline
---------
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: R Midhun Suresh <hi@midhun.dev>
* Install knapsack pro
* Use knapsack pro command
* Lint
* Use chrome
* Add test file pattern
* Use two different tokens for knapsack
* Use the correct secret
* Update lockfile
* Fix conflict
* Remove redundant options
* Add explaining comment
* Remove outdated variables and steps
* Update comment
* Fix conflict
* Use the chrome we setup earlier
* Add back percy config
* Set knapsack pro branch
* Use github_env to get browser path
* Add badge to readme
* Update .github/workflows/cypress.yaml
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* Apply prettier
---------
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* Update RoomSummaryCard navigation links
* Fix tests
* remove unneeded test
* "@vector-im/compound-web": "0.8.0"
* Fix: search button no transition on hover
* Fix: disabled invite option is not reflected in UI
* test canInviteTo
* update snapshots for CW 0.8.1
* unit test inviteToRoom
* unit test tagRoom
* add member link to roomsummarycard when using legacy room header
* use onChange instead of onClick for ToggleMenuItem favourite room
* update selectors in cypress tests
* always show people menu item
* add hover style to close button
* add padding around room name
* prettier
---------
Co-authored-by: Kerry Archibald <kerrya@element.io>