Views: Updated for (async) computed properties

frontend/src/views/Home.vue

@@ -24,18 +24,22 @@ export default {
     RegisterForm
   },
 
+  computed: {
+    session: () => Cookies.get('session')
+  },
+
   mounted() {
-    if (Cookies.get('session')) {
+    this.$nextTick(() => {
       axios
         .post('/user/login', {
-          session: Cookies.get('session')
+          session: this.session
         })
         .then(response => {
           if (response.data.success) {
             this.$router.push({ name: 'usercp' })
           }
         })
-    }
+    })
   }
 }
 </script>

frontend/src/views/UserCP.vue

@@ -2,8 +2,10 @@
   <v-container>
     <Header />
 
+    <template v-if="user">
       <p>user logged in: {{ user.login }}</p>
 
+      <template v-if="decks">
         <v-expansion-panel>
           <v-expansion-panel-content v-for="deck in decks" :key="deck.id">
             <template v-slot:header>
@@ -21,8 +23,10 @@
             </v-card>
           </v-expansion-panel-content>
         </v-expansion-panel>
+      </template>
 
       <v-btn @click.native="logout">Logout</v-btn>
+    </template>
   </v-container>
 </template>
 
@@ -40,11 +44,6 @@ export default {
     Header
   },
 
-  data: () => ({
-    user: '',
-    decks: ''
-  }),
-
   methods: {
     goHome() {
       Cookies.remove('session')
@@ -61,9 +60,44 @@ export default {
             this.goHome()
           }
         })
+    }
   },
 
-    parseDecklist() {
+  computed: {
+    session: () => Cookies.get('session'),
+    cardsdb: () => CardsDB
+  },
+
+  asyncComputed: {
+    user() {
+      return axios
+        .post('/user/info', {
+          session: this.session
+        })
+        .then(response => {
+          if (response.data.success) {
+            return response.data.user
+          } else {
+            this.goHome()
+            return null
+          }
+        })
+    },
+
+    decks() {
+      return axios
+        .post('/decks/list', {
+          session: this.session
+        })
+        .then(response => {
+          if (response.data.success) {
+            return response.data.decks
+          }
+        })
+    }
+  },
+
+  mounted() {
     let fileContent = `--Generated By FF Decks (www.ffdecks.com)--
 Deck Name: Ashe turbo
 Created by: hawks1997
@@ -153,35 +187,5 @@ Monster(0):`
 
     console.log(deckData)
   }
-  },
-
-  computed: {
-    cardsdb: () => CardsDB
-  },
-
-  mounted() {
-    this.parseDecklist()
-
-    axios
-      .post('/user/info', {
-        session: Cookies.get('session')
-      })
-      .then(response => {
-        if (response.data.success) {
-          this.user = response.data.user
-        } else {
-          this.goHome()
-        }
-      })
-    axios
-      .post('/decks/list', {
-        session: Cookies.get('session')
-      })
-      .then(response => {
-        if (response.data.success) {
-          this.decks = response.data.decks
-        }
-      })
-  }
 }
 </script>