Question fixes

components/Questions/index.vue

@@ -165,7 +165,7 @@ export default {
     },
 
     tabbed: {
-      type:    Boolean,
+      type:    [Boolean, String],
       default: true,
     },
 
@@ -193,7 +193,7 @@ export default {
   computed: {
     allQuestions() {
       if ( this.source.questions?.questions ) {
-        return this.chartVersion.questions.questions;
+        return this.source.questions.questions;
       } else if ( this.source.type === 'schema' && this.source.resourceFields ) {
         return schemaToQuestions(this.source.resourceFields);
       } else if ( typeof this.source === 'object' ) {
@@ -266,6 +266,18 @@ export default {
 
       return sortBy(out, 'weight:desc');
     },
+
+    asTabs() {
+      if ( this.tabbed === false || this.tabbed === 'never' ) {
+        return false;
+      }
+
+      if ( this.tabbed === 'multiple' ) {
+        return this.groups.length > 1;
+      }
+
+      return true;
+    },
   },
 
   watch: {
@@ -287,7 +299,7 @@ export default {
 </script>
 
 <template>
-  <div v-if="tabbed">
+  <form v-if="asTabs">
     <Tab
       v-for="g in groups"
       :key="g.name"
@@ -307,8 +319,8 @@ export default {
         </div>
       </div>
     </Tab>
-  </div>
+  </form>
-  <div v-else>
+  <form v-else>
     <div
       v-for="g in groups"
       :key="g.name"
@@ -329,7 +341,7 @@ export default {
         </div>
       </div>
     </div>
-  </div>
+  </form>
 </template>
 
 <style lang="scss" scoped>

components/Tabbed/index.vue

@@ -197,7 +197,7 @@ export default {
 </script>
 
 <template>
-  <div :class="{'side-tabs':!!sideTabs}">
+  <div :class="{'side-tabs': (!!sideTabs && tabs.length)}">
     <ul
       ref="tablist"
       role="tablist"
@@ -236,7 +236,7 @@ export default {
         </li>
       </ul>
     </ul>
-    <div class="tab-container">
+    <div :class="{ 'tab-container': !!tabs.length }">
       <slot />
     </div>
   </div>

edit/provisioning.cattle.io.cluster/rke2.vue

@@ -1,6 +1,5 @@
 <script>
 import difference from 'lodash/difference';
-import differenceBy from 'lodash/differenceBy';
 import throttle from 'lodash/throttle';
 import isArray from 'lodash/isArray';
 import merge from 'lodash/merge';
@@ -154,10 +153,6 @@ export default {
       }
     }
 
-    if ( !this.versionInfo ) {
-      this.versionInfo = {};
-    }
-
     for ( const v of this.addonVersions ) {
       if ( this.versionInfo[v.name] ) {
         continue;
@@ -222,8 +217,8 @@ export default {
       rke2Versions:     null,
       k3sVersions:      null,
       s3Backup:         false,
-      chartValues:      clone(this.value.spec.rkeConfig.chartValues),
       chartVersionInfo: null,
+      versionInfo:      {},
     };
   },
 
@@ -234,6 +229,10 @@ export default {
       return this.value.spec.rkeConfig;
     },
 
+    chartValues() {
+      return this.value.spec.rkeConfig.chartValues;
+    },
+
     serverConfig() {
       return this.value.spec.rkeConfig.controlPlaneConfig;
     },
@@ -345,7 +344,7 @@ export default {
     disableOptions() {
       return this.serverArgs.disable.options.map((value) => {
         return {
-          label: this.$store.getters['i18n/withFallback'](`cluster.rke2.systemService."${ value }"`, null, value.replace(/^rke2-/, '')),
+          label: this.$store.getters['i18n/withFallback'](`cluster.rke2.systemService."${ value }"`, null, value.replace(/^(rke2|rancher)-/, '')),
           value,
         };
       });
@@ -509,21 +508,27 @@ export default {
       return !!this.serverArgs.cni;
     },
 
-    addonVersions() {
+    addonNames() {
       const names = [];
       const cni = this.serverConfig.cni;
 
       if ( cni ) {
-        const parts = cni.split('+');
+        const parts = cni.split('+').map(x => `rke2-${ x }`);
 
         names.push(...parts);
       }
 
       if ( this.agentConfig['cloud-provider-name'] === 'vsphere' ) {
-        names.push('vsphere-cpi', 'vpshere-csi');
+        names.push('rancher-vsphere-cpi', 'rancher-vsphere-csi');
       }
 
-      return names.map(name => this.chartVersionFor(name)).filter(x => !!x);
+      return names;
+    },
+
+    addonVersions() {
+      const versions = this.addonNames.map(name => this.chartVersionFor(name));
+
+      return versions.filter(x => !!x);
     },
   },
 
@@ -540,8 +545,10 @@ export default {
       }
     },
 
-    addonVersions(neu, old) {
+    addonNames(neu, old) {
-      if (!this.$fetchState.pending && differenceBy(neu, old, 'name').length ) {
+      const diff = difference(neu, old);
+
+      if (!this.$fetchState.pending && diff.length ) {
         this.$fetch();
       }
     },
@@ -723,8 +730,7 @@ export default {
       });
     },
 
-    chartVersionFor(feature) {
+    chartVersionFor(chartName) {
-      const chartName = `rke2-${ feature }`;
       const entry = this.chartVersions[chartName];
 
       if ( !entry ) {
@@ -733,7 +739,7 @@ export default {
 
       const out = this.$store.getters['catalog/version']({
         repoType:    'cluster',
-        repoName:    (feature === 'multus' ? 'rancher-rke2-charts' : entry.repo), // @TODO remove when KDM is fixed
+        repoName:    entry.repo,
         chartName,
         versionName: entry.version,
       });
@@ -1157,6 +1163,7 @@ export default {
                 v-if="versionInfo[v.name].questions"
                 v-model="chartValues[v.name]"
                 :mode="mode"
+                :tabbed="false"
                 :source="versionInfo[v.name]"
                 :target-namespace="value.metadata.namespace"
               />

pages/c/_cluster/apps/charts/install.vue

@@ -1113,6 +1113,7 @@ export default {
                 v-model="chartValues"
                 :mode="mode"
                 :source="versionInfo"
+                tabbed="multiple"
                 :target-namespace="targetNamespace"
               />
             </Tabbed>