Add returned properties to the CreateRoom mutation, add emit to change the roomID.

webapp/components/Chat/Chat.vue

@@ -417,6 +417,8 @@ export default {
         })
         .then(({ data: { CreateRoom } }) => {
           this.fetchRooms({ room: CreateRoom, options: { refetch: true } })
+          this.roomId = CreateRoom.id
+          this.$emit('show-chat', CreateRoom.id)
         })
         .catch((error) => {
           this.$toast.error(error.message)

webapp/graphql/Rooms.js

@@ -5,6 +5,18 @@ export const createRoom = () => gql`
     CreateRoom(userId: $userId) {
       id
       roomId
+      roomName
+      lastMessageAt
+      unreadCount
+      #avatar
+      users {
+        _id
+        id
+        name
+        avatar {
+          url
+        }
+      }
     }
   }
 `

webapp/pages/chat.vue

@@ -12,6 +12,7 @@
       :roomId="getShowChat.showChat ? getShowChat.roomID : null"
       ref="chat"
       @toggle-user-search="showUserSearch = !showUserSearch"
+      :show-room="showRoom"
     />
   </div>
 </template>
@@ -47,6 +48,9 @@ export default {
     addChatRoom(userID) {
       this.$refs.chat.newRoom(userID)
     },
+    showRoom(roomId) {
+      this.showChat({ showChat: true, roomID: roomId })
+    }
   },
 }
 </script>