Load display application data and display number of available applications

client/galaxy/scripts/apps/admin.js

@@ -113,15 +113,18 @@ window.app = function app(options, bootstrapped) {
                 })
             );
         },
+
         _display_vue_helper: function(component, props) {
             let instance = Vue.extend(component);
             let vm = document.createElement("div");
             this.page.display(vm);
             new instance(props).$mount(vm);
         },
+
         show_data_tables: function() {
             this._display_vue_helper(DataTables);
         },
+
         show_data_types: function() {
             this._display_vue_helper(DataTypes);
         },

client/galaxy/scripts/components/admin/DisplayApplications.vue

@@ -1,9 +1,15 @@
 <template>
     <div>
-        <div v-if="error" class="alert alert-danger">
-            {{ error }}
+        <div v-if="errorVisible" class="alert alert-danger">
+            {{ errorMessage }}
+        </div>
+        <div v-if="applicationsVisible" class="card-header">
+            There are currently {{ applicationsLength }}
+            <a class="icon-btn" href="" title="Reload all display applications" data-placement="bottom">
+                <span class="fa fa-refresh"/>
+            </a>
+            display applications loaded.
         </div>
-        <div>Display Applications</div>
     </div>
 </template>
 <script>
@@ -15,9 +21,20 @@ export default {
     data() {
         return {
             applications: [],
-            error: null
+            errorMessage: null
         };
     },
+    computed: {
+        applicationsVisible: function() {
+            return this.applications.length > 0;
+        },
+        applicationsLength: function() {
+            return this.applications.length;
+        },
+        errorVisible: function() {
+            return this.error != null;
+        }
+    },
     created() {
         let Galaxy = getGalaxyInstance();
         let url = `${getAppRoot()}api/display_applications`;
@@ -27,7 +44,7 @@ export default {
                 this.applications = response.data;
             })
             .catch(e => {
-                this.error = this._errorMessage(e);
+                this.errorMessage = this._errorMessage(e);
             });
     },
     methods: {