From 97854423c4efd74a296208b4a653ecc1c0fa424b Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Mon, 28 Jun 2021 11:44:27 -0700
Subject: [PATCH 1/7] Ensure DM rooms have the same color in timeline and left
 panel.

---
 src/domain/session/rightpanel/RoomDetailsViewModel.js | 2 +-
 src/domain/session/room/RoomViewModel.js              | 2 +-
 src/matrix/room/Room.js                               | 4 ++++
 src/matrix/room/members/Heroes.js                     | 9 +++++++++
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/domain/session/rightpanel/RoomDetailsViewModel.js b/src/domain/session/rightpanel/RoomDetailsViewModel.js
index 911e5945..b9f05835 100644
--- a/src/domain/session/rightpanel/RoomDetailsViewModel.js
+++ b/src/domain/session/rightpanel/RoomDetailsViewModel.js
@@ -34,7 +34,7 @@ export class RoomDetailsViewModel extends ViewModel {
     }
 
     get avatarColorNumber() {
-        return getIdentifierColorNumber(this.roomId)
+        return getIdentifierColorNumber(this._room.avatarColorId)
     }
 
     avatarUrl(size) {
diff --git a/src/domain/session/room/RoomViewModel.js b/src/domain/session/room/RoomViewModel.js
index 4d53ec6c..38835db3 100644
--- a/src/domain/session/room/RoomViewModel.js
+++ b/src/domain/session/room/RoomViewModel.js
@@ -119,7 +119,7 @@ export class RoomViewModel extends ViewModel {
     }
 
     get avatarColorNumber() {
-        return getIdentifierColorNumber(this._room.id)
+        return getIdentifierColorNumber(this._room.avatarColorId)
     }
 
     avatarUrl(size) {
diff --git a/src/matrix/room/Room.js b/src/matrix/room/Room.js
index 482d167f..5e002411 100644
--- a/src/matrix/room/Room.js
+++ b/src/matrix/room/Room.js
@@ -328,6 +328,10 @@ export class Room extends BaseRoom {
         });
     }
 
+    get avatarColorId() {
+        return this._heroes?.roomAvatarColorId || this._roomId
+    }
+
     get isUnread() {
         return this._summary.data.isUnread;
     }
diff --git a/src/matrix/room/members/Heroes.js b/src/matrix/room/members/Heroes.js
index f6ad3085..6336cda2 100644
--- a/src/matrix/room/members/Heroes.js
+++ b/src/matrix/room/members/Heroes.js
@@ -97,4 +97,13 @@ export class Heroes {
         }
         return null;
     }
+
+    get roomAvatarColorId() {
+        if (this._members.size === 1) {
+            for (const member of this._members.values()) {
+                return member.userId;
+            }
+        }
+        return null;
+    }
 }

From 6527a0c677920acb17c827dd5ea7a6264602b7f1 Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Mon, 28 Jun 2021 11:54:49 -0700
Subject: [PATCH 2/7] Make the room color match up on the left panel, too.

---
 src/domain/session/leftpanel/RoomTileViewModel.js | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/domain/session/leftpanel/RoomTileViewModel.js b/src/domain/session/leftpanel/RoomTileViewModel.js
