diff --git a/src/domain/SessionPickerViewModel.js b/src/domain/SessionPickerViewModel.js index 6e33883b..79f97578 100644 --- a/src/domain/SessionPickerViewModel.js +++ b/src/domain/SessionPickerViewModel.js @@ -15,15 +15,14 @@ limitations under the License. */ import {SortedArray} from "../observable/index.js"; -import {SessionLoadViewModel} from "./SessionLoadViewModel.js"; import {ViewModel} from "./ViewModel.js"; import {avatarInitials, getIdentifierColorNumber} from "./avatar.js"; class SessionItemViewModel extends ViewModel { - constructor(sessionInfo, pickerVM) { - super({}); + constructor(options, pickerVM) { + super(options); this._pickerVM = pickerVM; - this._sessionInfo = sessionInfo; + this._sessionInfo = options.sessionInfo; this._isDeleting = false; this._isClearing = false; this._error = null; @@ -76,6 +75,10 @@ class SessionItemViewModel extends ViewModel { return this._sessionInfo.id; } + get openUrl() { + return this.urlRouter.urlForSegment("session", this.id); + } + get label() { const {userId, comment} = this._sessionInfo; if (comment) { @@ -127,11 +130,10 @@ class SessionItemViewModel extends ViewModel { export class SessionPickerViewModel extends ViewModel { constructor(options) { super(options); - const {storageFactory, sessionInfoStorage, sessionCallback, createSessionContainer} = options; + const {storageFactory, sessionInfoStorage, sessionInfoCallback} = options; this._storageFactory = storageFactory; this._sessionInfoStorage = sessionInfoStorage; - this._sessionCallback = sessionCallback; - this._createSessionContainer = createSessionContainer; + this._sessionInfoCallback = sessionInfoCallback; this._sessions = new SortedArray((s1, s2) => s1.id.localeCompare(s2.id)); this._loadViewModel = null; this._error = null; @@ -140,7 +142,9 @@ export class SessionPickerViewModel extends ViewModel { // this loads all the sessions async load() { const sessions = await this._sessionInfoStorage.getAll(); - this._sessions.setManyUnsorted(sessions.map(s => new SessionItemViewModel(s, this))); + this._sessions.setManyUnsorted(sessions.map(s => { + return new SessionItemViewModel(this.childOptions({sessionInfo: s}), this); + })); } // for the loading of 1 picked session @@ -148,34 +152,6 @@ export class SessionPickerViewModel extends ViewModel { return this._loadViewModel; } - async pick(id) { - if (this._loadViewModel) { - return; - } - const sessionVM = this._sessions.array.find(s => s.id === id); - if (sessionVM) { - this._loadViewModel = new SessionLoadViewModel({ - createAndStartSessionContainer: () => { - const sessionContainer = this._createSessionContainer(); - sessionContainer.startWithExistingSession(sessionVM.id); - return sessionContainer; - }, - sessionCallback: sessionContainer => { - if (sessionContainer) { - // make parent view model move away - this._sessionCallback(sessionContainer); - } else { - // show list of session again - this._loadViewModel = null; - this.emitChange("loadViewModel"); - } - } - }); - this._loadViewModel.start(); - this.emitChange("loadViewModel"); - } - } - async _exportData(id) { const sessionInfo = await this._sessionInfoStorage.get(id); const stores = await this._storageFactory.export(id); @@ -213,9 +189,7 @@ export class SessionPickerViewModel extends ViewModel { return this._sessions; } - cancel() { - if (!this._loadViewModel) { - this._sessionCallback(); - } + get cancelUrl() { + return this.urlRouter.urlForSegment("login"); } } diff --git a/src/ui/web/login/SessionPickerView.js b/src/ui/web/login/SessionPickerView.js index e421e56c..4bb9b6b7 100644 --- a/src/ui/web/login/SessionPickerView.js +++ b/src/ui/web/login/SessionPickerView.js @@ -79,7 +79,7 @@ class SessionPickerItemView extends TemplateView { })); const errorMessage = t.if(vm => vm.error, t.createTemplate(t => t.p({className: "error"}, vm => vm.error))); return t.li([ - t.div({className: "session-info"}, [ + t.a({className: "session-info", href: vm.openUrl}, [ t.div({className: `avatar usercolor${vm.avatarColorNumber}`}, vm => vm.avatarInitials), t.div({className: "user-id"}, vm => vm.label), ]), @@ -98,11 +98,6 @@ export class SessionPickerView extends TemplateView { render(t, vm) { const sessionList = new ListView({ list: vm.sessions, - onItemClick: (item, event) => { - if (event.target.closest(".session-info")) { - vm.pick(item.value.id); - } - }, parentProvidesUpdates: false, }, sessionInfo => { return new SessionPickerItemView(sessionInfo); @@ -118,9 +113,9 @@ export class SessionPickerView extends TemplateView { className: "styled secondary", onClick: async () => vm.import(await selectFileAsText("application/json")) }, vm.i18n`Import a session`), - t.button({ - className: "styled primary", - onClick: () => vm.cancel() + t.a({ + className: "button styled primary", + href: vm.cancelUrl }, vm.i18n`Sign In`) ]), t.if(vm => vm.loadViewModel, vm => new SessionLoadStatusView(vm.loadViewModel)),