Room avatar picker added to room details page

src/components/RoomInfo.vue

@@ -24,12 +24,7 @@
     </div>
 
     <div class="members ma-3 pa-3 mt-0 pt-0 text-center">
-      <v-avatar class="room-avatar">
-        <v-img v-if="roomAvatar" :src="roomAvatar" />
-        <span v-else class="white--text headline">{{
-          roomName.substring(0, 1).toUpperCase()
-        }}</span>
-      </v-avatar>
+      <room-avatar-picker />
       <div class="name">{{ roomName }}</div>
       <div class="topic">{{ roomTopic }}</div>
       <div class="created-by">
@@ -190,7 +185,7 @@
         >{{ $t("room_info.purge") }}</v-btn
       >
     </div>
-    
+
     <div class="build-version">
       {{ $t("room_info.version_info", { version: buildVersion }) }}
     </div>
@@ -218,6 +213,7 @@ import LeaveRoomDialog from "../components/LeaveRoomDialog";
 import PurgeRoomDialog from "../components/PurgeRoomDialog";
 import DeviceList from "../components/DeviceList";
 import RoomExport from "../components/RoomExport";
+import RoomAvatarPicker from "../components/RoomAvatarPicker";
 import QRCode from "qrcode";
 import roomInfoMixin from "./roomInfoMixin";
 import QRCodePopup from './QRCodePopup.vue';
@@ -232,6 +228,7 @@ export default {
     DeviceList,
     RoomExport,
     QRCodePopup,
+    RoomAvatarPicker
   },
   data() {
     return {