index eebea618..e901e17d 100644
--- a/src/domain/session/leftpanel/RoomTileViewModel.js
+++ b/src/domain/session/leftpanel/RoomTileViewModel.js
@@ -15,6 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+import {getIdentifierColorNumber} from "../../avatar.js";
 import {BaseTileViewModel} from "./BaseTileViewModel.js";
 
 export class RoomTileViewModel extends BaseTileViewModel {
@@ -75,6 +76,10 @@ export class RoomTileViewModel extends BaseTileViewModel {
         return timeDiff;
     }
 
+    get avatarColorNumber() {
+        return getIdentifierColorNumber(this._room.avatarColorId);
+    }
+
     get isUnread() {
         return this._room.isUnread;
     }

From dec06831452dbd2ee169c3a0774fe04a8c1828ca Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Tue, 29 Jun 2021 16:50:42 -0700
Subject: [PATCH 3/7] Correctly color archived and invited rooms

---
 src/domain/session/room/InviteViewModel.js | 2 +-
 src/matrix/room/ArchivedRoom.js            | 4 ++++
 src/matrix/room/BaseRoom.js                | 4 ++++
 src/matrix/room/Invite.js                  | 6 ++++++
 src/matrix/room/Room.js                    | 4 ----
 src/matrix/room/RoomSummary.js             | 9 +++++++++
 6 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/domain/session/room/InviteViewModel.js b/src/domain/session/room/InviteViewModel.js
index a9cc917f..81a08e44 100644
--- a/src/domain/session/room/InviteViewModel.js
+++ b/src/domain/session/room/InviteViewModel.js
@@ -56,7 +56,7 @@ export class InviteViewModel extends ViewModel {
     }
 
     get avatarColorNumber() {
-        return getIdentifierColorNumber(this._invite.id)
+        return getIdentifierColorNumber(this._invite.avatarColorId)
     }
 
     avatarUrl(size) {
diff --git a/src/matrix/room/ArchivedRoom.js b/src/matrix/room/ArchivedRoom.js
index f975191e..97a92450 100644
--- a/src/matrix/room/ArchivedRoom.js
+++ b/src/matrix/room/ArchivedRoom.js
@@ -107,6 +107,10 @@ export class ArchivedRoom extends BaseRoom {
         this._emitUpdate();
     }
 
+    get avatarColorId() {
+        return this._summary.data.avatarColorId;
+    }
+
     get isKicked() {
         return this._kickDetails?.membership === "leave";
     }
diff --git a/src/matrix/room/BaseRoom.js b/src/matrix/room/BaseRoom.js
index cef443c1..7d8bf040 100644
--- a/src/matrix/room/BaseRoom.js
+++ b/src/matrix/room/BaseRoom.js
@@ -341,6 +341,10 @@ export class BaseRoom extends EventEmitter {
         return null;
     }
 
+    get avatarColorId() {
+        return this._heroes?.roomAvatarColorId || this._roomId
+    }
+
     get lastMessageTimestamp() {
         return this._summary.data.lastMessageTimestamp;
     }
diff --git a/src/matrix/room/Invite.js b/src/matrix/room/Invite.js
index aa25b0c6..a0391a12 100644
--- a/src/matrix/room/Invite.js
+++ b/src/matrix/room/Invite.js
@@ -56,6 +56,10 @@ export class Invite extends EventEmitter {
         return this._inviteData.avatarUrl;
     }
 
+    get avatarColorId() {
+        return this._inviteData.avatarColorId;
+    }
+
     get timestamp() {
         return this._inviteData.timestamp;
     }
@@ -175,6 +179,7 @@ export class Invite extends EventEmitter {
     _createData(inviteState, myInvite, inviter, summaryData, heroes) {
         const name = heroes ? heroes.roomName : summaryData.name;
         const avatarUrl = heroes ? heroes.roomAvatarUrl : summaryData.avatarUrl;
+        const avatarColorId = heroes ? heroes.roomAvatarColorId : summaryData.avatarColorId;
         return {
             roomId: this.id,
             isEncrypted: !!summaryData.encryption,
@@ -182,6 +187,7 @@ export class Invite extends EventEmitter {
 //            type: 
             name,
             avatarUrl,
+            avatarColorId,
             canonicalAlias: summaryData.canonicalAlias,
             timestamp: this._platform.clock.now(),
             joinRule: this._getJoinRule(inviteState),
diff --git a/src/matrix/room/Room.js b/src/matrix/room/Room.js
index 5e002411..482d167f 100644
--- a/src/matrix/room/Room.js
+++ b/src/matrix/room/Room.js
@@ -328,10 +328,6 @@ export class Room extends BaseRoom {
         });
     }
 
-    get avatarColorId() {
-        return this._heroes?.roomAvatarColorId || this._roomId
-    }
-
     get isUnread() {
         return this._summary.data.isUnread;
     }
diff --git a/src/matrix/room/RoomSummary.js b/src/matrix/room/RoomSummary.js
index d0c78659..a99869ac 100644
--- a/src/matrix/room/RoomSummary.js
+++ b/src/matrix/room/RoomSummary.js
@@ -239,6 +239,15 @@ export class SummaryData {
         return !this.name && !this.canonicalAlias && this.heroes && this.heroes.length > 0;
     }
 
+    get avatarColorId() {
+        if (this.heroes && this.heroes.length === 1) {
+            for (const hero of this.heroes) {
+                return hero;
+            }
+        }
+        return this.roomId;
+    }
+
     isNewJoin(oldData) {
         return this.membership === "join" && oldData.membership !== "join";
     }

From d0f70cbdf9f3d9f1e29a3048106602cbabd9475c Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Tue, 29 Jun 2021 18:01:08 -0700
Subject: [PATCH 4/7] Move avatar color ID computation into SummaryData

---
 src/matrix/room/ArchivedRoom.js   | 4 ----
 src/matrix/room/BaseRoom.js       | 2 +-
 src/matrix/room/Invite.js         | 3 +--
 src/matrix/room/members/Heroes.js | 9 ---------
 4 files changed, 2 insertions(+), 16 deletions(-)

diff --git a/src/matrix/room/ArchivedRoom.js b/src/matrix/room/ArchivedRoom.js
index 97a92450..f975191e 100644
--- a/src/matrix/room/ArchivedRoom.js
+++ b/src/matrix/room/ArchivedRoom.js
@@ -107,10 +107,6 @@ export class ArchivedRoom extends BaseRoom {
         this._emitUpdate();
     }
 
-    get avatarColorId() {
-        return this._summary.data.avatarColorId;
-    }
-
     get isKicked() {
         return this._kickDetails?.membership === "leave";
     }
diff --git a/src/matrix/room/BaseRoom.js b/src/matrix/room/BaseRoom.js
index 7d8bf040..70fe5663 100644
--- a/src/matrix/room/BaseRoom.js
+++ b/src/matrix/room/BaseRoom.js
@@ -342,7 +342,7 @@ export class BaseRoom extends EventEmitter {
     }
 
     get avatarColorId() {
-        return this._heroes?.roomAvatarColorId || this._roomId
+        return this._summary.data.avatarColorId;
     }
 
     get lastMessageTimestamp() {
diff --git a/src/matrix/room/Invite.js b/src/matrix/room/Invite.js
index a0391a12..7346298b 100644
--- a/src/matrix/room/Invite.js
+++ b/src/matrix/room/Invite.js
@@ -179,7 +179,6 @@ export class Invite extends EventEmitter {
     _createData(inviteState, myInvite, inviter, summaryData, heroes) {
         const name = heroes ? heroes.roomName : summaryData.name;
         const avatarUrl = heroes ? heroes.roomAvatarUrl : summaryData.avatarUrl;
-        const avatarColorId = heroes ? heroes.roomAvatarColorId : summaryData.avatarColorId;
         return {
             roomId: this.id,
             isEncrypted: !!summaryData.encryption,
@@ -187,7 +186,7 @@ export class Invite extends EventEmitter {
 //            type: 
             name,
             avatarUrl,
-            avatarColorId,
+            avatarColorId: summaryData.avatarColorId,
             canonicalAlias: summaryData.canonicalAlias,
             timestamp: this._platform.clock.now(),
             joinRule: this._getJoinRule(inviteState),
diff --git a/src/matrix/room/members/Heroes.js b/src/matrix/room/members/Heroes.js
index 6336cda2..f6ad3085 100644
--- a/src/matrix/room/members/Heroes.js
+++ b/src/matrix/room/members/Heroes.js
@@ -97,13 +97,4 @@ export class Heroes {
         }
         return null;
     }
-
-    get roomAvatarColorId() {
-        if (this._members.size === 1) {
-            for (const member of this._members.values()) {
-                return member.userId;
-            }
-        }
-        return null;
-    }
 }

From ee1f1500e9617a0aebc15662a1b5225461eee1c7 Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Wed, 30 Jun 2021 15:07:27 -0700
Subject: [PATCH 5/7] Roll back to using heroes for computing DM color

---
 src/domain/session/leftpanel/BaseTileViewModel.js | 2 +-
 src/domain/session/leftpanel/RoomTileViewModel.js | 5 -----
 src/matrix/room/BaseRoom.js                       | 8 +++++++-
 src/matrix/room/Invite.js                         | 3 ++-
 src/matrix/room/Room.js                           | 4 ++++
 src/matrix/room/RoomSummary.js                    | 9 ---------
 src/matrix/room/members/Heroes.js                 | 9 +++++++++
 7 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/src/domain/session/leftpanel/BaseTileViewModel.js b/src/domain/session/leftpanel/BaseTileViewModel.js
index 62ea6380..95e91458 100644
--- a/src/domain/session/leftpanel/BaseTileViewModel.js
+++ b/src/domain/session/leftpanel/BaseTileViewModel.js
@@ -69,7 +69,7 @@ export class BaseTileViewModel extends ViewModel {
     }
 
     get avatarColorNumber() {
-        return getIdentifierColorNumber(this._avatarSource.id);
+        return getIdentifierColorNumber(this._avatarSource.avatarColorId);
     }
 
     avatarUrl(size) {
diff --git a/src/domain/session/leftpanel/RoomTileViewModel.js b/src/domain/session/leftpanel/RoomTileViewModel.js
index e901e17d..eebea618 100644
--- a/src/domain/session/leftpanel/RoomTileViewModel.js
+++ b/src/domain/session/leftpanel/RoomTileViewModel.js
@@ -15,7 +15,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import {getIdentifierColorNumber} from "../../avatar.js";
 import {BaseTileViewModel} from "./BaseTileViewModel.js";
 
 export class RoomTileViewModel extends BaseTileViewModel {
@@ -76,10 +75,6 @@ export class RoomTileViewModel extends BaseTileViewModel {
         return timeDiff;
     }
 
-    get avatarColorNumber() {
-        return getIdentifierColorNumber(this._room.avatarColorId);
-    }
-
     get isUnread() {
         return this._room.isUnread;
     }
diff --git a/src/matrix/room/BaseRoom.js b/src/matrix/room/BaseRoom.js
index 70fe5663..9d33c5c5 100644
--- a/src/matrix/room/BaseRoom.js
+++ b/src/matrix/room/BaseRoom.js
@@ -341,8 +341,14 @@ export class BaseRoom extends EventEmitter {
         return null;
     }
 
+    /**
+     * Retrieve the identifier that should be used to color
+     * this room's avatar. By default this is the room's
+     * ID, but DM rooms should be the same color as their
+     * user's avatar.
+     */
     get avatarColorId() {
-        return this._summary.data.avatarColorId;
+        return this._roomId;
     }
 
     get lastMessageTimestamp() {
diff --git a/src/matrix/room/Invite.js b/src/matrix/room/Invite.js
index 7346298b..3e6a417c 100644
--- a/src/matrix/room/Invite.js
+++ b/src/matrix/room/Invite.js
@@ -179,6 +179,7 @@ export class Invite extends EventEmitter {
     _createData(inviteState, myInvite, inviter, summaryData, heroes) {
         const name = heroes ? heroes.roomName : summaryData.name;
         const avatarUrl = heroes ? heroes.roomAvatarUrl : summaryData.avatarUrl;
+        const avatarColorId = heroes ? heroes.roomAvatarColorId : this.id;
         return {
             roomId: this.id,
             isEncrypted: !!summaryData.encryption,
@@ -186,7 +187,7 @@ export class Invite extends EventEmitter {
 //            type: 
             name,
             avatarUrl,
-            avatarColorId: summaryData.avatarColorId,
+            avatarColorId,
             canonicalAlias: summaryData.canonicalAlias,
             timestamp: this._platform.clock.now(),
             joinRule: this._getJoinRule(inviteState),
diff --git a/src/matrix/room/Room.js b/src/matrix/room/Room.js
index 482d167f..a8e94326 100644
--- a/src/matrix/room/Room.js
+++ b/src/matrix/room/Room.js
@@ -328,6 +328,10 @@ export class Room extends BaseRoom {
         });
     }
 
+    get avatarColorId() {
+        return this._heroes?.roomAvatarColorId || this._roomId;
+    }
+
     get isUnread() {
         return this._summary.data.isUnread;
     }
diff --git a/src/matrix/room/RoomSummary.js b/src/matrix/room/RoomSummary.js
index a99869ac..d0c78659 100644
--- a/src/matrix/room/RoomSummary.js
+++ b/src/matrix/room/RoomSummary.js
@@ -239,15 +239,6 @@ export class SummaryData {
         return !this.name && !this.canonicalAlias && this.heroes && this.heroes.length > 0;
     }
 
-    get avatarColorId() {
-        if (this.heroes && this.heroes.length === 1) {
-            for (const hero of this.heroes) {
-                return hero;
-            }
-        }
-        return this.roomId;
-    }
-
     isNewJoin(oldData) {
         return this.membership === "join" && oldData.membership !== "join";
     }
diff --git a/src/matrix/room/members/Heroes.js b/src/matrix/room/members/Heroes.js
index f6ad3085..921eed47 100644
--- a/src/matrix/room/members/Heroes.js
+++ b/src/matrix/room/members/Heroes.js
@@ -97,4 +97,13 @@ export class Heroes {
         }
         return null;
     }
+
+    get roomAvatarColorId() {
+        if (this._members.size === 1) {
+            for (const member of this._members.keys()) {
+                return member
+            }
+        }
+        return null;
+    }
 }

From b40f946b85604b3ea57660ee125fc385f5cc421a Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Wed, 30 Jun 2021 15:15:08 -0700
Subject: [PATCH 6/7] Add JSDoc to new Hero method

---
 src/matrix/room/members/Heroes.js | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/matrix/room/members/Heroes.js b/src/matrix/room/members/Heroes.js
index 921eed47..29732def 100644
--- a/src/matrix/room/members/Heroes.js
+++ b/src/matrix/room/members/Heroes.js
@@ -98,6 +98,14 @@ export class Heroes {
         return null;
     }
 
+    /**
+     * In DM rooms, we want the room's color to be
+     * the same as the other user's color. Thus, if the room
+     * only has one hero, we use their ID, instead
+     * of the room's, to get the avatar color.
+     *
+     * @returns {?string} the ID of the single hero.
+     */
     get roomAvatarColorId() {
         if (this._members.size === 1) {
             for (const member of this._members.keys()) {

From f7d6569154899bc86961e3344e38fa994f26dd6e Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Wed, 30 Jun 2021 15:21:11 -0700
Subject: [PATCH 7/7] Add a small comment to Invite.avatarColorId, too.

---
 src/matrix/room/Invite.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/matrix/room/Invite.js b/src/matrix/room/Invite.js
index 3e6a417c..ce400f01 100644
--- a/src/matrix/room/Invite.js
+++ b/src/matrix/room/Invite.js
@@ -56,6 +56,7 @@ export class Invite extends EventEmitter {
         return this._inviteData.avatarUrl;
     }
 
+    /** @see BaseRoom.avatarColorId */
     get avatarColorId() {
         return this._inviteData.avatarColorId;
     }