Fix room avatars

src/components/AuthedImage.vue

@@ -15,14 +15,33 @@ export default {
       },
     },
   },
-  mounted() {
+  destroyed() {
+    this.unloadSrc();
+  },
+  watch: {
+    src: {
+      immediate: true,
+      handler(newValue) {
+        this.unloadSrc();
+        this.loadSrc();
+      }
+    }
+  },
+  data() {
+    return {
+      imageSrc: null
+    }
+  },
+  methods: {
+    loadSrc() {
       if (this.src) {
-      console.error("GOT URL", this.src);
         if (this.$matrix.useAuthedMedia) {
           axios
-        .get(this.src, { responseType: "blob", headers: {
+            .get(this.src, {
+              responseType: "blob", headers: {
                 Authorization: `Bearer ${this.$matrix.matrixClient.getAccessToken()}`,
-        }})
+              }
+            })
             .then((response) => {
               this.imageSrc = URL.createObjectURL(response.data);
             })
@@ -34,19 +53,13 @@ export default {
         }
       }
     },
-  destroyed() {
+    unloadSrc() {
       if (this.imageSrc && this.src != this.imageSrc) {
         const url = this.imageSrc;
         this.imageSrc = null;
         URL.revokeObjectURL(url);
       }
-  },
-  data() {
-    return {
-      imageSrc: null
     }
-  },
-  methods: {
   }
 };
 </script>

src/components/RoomAvatarPicker.vue

@@ -58,10 +58,7 @@ export default {
             self.isRoomAvatarLoaded = true;
           }
         }
-      ).then((url) => {
+      )
-        console.error("UPDATE AVATAR", url);
-        this.room.avatar = url;
-      })
     },
     handleRoomPickedAvatar(event) {
       if (event.target.files && event.target.files[0]) {

src/services/matrix.service.js

@@ -524,9 +524,7 @@ export default {
             return room.selfMembership && (room.selfMembership == "invite" || room.selfMembership == "join") && room.currentState.getStateEvents(STATE_EVENT_ROOM_DELETED).length == 0;
           });
           updatedRooms.forEach((room) => {
-            if (!room.avatar) {
             Vue.set(room, "avatar", room.getAvatarUrl(this.matrixClient.getHomeserverUrl(), 80, 80, "scale", true, this.useAuthedMedia));
-            }
           });
           Vue.set(this, "rooms", updatedRooms);
 
@@ -1236,7 +1234,7 @@ export default {
                 (roomId.startsWith("!") && room.room_id == roomId)
               ) {
                 if (room.avatar_url) {
-                  room.avatar = client.mxcUrlToHttp(room.avatar_url, 80, 80, "scale", true, undefined, useAuthedMedia);
+                  Vue.set(room, "avatar", client.mxcUrlToHttp(room.avatar_url, 80, 80, "scale", false, undefined, useAuthedMedia));
                 }
                 return Promise.resolve(room);
               }