From efd9f70e928cb2374c6c734ac9002fb77daec628 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Thu, 7 Jul 2022 16:39:45 +0530 Subject: [PATCH 1/4] WIP --- src/domain/session/room/RoomViewModel.js | 37 ++++++++++++++++++- .../web/ui/css/themes/element/theme.css | 4 +- ...rchivedView.js => DisabledComposerView.js} | 4 +- src/platform/web/ui/session/room/RoomView.js | 19 ++++++---- 4 files changed, 50 insertions(+), 14 deletions(-) rename src/platform/web/ui/session/room/{RoomArchivedView.js => DisabledComposerView.js} (82%) diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js index 66042ae5..1cf15969 100644 --- a/src/domain/session/room/RoomViewModel.js +++ b/src/domain/session/room/RoomViewModel.js @@ -37,9 +37,9 @@ export class RoomViewModel extends ViewModel { this._sendError = null; this._composerVM = null; if (room.isArchived) { - this._composerVM = new ArchivedViewModel(this.childOptions({archivedRoom: room})); + this._composerVM = this.track(new ArchivedViewModel(this.childOptions({archivedRoom: room}))); } else { - this._composerVM = new ComposerViewModel(this); + this._watchPowerLevelChange(); } this._clearUnreadTimout = null; this._closeUrl = this.urlCreator.urlUntilSegment("session"); @@ -67,6 +67,29 @@ export class RoomViewModel extends ViewModel { this._clearUnreadAfterDelay(); } + async _watchPowerLevelChange() { + const powerLevelObservable = await this._room.observePowerLevels(); + let oldCanSendMessage = powerLevelObservable.get().canSendType("m.room.message"); + const recreateComposer = newCanSendMessage => { + this._composerVM = this.disposeTracked(this._composerVM); + if (newCanSendMessage) { + this._composerVM = this.track(new ComposerViewModel(this)); + } + else { + this._composerVM = this.track(new LowerPowerLevelViewModel()); + } + this.emitChange("powerLevelObservable") + }; + this.track(powerLevelObservable.subscribe(newPowerLevel => { + const newCanSendMessage = newPowerLevel.canSendType("m.room.message"); + if (oldCanSendMessage !== newCanSendMessage) { + recreateComposer(newCanSendMessage); + oldCanSendMessage = newCanSendMessage; + } + })); + recreateComposer(oldCanSendMessage); + } + async _clearUnreadAfterDelay() { if (this._room.isArchived || this._clearUnreadTimout) { return; @@ -365,3 +388,13 @@ class ArchivedViewModel extends ViewModel { return "archived"; } } + +class LowerPowerLevelViewModel extends ViewModel { + get description() { + return this.i18n`You do not have the powerlevel necessary to send messages`; + } + + get kind() { + return "low-powerlevel"; + } +} diff --git a/src/platform/web/ui/css/themes/element/theme.css b/src/platform/web/ui/css/themes/element/theme.css index 113ea254..632d5bc5 100644 --- a/src/platform/web/ui/css/themes/element/theme.css +++ b/src/platform/web/ui/css/themes/element/theme.css @@ -894,12 +894,12 @@ button.link { width: 100%; } -.RoomArchivedView { +.DisabledComposerView { padding: 12px; background-color: var(--background-color-secondary); } -.RoomArchivedView h3 { +.DisabledComposerView h3 { margin: 0; } diff --git a/src/platform/web/ui/session/room/RoomArchivedView.js b/src/platform/web/ui/session/room/DisabledComposerView.js similarity index 82% rename from src/platform/web/ui/session/room/RoomArchivedView.js rename to src/platform/web/ui/session/room/DisabledComposerView.js index 1db1c2d2..caa8eeb9 100644 --- a/src/platform/web/ui/session/room/RoomArchivedView.js +++ b/src/platform/web/ui/session/room/DisabledComposerView.js @@ -16,8 +16,8 @@ limitations under the License. import {TemplateView} from "../../general/TemplateView"; -export class RoomArchivedView extends TemplateView { +export class DisabledComposerView extends TemplateView { render(t) { - return t.div({className: "RoomArchivedView"}, t.h3(vm => vm.description)); + return t.div({className: "DisabledComposerView"}, t.h3(vm => vm.description)); } } diff --git a/src/platform/web/ui/session/room/RoomView.js b/src/platform/web/ui/session/room/RoomView.js index 76e26eab..5923355c 100644 --- a/src/platform/web/ui/session/room/RoomView.js +++ b/src/platform/web/ui/session/room/RoomView.js @@ -21,7 +21,7 @@ import {Menu} from "../../general/Menu.js"; import {TimelineView} from "./TimelineView"; import {TimelineLoadingView} from "./TimelineLoadingView.js"; import {MessageComposer} from "./MessageComposer.js"; -import {RoomArchivedView} from "./RoomArchivedView.js"; +import {DisabledComposerView} from "./DisabledComposerView.js"; import {AvatarView} from "../../AvatarView.js"; export class RoomView extends TemplateView { @@ -32,12 +32,6 @@ export class RoomView extends TemplateView { } render(t, vm) { - let bottomView; - if (vm.composerViewModel.kind === "composer") { - bottomView = new MessageComposer(vm.composerViewModel, this._viewClassForTile); - } else if (vm.composerViewModel.kind === "archived") { - bottomView = new RoomArchivedView(vm.composerViewModel); - } return t.main({className: "RoomView middle"}, [ t.div({className: "RoomHeader middle-header"}, [ t.a({className: "button-utility close-middle", href: vm.closeUrl, title: vm.i18n`Close room`}), @@ -58,7 +52,16 @@ export class RoomView extends TemplateView { new TimelineView(timelineViewModel, this._viewClassForTile) : new TimelineLoadingView(vm); // vm is just needed for i18n }), - t.view(bottomView), + t.mapView(vm => vm.composerViewModel, + composerViewModel => { + switch (composerViewModel?.kind) { + case "composer": + return new MessageComposer(vm.composerViewModel, this._viewClassForTile); + case "archived": + case "low-powerlevel": + return new DisabledComposerView(vm.composerViewModel); + } + }), ]) ]); } From 3941b7e3f09a213ea03970d1512255fbe0ad2801 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Thu, 7 Jul 2022 16:45:18 +0530 Subject: [PATCH 2/4] Rename method --- src/domain/session/room/RoomViewModel.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js index 1cf15969..fac0ed9d 100644 --- a/src/domain/session/room/RoomViewModel.js +++ b/src/domain/session/room/RoomViewModel.js @@ -39,7 +39,7 @@ export class RoomViewModel extends ViewModel { if (room.isArchived) { this._composerVM = this.track(new ArchivedViewModel(this.childOptions({archivedRoom: room}))); } else { - this._watchPowerLevelChange(); + this._recreateComposerOnPowerLevelChange(); } this._clearUnreadTimout = null; this._closeUrl = this.urlCreator.urlUntilSegment("session"); @@ -67,7 +67,7 @@ export class RoomViewModel extends ViewModel { this._clearUnreadAfterDelay(); } - async _watchPowerLevelChange() { + async _recreateComposerOnPowerLevelChange() { const powerLevelObservable = await this._room.observePowerLevels(); let oldCanSendMessage = powerLevelObservable.get().canSendType("m.room.message"); const recreateComposer = newCanSendMessage => { From d292e1f5adc8ebdda19cd9c5db93b5148ff5bf00 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Thu, 7 Jul 2022 17:23:23 +0530 Subject: [PATCH 3/4] Extract into function --- src/domain/session/room/RoomViewModel.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js index fac0ed9d..74dda426 100644 --- a/src/domain/session/room/RoomViewModel.js +++ b/src/domain/session/room/RoomViewModel.js @@ -69,7 +69,8 @@ export class RoomViewModel extends ViewModel { async _recreateComposerOnPowerLevelChange() { const powerLevelObservable = await this._room.observePowerLevels(); - let oldCanSendMessage = powerLevelObservable.get().canSendType("m.room.message"); + const canSendMessage = () => powerLevelObservable.get().canSendType("m.room.message"); + let oldCanSendMessage = canSendMessage(); const recreateComposer = newCanSendMessage => { this._composerVM = this.disposeTracked(this._composerVM); if (newCanSendMessage) { @@ -80,8 +81,8 @@ export class RoomViewModel extends ViewModel { } this.emitChange("powerLevelObservable") }; - this.track(powerLevelObservable.subscribe(newPowerLevel => { - const newCanSendMessage = newPowerLevel.canSendType("m.room.message"); + this.track(powerLevelObservable.subscribe(() => { + const newCanSendMessage = canSendMessage(); if (oldCanSendMessage !== newCanSendMessage) { recreateComposer(newCanSendMessage); oldCanSendMessage = newCanSendMessage; From 0bdbb96036699bbbe1810aa0e010a9fbc16bd4e5 Mon Sep 17 00:00:00 2001 From: RMidhunSuresh Date: Thu, 7 Jul 2022 17:26:43 +0530 Subject: [PATCH 4/4] Use same kind --- src/domain/session/room/RoomViewModel.js | 4 ++-- src/platform/web/ui/session/room/RoomView.js | 3 +-- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js index 74dda426..60a01d16 100644 --- a/src/domain/session/room/RoomViewModel.js +++ b/src/domain/session/room/RoomViewModel.js @@ -386,7 +386,7 @@ class ArchivedViewModel extends ViewModel { } get kind() { - return "archived"; + return "disabled"; } } @@ -396,6 +396,6 @@ class LowerPowerLevelViewModel extends ViewModel { } get kind() { - return "low-powerlevel"; + return "disabled"; } } diff --git a/src/platform/web/ui/session/room/RoomView.js b/src/platform/web/ui/session/room/RoomView.js index 5923355c..d36466dd 100644 --- a/src/platform/web/ui/session/room/RoomView.js +++ b/src/platform/web/ui/session/room/RoomView.js @@ -57,8 +57,7 @@ export class RoomView extends TemplateView { switch (composerViewModel?.kind) { case "composer": return new MessageComposer(vm.composerViewModel, this._viewClassForTile); - case "archived": - case "low-powerlevel": + case "disabled": return new DisabledComposerView(vm.composerViewModel); } }),