From 2c96acbac357b7d6daa75ce3838bc48bdd00e8c7 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Tue, 27 Oct 2020 15:18:03 +0200
Subject: [PATCH] fix races, hide empty text and add busy spinner

---
 .../LibraryFolder/LibraryFolder.vue           | 21 ++++++++++++++-----
 .../LibraryFolder/TopToolbar/FolderTopBar.vue | 11 +++++-----
 2 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolder.vue b/client/src/components/LibraryFolder/LibraryFolder.vue
index cabfa38c001..f1ae1335077 100644
--- a/client/src/components/LibraryFolder/LibraryFolder.vue
+++ b/client/src/components/LibraryFolder/LibraryFolder.vue
@@ -41,6 +41,12 @@
                         </a>
                     </div>
                 </template>
+                <template #table-busy>
+                    <div class="text-center my-2">
+                        <b-spinner class="align-middle"></b-spinner>
+                        <strong>Loading...</strong>
+                    </div>
+                </template>
                 <template v-slot:head(selected)="">
                     <font-awesome-icon
                         v-if="isAllSelectedMode && !isAllSelectedOnPage()"
@@ -297,7 +303,7 @@ export default {
         return {
             error: null,
             isBusy: false,
-            folder_metadata: null,
+            folder_metadata: {},
             currentPage: 1,
             fields: fields,
             selectMode: "multi",
@@ -312,16 +318,21 @@ export default {
             filterOn: [],
             search_text: "",
             isAllSelectedMode: false,
+            total_rows: 0,
             deselectedDatasets: [],
         };
     },
     computed: {
         parentFolder() {
-            const path = this.folder_metadata.full_path;
-            if (path.length === 1) {
-                return `${this.root}library/list/`;
+            if (this.folder_metadata && this.folder_metadata.full_path) {
+                const path = this.folder_metadata.full_path;
+                if (path.length === 1) {
+                    return `${this.root}library/list/`;
+                } else {
+                    return `${this.root}library/folders/${path[path.length - 2][0]}`;
+                }
             } else {
-                return `${this.root}library/folders/${path[path.length - 2][0]}`;
+                return false
             }
         },
     },
diff --git a/client/src/components/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/LibraryFolder/TopToolbar/FolderTopBar.vue
index 92a1e561077..26ad7479785 100644
--- a/client/src/components/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -229,11 +229,12 @@ export default {
         this.fetchExtAndGenomes();
     },
     mounted() {
-        new mod_path_bar.PathBar({
-            full_path: this.metadata.full_path,
-            id: this.folder_id,
-            parent_library_id: this.metadata.parent_library_id,
-        });
+        if (this.metadata.full_path)
+            new mod_path_bar.PathBar({
+                full_path: this.metadata.full_path,
+                id: this.folder_id,
+                parent_library_id: this.metadata.parent_library_id,
+            });
     },
     computed: {
         contains_file_or_folder: function () {