* feat: add unread status to section view
* feat: add unread tracking in room list section
* feat: populate rooms into section header vm
* test: add units for unread in section view model
* test(e2e): add unread tests
* Remove global h2 css rule in favour of heading styles/components
* Use Compound Heading in shared-components
and forbid hX elements
* Use Compound Heading in settings
add back margin to some legacy headings
* Tweak some headings
* Update screenshots
* Update screenshots
* Update snapshots
* Tweak .gitignore
* Update snapshots
* Iterate
* Update screenshots
* Update screenshots
* Update screenshot
* Refactor MessageActionBar into MVVM ActionBarView
* Adding tooltips for menu items and correct i18n strings
* Layout changes
* Renaming some properties
* Rename property
* Create a first version of the view model and refactor media visibility logic
* Refactor view to take options and rections menu as optional properties
* Cleaner interface between view and view model
* Refactor view properties and replace Menu and MenuItem
* Bugfixes and switching to ActionBarView instead of MessageActionBar in element-web
* Avoid creating view models and render toolbar until it is actually shown
* Added unit and playwright tests and documented the view
* Added view model unit tests and updated snapshots of dependant tests
* Remove unused components and unnecessary css
* Remove unused language tags
* Fix for handling join-rules correctly
* Prettier
* Add handling of stale view model in async calls
* Prettier
* Split the element-web css into two different. One for legacy components and one for the ActionBarView
* Missing variables used for linting
* Fix for showing ActionBarView when using keyboard for navigation
* Handle visibility on context menu closing
* ThreadPanel uses the ActionBarView so restore css rule
* Fix for visibility of the ActionBarView in Thread panel
* Fix for ActionBarVuew visibility when closing right-click context menu and not still hovering
* Add roving index to function as a toolbar
* Adjust the RoomView test to send hover to the EventTile instead of the message text
* Fix SonarCloud issues
* Fix for SonarCloud issue
* Merge fix
* Rename mx_LegacyActionBar to mx_ThreadActionBar
* Added documentation and simplified join rules
* Generalize the ActionBarView and move logic to view model
* Add the four new buttons to the ActionBarView
* Update view model and tests to use the updated ActionBarView
* Refactor element-web to use ActionBarView
* Clean up styling in element-web
* Clean up and updating snaps and screenshots
* Added unit-tests for better coverage
* Moving ActionBarView to the correct folder in shared components
* Update snaps in element-web
* Better documentation in stories
* Merge fixes
* Updates after review comments
* Review comment fixes
* Added documentation to view models and updated snaps
* Hide button had the wrong label
* Replace createRef with useRef
* init MVideoBody to shared components, including test, stories and view
* fix prettier and other warnings
* move video message body to shared view + app viewmodel
* Fix prettier warnings and masking spinner for tests
* stabilize VideoBodyView screenshots with local media asset
* Disable spinner from changing image all the time
* Added mask over video spinner to prevent issues with new generated images on playwright tests
* Update prettier fix
* Update snapshot
* Add tests to cover different states of Video
* Update code to prevent the previous component Hack fix regarding jumps on the timeline.
* Update snapshot
* Update code to improve code quality for Sonar + update snapshot
* adde documentation snippets
* refactor: move m.video rendering into body factory
* docs: add tsdoc for video body view model
* docs: add thumbnail tsdoc for video body view model
* docs: add content-url tsdoc for video body view model
* docs: add dimensions tsdoc for video body view model
* docs: add aspect-ratio tsdoc for video body view model
* docs: add tsdoc for video body view state
* refactor: replace video body view state enum
* refactor: remove duplicate video body state init
* refactor: drop unused video body view state attribute
* Fix Prettier
* Update snapshot screenshot
* test: restore video story screenshot mask
* chore: refresh PR head
* Add mask to screenshot to pass CI tests
* test: narrow video story mask hook
* Fix easy Sonar warnings in video body components
* Move shared message body views into event-tile layout
* Move shared message body visual baselines
* Revert unrelated shared message body moves
* feat: add sections to RLSV3
* feat: add sections in vms
* feat: add room list section labs flag
* fix: wrong margin for room list item when in sections
* feat: hide favourites and low priority filters
* fix: crash when changing filter
* feat: support sticky room in sections
* test: update SC snapshot
* test: update SC screenshot
* test: update RLS tests
* test: add tests to RoomListSectionHeaderViewModel
* test: fix existing test in RoomListViewModel
* test: add sections tests for RoomListViewModel
* test: add e2e tests for sections
* fix: incorrect selected room when expanding/collasping a section
* fix: typo in `roomSkipList`
* feat: use one skip list with all filters instead of one list by tag
* chore: put back comment about `roomIndexInSection`
* chore: add missing `readonly`
* chore: add doc about possible undefined value for room item vm
* Use display:none to hide separator
Instead of using zero width and zero opacity. This will prevent any
interaction with the separator.
* Update snapshot
* Give rooms with calls a proper accessible description
Besides improving accessibility, this makes it possible to check for the presence of a call indicator in the room list in Playwright tests.
* Make room list react to calls in a room, even when not connected to them
To use the results of CallStore.getRoom reactively, you need to listen for Call events, not ConnectedCalls events.
* Don't assume that every call starts off as a video call
If a Call object is created by way of someone starting a voice call, then of course the call's initial type needs to be 'voice'.
* Make room list items react to changes in call type
The type of a call may change over time; therefore room list items explicitly need to react to the changes.
* Update a call's type before notifying listeners of the change
If we notify listeners of a change in a call's type before actually making that change, the listeners will be working with glitched state. This would cause the room list to show the wrong call type in certain situations.
* Ignore the Vitest attachments directory
* perf: add memo to room avatar view
* perf: batch rlsV3 emit
* perf: avoid to re-render the room list if the room list state and sections are same
* perf: listen only message preview of the specific room
* perf: avoid to re-render the room list item if the notification or the content is same
* chore: replace useState and useEffect by useMemo in virtualized list
* fix: listen to room name event in RoomAvatar
* fix: room avatar re-render when room is low priority
* refactoring and creation of shared-components for reductedBodyView
* move redacted message rendering to shared MVVM view
* Update snapshots + fix lint errors
* Remove MatrixClientPeg and use reguler react matrix client context
* Stop resyncing redacted body view models with mxEvent
* Fix redacted_because test fixtures for stricter event typing
* Simplify redacted body client access
* Watch timestamp setting in redacted body view model
* Refactor redacted and decryption failure body factories into MBodyFactory
* Prettier Fix
* Refactor FileBody into same pattern for consitancy
* Add `react-resizable-panels` library
* Implement a custom SeparatorView
* Add a `LeftResizablePanelView`
* Add a custom `GroupView`
* Export everything from shared-components
* Make it possible to track width/collapse state through settings
* Add a view model to drive the views
* Render views without disrupting the old room list
* Fix lint error
* Disable user interaction on collapsed panel
* Prevent widgets fron hijacking pointer events
* Expand to full width on separator click
* Separator should be shown when focused via keyboard
* Update tests
* Use data-attribute for hover
* Write stories for SeperatorView
* Write vite tests for SeparatorView
* Write tests for LeftResizablePanelView
* More tests
* Fix lint errors
* Fix flakey border on the roomlst
* Fix storybook axe violation
* Update snapshots
* Fix playwright tests
* Fix sonarcloud issues
* Use translated string
* Add better js-doc comments
* Rename `ResizerSnapshot` to `ResizerViewSnapshot`
* Externalize react-resizable-panels
* Link figma designs to stories
* Write playwright tests
* Update screenshots
* Fix lint errors
* Update more screenshots
* Update more screenshots
* Fix flaky toast test
* Update apps/web/playwright/e2e/crypto/toasts.spec.ts
Co-authored-by: Andy Balaam <andy.balaam@matrix.org>
* Fix indentation
---------
Co-authored-by: Andy Balaam <andy.balaam@matrix.org>
* Update dependency vite to v8
* Update vitest.config.ts
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
* Vite 8 migration
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>
Add missing export in globals:
No name was provided for external module "@vector-im/compound-web" in
"output.globals" – guessing "compoundWeb".
No name was provided for external module "react-virtuoso" in
"output.globals" – guessing "reactVirtuoso".
* chore: rename snapshot, actions and vm according to MVVM doc
* doc: add naming conventions
* chore: fix UrlGroupView naming, folders and children
* chore: remove `Example` column
* refactor: rename `UrlPreviewGroupViewPreview` into `UrlPreview`
* feat: add section header
* refactor: remove index and role related to list box from RoomListItemView
* feat: add wrapper to RoomListItemView to handle different accessiblity pattern
* feat: add section support to VirtualizedRoomListView
* feat: add sections support to RoomListView
* test: add screenshot for sections header
* test: add/update screenshots for sections
* feat: force flat list on view model
This is an intermediary step before implementing sections in the vm. We
force the flat list but we use the underneath the view supporting
sections.
* test: update RoomListViewModel test
* test: fix breaking test
* chore: rename `getSectionViewModel` to `getSectionHeaderViewModel`
* chore: add missing `RoomListItemAccessibilityWrapper` export
* chore: merge `react` imports
* chore: simplify and add comment to `getItemKey` and `getHeaderKey`
* chore add comments to `getItemComponent` variants
* chore: fix typo in example doc
* Port over linkifyJS to shared-components.
* Drop rubbish
* update lock
* quickfix test
* drop group id
* Modernize tests
* Remove stories that aren't in use.
* Complete working version
* Add copyright
* tidy up
* update lock
* Update snaps
* update snap
* undo change
* remove unused
* More test updates
* fix typo
* fix margin on preview
* move margin block
* snapupdate
* prettier
* Port url preview logic to a view model.
* More fiddling with VM logic
* Note to self
* Refactor away into a shared component.
* Even more lovely lovely code that makes it look prettier
* translation cleanup
* Even more stuff that I need to fix yay
* Remove .last-run.json
* Update snaps
* Ensure we set showUrlPreview
* Cleanup tests
* lint + add png support
* Add a label
* Cleanup
* Add snaps
* Update snaps
* update playwright
* Refactors
* update snap
* Add missing snap
* Remove editing code (we check this in a better way in componentDidUpdate)
* Add README
* fix the one unused import
* Style shuffling
* Update vis tests
* Finally fix the tooltip
* Remove unused prop
* Add some padding
* fix lint issue
* Design improvements
* new screens
* Update snaps
* Fix CSS specificity
* Remove stale screenshot
* Rename function to match reality
* Port viewmodel tests to snapshots
* finish documenting types
* Stop being dangerous
* Use Linkify+decode for description
* Remove ability for VM to do linkifying.
* Port over linkifyJS to shared-components.
* Drop rubbish
* update lock
* quickfix test
* drop group id
* Modernize tests
* Remove stories that aren't in use.
* Complete working version
* Add copyright
* tidy up
* update lock
* Update snaps
* update snap
* undo change
* remove unused
* More test updates
* fix typo
* fix margin on preview
* move margin block
* snapupdate
* prettier
* cleanup a test mistake
* Fixup sonar issues
* Don't expose linkifyjs to applications, just provide helper functions.
* Add story for documentation.
* remove $
* Use a const
* typo
* cleanup var name
* remove console line
* Changes checkpoint
* Convert to context
* Revert unrelated change.
* more cleanup
* Add a test to cover ignoring incoming data elements
* Make tests happy
* Update tests for LinkedText
* Underlines!
* fix lock
* remove unused linkify packages
* import move
* Remove mod to remove underline
* undo
* fix snap
* another snapshot fix
* More cleanup
* Tidy up based on review.
* fix story
* Pass in args
* update snap
* cleanup
* use source image
* oops
* remove client peg
* Remove unused state
* tidy up code
* Ensure we update the preview when the event content may have changed.
* s/global/globalThis/
* Ensure we don't stretch images
* Update screenshots
* Cleanup
* Refactor MFileBody using MVVM and move to shared component
* Simplyfing rendering properties
* Create a first version of view model for the component
* Simplifying component properties and make it possible to override module css using data-* attributes
* Create a MBodyFactory in element-web and use it to render MFileBodyView from MessageEvent
* Use <MediaBody instead of <button to support legacy rendering
* Updated styling and comments
* Refactoring className from snapshot to component property
* Rename MFileBody* to FileBody*
* Rename MFileBody* to FileBody*
* Refactoring render branches to allow for displaying nothing
* Fix styling issues
* Fix lint errors
* Fix for css selectors in playwright tests
* Remove the MFileBody component and change all callers to use MBodyFactory:FileBodyView
* Remove unused strings in element-web
* Revert to render text in story iframes
* Fix for prettier error
* Fix playwright test css selectors
* Apply legacy styling in element-web
* Add legacy styling for mx_MFileBody
* Restore file
* Change from <div to <button
* Calculate span width ad update screenshots
* Remove width calculation and update snapshots
* Fix for letter-spacing and better content in story
* Updated playwright screenshots
* Updated snapshots
* Fixing Sonar errors/warnings
* Removed extra parentheses
* Changes after review
* Change border-radius to px and updated snapshots
* Fix typo in description
* And another typo fix
* Changes after review
* refactor: extract most of the logic from the virtualized list
The VirtualizedList component is renamed FlatVirtualizedList and most of
the logic is extracted. In order to prepare the introduction of the
GroupedVirtualizedList which will share most of the behaviour.
* refactor: use `FlatVirtualizedList` instead of `VirtualizedList`
* feat: add grouped virtualized list to shared components
* feat: add accessiblity helps for virtualized list
* test: use one test suite for the two virtualized lists
* test: update storybook screenshots
* feat: add keyboard navigation on header
* test: make a11y test pass
* chore: delete old screenshot
* doc: a11y docs to list stories
* chore: fix copyright
* Port over linkifyJS to shared-components.
* Drop rubbish
* update lock
* quickfix test
* drop group id
* Modernize tests
* Remove stories that aren't in use.
* Complete working version
* Add copyright
* tidy up
* update lock
* Update snaps
* update snap
* undo change
* remove unused
* More test updates
* fix typo
* fix margin on preview
* move margin block
* snapupdate
* prettier
* cleanup a test mistake
* Fixup sonar issues
* Don't expose linkifyjs to applications, just provide helper functions.
* Add story for documentation.
* remove $
* Use a const
* typo
* cleanup var name
* remove console line
* Changes checkpoint
* Convert to context
* Revert unrelated change.
* more cleanup
* Add a test to cover ignoring incoming data elements
* Make tests happy
* Update tests for LinkedText
* Underlines!
* fix lock
* remove unused linkify packages
* import move
* Remove mod to remove underline
* undo
* fix snap
* another snapshot fix
* Tidy up based on review.
* fix story
* Pass in args
* refactor: move pinned message badge into shared-components
* Update lint errors
* Fix for Vitest issue with CI on shared components
* Update related to the pr comments and requests
* Prettier Fix
* Update, remove view since it was just moved and not actually MVVMed
* Removed view suffix since it was only moved and not mvvmed
* Update snapshots
* Removal of unused screenshots
* Added Image that we need
* [create-pull-request] automated change
* Use a dedicated string for public access in settings.
* Fix tests due to copy changes.
* Fix tests due to copy changes.
* Fix tests due to copy changes.
* Fix tests due to copy changes.
* Fix tests due to copy changes.
* Updated visual tests screenshots due to copy changes.
* Updated visual tests screenshots due to copy changes.
---------
Co-authored-by: t3chguy <2403652+t3chguy@users.noreply.github.com>
Co-authored-by: mxandreas <andreass@element.io>
* Refactor className? to component property in EncryptionEventView
* Refactor extraClassNames to default react className as component property for DecryptionFailureBodyView
* Refactor className to component property for MessageTimestampView
* Refactor className and children to component properties for ReactionsRowButton
* Refactor className to component property for DisambiguatedProfile
* Refactor className to a component property in DateSeparatorView
* Fix for lint errors and EncryptionEventView unsupported icon color
* EncryptionEventView fix for icon color css specificity/order
* perf(room list): clear room list item vm only when changing space
Clearing all the item vms at every room list change is causing massive
re-render of all the room list items. References to the vms are already
removed when out of view (see RoomListViewMode.updateVisibleRooms) and
handled by GC.
* perf(room list): avoid to re-render filters at every room list update
RoomListView re-renders on update but the filters (children) don't need
to.
Add a memo to avoid excessive-rerenders.
* chore: add `keepIfSame` to do diff on vm objects
* perf(room list): avoid to create new filter ids and keys when the room list is updated
The filterKeys are passed in the virtuoso context so it should reduce
internal computing
The filter ids array has always the same value, there is no point to
create a new instance.
* test(room list): remove no longer relevant test
* test(room list): add new test to ensure that room list item vms are preserved
* Init shared component structure
* Storybook implementation
* Add snapshots of storybook examples
* ViewModel Creation + Implementation In EventTile.tsx
* Prettier
* Update HTML snapshot
* Add onhover pointer on bottons
* Added compound web tooltip
* Removed possible of undefined on label
* Update snapshots
* Update setters to use merge instead of updating full snapshot
* adapt view model test for setters change
* Actions should be passed to viewmodel fix
* replace ReactionsRowWrapper forceRender with explicit reaction state
* Update snapshot
