From f2f630083a936f9433a6e7774cd8c154744cfeda Mon Sep 17 00:00:00 2001
From: N-Pex <npexdev@gmail.com>
Date: Sun, 18 Jul 2021 11:48:40 +0200
Subject: [PATCH] Add top level loading page

Issue #152.
---
 src/App.vue                     | 35 +++++++++++++++++++++++++++++++++
 src/assets/translations/en.json |  3 ++-
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index d57b87c..6fe1f74 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -2,6 +2,28 @@
   <v-app>
     <v-main>
       <router-view />
+
+      <!-- Loading indicator -->
+      <v-container
+        fluid
+        fill-height
+        style="
+          position: absolute;
+          z-index: 20;
+          background-color: rgba(255, 255, 255, 1);
+        "
+        v-if="loading"
+      >
+        <v-row align="center" justify="center">
+          <v-col class="text-center">
+            <v-progress-circular
+              indeterminate
+              color="primary"
+            ></v-progress-circular>
+            <div>{{$t('menu.loading', {appName: appName})}}</div>
+          </v-col>
+        </v-row>
+      </v-container>
     </v-main>
   </v-app>
 </template>
@@ -11,6 +33,11 @@ import config from "./assets/config";
 
 export default {
   name: "App",
+  data() {
+    return {
+      loading: true,
+    };
+  },
   beforeMount() {
     // Set language
     this.$i18n.locale = this.$store.state.language || "en";
@@ -32,13 +59,21 @@ export default {
         })
         .catch((error) => {
           console.log("Error creating client", error);
+        })
+        .finally(() => {
+          this.loading = false;
         });
+    } else {
+      this.loading = false;
     }
   },
   computed: {
     currentUser() {
       return this.$store.state.auth.user;
     },
+    appName() {
+      return config.appName;
+    },
     title() {
       var title = this.$t(config.appName);
       if (this.$matrix.notificationCount > 0) {
diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json
index d708d96..93512d8 100644
--- a/src/assets/translations/en.json
+++ b/src/assets/translations/en.json
@@ -14,7 +14,8 @@
     "login": "Login",
     "logout": "Logout",
     "new_room": "New Room",
-    "undo": "Undo"
+    "undo": "Undo",
+    "loading": "Loading {appName}"
   },
   "message": {
     "you": "You",