From f566c87b3cebfae314a79488ceb0b6f3e4d2924e Mon Sep 17 00:00:00 2001
From: John Chilton <jmchilton@gmail.com>
Date: Fri, 22 May 2020 09:33:00 -0400
Subject: [PATCH] Improved UploadModal state handling during initialization.

Track whether datatypes and genomes have been set and use the LoadingSpan component to display information about this wait if the component is not yet ready.
---
 .../scripts/components/Upload/UploadModal.vue   | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/client/galaxy/scripts/components/Upload/UploadModal.vue b/client/galaxy/scripts/components/Upload/UploadModal.vue
index 3c77fe8c705..152b250422d 100644
--- a/client/galaxy/scripts/components/Upload/UploadModal.vue
+++ b/client/galaxy/scripts/components/Upload/UploadModal.vue
@@ -12,7 +12,7 @@
         <template v-slot:modal-header>
             <h4 class="title" tabindex="0">{{ title }}</h4>
         </template>
-        <b-tabs v-if="historyAvailable">
+        <b-tabs v-if="ready">
             <b-tab title="Regular" id="regular" button-id="tab-title-link-regular">
                 <default :app="this" :lazy-load-max="50" />
             </b-tab>
@@ -27,7 +27,7 @@
             </b-tab>
         </b-tabs>
         <div v-else>
-            Loading required information from Galaxy server.
+            <loading-span message="Loading required information from Galaxy server." />
         </div>
     </b-modal>
 </template>
@@ -44,6 +44,7 @@ import Composite from "./Composite";
 import Collection from "./Collection";
 import Default from "./Default";
 import RulesInput from "./RulesInput";
+import LoadingSpan from "components/LoadingSpan";
 
 Vue.use(BootstrapVue);
 
@@ -53,6 +54,7 @@ export default {
         Composite,
         Default,
         RulesInput,
+        LoadingSpan,
     },
     props: {
         modalStatic: {
@@ -101,6 +103,8 @@ export default {
             currentUser: null,
             listGenomes: [],
             listExtensions: [],
+            genomesSet: false,
+            extensionsSet: false,
         };
     },
     created: function () {
@@ -116,19 +120,26 @@ export default {
         // load extensions
         UploadUtils.getUploadDatatypes(
             (listExtensions) => {
+                this.extensionsSet = true;
                 this.listExtensions = listExtensions;
             },
-            this.datatypesDisableSuto,
+            this.datatypesDisableAuto,
             this.auto
         );
 
         // load genomes
         UploadUtils.getUploadGenomes((listGenomes) => {
+            this.genomesSet = true;
             this.listGenomes = listGenomes;
         }, this.defaultGenome);
 
         this.initStateWhenHistoryReady();
     },
+    computed: {
+        ready() {
+            return this.genomesSet && this.extensionsSet && this.historyAvailable;
+        },
+    },
     methods: {
         show() {
             this.modalShow = true;