* Create new method for header button behaviour
With the introduction of tabs, the behaviour of the header buttons is
changed as follows:
- Close any right panel if open
- Open the correct right panel if no panel was open before
The old method (and behaviour) is retained as showOrHidePhase.
* Implement tabs in the right panel
There are three tabs: Info, People and Threads
* Remove unwanted code from RoomSummaryCard
- Remove the menu item for opening the memberlist since that is now
taken of by the tabs.
- Remove the close button
* Remove code for focusing close button from tac item
See https://github.com/matrix-org/matrix-react-sdk/pull/12410
There's no longer a close button to focus so we instead focus the thread
tab. This is done in RightPaneltabs.tsx so we just need to remove this
code.
* Introduce a room info icon to the header
This was previously present in the legacy room header but not in the new
header.
* BaseCard changes
- Adds id, ariaLabelledBy and role props to implement tab accessibility.
- Adds hideHeaderButtons prop to hide header buttons (think back and
close buttons).
- Change confusing header rendering code:
header is not rendered ONLY when no header is passed AND
hideHeaderButtons is true.
* Refactor repeated code into function
Created a new function createSpaceScopeHeader which returns the
component if the room is a space room. Previously this code was
duplicated in every component that uses SpaceScopeHeader component.
* Pass BaseCard attributes and use helper function
Actually using the code from the last two commits
* Add, update and remove tests/screenshots/snapshots
* Fix distance between search bar and tabs
* Update compound
* Update screenshots/snapshots
* Extract SearchInfo interface and SearchScope enum
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix in-progress and update behaviour of RoomSearchView
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove search button from legacy header
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Move search from aux panel to room summary card
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Wire up Cmd/Ctrl F for moved search field
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Use cpd space tokens
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove stale props
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix ctrl/cmd f search shortcut
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Tests
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Tests
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update Compound
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Revert the back button for now
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>
* Iterate
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>
* Cancel search on escape
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix missing X
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Improve coverage
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Extract SearchScope and SearchInfo into Searching
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* delint
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* delint
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix test
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Switch to icon button for cancel search
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Iterate
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* yarn.lock
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Iterate
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* lint
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>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* i18n
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update locators
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Revert screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update snapshots
* Discard changes to package.json
* i18n
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Snapshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Handle narrow viewports
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Iterate
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Improve coverage
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Improve coverage
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Iterate
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Revert copy
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---------
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
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.
* 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
* Migrate file-panel.spec.ts from Cypress to Playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Migrate right-panel.spec.ts from Cypress to Playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Migrate notification-panel.spec.ts from Cypress to Playwright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix test flakes
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* delint
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshot
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix tests
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Update screenshots
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Try stabilise test
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* sleep
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Handle both cases
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Fix assertion
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Flip
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Test
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Iterate
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Test
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---------
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>