diff --git a/src/domain/session/rightpanel/MemberDetailsViewModel.js b/src/domain/session/rightpanel/MemberDetailsViewModel.js index 0c526130..dad65d64 100644 --- a/src/domain/session/rightpanel/MemberDetailsViewModel.js +++ b/src/domain/session/rightpanel/MemberDetailsViewModel.js @@ -24,6 +24,9 @@ export class MemberDetailsViewModel extends ViewModel { this._mediaRepository = options.mediaRepository; this._member = this._observableMember.get(); this._isEncrypted = options.isEncrypted; + this._powerLevelsObservable = options.powerLevelsObservable; + this._powerLevel = this._powerLevelFromObservable(this._powerLevelsObservable); + this.track(this._powerLevelsObservable.subscribe(() => this._onPowerLevelsChange())); this.track(this._observableMember.subscribe( () => this._onMemberChange())); } @@ -33,7 +36,10 @@ export class MemberDetailsViewModel extends ViewModel { get type() { return "member-details"; } get role() { - return "Admin"; + if (this._powerLevel >= 100) { return "Admin"; } + else if (this._powerLevel >= 50) { return "Moderator"; } + else if (this._powerLevel === 0) { return "Default"; } + else { return `Custom (${this._powerLevel})`; } } _onMemberChange() { @@ -41,6 +47,12 @@ export class MemberDetailsViewModel extends ViewModel { this.emitChange(); } + _onPowerLevelsChange() { + const powerLevels = this._powerLevelsObservable.get(); + this._powerLevel = powerLevels.getUserLevel(this._member.userId); + this.emitChange(); + } + get avatarLetter() { return avatarInitials(this.name); } diff --git a/src/domain/session/rightpanel/RightPanelViewModel.js b/src/domain/session/rightpanel/RightPanelViewModel.js index 1e058674..77291082 100644 --- a/src/domain/session/rightpanel/RightPanelViewModel.js +++ b/src/domain/session/rightpanel/RightPanelViewModel.js @@ -24,7 +24,8 @@ export class RightPanelViewModel extends ViewModel { const userId = segment.value; const observableMember = await this._room.observeMember(userId); const isEncrypted = this._room.isEncrypted; - return {observableMember, isEncrypted, mediaRepository: this._room.mediaRepository}; + const powerLevelsObservable = await this._room.observePowerLevels(); + return {observableMember, isEncrypted, powerLevelsObservable, mediaRepository: this._room.mediaRepository}; } _setupNavigation() { diff --git a/src/platform/web/ui/session/rightpanel/MemberDetailsView.js b/src/platform/web/ui/session/rightpanel/MemberDetailsView.js index bff07ff1..0d9c38f8 100644 --- a/src/platform/web/ui/session/rightpanel/MemberDetailsView.js +++ b/src/platform/web/ui/session/rightpanel/MemberDetailsView.js @@ -25,9 +25,9 @@ export class MemberDetailsView extends TemplateView { }; return t.div({className: "MemberDetailsView"}, [ t.view(new AvatarView(vm, 128)), - t.div({className: "MemberDetailsView_name"}, t.h2(vm.name)), + t.div({className: "MemberDetailsView_name"}, t.h2(vm => vm.name)), t.div({className: "MemberDetailsView_id"}, vm.userId), - this._createSection(t, vm.i18n`ROLE`, vm.role), + this._createSection(t, vm.i18n`ROLE`, vm => vm.role), this._createSection(t, vm.i18n`SECURITY`, encryptionMessages[vm.isEncrypted]), this._createOptions(t, vm) ]);