diff --git a/doc/SDK.md b/doc/SDK.md index 54e37cca..3f5bdb09 100644 --- a/doc/SDK.md +++ b/doc/SDK.md @@ -31,7 +31,8 @@ import { createNavigation, createRouter, RoomViewModel, - TimelineView + TimelineView, + viewClassForTile } from "hydrogen-view-sdk"; import downloadSandboxPath from 'hydrogen-view-sdk/download-sandbox.html?url'; import workerPath from 'hydrogen-view-sdk/main.js?url'; @@ -53,7 +54,7 @@ import "hydrogen-view-sdk/theme-element-light.css"; async function main() { const app = document.querySelector('#app')! const config = {}; - const platform = new Platform(app, assetPaths, config, { development: import.meta.env.DEV }); + const platform = new Platform({container: app, assetPaths, config, options: { development: import.meta.env.DEV }}); const navigation = createNavigation(); platform.setNavigation(navigation); const urlRouter = createRouter({ @@ -88,7 +89,7 @@ async function main() { navigation, }); await vm.load(); - const view = new TimelineView(vm.timelineViewModel); + const view = new TimelineView(vm.timelineViewModel, viewClassForTile); app.appendChild(view.mount()); } } diff --git a/scripts/sdk/base-manifest.json b/scripts/sdk/base-manifest.json index 7730bbac..0ed9fdab 100644 --- a/scripts/sdk/base-manifest.json +++ b/scripts/sdk/base-manifest.json @@ -1,7 +1,7 @@ { "name": "hydrogen-view-sdk", "description": "Embeddable matrix client library, including view components", - "version": "0.0.10", + "version": "0.0.12", "main": "./hydrogen.es.js", "type": "module" } diff --git a/src/domain/ViewModel.ts b/src/domain/ViewModel.ts index 8b8581ae..0bc52f6e 100644 --- a/src/domain/ViewModel.ts +++ b/src/domain/ViewModel.ts @@ -40,9 +40,9 @@ export type Options = { export class ViewModel extends EventEmitter<{change: never}> { private disposables?: Disposables; private _isDisposed = false; - private _options: O; + private _options: Readonly; - constructor(options: O) { + constructor(options: Readonly) { super(); this._options = options; } @@ -51,7 +51,7 @@ export class ViewModel extends EventEmitter<{change return Object.assign({}, this._options, explicitOptions); } - get options(): O { return this._options; } + get options(): Readonly { return this._options; } // makes it easier to pass through dependencies of a sub-view model getOption(name: N): O[N] { @@ -115,10 +115,6 @@ export class ViewModel extends EventEmitter<{change return result; } - updateOptions(options: O): void { - this._options = Object.assign(this._options, options); - } - emitChange(changedProps: any): void { if (this._options.emitChange) { this._options.emitChange(changedProps); diff --git a/src/domain/session/room/timeline/tiles/SimpleTile.js b/src/domain/session/room/timeline/tiles/SimpleTile.js index cf954ac8..18e6ba17 100644 --- a/src/domain/session/room/timeline/tiles/SimpleTile.js +++ b/src/domain/session/room/timeline/tiles/SimpleTile.js @@ -22,6 +22,7 @@ export class SimpleTile extends ViewModel { constructor(entry, options) { super(options); this._entry = entry; + this._emitUpdate = undefined; } // view model props for all subclasses // hmmm, could also do instanceof ... ? @@ -67,16 +68,20 @@ export class SimpleTile extends ViewModel { // TilesCollection contract below setUpdateEmit(emitUpdate) { - this.updateOptions({emitChange: paramName => { + this._emitUpdate = emitUpdate; + } + + /** overrides the emitChange in ViewModel to also emit the update over the tiles collection */ + emitChange(changedProps) { + if (this._emitUpdate) { // it can happen that after some network call // we switched away from the room and the response // comes in, triggering an emitChange in a tile that // has been disposed already (and hence the change // callback has been cleared by dispose) We should just ignore this. - if (emitUpdate) { - emitUpdate(this, paramName); - } - }}); + this._emitUpdate(this, changedProps); + } + super.emitChange(changedProps); } get upperEntry() { diff --git a/src/matrix/Client.js b/src/matrix/Client.js index 83861cb7..c3352a36 100644 --- a/src/matrix/Client.js +++ b/src/matrix/Client.js @@ -132,14 +132,15 @@ export class Client { }); } - async startRegistration(homeserver, username, password, initialDeviceDisplayName) { + async startRegistration(homeserver, username, password, initialDeviceDisplayName, flowSelector) { const request = this._platform.request; const hsApi = new HomeServerApi({homeserver, request}); const registration = new Registration(hsApi, { username, password, initialDeviceDisplayName, - }); + }, + flowSelector); return registration; }