e4ed5240e7a6eded637b6ff7e050a5bf9ab94464
12 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
11030ae68d |
Refactor DateSeparator using MVVM and move to shared-components (#32482)
* Refactor DateSeparator using MVVM and move to shared-components
* Add a few more stories, tests and screenshots
* Use the shared component and viewmodel in element-web
* Renaming custom content property an updating snapshots
* Fix lint errors and update snapshot after merge
* Change lifecycle handling for DateSeparatoreViewModel in components where manual handling is preferrable over wrapper component.
* Move context menu from viewmodel to shared components - step 1
* Create a jump to date picker component in shared components
* Add tests for coverage and fix layout issues and roving indexes
* Make element-web use the new component
* Simplify context menu and adjusting tests
* The HTMLExport now render shared components and need a I18nContext.Provider
* Updating unit tests for context menu
* Changed to {translate: _t} to let scripts pick up translations
* Fix lint issue and updating screenshots after merge
* Update snaps for element web components
* Renaming MVVM view components with suffix View.
* Fixing problem with input date calendar icon and system dark theme
* Changed the rendering of the menu and added a separate button component
* Handle input control with useRef in onKeyDown
* Updating DateSeparator snapshots on unit tests
* Updating layout after compound Menu got a className property
* Move files to new subfolder after merge
* Updated snapshot after merge
* Updating lock file
* Updates to styling from PR review
* Updates to focus/blur functionality
* Fixed tabbing and export documentation to stories
* Updated snapshots
---------
Co-authored-by: Zack <zazi21@student.bth.se>
|
||
|
|
6d870c3935 |
Room list: fix keyboard navigation (#32585)
* feat: add visual feedback of selection in `VirtualizedList` story * fix: keyboard navigation when focused element is no longer in the dom * fix: selection delay when the list is scrolled * fix: room list item scroll issue Avoid to use margin https://virtuoso.dev/react-virtuoso/#caveats * test: add tests * test(e2e): update snapshots * test: update room list item screenshot |
||
|
|
77670eb369 |
Add lint rule to protect against this access on unbound methods (#32578)
* Add Actions to ViewModel utility types and specify `this: void` signature Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add https://typescript-eslint.io/rules/unbound-method/ linter to shared-components also fix stray lint config which doesn't apply to SC Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add https://typescript-eslint.io/rules/unbound-method/ linter to element-web Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix genuine issues identified by the linter Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Specify this:void on i18napi Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update Module API Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add comment for MapToVoidThis Added utility type to map VM actions to unbound functions. --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
ffd4270051 |
Switch from yarn classic to pnpm (#31971)
* Switch shared-components from yarn classic to pnpm Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch element-web from yarn classic to pnpm Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch CI to pnpm Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update docs & comments Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Hold back postcss to match yarn.lock & use workspace protocol Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Tweak CI Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Rid the world of `$(res)` Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to type=module Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix module import Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Make knip happy Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update playwright imports Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Make docker build happy Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Remove stale params Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix badly formatted logging Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to lodash-es Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Make jest happier Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch element-web to ESM Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update testcontainers imports Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix modernizr cjs Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix modernizr cjs ignore files Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Move modernizr sonar exclusion to exclude everything Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update playwright tests for esm compat Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Add pnpm-link utility Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Test matrix-web-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> * Discard changes to src/vector/index.ts * Update playwright-common Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Use catalogs Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Improve pnpm-link script Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Use pnpm import to regenerate lockfile from yarn.lock Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
abdb307279 |
Publish shared components storybook (#31907)
* doc: add typedoc generation for shared component * ci: add SC doc publish * ci: push doc on changes on develop * ci: fix working directory * doc: add typedoc generation into storybook * doc: build i18n files for storybook static sites * ci: change workflow to deploy storybook * chore: exclude non-ui tests from vitest visual tests * chore: try to fix error in CI * doc: fix broken link in README * doc: add typedoc missing export plugin Add https://github.com/Gerrit0/typedoc-plugin-missing-exports to avoid to have to explicit export all the types which are not used outside SC * doc: add mapping to external docs * fix: remove shebang |
||
|
|
6da1412de8 |
Migrate the room list view to shared components (#31921)
* Add NotificationDecoration component Add the NotificationDecoration component to shared-components. This is a leaf component that renders notification badges and indicators for rooms/items including mentions, unread counts, call indicators, etc. * Add RoomListItem component Add the RoomListItem component to shared-components. Includes context menu, hover menu, notification menu, and more options menu. * Add RoomListPrimaryFilters component Add filter chips component for filtering the room list by unread, people, rooms, favourites, mentions, invites, and low priority. * Update VirtualizedList component Update VirtualizedList to support the room list virtualization requirements. * Add RoomList component Add RoomList component that renders a virtualized list of room items. Includes story mocks for testing. * Add RoomListView component Add RoomListView component that composes RoomList with filters, empty states, and loading skeleton. * Export room-list components from shared-components Add exports for RoomListView, RoomListItem, RoomListPrimaryFilters, and RoomList. Include i18n strings for room list components. * Add RoomListItemViewModel Add view model for individual room list items. Manages per-room subscriptions and updates only when specific room data changes. * Add RoomListViewViewModel Add view model for the room list view. Manages room list state, filtering, keyboard navigation, and child view models. * Integrate shared components into RoomListView Update RoomListView to use the new ViewModels and shared components. Includes i18n string updates for element-web. * Remove old room list implementation Remove old ViewModels, hooks, and view components that are now replaced by the shared-components implementation. * Update sliding-sync playwright test Update test expectations for new room list implementation. * Add figma links * Move viewModels to the right folder * Rename to RoomListEmptyStateView * Update VirtualizedRoomListView naming * Update screenshots and snapshots * Move viewmodel tests to the right location and fix some imports * lint * Use unknown as an Opaque type rather than any. It discourages property access within shared components and can still be cast back in EW. * Update screenshots for new shared component rendering params * Make room order tests deterministic |
||
|
|
d6f11d828b |
Migrate ListView to shared components (#31860)
* Migrate ListView to shared components * Add stories * lint * Update name of component * Use compound spacing * lint * VirtualizedList * Simplify story * Add git diff check before uploading artifacts * Fix git diff workaround for vis * Ignore coverage report in .gitignore Add coverage report to .gitignore * Add screenshot test * Fix package and lock files * clear unneeded lock file changes --------- Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
35fca4d339 |
Switch shared-components from jest & test-runner to vitest (#31800)
* Remove babel Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Remove duplicated patch-package dep Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch to @fetch-mock/vitest Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update tests to import & call vitest functions Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update test-utils imports Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update unit test snapshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch from jest->vitest for unit tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update visual test screenshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Switch from test-runner->vitest for visual tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update README Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update CI for shared-components unit & visual tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update yarn.lock Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update README Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix storybook trying to import vitest Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix css modules leaking between storybook tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Tweak screenshot update script to accept args Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
13696af194 |
Split translations between EW and shared components (#31441)
* Split translations between EW and shared components Uses update module API with global TranslationKey type that can be overridden. WIP. * Removed the wrong script (for now) * Add the type files * Add shared components i18n file * More i18n strings * Add i18n check for shared conmponents * Needs a different name * rerun i18n for merge from develop, fix test * Move translated strings to shared components file NB. there are lots of removed strings for a few languages where we seem to have hit a localazy bug or something where the key/value for plurals got switched, making the translations invalid. They've been missing for a while so I'm removing them rather than trying to restore them, * Add shared components files to localazy * Merge element web & shared component translations for the built app * Use right translations for shared component tests and fix missign en_EN strings * Pull shared components translations too * Fix/disable warnings * We can now remove the build:res call ...right? (right?) * Remove webpack import for languages index ..and just load it using a relative path which we do for the individual language files and also did anyway for the index because even in non-test it was an object, not a string, so we always usesd the 'test' code path. * Make the storybook language selector work ...without referring to the parent app's files * Revert unnecessary yarn lock change * Typo Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> * Add comment on why we use merge * Fix localazy download config to actually put the translations in the right place * Better typescript syntax Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> * Watch both translations files --------- Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
5370f25870 |
Introduce i18nContext (#31347)
* Introduce i18nContext * Adds a context that holds the module i1n API * Switches shared components to use that instead of importing it directly * Adds the context to MatrixChat and BaseDalog so it should be available most places in EW This is a relatively small PR but does change the way the shared components do i18n so just doing this one by itself (it stands by itself anyway). This will allow shared components to use i18n when used in modules. * Add the file * Fix import lint * Name the translate function _t Then it should continue to get picked up by the script This seems a bit flaky and ew but I'm not sure I want to get into changing this in this PR. * Put humanize back to calling something called _t too * Missed one * Add i18n context wrapper to stories * Unused import * Fix imports * wrap richitem * Wrap other richitem & richlist * One day I will get my head around this syntax * Fix import spacing * Add wrapper to test * unused import * Hack around dependency cycle * Make a moduleapi instance for tests * Add i18n wrapper to jest-matrix-react * Simple test for i18napi * Import type * Move i18n context wrapper to storybook template * Unused imports & fix pill story * Move i18n to its own provider * Add i18ncontext wrapper to jest tests * imports * Bump module api to 1.7.0 * tsdoc |
||
|
|
b0cdbf5eff |
Make shared component build work in isolation (#31066)
* Make shared component build work in isolation * Add deps that were missing because they were getting picked up from element-web main but shared-components needs itself * Exclude test files from dts generation * Bump version * Change all the shared-component import to be the built artifact * Don't randomly inhale eslint configs in parent dirs please * maybe we don't need this anymore? * maybe fix build * Maybe fix docker build * More build faff * build:res on the parent as part of shared component prepare * link shared component repo inn docker build * 💅 * 💅x2 * Try converting the translation keys to a .d.ts file manually so it gets bundled rather than left as a relative import to the json file * add the script * Add this back for 2nd time now I think * Shouldn't need this anymore * patch-package on prepare because we're patching a dev dependency so it won't be there if we're installed as a dependency * Unused import * Prettier compliance * Only use counterpart from shared components as per comment * Import shared components CSS * Prettier * Call the one from shared components rather than recurse infinitely * Hopefully make tests work * wake up, comment goes before import * Fix lint errors * Fix dupe TranslationKey export * Update compound-web to fix type error An update to @types.react adds the 'hint' value to the enum of the 'popover' attribute and this version of compound-web uses the maching verson of @types/react so they don't conflict. * Maybe, hopefully, get the types working? Please? * Add copyright header to i18nkeys as eslint complains otherwise since it's now in src * prettier * stop running shared-component tests in EW * update snapshots because flex is now from an external stylesheet I guess * More snapshots * Manual class update * Avoid bundling compound bits Because a) it's silly and b) it means we end up bundling a copy of floating-ui too which causes absolute madness with its useDelayGroup contexts. * ignore test util files for coverage * Add !important because the styles are being applied in a different order now * Another !important because css order has changed * Try adding it here to make the test files ignored * More !important * commit yarn lock change * Add shared components coverage file * Update snapshots Because the line height was being overridden to 22.5px somehow by something I can't find, and now isn't: surely the normal 1.5rem is more sensible. * Update snapshots, attempt 2 * Another !important * More snapshot updates * Add test for i18n wrappers & add test script * lint * Prettier * Hopefully run shared component tests * don't need this bit for non-matrix * install ew deps * rigfht coverage location * Rename job here too * Try different coverage filename * Fix copyrights & comment * Typo Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> --------- Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> |
||
|
|
2698ad422e |
Move shared components to a packages/ directory (#30962)
* Move shared components to a packages/ directory so they can be publish more sensibly * Iterate towards split out shared-components module * Move shared component source into src/ subdir * Fix up imports * Include shared components in babel-ing (again) * Remove now unused dependencies * Update import in storybook preview * ...except of course they aren't unused if we import the shared components by source * Ignore shared components deps * Add shared-components to i18n paths and upgrade web-i18n to version that supports doing so * Move storybook stuff to shared-components * Seems we don't need this anymore... * Remove unused deps and remove storybook plugin from eslint * Presumably working-directory is only valid on run steps * Ignore dep & run prettier * Prettier on knips.ts * Hopefully run in right dir * Remember how to software write * Okay... how about THIS way? * Oh right, they were git ignored. Sigh. * Add concurrently * Ignore in knip * Better? * Paaaaaaaackageeeeeeees * More packages * Move playwright snapshots * Still need a custom snapshots dir * Add eslint back * Oh, now knip sees them * Fix another import * Don't lint shared-components with everything else Okay, eslint & tsconfig are tied too closely for this to work and running tsc on the shared components will need its deps installing * Maybe lint shared components please? * Not quite * Remove storybook again Re-check if it does work without it * Remove storybook eslint plugin as we're not linting storybook here anymore * Remove this too * We do need it here though |