* Use grid layout instead
- BEM naming style
- Increase block gap from 4px to 8px
- Use flexbox inside 'header' grid-area to let the buttons wrapped
- Use variables
- Remove 4px gap when one of the buttons is not rendered
- Change 'body' to 'message'
- Set 'align-self: start' to the icon and spinner
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Unset height of spinner
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Break lines at newline characters with white-space: pre-line
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Edit tests to check decryption failure bars on narrow timeline
- checkTimelineNarrow() looks for buttons by default
- Test indicator as well
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove a line
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Edit the test to have it check mx_EventTile_last only inside mx_RoomView_body
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Fix double underscores
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Fix double underscores - pcss
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Iterate - buttons at the bottom
- Set common spacing to buttons with variables
- Remove line breaks, yarn run i18n
- Set data-testid for headlines and buttons in case the tested strings would be displayed elsewhere simultaneously
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Check waiting headline as well
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Increase spacing between the message and the buttons
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* lint
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Increase block gap between wrapped buttons for clickability
Apply 8px between wrapped buttons
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Revert bottom margin of buttons which are not expected to be wrapped
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Check visibility instead of existence
This commit removes data-testid from headlines and data-testid-button and checks whether the elements are really visible, not overflowing the viewport.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Remove redundant gap between 'mx_DecryptionFailureBar_start' and the bottom edge
This commit adds '.mx_DecryptionFailureBar--withEnd' class name to have it applied to the bar only if it has button(s). This way the bar is rendered with a flexbox and the row-gap declaration is respected only if there is a 'mx_DecryptionFailureBar--withEnd' element. The element currently includes the button(s) only.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* lint - prettier
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Have Percy take a snapshot of the bar loading spinner before checkTimelineNarrow()
The loading spinner is likely to disappear while checking the bar on the narrow timeline.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
---------
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
Co-authored-by: Kerry <kerrya@element.io>
* Fix flaky Percy tests of ReplyChain
- Add media query for percy on _ReplyChain.pcss to apply the same color to vertical strokes (border-left)of ReplyChain
- Use CSS variables for visibility
- Manage those variables on _common.pcss for maintainability
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Check receptSent as well for consistency
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add a comment
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Specify zero spacing and remove list-style
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
---------
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* bumps the RTE dependency to introduce user/room mention handling
* adds autocomplete behaviour to allow users to insert user and room mentions as links
* sets up tests for the autocomplete behaviour
* Set expected line height to an expanded GELS line on IRC layout, add a test
* Add a test for compact modern/group layout
* Create a new test category on timeline.spec.ts
* Rename the class name as 'spacer'
* Add a test for GELS' spacer on bubble layout
---------
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
Co-authored-by: Germain <germain@souquet.com>
* add poll history tab to room settings
* test poll history in room settings
* remove posthog tracking for poll his
* use consistent label for polls history
* basic sync setup
* formatting
* get loudest value for synced rules
* more types
* test synced rules in notifications settings
* type fixes
* noimplicitany fixes
* remove debug
* tidying
* extract updatePushRuleActions fn to utils
* extract update synced rules
* just synchronise in one place?
* monitor account data changes AND trigger changes sync in notifications form
* lint
* setup LoggedInView test with enough mocks
* test rule syncing in LoggedInView
* strict fixes
* more comments
* one more comment
* add error variant for caption component
* tests for new error message
* tweak styles
* noImplicitAny
* revert out of date prettier changes to unrelated files
* limit inline message to radios only, tests
* strict fix
* Prevent long name blowout from Replytile on IRC layout
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add a test to check long strings do not overflow
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Sort declarations based on .mx_IRCLayout .mx_EventTile .mx_DisambiguatedProfile
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
---------
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Reduce height of toggle on expanded view source event
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* Add a test to check size and position of toggle on expanded view source event
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
---------
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
This PR adds the flex declaration to mx_RoomHeader_button to prevent the buttons from being compressed due to a long room name, copying the whole declarations from mx_RightPanel_headerButton for reference.
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
* load more pages of polls
* load more and no results messages
* style no results message
* remove debug
* strict fixes
* comments
* i18n pluralisations
* pluralisation the right way
* basic navigation to focused poll
* add tooltip
* drill permalinkCreator down to poll history
* render poll tile and link to timeline
* tidy and lint
* unit test poll detail
* add view poll link to ended pollliste item
* strict fix
* pr improvements
* pass room as prop
* permalinkcreator ts assertion
* Modified css for copy button and the copyable text accross the app specially to solve the overlapping problem in the access token div
* Modified css for copy button and the copyable text accross the app specially to solve the overlapping problem in the access token div and replaced the scroll with auto
* use timeline pagination
* fetch last 30 days of poll history
* add comments, tidy
* more comments
* finish comment
* wait for responses to resolve before displaying in list
* dont use state for list
* return unsubscribe
* strict fixes
* unnecessary event type in filter
* add catch
* wip
* remove dupe
* use poll model relations in all cases
* update mpollbody tests to use poll instance
* update poll fetching login in pinned messages card
* add pinned polls to room polls state
* add spinner while relations are still loading
* handle no poll in end poll dialog
* strict errors
* render a poll body that errors for poll end events
* add fetching logic to pollend tile
* extract poll testing utilities
* test mpollend
* strict fix
* more strict fix
* strict fix for forwardref
* add filter component
* update poll test utils
* add unstyled filter tab group
* filtertabgroup snapshot
* lint
* update test util setupRoomWithPollEvents to allow testing multiple polls in one room
* style filter tabs
* test error message for past polls
* sort polls list by latest
* extract poll option display components from pollbody
* add ended poll list item component
* use named export for polllistitem
* test POllListItemEnded
* comments
* strict fixes
* extract poll option display components
* strict fixes
* strict
* wip
* remove dupe
* use poll model relations in all cases
* update mpollbody tests to use poll instance
* update poll fetching login in pinned messages card
* add pinned polls to room polls state
* add spinner while relations are still loading
* handle no poll in end poll dialog
* strict errors
* render a poll body that errors for poll end events
* add fetching logic to pollend tile
* extract poll testing utilities
* test mpollend
* strict fix
* more strict fix
* strict fix for forwardref
* add filter component
* update poll test utils
* add unstyled filter tab group
* filtertabgroup snapshot
* lint
* update test util setupRoomWithPollEvents to allow testing multiple polls in one room
* style filter tabs
* test error message for past polls
* sort polls list by latest
* extract poll option display components
* strict fixes
* wip
* remove dupe
* use poll model relations in all cases
* update mpollbody tests to use poll instance
* update poll fetching login in pinned messages card
* add pinned polls to room polls state
* add spinner while relations are still loading
* handle no poll in end poll dialog
* strict errors
* render a poll body that errors for poll end events
* add fetching logic to pollend tile
* extract poll testing utilities
* test mpollend
* strict fix
* more strict fix
* strict fix for forwardref
* add filter component
* update poll test utils
* add unstyled filter tab group
* filtertabgroup snapshot
* lint
* update test util setupRoomWithPollEvents to allow testing multiple polls in one room
* style filter tabs
* test error message for past polls
* sort polls list by latest
* move FilterTabGroup into generic components
* comments
* Update src/components/views/dialogs/polls/types.ts
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
* Apply suggestions from code review
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
---------
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
* wip
* remove dupe
* use poll model relations in all cases
* update mpollbody tests to use poll instance
* update poll fetching login in pinned messages card
* add pinned polls to room polls state
* add spinner while relations are still loading
* handle no poll in end poll dialog
* strict errors
* render a poll body that errors for poll end events
* add fetching logic to pollend tile
* extract poll testing utilities
* test mpollend
* strict fix
* more strict fix
* strict fix for forwardref
* update poll test utils
* implicit anys
* tidy and add jsdoc
* add settings while under development
* very basic tests for roomsummarycard
* empty poll history dialog and option in room summary
* pollS history in settings
* render an ugly list of polls in current timeline
* readonly poll history list items
* fix scroll window
* use short year code in date format, tidy
* no results message + tests
* strict fix
* mock intldatetimeformat for stable date formatting
* extract date format fn into date-utils
* jsdoc
* wip
* remove dupe
* use poll model relations in all cases
* update mpollbody tests to use poll instance
* update poll fetching login in pinned messages card
* add pinned polls to room polls state
* add spinner while relations are still loading
* handle no poll in end poll dialog
* strict errors
* strict fix
* more strict fix
* Revert "Apply more general fix for base avatar regressions (#10045)"
This reverts commit 371a3c0d36.
* Revert "Fix layout and visual regressions around default avatars (#10031)"
This reverts commit 0d1fce37b2.
* Revert "Member avatars without canvas (#9990)"
This reverts commit a8aa4de4b4.
* Update snapshots
* add settings while under development
* very basic tests for roomsummarycard
* empty poll history dialog and option in room summary
* pollS history in settings
* use more user-centric selectors in roomsummarycard test
* Strict typechecking fixes for Base/Member/Avatar
Update the core avatar files to pass `--strict --noImplicitAny` typechecks.
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
* Add tests for Base/Member/Avatar
More thoroughly test the core avatar files. Not necessarily the most thorough,
but an improvement.
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
* Extract TextAvatar from BaseAvatar
Extracted the fallback/textual avatar into its own component.
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
* Use standard HTML for non-image avatars
Firefox users with `resistFingerprinting` enabled were seeing random noise
for rooms and users without avatars. There's no real reason to use data
URLs to present flat colors.
This converts non-image avatars to inline blocks with background colors.
See https://github.com/vector-im/element-web/issues/23936
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
* Have pills use solid backgrounds rather than colored images
Similar to room and member avatars, pills now use colored pseudo-elements
rather than background images.
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
---------
Signed-off-by: Clark Fischer <clark.fischer@gmail.com>
Co-authored-by: Andy Balaam <andy.balaam@matrix.org>
* Applies small changes to code block display in timeline
* Makes the composer code block look like the timeline display, but without line numbers
* Adds a button to allow code blocks to be implemented
* Adds tests for the new button
* Add option to show full identifier as tooltip on sender profiles
* Show full user id as tooltip on threads list entries
* Fix broken threads list timestamp layout
Previously, thread list timestamps would overflow
into the unread messages bubble on the right.
This is fixed by resetting the width of the
timestamp and ensuring both the timestamp and the
display name can shrink if necessary.
Both now also use ellipses if necessary.
* adds buttons to toggle bulleted and numbered lists on and off
* adds icons for those buttons
* css changes to timeline display
* adds tests for the new buttons, refactors existing tests
* Don't prefer STIXGeneral over the default font
STIXGeneral contains some glyphs for non-LGC scripts, but often doesn't implement these scripts fully. We should always try the browser's default fonts, which are likely to look nicer and have broader script support, before falling back to STIXGeneral.
* Explain why STIXGeneral shouldn't have precedence
* Add a regression test
* Remove unnecessary PipContainer component
* Redesign the picture-in-picture window
* Add a hover effect to the controls
* Clarify that WidgetPip has call-specific behavior
* Improve decryption error UI by consolidating error messages and providing instructions when possible
* Fix TS strict errors
* Rename .scss to .pcss
* Avoid accessing clipboard, Cypress doesn't like it
* Display DecryptionFailureBar alongside other AuxPanel bars
* Add comments
* Add small margin off-screen for visible decryption failures
* Fix some more TS strict errors
* Add unit tests for DecryptionFailureBar
* Add button to resend key requests manually
* Remove references to matrix-js-sdk crypto internals
* Add hysteresis to visible decryption failures
* Add comment
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
* Add comment
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
* Don't create empty div if we're not showing resend requests button
* cancel updateSessions on unmount
* Update unit tests
* Fix lint and implicit any
* Simplify visible event bounds checking
* Adjust cypress test descriptions
* Add percy snapshots
* Update src/components/structures/TimelinePanel.tsx
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
* Add comments on TimelinePanel IState
* comment
* Add names to percy snapshots
* Show Resend Key Requests button when there are sessions that haven't already been requested via this bar
* We no longer request keys from senders
* update i18n
* update expected text in cypress test
* don't download keys ourselves, update device info in response to updates from client
* fix ts strict errors
* visibledecryptionfailures undefined handling
* Fix implicitAny errors
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* Give reply tile an avatar
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Improve `in reply to`
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Drop `In reply to` for `Expand thread`
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix avatar alignment
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix default avatar alignment
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Simplifie code
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Simplifie some more code
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Make replies lighter
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Give replies a hover effect
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Revert changes to sender profile in replies
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Improve padding
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Increase line height of replies
to keep descenders from being cut off, and generally give them more room
to breathe.
Signed-off-by: Robin Townsend <robin@robin.town>
* Replace reply hover effect with a color change
Signed-off-by: Robin Townsend <robin@robin.town>
* Replace expand thread hover effect with an opacity change
Signed-off-by: Robin Townsend <robin@robin.town>
* Simplify image and sticker reply designs
Signed-off-by: Robin Townsend <robin@robin.town>
* Revise file and deleted message padding to match new reply layout
Signed-off-by: Robin Townsend <robin@robin.town>
* Remove unneeded CSS
Since the download button for files got moved out of the timeline and
into the message action bar, hiding it manually is no longer necessary.
Signed-off-by: Robin Townsend <robin@robin.town>
* Hide edited indicator from replies
There are a few reasons for this: it adds visual noise to what is meant
to be a brief preview, it can sometimes add an extra line to the reply
preview, and clicking on it inside a reply was broken due to the
stacking of event listeners.
Signed-off-by: Robin Townsend <robin@robin.town>
* Fix i18n
Signed-off-by: Robin Townsend <robin@robin.town>
* "Expand thread" -> "Expand replies"
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Add a missing import
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove unused import
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove unused import
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Use `this.state`
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix sender profile confusion
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Implement suggested changes
* Make "In reply to" the same color as reply previews
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
Signed-off-by: Robin Townsend <robin@robin.town>
Co-authored-by: Robin Townsend <robin@robin.town>
Because the persisted widget element takes an extra layout tick to be moved into place, you would briefly see the background color of the call view flash into view when joining a call. Giving the widget tile a background fixes this.
