From 00718c582a7c85032cb481fa0bdbe565ded2a134 Mon Sep 17 00:00:00 2001
From: Bruno Windels <brunow@matrix.org>
Date: Thu, 20 Aug 2020 17:32:55 +0200
Subject: [PATCH] render avatar img in room list

---
 src/domain/session/roomlist/RoomTileViewModel.js | 14 +++++++++++++-
 src/matrix/room/Room.js                          |  4 ++++
 src/ui/web/session/RoomTile.js                   |  3 ++-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/domain/session/roomlist/RoomTileViewModel.js b/src/domain/session/roomlist/RoomTileViewModel.js
index 9f527f65..56d0345f 100644
--- a/src/domain/session/roomlist/RoomTileViewModel.js
+++ b/src/domain/session/roomlist/RoomTileViewModel.js
@@ -61,11 +61,23 @@ export class RoomTileViewModel extends ViewModel {
         return this._room.name;
     }
 
-    get avatarInitials() {
+    // Avatar view model contract
+    get avatarLetter() {
         return avatarInitials(this._room.name);
     }
 
     get avatarColorNumber() {
         return getIdentifierColorNumber(this._room.id)
     }
+
+    get avatarUrl() {
+        if (this._room.avatarUrl) {
+            return this._room.mediaRepository.mxcUrlThumbnail(this._room.avatarUrl, 32, 32, "crop");
+        }
+        return null;
+    }
+
+    get avatarTitle() {
+        return this.name;
+    }
 }
diff --git a/src/matrix/room/Room.js b/src/matrix/room/Room.js
index 7bea8362..5ac77009 100644
--- a/src/matrix/room/Room.js
+++ b/src/matrix/room/Room.js
@@ -180,6 +180,10 @@ export class Room extends EventEmitter {
         return this._roomId;
     }
 
+    get avatarUrl() {
+        return this._summary.avatarUrl;
+    }
+
     /** @public */
     async openTimeline() {
         if (this._timeline) {
diff --git a/src/ui/web/session/RoomTile.js b/src/ui/web/session/RoomTile.js
index 9268bfe5..cde53b81 100644
--- a/src/ui/web/session/RoomTile.js
+++ b/src/ui/web/session/RoomTile.js
@@ -15,11 +15,12 @@ limitations under the License.
 */
 
 import {TemplateView} from "../general/TemplateView.js";
+import {renderAvatar} from "../common.js";
 
 export class RoomTile extends TemplateView {
     render(t, vm) {
         return t.li({"className": {"active": vm => vm.isOpen}}, [
-            t.div({className: `avatar medium usercolor${vm.avatarColorNumber}`}, vm => vm.avatarInitials),
+            renderAvatar(t, vm, 32),
             t.div({className: "description"}, t.div({className: "name"}, vm => vm.name))
         ]);
     }