From f4eafdfb51d22d7afd68837e94e8ad1d58d51a52 Mon Sep 17 00:00:00 2001
From: ngxson <thichthat@gmail.com>
Date: Thu, 16 Jul 2020 20:18:11 +0200
Subject: [PATCH] fix loading indicator on alias list

---
 src/popup/components/Main.vue | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/popup/components/Main.vue b/src/popup/components/Main.vue
index 214ffcd..f5b103c 100644
--- a/src/popup/components/Main.vue
+++ b/src/popup/components/Main.vue
@@ -223,7 +223,7 @@
         </div>
       </div>
 
-      <div v-if="hasLoadMoreAlias" class="text-secondary mx-auto text-center">
+      <div v-if="isLoadingAlias" class="text-secondary mx-auto text-center">
         <img
           src="/images/loading-three-dots.svg"
           style="width: 80px; margin: 20px;"
@@ -267,7 +267,7 @@ export default {
       isFetchingAlias: true,
       searchString: "",
       aliasArray: [], // array of existing alias
-      hasLoadMoreAlias: true,
+      isLoadingAlias: true,
     };
   },
   async mounted() {
@@ -307,11 +307,14 @@ export default {
 
     async loadAlias() {
       this.aliasArray = [];
-      this.hasLoadMoreAlias = true;
-
       let currentPage = 0;
-      this.aliasArray = await this.fetchAlias(currentPage, this.searchString);
-      this.hasLoadMoreAlias = this.aliasArray.length > 0;
+      
+      this.isLoadingAlias = true;
+      this.aliasArray = await this.fetchAlias(
+        currentPage,
+        this.searchString
+      );
+      this.isLoadingAlias = false;
 
       let allAliasesAreLoaded = false;
 
@@ -326,12 +329,12 @@ export default {
         if (bottomOfWindow) {
           currentPage += 1;
 
-          that.hasLoadMoreAlias = true;
+          that.isLoadingAlias = true;
           let newAliases = await that.fetchAlias(
             currentPage,
             that.searchString
           );
-          that.hasLoadMoreAlias = false;
+          that.isLoadingAlias = false;
 
           allAliasesAreLoaded = newAliases.length === 0;
           that.aliasArray = mergeAliases(that.aliasArray, newAliases);