From bcfd1bd1352e7789b9049eb328d350a4a9215362 Mon Sep 17 00:00:00 2001
From: RMidhunSuresh <rmidhunsuresh@gmail.com>
Date: Sun, 27 Jun 2021 15:05:35 +0530
Subject: [PATCH] Support loading view for all panels

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
---
 src/domain/session/rightpanel/MemberListViewModel.js |  2 ++
 src/domain/session/rightpanel/RightPanelViewModel.js |  1 +
 .../session/rightpanel/RoomDetailsViewModel.js       |  4 ++++
 .../web/ui/session/rightpanel/MemberListView.js      |  7 -------
 .../web/ui/session/rightpanel/RightPanelView.js      | 12 ++++++++----
 5 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/domain/session/rightpanel/MemberListViewModel.js b/src/domain/session/rightpanel/MemberListViewModel.js
index 114c61b7..0a6c4add 100644
--- a/src/domain/session/rightpanel/MemberListViewModel.js
+++ b/src/domain/session/rightpanel/MemberListViewModel.js
@@ -12,6 +12,8 @@ export class MemberListViewModel extends ViewModel {
         this.mediaRepository = options.mediaRepository;
     }
 
+    get type() { return "member-list"; }
+
     _filterJoinedMembers(members) {
         return members.filterValues(member => member.membership === "join");
     }
diff --git a/src/domain/session/rightpanel/RightPanelViewModel.js b/src/domain/session/rightpanel/RightPanelViewModel.js
index f01f9491..0a04f8a1 100644
--- a/src/domain/session/rightpanel/RightPanelViewModel.js
+++ b/src/domain/session/rightpanel/RightPanelViewModel.js
@@ -11,6 +11,7 @@ export class RightPanelViewModel extends ViewModel {
 
     get roomDetailsViewModel() { return this._roomDetailsViewModel; }
     get memberListViewModel() { return this._memberListViewModel; }
+    get activeViewModel() { return this._roomDetailsViewModel ?? this._memberListViewModel; }
 
     _setupNavigation() {
         const details = this.navigation.observe("details");
diff --git a/src/domain/session/rightpanel/RoomDetailsViewModel.js b/src/domain/session/rightpanel/RoomDetailsViewModel.js
index b9f05835..896fab54 100644
--- a/src/domain/session/rightpanel/RoomDetailsViewModel.js
+++ b/src/domain/session/rightpanel/RoomDetailsViewModel.js
@@ -9,6 +9,10 @@ export class RoomDetailsViewModel extends ViewModel {
         this._room.on("change", this._onRoomChange);
     }
 
+    get type() {
+        return "room-details";
+    }
+
     get roomId() {
         return this._room.id;
     }
diff --git a/src/platform/web/ui/session/rightpanel/MemberListView.js b/src/platform/web/ui/session/rightpanel/MemberListView.js
index 9c4a847a..5b941a23 100644
--- a/src/platform/web/ui/session/rightpanel/MemberListView.js
+++ b/src/platform/web/ui/session/rightpanel/MemberListView.js
@@ -1,16 +1,9 @@
 import {TemplateView} from "../../general/TemplateView.js";
 import {ListView} from "../../general/ListView.js";
 import {MemberTileView} from "./MemberTileView.js";
-import {spinner} from "../../common.js";
 
 export class MemberListView extends TemplateView {
     render(t, vm) {
         return t.view(new ListView({list: vm.memberTileViewModels, className:"MemberListView"}, tileViewModel => new MemberTileView(tileViewModel)));
     }
 }
-
-export class MemberListLoadingView extends TemplateView {
-    render(t) {
-        return t.div(["Loading ", spinner(t)]);
-    }
-}
diff --git a/src/platform/web/ui/session/rightpanel/RightPanelView.js b/src/platform/web/ui/session/rightpanel/RightPanelView.js
index aac92458..8f932004 100644
--- a/src/platform/web/ui/session/rightpanel/RightPanelView.js
+++ b/src/platform/web/ui/session/rightpanel/RightPanelView.js
@@ -1,13 +1,17 @@
 import {TemplateView} from "../../general/TemplateView.js";
 import {RoomDetailsView} from "./RoomDetailsView.js";
-import {MemberListLoadingView, MemberListView} from "./MemberListView.js";
+import {MemberListView} from "./MemberListView.js";
+import {LoadingView} from "./LoadingView.js";
 
 export class RightPanelView extends TemplateView {
     render(t) {
-        return t.div({className: "RightPanelView"}, 
+        const viewFromType = {
+            "room-details": RoomDetailsView,
+            "member-list": MemberListView
+        };
+        return t.div({ className: "RightPanelView" },
             [
-                t.mapView(vm => vm.roomDetailsViewModel, roomDetailsViewModel => roomDetailsViewModel ? new RoomDetailsView(roomDetailsViewModel) : null),
-                t.mapView(vm => vm.memberListViewModel, memberListViewModel => memberListViewModel ? new MemberListView(memberListViewModel) : new MemberListLoadingView())
+                t.mapView(vm => vm.activeViewModel, vm => vm ? new viewFromType[vm.type](vm) : new LoadingView())
             ]
         );
     }