@rancher/shell 0.1.4 → 0.2.1

package/mixins/resource-fetch.js

@@ -1,26 +1,10 @@
 import { mapGetters } from 'vuex';
-import {
-  COUNT, MANAGEMENT, POD, WORKLOAD_TYPES, WORKLOAD, SECRET
-} from '@shell/config/types';
+import { COUNT, MANAGEMENT } from '@shell/config/types';
 import { SETTING, DEFAULT_PERF_SETTING } from '@shell/config/settings';
 
 // Number of pages to fetch when loading incrementally
 const PAGES = 4;
 
-// restrict advanced features of manual refresh and incremental loading to these resource types
-export const TYPES_RESTRICTED = [
-  SECRET,
-  POD,
-  WORKLOAD_TYPES.DEPLOYMENT,
-  WORKLOAD_TYPES.CRON_JOB,
-  WORKLOAD_TYPES.DAEMON_SET,
-  WORKLOAD_TYPES.JOB,
-  WORKLOAD_TYPES.STATEFUL_SET,
-  WORKLOAD_TYPES.REPLICA_SET,
-  WORKLOAD_TYPES.REPLICATION_CONTROLLER,
-  WORKLOAD
-];
-
 export default {
   data() {
     // fetching the settings related to manual refresh from global settings
@@ -66,7 +50,17 @@ export default {
     }
   },
 
-  computed: { ...mapGetters({ refreshFlag: 'resource-fetch/refreshFlag' }) },
+  computed: {
+    ...mapGetters({ refreshFlag: 'resource-fetch/refreshFlag' }),
+    rows() {
+      const inStore = this.$store.getters['currentStore'](this.resource);
+
+      return this.$store.getters[`${ inStore }/all`](this.resource);
+    },
+    loading() {
+      return this.rows.length ? false : this.$fetchState.pending;
+    },
+  },
   watch:    {
     refreshFlag(neu) {
       // this is where the data assignment will trigger the update of the list view...

package/mixins/resource-manager.js

@@ -0,0 +1,126 @@
+import { mapGetters } from 'vuex';
+import { allHashSettled } from '@shell/utils/promise';
+
+export default {
+  computed: { ...mapGetters(['currentCluster']) },
+  data() {
+    return { isLoadingSecondaryResources: false };
+  },
+  methods:  {
+    /**
+    *
+    * Function resourceManagerFetchSecondaryResources
+    * This method is used to fetch what is called "secondary resources", which can be defined as resources that are needed to populate
+    * the page/component itself (ex: used as options on a Select) but don't need to be put into Vuex store or watched to get constant updates.
+    * This method allows to fetch resources for a given namespace to reduce the amount of results instead of needing to fetch all and filtering afterwards.
+    *
+    *
+    * @param {String} resourceData.namespace - Namespace identifier
+    * @param {Object} resourceData.data - Object containing info about the data needed to be fetched and how it should be parsed. Note: The KEY NEEDS to be the resource TYPE!
+    * @param {Array} resourceData.data[TYPE].applyTo - The array of operations needed to be performed for the specific data TYPE
+    * @param {String} resourceData.data[TYPE].applyTo[x].var - The 'this' property name that should be populated with the data fetched
+    * @param {Boolean} resourceData.data[TYPE].applyTo[x].classify - Whether the data fetched should have a model applied to it
+    * @param {Function} resourceData.data[TYPE].applyTo[x].parsingFunc - Optional parsing function if the fetched data needs to be parsed
+    * @param {Boolean} onlyNamespaced - Only fetch namespaced resources
+    */
+    async resourceManagerFetchSecondaryResources(resourceData, onlyNamespaced = false) {
+      const requests = {};
+      const namespace = resourceData.namespace;
+
+      // Only fetch types if the user is allowed to...
+      Object.keys(resourceData.data).forEach((type) => {
+        const schema = this.$store.getters['cluster/schemaFor'](type);
+
+        if (schema) {
+          let url = schema.links.collection;
+
+          if (schema?.attributes?.namespaced && namespace) {
+            const parts = url.split('/');
+
+            parts.splice(parts.length - 2, 0, `api`);
+            parts.splice(parts.length - 1, 0, `namespaces/${ namespace }`);
+            url = parts.join('/');
+          } else if (onlyNamespaced) {
+            // Type isn't namespaced and we've been requested to only fetch namespaced types
+            return;
+          }
+
+          requests[type] = this.$store.dispatch('cluster/request', { url });
+        }
+      });
+
+      if (Object.keys(requests).length) {
+        // this is the flag/variable that we need to apply to all places that rely on this data. Ex: LabeledSelect
+        this.isLoadingSecondaryResources = true;
+        const hash = await allHashSettled(requests);
+        const types = Object.keys(hash);
+
+        for (let i = 0; i < types.length; i++) {
+          const type = types[i];
+          const status = hash[type].status;
+          // if it's namespaced, we get the data on 'items' prop, for non-namespaced it's  'data' prop...
+          const requestData = hash[type].value.items || hash[type].value.data || hash[type].value;
+          const schema = this.$store.getters['cluster/schemaFor'](type);
+
+          if (status === 'fulfilled' && resourceData.data[type] && resourceData.data[type].applyTo?.length) {
+            for (let y = 0; y < resourceData.data[type].applyTo.length; y++) {
+              const apply = resourceData.data[type].applyTo[y];
+              let resources = requestData;
+
+              if (schema?.attributes?.namespaced) {
+                // The resources returned when requesting namespaced types do not contain id, type and links properties.
+                // This isn't perfect, or universally applicable, but will work for the current set of use cases
+                // To make this more generic
+                // - id param = this.$store.getters['cluster/keyFieldForType'](type)
+                // - id value = new dashboard-store getter, overwritten by steve store getter
+                requestData.forEach((item) => {
+                  item.type = type;
+                  item.id = `${ item.metadata.namespace }/${ item.metadata.name }`;
+                });
+              }
+
+              if (apply.classify) {
+                resources = await this.$store.dispatch('cluster/createMany', requestData);
+              }
+
+              if (apply.parsingFunc) {
+                this[apply.var] = apply.parsingFunc(resources);
+              } else {
+                this[apply.var] = resources;
+              }
+            }
+          } else if (status === 'rejected') {
+            console.error(`Resource Manager - secondary data request for type ${ type } has failed`, status.error); // eslint-disable-line no-console
+          }
+        }
+
+        this.isLoadingSecondaryResources = false;
+      }
+    },
+
+    /**
+     * Clear the cached secondary resources
+     *
+     * @param {*} resourceData See resourceManagerFetchSecondaryResources
+     * @param {*} onlyNamespaced Clear only namespaced resources
+     */
+    resourceManagerClearSecondaryResources(resourceData, onlyNamespaced = false) {
+      Object.keys(resourceData.data).forEach((type) => {
+        const schema = this.$store.getters['cluster/schemaFor'](type);
+
+        if (schema) {
+          if (!schema?.attributes?.namespaced && onlyNamespaced) {
+            // resource isn't namespaced and we're only interested in namespaced resources
+            return;
+          }
+
+          for (let y = 0; y < resourceData.data[type].applyTo.length; y++) {
+            const apply = resourceData.data[type].applyTo[y];
+
+            this[apply.var] = [];
+          }
+        }
+      });
+    }
+  },
+};

package/models/catalog.cattle.io.uiplugin.js

@@ -31,4 +31,8 @@ export default class UIPlugin extends SteveModel {
   get isDeveloper() {
     return this.pluginMetadata?.developer === 'true';
   }
+
+  get plugin() {
+    return this.spec?.plugin || {};
+  }
 }

package/models/management.cattle.io.cluster.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import { CATALOG, CLUSTER_BADGE } from '@shell/config/labels-annotations';
-import { NODE, FLEET, MANAGEMENT } from '@shell/config/types';
+import { NODE, FLEET, MANAGEMENT, CAPI } from '@shell/config/types';
 import { insertAt } from '@shell/utils/array';
 import { downloadFile } from '@shell/utils/download';
 import { parseSi } from '@shell/utils/units';
@@ -430,4 +430,12 @@ export default class MgmtCluster extends HybridModel {
   get nodes() {
     return this.$getters['all'](MANAGEMENT.NODE).filter(node => node.id.startsWith(this.id));
   }
+
+  get provClusterId() {
+    const verb = this.isLocal ? 'to' : 'from';
+    const from = `${ verb }Type`;
+    const id = `${ verb }Id`;
+
+    return this.metadata.relationships.find(r => r[from] === CAPI.RANCHER_CLUSTER)?.[id];
+  }
 }

package/models/pod.js

@@ -182,19 +182,29 @@ export default class Pod extends WorkloadService {
   }
 
   save() {
+    const prev = { ...this };
+
     const { metadata, spec } = this.spec.template;
 
     this.spec = {
       ...this.spec,
-      metadata: {
-        ...this.metadata,
-        ...metadata
-      },
       ...spec
     };
 
+    this.metadata = {
+      ...this.metadata,
+      ...metadata
+    };
+
     delete this.spec.template;
 
-    return this._save(...arguments);
+    // IF there is an error POD world model get overwritten
+    // For the workloads this need be reset back
+    return this._save(...arguments).catch((e) => {
+      this.spec = prev.spec;
+      this.metadata = prev.metadata;
+
+      return Promise.reject(e);
+    });
   }
 }

package/models/provisioning.cattle.io.cluster.js

@@ -679,6 +679,10 @@ export default class ProvCluster extends SteveModel {
   }
 
   get supportsWindows() {
+    if (this.isK3s || this.isImportedK3s) {
+      return false;
+    }
+
     if ( this.isRke1 ) {
       return this.mgmt?.spec?.windowsPreferedCluster || false;
     }

package/models/workload.service.js

@@ -123,6 +123,11 @@ export default class WorkloadService extends SteveModel {
 
       return containers;
     }
+
+    if ( this.spec.containers ) {
+      return this.spec.containers;
+    }
+
     const { spec:{ template:{ spec:{ containers } } } } = this;
 
     return containers;
@@ -135,6 +140,11 @@ export default class WorkloadService extends SteveModel {
 
       return initContainers;
     }
+
+    if (this.spec.initContainers) {
+      return this.spec.initContainers;
+    }
+
     const { spec:{ template:{ spec:{ initContainers } } } } = this;
 
     return initContainers;

package/nuxt.config.js

@@ -582,6 +582,7 @@ export default function(dir, _appConfig) {
       { src: path.join(NUXT_SHELL, 'plugins/plugin'), ssr: false }, // Load dyanmic plugins
       { src: path.join(NUXT_SHELL, 'plugins/codemirror-loader'), ssr: false },
       { src: path.join(NUXT_SHELL, 'plugins/formatters'), ssr: false }, // Populate formatters cache for sorted table
+      { src: path.join(NUXT_SHELL, 'plugins/version'), ssr: false }, // Makes a fetch to the backend to get version metadata
     ],
 
     // Proxy: https://github.com/nuxt-community/proxy-module#options
@@ -595,8 +596,8 @@ export default function(dir, _appConfig) {
       '/v3-public':      proxyOpts(api), // Rancher Unauthed API
       '/api-ui':         proxyOpts(api), // Browser API UI
       '/meta':           proxyMetaOpts(api), // Browser API UI
-      '/rancherversion': proxyPrimeOpts(api), // Rancher version endpoint
       '/v1-*':           proxyOpts(api), // SAML, KDM, etc
+      '/rancherversion': proxyPrimeOpts(api), // Rancher version endpoint
       // These are for Ember embedding
       '/c/*/edit':       proxyOpts('https://127.0.0.1:8000'), // Can't proxy all of /c because that's used by Vue too
       '/k/':             proxyOpts('https://127.0.0.1:8000'),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "0.1.4",
+  "version": "0.2.1",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",

package/pages/auth/login.vue

@@ -26,6 +26,7 @@ import {
   setBrand,
   setVendor
 } from '@shell/config/private-label';
+import loadPlugins from '@shell/plugins/plugin';
 
 export default {
   name:       'Login',
@@ -255,6 +256,15 @@ export default {
           this.$cookies.remove(USERNAME);
         }
 
+        // User logged with local login - we don't do any redirect/reload, so the boot-time plugin will not run again to laod the plugins
+        // so we manually load them here - other SSO auth providers bounce out and back to the Dashboard, so on the bounce-back
+        // the plugins will load via the boot-time plugin
+        await loadPlugins({
+          app:     this.$store.app,
+          store:   this.$store,
+          $plugin: this.$store.$plugin
+        });
+
         if (this.firstLogin || user[0]?.mustChangePassword) {
           this.$store.dispatch('auth/setInitialPass', this.password);
           this.$router.push({ name: 'auth-setup' });

package/pages/auth/verify.vue

@@ -2,6 +2,8 @@
 import { GITHUB_CODE, GITHUB_NONCE, BACK_TO } from '@shell/config/query-params';
 import { get } from '@shell/utils/object';
 import { base64Decode } from '@shell/utils/crypto';
+import loadPlugins from '@shell/plugins/plugin';
+
 const samlProviders = ['ping', 'adfs', 'keycloak', 'okta', 'shibboleth'];
 
 function reply(err, code) {
@@ -60,6 +62,13 @@ export default {
       if ( res._status === 200) {
         const backTo = route.query[BACK_TO] || '/';
 
+        // Load plugins
+        await loadPlugins({
+          app:     store.app,
+          store,
+          $plugin: store.$plugin
+        });
+
         redirect(backTo);
       } else {
         redirect(`/auth/login?err=${ escape(res) }`);

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

@@ -5,13 +5,13 @@ 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 { Banner } from '@components/Banner';
 import ButtonGroup from '@shell/components/ButtonGroup';
 import ChartReadme from '@shell/components/ChartReadme';
 import { Checkbox } from '@components/Form/Checkbox';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { LabeledInput } from '@components/Form/LabeledInput';
+import { LabeledTooltip } from '@components/LabeledTooltip';
 import LazyImage from '@shell/components/LazyImage';
 import Loading from '@shell/components/Loading';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
@@ -24,7 +24,7 @@ import Wizard from '@shell/components/Wizard';
 import TypeDescription from '@shell/components/TypeDescription';
 import ChartMixin from '@shell/mixins/chart';
 import ChildHook, { BEFORE_SAVE_HOOKS, AFTER_SAVE_HOOKS } from '@shell/mixins/child-hook';
-import { CATALOG, MANAGEMENT, DEFAULT_WORKSPACE } from '@shell/config/types';
+import { CATALOG, MANAGEMENT, DEFAULT_WORKSPACE, CAPI } from '@shell/config/types';
 import {
   CHART, FROM_CLUSTER, FROM_TOOLS, HIDE_SIDE_NAV, NAMESPACE, REPO, REPO_TYPE, VERSION, _FLAGGED
 } from '@shell/config/query-params';
@@ -61,6 +61,7 @@ export default {
     Checkbox,
     LabeledInput,
     LabeledSelect,
+    LabeledTooltip,
     LazyImage,
     Loading,
     NameNsDescription,
@@ -93,10 +94,12 @@ export default {
 
     this.errors = [];
 
-    this.defaultRegistrySetting = await this.$store.dispatch('management/find', {
-      type: MANAGEMENT.SETTING,
-      id:   'system-default-registry'
-    });
+    // If the chart doesn't contain system `systemDefaultRegistry` properties there's no point applying them
+    if (this.showCustomRegistry) {
+      this.clusterRegistry = await this.getClusterRegistry();
+      this.globalRegistry = await this.getGlobalRegistry();
+      this.defaultRegistrySetting = this.clusterRegistry || this.globalRegistry;
+    }
 
     this.serverUrlSetting = await this.$store.dispatch('management/find', {
       type: MANAGEMENT.SETTING,
@@ -281,6 +284,16 @@ export default {
       */
       this.chartValues = merge(merge({}, this.versionInfo?.values || {}), userValues);
 
+      if (this.showCustomRegistry) {
+        const existingRegistry = this.chartValues?.global?.systemDefaultRegistry || this.chartValues?.global?.cattle?.systemDefaultRegistry;
+
+        delete this.chartValues?.global?.systemDefaultRegistry;
+        delete this.chartValues?.global?.cattle?.systemDefaultRegistry;
+
+        this.customRegistrySetting = existingRegistry || this.defaultRegistrySetting;
+        this.showCustomRegistryInput = !!this.customRegistrySetting;
+      }
+
       /* Serializes an object as a YAML document */
       this.valuesYaml = saferDump(this.chartValues);
 
@@ -292,6 +305,7 @@ export default {
       this.loadedVersionValues = this.versionInfo?.values || {};
       this.loadedVersion = this.version?.key;
     }
+
     /* Check if chart exists and if required values exist */
     this.updateStepOneReady();
 
@@ -317,13 +331,16 @@ export default {
     };
 
     return {
-      defaultRegistrySetting: null,
+      defaultRegistrySetting: '',
+      customRegistrySetting:  '',
       serverUrlSetting:       null,
       chartValues:            null,
+      clusterRegistry:        '',
       originalYamlValues:     null,
       previousYamlValues:     null,
       errors:                 null,
       existing:               null,
+      globalRegistry:         '',
       forceNamespace:         null,
       loadedVersion:          null,
       loadedVersionValues:    null,
@@ -335,22 +352,22 @@ export default {
       valuesYaml:             '',
       project:                null,
       migratedApp:            false,
-
       defaultCmdOpts,
-      customCmdOpts: { ...defaultCmdOpts },
+      customCmdOpts:          { ...defaultCmdOpts },
 
       nameDisabled: false,
 
-      preFormYamlOption:   VALUES_STATE.YAML,
-      formYamlOption:      VALUES_STATE.YAML,
-      showDiff:            false,
-      showValuesComponent: true,
-      showQuestions:       true,
-      showSlideIn:         false,
-      shownReadmeWindows:  [],
-      componentHasTabs:    false,
-      showCommandStep:     false,
-      isNamespaceNew:      false,
+      preFormYamlOption:       VALUES_STATE.YAML,
+      formYamlOption:          VALUES_STATE.YAML,
+      showDiff:                false,
+      showValuesComponent:     true,
+      showQuestions:           true,
+      showSlideIn:             false,
+      shownReadmeWindows:      [],
+      componentHasTabs:        false,
+      showCommandStep:         false,
+      showCustomRegistryInput: false,
+      isNamespaceNew:          false,
 
       stepBasic: {
         name:           'basics',
@@ -645,6 +662,23 @@ export default {
       }
 
       return null;
+    },
+
+    /**
+     * Check if the chart contains `systemDefaultRegistry` properties. If not we shouldn't apply the setting (or show the UI for them)
+     */
+    showCustomRegistry() {
+      const global = this.versionInfo?.values?.global || {};
+
+      return global.systemDefaultRegistry !== undefined || global.cattle?.systemDefaultRegistry !== undefined;
+    },
+
+    /**
+     * True if we should apply/save the custom registry value. This should be false if matching the global registry
+     * (we shouldn't save the global registry to avoid issues on upgrade where we might confused it with a custom one)
+     */
+    applyCustomRegistry() {
+      return this.customRegistrySetting !== this.globalRegistry;
     }
   },
 
@@ -744,6 +778,42 @@ export default {
   },
 
   methods: {
+    async getClusterRegistry() {
+      const hasPermissionToSeeProvCluster = this.$store.getters[`management/schemaFor`](CAPI.RANCHER_CLUSTER);
+
+      if (hasPermissionToSeeProvCluster) {
+        const mgmCluster = this.$store.getters['currentCluster'];
+        const provCluster = await this.$store.dispatch('management/find', {
+          type: CAPI.RANCHER_CLUSTER,
+          id:   mgmCluster.provClusterId
+        });
+
+        if (provCluster.isRke2) { // isRke2 returns true for both RKE2 and K3s clusters.
+          const agentConfig = provCluster.spec.rkeConfig.machineSelectorConfig.find(x => !x.machineLabelSelector).config;
+
+          // If a cluster scoped registry exists,
+          // it should be used by default.
+          const clusterRegistry = agentConfig?.['system-default-registry'] || '';
+
+          if (clusterRegistry) {
+            return clusterRegistry;
+          }
+        }
+      }
+    },
+
+    async getGlobalRegistry() {
+      // Use the global registry as a fallback.
+      // If it is an empty string, the container
+      // runtime will pull images from docker.io.
+      const globalRegistry = await this.$store.dispatch('management/find', {
+        type: MANAGEMENT.SETTING,
+        id:   'system-default-registry'
+      });
+
+      return globalRegistry.value;
+    },
+
     updateValue(value) {
       if (this.$refs.yaml) {
         this.$refs.yaml.updateValue(value);
@@ -905,7 +975,7 @@ export default {
       const cluster = this.currentCluster;
       const projects = this.$store.getters['management/all'](MANAGEMENT.PROJECT);
       const systemProjectId = projects.find(p => p.spec?.displayName === 'System')?.id?.split('/')?.[1] || '';
-      const defaultRegistry = this.defaultRegistrySetting?.value || '';
+
       const serverUrl = this.serverUrlSetting?.value || '';
       const isWindows = (cluster.workerOSs || []).includes(WINDOWS);
       const pathPrefix = cluster?.spec?.rancherKubernetesEngineConfig?.prefixPath || '';
@@ -913,8 +983,15 @@ export default {
 
       setIfNotSet(cattle, 'clusterId', cluster?.id);
       setIfNotSet(cattle, 'clusterName', cluster?.nameDisplay);
-      setIfNotSet(cattle, 'systemDefaultRegistry', defaultRegistry);
-      setIfNotSet(global, 'systemDefaultRegistry', defaultRegistry);
+      if (this.showCustomRegistry) {
+        // If this is the current global registry leave it blank. This avoids the scenario on upgrade where a previous global registry that's
+        // been updated is confused with a custom user registry
+        const registry = this.applyCustomRegistry ? this.customRegistrySetting : '';
+
+        set(cattle, 'systemDefaultRegistry', registry);
+        set(global, 'systemDefaultRegistry', registry);
+      }
+
       setIfNotSet(global, 'cattle.systemProjectId', systemProjectId);
       setIfNotSet(cattle, 'url', serverUrl);
       setIfNotSet(cattle, 'rkePathPrefix', pathPrefix);
@@ -939,7 +1016,6 @@ export default {
       }
 
       const cluster = this.$store.getters['currentCluster'];
-      const defaultRegistry = this.defaultRegistrySetting?.value || '';
       const serverUrl = this.serverUrlSetting?.value || '';
       const isWindows = (cluster.workerOSs || []).includes(WINDOWS);
       const pathPrefix = cluster?.spec?.rancherKubernetesEngineConfig?.prefixPath || '';
@@ -948,7 +1024,6 @@ export default {
       if ( values.global?.cattle ) {
         deleteIfEqual(values.global.cattle, 'clusterId', cluster?.id);
         deleteIfEqual(values.global.cattle, 'clusterName', cluster?.nameDisplay);
-        deleteIfEqual(values.global.cattle, 'systemDefaultRegistry', defaultRegistry);
         deleteIfEqual(values.global.cattle, 'url', serverUrl);
         deleteIfEqual(values.global.cattle, 'rkePathPrefix', pathPrefix);
         deleteIfEqual(values.global.cattle, 'rkeWindowsPathPrefix', windowsPathPrefix);
@@ -966,10 +1041,6 @@ export default {
         delete values.global.cattle;
       }
 
-      if ( values.global ) {
-        deleteIfEqual(values.global, 'systemDefaultRegistry', defaultRegistry);
-      }
-
       if ( !Object.keys(values.global || {}).length ) {
         delete values.global;
       }
@@ -1289,7 +1360,6 @@ export default {
             </div>
           </div>
           <NameNsDescription
-            v-if="chart"
             v-model="value"
             :description-hidden="true"
             :mode="mode"
@@ -1316,13 +1386,31 @@ export default {
               />
             </template>
           </NameNsDescription>
+          <Checkbox v-model="showCommandStep" class="mb-20" :label="t('catalog.install.steps.helmCli.checkbox', { action, existing: !!existing })" />
+
+          <Checkbox
+            v-if="showCustomRegistry"
+            v-model="showCustomRegistryInput"
+            class="mb-20"
+            :label="t('catalog.chart.registry.custom.checkBoxLabel')"
+            :tooltip="t('catalog.chart.registry.tooltip')"
+          />
+          <div v-if="showCustomRegistry" class="row">
+            <div class="col span-6">
+              <LabeledInput
+                v-if="showCustomRegistryInput"
+                v-model="customRegistrySetting"
+                label-key="catalog.chart.registry.custom.inputLabel"
+                placeholder-key="catalog.chart.registry.custom.placeholder"
+                :min-height="30"
+              />
+            </div>
+          </div>
           <div class="step__values__controls--spacer" style="flex:1">
 &nbsp;
           </div>
           <Banner v-if="isNamespaceNew" color="info" v-html="t('catalog.install.steps.basics.createNamespace', {namespace: value.metadata.namespace}, true) ">
           </Banner>
-
-          <Checkbox v-model="showCommandStep" class="mb-20" :label="t('catalog.install.steps.helmCli.checkbox', { action, existing: !!existing })" />
         </div>
       </template>
       <template #clusterTplVersion>