* Show & clear your own on-a-call status
The user menu / settings now reflects your own on-a-call status
and pressing the 'clear' button will clear both m.status and m.call,
whichever are set.
* Update function name
* Fix tests
And make the clear status function simpler by just throwing if either fails.
* Fix more tests
* Refactor NotificationBadge to shared MVVM
* Added snapshot images
* Replace legacy NotificationBadge with adapter
* Fix Eslint
* Use regular NotificationBadge prop names
* Remove legacy NotificationBadge selectors
* Update TAC badge Playwright selectors
* Rename NotificationBadgeAdapter to NotificationBadge
Addresses review feedback: the component is the app-facing badge, not an
adapter, so name it NotificationBadge.
* Make NotificationBadgeView isClickable a required boolean
Addresses review feedback: there is no semantic difference between
`isClickable: false` and `isClickable: undefined` (both render the
non-interactive variant), so the field should be a plain boolean. The
view model always provides it.
* Drop redundant comparison guards in NotificationBadge view model setters
Addresses review feedback: Snapshot.merge already compares each field
with Object.is and only emits when something actually changed, so the
manual equality guards in each setter were redundant. Recompute the
snapshot unconditionally and let merge dedupe.
* Resolve notification badge labels inside NotificationBadgeView
Addresses review feedback: static UI labels belong in the view, not the
snapshot. The view now resolves the knock and unsent-message strings via
useI18n, and the snapshot exposes a showUnsentTooltip boolean instead of
a prebuilt tooltipLabel (and drops knockLabel entirely). Adds the
room|knock_sent and notifications|message_didnt_send keys to the
shared-components i18n catalogue so they resolve in tests and storybook.
* Remove unused translation because of shared components movement
* Fix typescript issue
* Fix lint issue
* Remove unused notification badge count setting
* Pass notification badge class names explicitly
* Refactor Mjolnir body to use render-only view model actions
* Extracted isMjolnirBodyAllowed from MessageEvent
* Converted the new test file to vitest
* Add EventTile root properties to view model
* Move render-related event reads into the vm
* Remove duplicate root derivation in UnwrappedEventTile
* Move data-has-reply derivation into EventTileViewModel
* Move getEventDisplayInfo() and dependencies into EventTileViewModel
* Add tests for improved coverage
* Cleanup and comments
* Fix: Replacement events have a fallback tile but must not show their own reply chain
* Combine dependency and prop updates into one atomic VM update
* Remove property which was never read and fix oxfmt issue
* Add new setting to store section state
* Store section state in device settings
* Wire up section header view model and new section functions
* Update room list vm tests
* Add e2e test on section state persistence
* Use more intuitive syntax for SectionExpansionState
* Formatting
* Fix chats section staying expanded
* Add CHAT section case in e2e test
* Add pure sender render inputs to EventTileViewModel
* Move sender/avatar normalization to EventTile
* Split sender and avatar adapters into focused leaf components
* Add tests for the sender and avatar adapters
* Fix sonar issues
* Make sender profile consume pure member info
* Collapse sender adapter onto snapshot-driven props
* Share current-member resolution for event and reply tiles
* Fix Prettier issues
* Keep settings preview on historical sender profiles
* Update the proprty name to reflect the use of the event-time sender data instead of resolving the current room member
* Fix Sonar issue
* Tighten member to MemberInfo | null in the view model
* use url preview bundle preview content in timeline
* fixed linting errors
* claude wrote a test!
* moved reading settings from the view model into the component
* claude wrote more tests
* applied reviews
* Fetches link previews for all links in message (instead of just the first one)
* message url component to display preview for multiple urls
* Revert visible behaviour back to only showing one URL preview
While fetching all link previews in the text message.
* Moved URL preview VM to MessageComposer
* Added com.beeper.linkpreviews to messages sent with the markdown compositor
* MSC 4452 implemented for the older (markdown) composer
* claude told me to use logger instead of console
* Previews generated with snapshot instead of vm
* moved attachPreviews to a separate file
* added attach URL previews to rich text editor
* don't let attachUrlPreviews block clearning the composer
* fixed linter errors
* moved url preview behind labs feature gate
* passed linters
* moved lab feature checking to where attach preview is used
* claude wrote some unit tests for url previewing
* fixed linter errors
* added feature to labs.md
* fixed linter errors
* fixed oxfmt error
* set previews to none if all previews failed
* resolved PR reviews besides the ones that requires a larger code change
* moved url preview VM creation to message composer
* removed delay when clearing composer url preview on message send
* minor changes to stop using globals everywhere
* moved debouncing responsibility to urlpreviewVM
* minor lint fixes
* added comment
* remove composer content from the state of urlpreview, moved it to the vm
* urlpreviewwrapper depends on the vm only
* added comments
* edited the comment
* updated snapshots
* claude fixed tests
* enable feature for tests that requires MSC4095
* updated snapshot
* Expose SDKContextClass via window for debugging
* Remove stores from window if they are exposed via sdkContext
* Avoid usages of global store instance where React context is accessible
* Fix tests by adding SDKContext.Provider
* Fix tests by adding SDKContext.Provider
* Fix tests by adding SDKContext.Provider
* Fix tests by adding SDKContext.Provider
* Iterate
* Discard changes to apps/web/src/components/views/elements/AppTile.tsx
* Add back Favourites and Low Priority filter into shared components
* Wireup RoomList.showSections and filters in room list vm
* Add e2e test for filters and showSection setting
* Adapt OAuth2 implementation to Matrix Spec v1.18
* Handle more cases of oidc->oauth
* Fix test
* Fix read back of oauth2 context
* Iterate
* Fix tests
* Discard changes to apps/web/playwright/e2e/settings/account-user-settings-tab.spec.ts
* Fix test
* Fix test
* Fix test
* Potential fix for pull request finding 'Unused variable, import, function or class'
Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>
* Iterate
* Iterate
* Fix test
---------
Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>
* Implement tombstone tile view for a room
* Implement tombstone tile view for a DM
* Implement root call tile view
* Export all the views
* Add screenshots
* Remove old view code
* Implement vm for tombstone tile in a room
* Implement vm for tombstone tile in a DM
* Implement root tile vm
* Use new tile in the event factory
* Remove old vm
* Exclude mock code from code checks
* Migrate more jest tests to vitest
* Fix jest config
* Fix jest config
* Make remaining jest tests type-happy
* Iterate
* Fix Notifier import cycle
* Fix tests
* Delint
* Iterate
* Handle SDKContextClass `client` initialisation internally
Rather than via MatrixChat - this is predominantly for Lifecycle tests as they don't use a MatrixChat and it doesn't make much sense for this component to own this state.
* Fix tests
* Iterate
* Simplify diff
* Improve coverage
* Improve coverage
* Iterate
* Add new settings to enable/disable the sections
* Add `RoomList.showSections` settings to preference user settings
* Hide sections ui in room list header
- Hide the collapse/expand button and the *new section* entry in the
menu.
- Display the *start chat* button instead of the compose menu when the
only action available is to create a DM
* Hide sections ui in context menu of room item
* Listen to show section settings in room list item vm
* Listen to show sections setting in room list header vm
* Put all the rooms inside the chat section when sections are disabled
When the chat section is the only section, the room list is in "flat
list mode". Putting all the rooms inside the chat section.
The section filters (aka custom section, favourites etc) are not passed
to the skip list.
* Update preferences settings screenshot
* Add e2e test for RoomList.showSections toggle
* Hide "Chat moved" toast when a room is tagged when RoomList.showSections is disabled
* First stage
1. Make avatar BIGGER!
2. Move status button out to its own component so we can reuse it
* Working version
but using context menu rather than dropdown menu which almost looks
right but not quite.
* Commit the set status view component
* Change to use dropdown with custom trigger
* Show full set status component in user menu
and styling tweaks
* In user menu, clicking takes you to settings
* Add the view model
* oxfmt
because apparently mine had decided to go away
* Fix type import
* Pass set status viewmodel in story
* Bump compound-web
for customisable dropdown
* Snapshot
* Add explicit aria label
as combobox role things don't just inherit from their inner text
* snapshot again
* Only show user status if feature flag enabled
* Make status btton view not a button
because it doesn't need to be. Also rename accordingly.
* Screenshots
* Disable in settings if feature flag off
* Snapshot
* Snapshot again
* Update screenshots
including room settings one which wasn't really supposed to change
although the avatar now takes up the space it's in - leaving it for
design to check.
* Fix size & positioning of the status button
* Update screenshots
* Screenshots
* Test for SetStatusViewModel
* Update set status view on status change
* Use a link component for the status button
which has built in hover state
* Float the status button in a 28px container
vs making it actually 28px min height
* Separate user menu profile into two sections
With 8px gap between things in the two sections and 12px gap between
sections (ie. in practice, 12px gap between the status control and username).
* Screenshot
* Screenshots
* Pass set status view model in the state
rather than as an extra prop. Fixes it in the story too.
* Pass ownprofilestore into the viewmodel
* Don't use snapshot for testing the view model
Avoids getting all the random stuff from the sub VM in the snapshot
and better to test what we care about anyway.
* don't mention the bad word
* Here too
* Don't show user status for guests
* Update guest story to remove user status
* Handle SDKContextClass `client` initialisation internally
Rather than via MatrixChat - this is predominantly for Lifecycle tests as they don't use a MatrixChat and it doesn't make much sense for this component to own this state.
* Fix tests
* Separate out SDKContext
...from SDKContextClass, as the comments hopefully explain.
Also make the captitalisation consistent.
* Adding the new file usually helps too
* Fix import
* More comment
* Update the various imports of SDKContextClass
* Also fix case of TestSDKContext
* Update the mock
* Modify LinkPreview to export shared atomics
* Implement MessageComposerUrlPreviewView
* Create UrlPreviewFetcher utility function
* Modify view models
* Implement in composer
* Support running tests in dom-less vitest environment
* Add a playwright test
* hide another one
* fmt
* cleanup
* test rte too
* fixup
* Add back docstring
* cleanup
* off by one
* remove description check
* Cleanup hacks
* Remove another hack
* cleanup
* one more
* fixup window here too
* whoops type
* Rename to be cleaeer
* Trim URLs first
* fix bug
* Forward the scroller element and scroll handle through VirtualizedList
The room list needs two things the generic list did not expose: the underlying
scroll container (to observe which items are genuinely visible) and the imperative
scroll handle (to scroll an item into view). Forward an optional scrollerRef from
useVirtualizedList and pass scrollHandleRef through FlatVirtualizedList, mirroring
what GroupedVirtualizedList already exposes. Both are additive and optional, so other
consumers are unaffected.
Signed-off-by: David Langley <langley.dave@gmail.com>
* Add an unread-activity toast to the room list
Show a clickable "You have unread activity" pill when there are unread rooms
scrolled below the visible fold, including unreads hidden inside collapsed sections
whose header is below the fold. Clicking it scrolls the next such unread into view.
The visible fold is tracked with an IntersectionObserver over the rendered item
elements, so the toast appears as soon as a room crosses the fold rather than only
once it leaves Virtuoso's overscan buffer. The toast click is wired through an
imperative scroll handle the view registers with the view model.
Signed-off-by: David Langley <langley.dave@gmail.com>
* Change toast to target notifications only, not unread activity.
* Fix formatting and refresh Toast snapshots for compound-web 9.7.0
- Apply oxfmt to the room list view model and virtualized view.
- Refresh the RoomListToast/RoomListView story snapshots: compound-web
9.7.0 moves the typography classes onto the toast .content element and
rebuilds the Toast CSS module hashes.
- Add the missing UnreadActivityToast render snapshot baseline.
* Add e2e tests for the room list unread activity toast
Cover the unread-activity toast end to end:
- it appears for a notifying room scrolled below the fold and clicking it
scrolls that room into view (then the toast clears);
- a room with only an unread-activity dot (no notification count) does not
raise it;
- a collapsed section hiding a notifying room raises it, and clicking
scrolls the section header into view.
* Add visual snapshot baselines for the unread-activity toast stories
* Converge room-list toast codepaths into a single state-driven toast
Reviewer feedback: the unread-activity toast and the transient event toasts
(section_created / chat_moved) should share one mechanism, with toast
lifecycle and precedence owned by the view model rather than split across a
separate snapshot flag and a view-level ternary.
- RoomListViewModel now reconciles the transient event toast and the derived
unread-activity state into a single snapshot.toast via recomputeToast(); the
event toast still takes precedence and auto-dismisses, and the unread toast
reappears once it clears. Drops hasUnreadActivityBelow from the snapshot.
- RoomListView renders a single RoomListToast driven by snapshot.toast; the
ToastType union gains 'unread_activity'. The standalone UnreadActivityToast
component is folded into RoomListToast (clickable arrow-down variant).
- Adds VM tests for the unread-activity toast and the event/unread precedence.
* Pre-bundle the room-list dnd-kit + virtuoso graph in vitest browser mode
The room-list suites (RoomListView, VirtualizedRoomListView,
RoomListItemMoreOptionsMenu) import a heavy @dnd-kit + react-virtuoso graph.
Only @dnd-kit/abstract was pinned in optimizeDeps.include; @dnd-kit/dom,
@dnd-kit/react, @dnd-kit/abstract/modifiers and react-virtuoso were left to
runtime discovery. Under CI load the browser-mode dep optimizer can discover
them late, re-bundle and reload the page, which fails the in-flight
setupTests.ts import for those suites. Pinning the whole graph forces it into
the initial optimize pass so no re-run happens while tests load.
---------
Signed-off-by: David Langley <langley.dave@gmail.com>
* feat(rls): centralize room-list section ordering via getOrderedSections
Introduce a single source of truth for the ordered list of section
tags (defaults + custom) in section.ts. RoomListStoreV3 no longer
hard-codes the default tag order — it asks section.ts.
* feat(vm): add section reorder logic to RoomListStoreV3 and view model
* refactor(sc): extract RoomListSectionHeaderContent from RoomListSectionHeaderView
* feat(sc): add drag-and-drop reordering for room-list sections
* test(sc): update existing tests
* test: add new tests
* test(sc): add snapshot test for overlay
* test(e2e): add playright test for dnd of sections
* feat: tweak opacity
* fix: section detection when dragged
* feat: use relative position in section order
* chore: move style to room list section header view
* test: add e2e test for moving section before another
* feat: make favourite and low priority no draggable
* test: remove deprecated e2e test
* fix: type correctly dnd provider and hooks
* fix: use String instead of casting to string
* fix: wrong a11y attributes on section header
* test: fix keyboard navigation e2e tests
* feat: use custom a11y announcement for dnd
* fix: add aria-hidden to the overlay
* chore: remove duplicated code in a11Y announcement
* fix: increase keyboard drag offset
* fix: tests
* fix: virtuoso computed item key
* fix: aria-expanded double annoncement why dragging
* fix: re-add screen reader instructions
* chore: remove unused import
* fix: reduce keyboard drag offset
* fix: improve text readback on unread section
* feat: use a custom a11y plugin instead of buitin a11y plugin
* chore: formatting
* test: fix incorrect tests
* chore: use randomUUID
* fix: try to make test working
* fix: put back mock
* fix: circular import
* Revert "fix: circular import"
This reverts commit 6c69313ade9ed2ab17a4622c692b435fbdb94ad2.
* chore: add @dnd-kit/abstract to optimizeDeps.include
* test: fix e2e tests
* fix: disable interaction with section when dragging
* fix: be more explicit if the section will be dropped before or after
* fix: add info that space is dropping too
* fix: scroll to dropped section
* test: fix virtualized room list test
* chore: update lang
* chore: fix dead code analyze
* test: add provider section story
* fix: lang
* fix: again lang...
* fix: improve voice over on chrome
* test: upate snapshot
* fix: add readback when a section is over a non droppable element
* Add user status on user profile icon
Currently unstyled & no tests
* Style the user status icon
* Update snapshot
for avatar wrapper
* More snapshot updates
* add if braces
* Split out user status functions
to avoid circular dep which has the weird effect of just breaking
jest's mocking.
* type imports
* Update imports
* Update snapshot
* Tests
* baseline image
* Just snapshot the component itself
* User status in user menu
first pass, unstyled
* fix export
* superstylin'
* snapshots
* Add story & test
* Snapshots
and re-use the repeated rules
* Tests
* Fix jest lcov projectRoot config
* Change tooltip text to just 'clear'
* Add comment & fix console warn
* Remove all options screenshot
as it's not really particularly useful as a preset story
* remove stale screenshot
* fix imports
---------
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* fix: don't display the empty/collapse icon when the room list is empty
* Fix jest lcov projectRoot config
---------
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* Add user status on user profile icon
Currently unstyled & no tests
* Style the user status icon
* Update snapshot
for avatar wrapper
* More snapshot updates
* add if braces
* Split out user status functions
to avoid circular dep which has the weird effect of just breaking
jest's mocking.
* type imports
* Update imports
* Update snapshot
* Tests
* baseline image
* Just snapshot the component itself
---------
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
* Remove `onFocus` and `onBlur` handlers
react-resizable-panels fixed the issue where focus-visible was not
working as expected, so we no longer need this bit of code.
* Implement new hover/focus separator
* Collapse the panel when clicking on the new focus separator
* Remove `isFocusedViaKeyboard` from snapshot
* Update tests and storybook
* Expand panel only on double click
* Add animation
* Fix tests
* Don't render border when type is bar
* Single click to expand, double click to collapse
* Change focus separator color
* Make EventTileViewModel an owned root VM
* Move timestamp sub-VMs under EventTileViewModel
* Move thread-list action bar VM under EventTileViewModel
* Clean up for improved readability
* Clean up to avoid duplicate EventTile render derivations
* Avoid mutating EventTileViewModel during render
* Move EventTile child VM syncing into adapters
* Replace timestamp VM field setters with batched setProps
* Component wrappers at the end of the file
* Lazy-create EventTile child view models
* Thin EventTile render state wiring
* Move EventTile E2E verification into a view model
* Derive EventTile E2E padlock slots in view model
* Derive EventTile timestamp slots in render state
* Derive EventTile footer slots in render state
* Fix SonarCloud issues
* feat: display empty custom sections in the space where they were created
* test: update tests
* fix: room can't be drag in to a section if a section is created before
* fix: re-render issue when section is created
* Remove border from roomlist container
The separator will act as the border so we no longer need the roomlist
border.
* Use pointer events to detect click event
Otherwise the onClick handler would run when you resize the panel.
* Support showing the border in separator
* Update tests
* Disable double click behaviour on separator
* Fix screenshot tests failing