Fix custom component loading

components/ResourceDetail.vue

@@ -128,7 +128,11 @@ export default {
   },
 
   data() {
-    return { currentValue: this.value };
+    return {
+      currentValue:    this.value,
+      detailComponent: this.$store.getters['type-map/importDetail'](this.resource),
+      editComponent:   this.$store.getters['type-map/importEdit'](this.resource),
+    };
   },
 
   computed: {
@@ -164,9 +168,9 @@ export default {
 
     showComponent() {
       if ( this.isView && this.hasCustomDetail ) {
-        return this.$store.getters['type-map/importDetail'](this.resource);
+        return this.detailComponent;
       } else if ( !this.isView && this.hasCustomEdit ) {
-        return this.$store.getters['type-map/importEdit'](this.resource);
+        return this.editComponent;
       }
 
       return null;

components/SortableTable/index.vue

@@ -228,11 +228,13 @@ export default {
     availableActions() {
       return this.$store.getters[`${ this.storeName }/forTable`];
     },
+
     ...mapState({
       tableSelected(state) {
         return state[this.storeName].tableSelected;
       }
     }),
+
     classObject() {
       return {
         'top-divider':     this.topDivider, 'emphasized-body': this.emphasizedBody, 'body-dividers':   this.bodyDividers

components/nav/Group.vue

@@ -81,16 +81,17 @@ export default {
           <hr />
         </li>
         <li v-else-if="child[childrenKey]" :key="child.name">
-          <Group
+          <ul class="list-unstyled m-0">
-            :key="child.name"
+            <Group
-            :depth="depth + 1"
+              :key="child.name"
-            :is-expanded="isExpanded"
+              :depth="depth + 1"
-            :toggle-group="toggleGroup"
+              :is-expanded="isExpanded"
-            :children-key="childrenKey"
+              :children-key="childrenKey"
-            :can-collapse="canCollapse"
+              :can-collapse="canCollapse"
-            :id-prefix="id+'_'"
+              :id-prefix="id+'_'"
-            :group="child"
+              :group="child"
-          />
+            />
+          </ul>
         </li>
         <Type
           v-else

pages/c/_cluster/_resource/index.vue

@@ -3,6 +3,11 @@ import ResourceTable from '@/components/ResourceTable';
 
 export default {
   components: { ResourceTable },
+
+  data() {
+    return { listComponent: this.$store.getters['type-map/importList'](this.resource) };
+  },
+
   computed:   {
     schema() {
       return this.$store.getters['cluster/schemaFor'](this.resource);
@@ -16,10 +21,6 @@ export default {
       return this.$store.getters['type-map/hasCustomList'](this.resource);
     },
 
-    showComponent() {
-      return this.$store.getters['type-map/importList'](this.resource);
-    },
-
     typeDisplay() {
       return this.$store.getters['type-map/pluralLabelFor'](this.schema);
     },
@@ -53,7 +54,7 @@ export default {
     </header>
     <div v-if="hasComponent">
       <component
-        :is="showComponent"
+        :is="listComponent"
         :schema="schema"
         :rows="rows"
         :headers="headers"