Merge pull request #12044 from rak-phillip/bugfix/11898-remove-chart-…

…steps Remove custom chart steps feature
rancher · Sep 27, 2024 · 1b6e64e · 1b6e64e
2 parents 6a16cc3 + 09fe0af
commit 1b6e64e
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 82 deletions.
diff --git a/shell/pages/c/_cluster/apps/charts/install.vue b/shell/pages/c/_cluster/apps/charts/install.vue
@@ -5,6 +5,7 @@ import isEqual from 'lodash/isEqual';
 import { mapPref, DIFF } from '@shell/store/prefs';
 import { mapFeature, MULTI_CLUSTER, LEGACY } from '@shell/store/features';
 import { mapGetters } from 'vuex';
+import { markRaw } from 'vue';
 import { Banner } from '@components/Banner';
 import ButtonGroup from '@shell/components/ButtonGroup';
 import ChartReadme from '@shell/components/ChartReadme';
@@ -260,14 +261,6 @@ export default {
       await this.loadValuesComponent();
     }
 
-    /*
-      Check if the Helm chart has indicated
-      that the user should fill out the chart values
-      through a wizard-style workflow. If so, load
-      the chart steps.
-    */
-    await this.loadChartSteps();
-
     /*
       this.loadedVersion will only be true if you select a non-defalut
       option from the "Version" dropdown menu in Apps & Marketplace
@@ -451,10 +444,6 @@ export default {
         weight:         10
       },
 
-      customSteps: [
-
-      ],
-
       isPlainLayout: isPlainLayout(this.$route.query),
 
       legacyDefs: {
@@ -674,7 +663,6 @@ export default {
         steps.push(
           this.stepBasic,
           this.stepValues,
-          ...this.customSteps
         );
       }
 
@@ -826,10 +814,6 @@ export default {
     // for editing values
     await this.loadValuesComponent();
 
-    // Load Helm chart info used for showing
-    // wizard steps
-    await this.loadChartSteps();
-
     window.scrollTop = 0;
 
     this.preFormYamlOption = this.valuesComponent || this.hasQuestions ? VALUES_STATE.FORM : VALUES_STATE.YAML;
@@ -910,7 +894,7 @@ export default {
         const hasChartComponent = this.$store.getters['type-map/hasCustomChart'](component);
 
         if ( hasChartComponent ) {
-          this.valuesComponent = this.$store.getters['type-map/importChart'](component);
+          this.valuesComponent = markRaw(this.$store.getters['type-map/importChart'](component));
           this.showValuesComponent = true;
         } else {
           this.valuesComponent = null;
@@ -922,33 +906,6 @@ export default {
       }
     },
 
-    async loadChartSteps() {
-      const component = this.version?.annotations?.[CATALOG_ANNOTATIONS.COMPONENT];
-
-      if ( component ) {
-        const steps = await this.$store.getters['catalog/chartSteps'](component);
-
-        this.customSteps = await Promise.all( steps.map((cs) => this.loadChartStep(cs)));
-      }
-    },
-
-    async loadChartStep(customStep) {
-      // Broken in 2.10, see https://github.com/rancher/dashboard/issues/11898
-      const loaded = await customStep.component();
-      const withFallBack = this.$store.getters['i18n/withFallback'];
-
-      return {
-        name:      customStep.name,
-        label:     withFallBack(loaded?.default?.label, null, customStep.name),
-        subtext:   withFallBack(loaded?.default?.subtext, null, ''),
-        weight:    loaded?.default?.weight,
-        ready:     false,
-        hidden:    true,
-        loading:   true,
-        component: customStep.component,
-      };
-    },
-
     selectChart(chart) {
       if ( !chart ) {
         return;
@@ -1348,17 +1305,6 @@ export default {
       @cancel="cancel"
       @finish="finish"
     >
-      <template
-        v-for="customStep of customSteps"
-        v-slot:[customStep.name]
-        :key="customStep.name"
-      >
-        <component
-          :is="customStep.component"
-          @update="updateStep(customStep.name, $event)"
-          @errors="e=>errors.push(...e)"
-        />
-      </template>
       <template #bannerTitleImage>
         <div>
           <div class="logo-bg">

diff --git a/shell/store/catalog.js b/shell/store/catalog.js
@@ -7,7 +7,6 @@ import { findBy, addObject, filterBy, isArray } from '@shell/utils/array';
 import { stringify } from '@shell/utils/error';
 import { classify } from '@shell/plugins/dashboard-store/classify';
 import { sortBy } from '@shell/utils/sort';
-import { importChart } from '@shell/utils/dynamic-importer';
 import { ensureRegex } from '@shell/utils/string';
 import { isPrerelease } from '@shell/utils/version';
 import difference from 'lodash/difference';
@@ -265,31 +264,6 @@ export const getters = {
     };
   },
 
-  chartSteps(state, getters) {
-    return (name) => {
-      const steps = [];
-
-      const stepsPath = `./${ name }/steps/`;
-      // require.context only takes literals, so find all candidate step files and filter out
-      const allPaths = require.context('@shell/chart', true, /\.vue$/).keys();
-
-      allPaths
-        .filter((path) => path.startsWith(stepsPath))
-        .forEach((path) => {
-          try {
-            steps.push({
-              name:      path.replace(stepsPath, ''),
-              component: importChart(path.substr(2, path.length)),
-            });
-          } catch (e) {
-            console.warn(`Failed to load step component ${ path } for chart ${ name }`, e); // eslint-disable-line no-console
-          }
-        });
-
-      return steps;
-    };
-  },
-
   inStore(state) {
     return state.inStore;
   },