From 69237fce85282ad44333c00b70b0315279fb4f47 Mon Sep 17 00:00:00 2001
From: RMidhunSuresh <rmidhunsuresh@gmail.com>
Date: Fri, 11 Jun 2021 23:51:55 +0530
Subject: [PATCH] Basic barebones of memberlist view

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>
---
 .../session/rightpanel/MemberListViewModel.js | 24 +++++++++++++++++++
 .../session/rightpanel/MemberTileViewModel.js | 12 ++++++++++
 .../ui/session/rightpanel/MemberListView.js   |  9 +++++++
 .../ui/session/rightpanel/MemberTileView.js   |  7 ++++++
 4 files changed, 52 insertions(+)
 create mode 100644 src/domain/session/rightpanel/MemberListViewModel.js
 create mode 100644 src/domain/session/rightpanel/MemberTileViewModel.js
 create mode 100644 src/platform/web/ui/session/rightpanel/MemberListView.js
 create mode 100644 src/platform/web/ui/session/rightpanel/MemberTileView.js

diff --git a/src/domain/session/rightpanel/MemberListViewModel.js b/src/domain/session/rightpanel/MemberListViewModel.js
new file mode 100644
index 00000000..691efd0d
--- /dev/null
+++ b/src/domain/session/rightpanel/MemberListViewModel.js
@@ -0,0 +1,24 @@
+import {ViewModel} from "../../ViewModel.js";
+import {MemberTileViewModel} from "./MemberTileViewModel.js";
+
+function comparator(member, otherMember) {
+    return member.displayName?.localeCompare(otherMember.displayName);
+}
+
+export class MemberListViewModel extends ViewModel {
+    constructor(options) {
+        super(options);
+        this.memberTileViewModels = this._mapTileViewModels(this._filterJoinedMembers(options.members))
+                                        .sortValues(comparator);
+    }
+
+    _filterJoinedMembers(members) {
+        return members.filterValues(member => member.membership === "join");
+    }
+
+    _mapTileViewModels(members) {
+        return members.mapValues((member, emitChange) => {
+            return new MemberTileViewModel(this.childOptions({member, emitChange}));
+        });
+    }
+}
diff --git a/src/domain/session/rightpanel/MemberTileViewModel.js b/src/domain/session/rightpanel/MemberTileViewModel.js
new file mode 100644
index 00000000..9ce14d78
--- /dev/null
+++ b/src/domain/session/rightpanel/MemberTileViewModel.js
@@ -0,0 +1,12 @@
+import {ViewModel} from "../../ViewModel.js";
+
+export class MemberTileViewModel extends ViewModel {
+    constructor(options) {
+        super(options);
+        this.member = options.member;
+    }
+
+    get displayName() {
+        return this.member.displayName;
+    }
+}
diff --git a/src/platform/web/ui/session/rightpanel/MemberListView.js b/src/platform/web/ui/session/rightpanel/MemberListView.js
new file mode 100644
index 00000000..b441f319
--- /dev/null
+++ b/src/platform/web/ui/session/rightpanel/MemberListView.js
@@ -0,0 +1,9 @@
+import {TemplateView} from "../../general/TemplateView.js";
+import {ListView} from "../../general/ListView.js";
+import {MemberTileView} from "./MemberTileView.js";
+
+export class MemberListView extends TemplateView {
+    render(t, vm) {
+        return t.view(new ListView({list: vm.memberTileViewModels}, tileViewModel => new MemberTileView(tileViewModel)));
+    }
+}
diff --git a/src/platform/web/ui/session/rightpanel/MemberTileView.js b/src/platform/web/ui/session/rightpanel/MemberTileView.js
new file mode 100644
index 00000000..e4b010a4
--- /dev/null
+++ b/src/platform/web/ui/session/rightpanel/MemberTileView.js
@@ -0,0 +1,7 @@
+import {TemplateView} from "../../general/TemplateView.js";
+
+export class MemberTileView extends TemplateView {
+    render(t, vm) {
+        return t.div(vm.displayName);
+    }
+}