From 6de1e407658ed15ae9751118f661763197d31415 Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Wed, 16 Dec 2020 16:36:23 +0100
Subject: [PATCH] Fix join UI when logged in

---
 src/components/Join.vue | 68 ++++++++++++++++++++++++++++-------------
 1 file changed, 47 insertions(+), 21 deletions(-)

diff --git a/src/components/Join.vue b/src/components/Join.vue
index 14a1f65..c5ed446 100644
--- a/src/components/Join.vue
+++ b/src/components/Join.vue
@@ -1,27 +1,48 @@
 <template>
   <div class="join-root">
     <div v-if="!waiting" class="text-center">
-      <v-btn class="btn-login" text small @click.stop="handleLogin" :loading="loading">Login</v-btn>
+      <v-btn
+        class="btn-login"
+        text
+        small
+        @click.stop="handleLogin"
+        :loading="loading"
+        >Login</v-btn
+      >
 
       <v-avatar class="join-avatar">
         <v-img v-if="roomAvatar" :src="roomAvatar" />
         <span v-else class="white--text headline">{{
           roomName.substring(0, 1).toUpperCase()
-      }}</span>
+        }}</span>
       </v-avatar>
       <div class="join-title">Welcome to {{ roomName }}</div>
-      <div class="join-message">Join the group chat in a web browser or with the Keanu app.</div>
-      <v-btn class="btn-light" large block @click.stop="handleOpenApp" :loading="loading"
+      <div class="join-message">
+        Join the group chat in a web browser or with the Keanu app.
+      </div>
+      <v-btn
+        class="btn-light"
+        large
+        block
+        @click.stop="handleOpenApp"
+        :loading="loading"
         >Open Keanu app</v-btn
       >
-      
+
       <div class="join-or-divider">OR</div>
 
-      <v-btn class="btn-dark" large block @click.stop="handleJoin" :loading="loading"
+      <v-btn
+        class="btn-dark"
+        large
+        block
+        @click.stop="handleJoin"
+        :loading="loading"
         >Join as guest</v-btn
       >
 
-      <div class="join-privacy">Enhance your physical privacy. <a href="#">Learn how</a></div>
+      <div class="join-privacy">
+        Enhance your physical privacy. <a href="#">Learn how</a>
+      </div>
 
       <div v-if="loadingMessage">{{ loadingMessage }}</div>
     </div>
@@ -41,20 +62,24 @@ export default {
       guestUser: new User("https://neo.keanu.im", "", "", true),
       loading: false,
       loadingMessage: null,
-      waiting: true
+      waiting: true,
     };
   },
   mounted() {
     this.roomId = this.$route.hash;
     this.roomName = this.roomId;
     if (this.currentUser) {
-        this.waiting = true;
-        const self = this;
-        this.$matrix.getMatrixClient(this.currentUser)
+      this.waiting = true;
+      const self = this;
+      this.$matrix
+        .getMatrixClient(this.currentUser)
         .then(() => {
           // Already joined?
           const room = self.$matrix.getRoom(self.roomId);
-          if (room && room.hasMembershipState(self.currentUser.user_id, "join")) {
+          if (
+            room &&
+            room.hasMembershipState(self.currentUser.user_id, "join")
+          ) {
             // Yes, go to room
             self.$matrix.setCurrentRoom(room);
             self.$router.replace({ name: "Chat" });
@@ -63,22 +88,23 @@ export default {
 
           this.waiting = false;
         })
-        .catch(ignoredErr => {
+        .catch((ignoredErr) => {
           this.waiting = false;
         });
-    } else {
-      this.$matrix.getPublicRoomInfo(this.roomId)
-      .then(room => {
+    }
+
+    this.$matrix
+      .getPublicRoomInfo(this.roomId)
+      .then((room) => {
         console.log("Found room:", room);
         this.roomName = room.name;
         this.roomAvatar = room.avatar;
-          this.waiting = false;
+        this.waiting = false;
       })
-      .catch(err => {
+      .catch((err) => {
         console.log("Could not find room info", err);
-          this.waiting = false;
-      })
-    }
+        this.waiting = false;
+      });
   },
   computed: {
     currentUser() {