@rancher/shell 3.0.12-rc.4 → 3.0.12-rc.6

package/edit/fleet.cattle.io.helmop.vue

@@ -196,7 +196,7 @@ export default {
           label:          this.t('fleet.helmOp.add.steps.metadata.label'),
           subtext:        this.t('fleet.helmOp.add.steps.metadata.subtext'),
           descriptionKey: 'fleet.helmOp.add.steps.metadata.description',
-          ready:          this.isView || !!this.value.metadata.name,
+          ready:          this.isView || (!!this.value.metadata.name && this.stepPathErrors('basics').length === 0),
           weight:         1
         },
         {
@@ -443,6 +443,15 @@ export default {
       this.done();
     },
 
+    stepPathErrors(stepName) {
+      // Helper is used to check which validations is for each step
+      const paths = this.fvFormRuleSets
+        .filter((rule) => rule.step === stepName)
+        .map((rule) => rule.path);
+
+      return this.fvGetPathErrors(paths);
+    },
+
     onSourceTypeSelect(type) {
       if (this.isSuseAppCollection) {
         return;
@@ -659,35 +668,49 @@ export default {
     },
 
     updateValidationRules(sourceType) {
+      const nameRule = {
+        step:           'basics',
+        path:           'metadata.name',
+        rules:          ['subDomain'],
+        translationKey: 'nameNsDescription.name.label'
+      };
+
       switch (sourceType) {
       case SOURCE_TYPE.REPO:
-        this.fvFormRuleSets = [{
+        this.fvFormRuleSets = [nameRule, {
+          step:  'chart',
           path:  'spec.helm.repo',
           rules: ['urlRepository'],
         }, {
+          step:  'chart',
           path:  'spec.helm.chart',
           rules: ['required'],
         }, {
+          step:  'chart',
           path:  'spec.helm.version',
           rules: ['semanticVersion'],
         }];
         break;
       case SOURCE_TYPE.OCI:
-        this.fvFormRuleSets = [{
+        this.fvFormRuleSets = [nameRule, {
+          step:  'chart',
           path:  'spec.helm.repo',
           rules: ['ociRegistry'],
         },
         ...(this.isSuseAppCollection ? [{
+          step:  'chart',
           path:  'spec.helm.chart',
           rules: ['required'],
         }] : []),
         {
+          step:  'chart',
           path:  'spec.helm.version',
           rules: this.isSuseAppCollection ? ['required', 'semanticVersion'] : ['semanticVersion'],
         }];
         break;
       case SOURCE_TYPE.TARBALL:
-        this.fvFormRuleSets = [{
+        this.fvFormRuleSets = [nameRule, {
+          step:  'chart',
           path:  'spec.helm.chart',
           rules: ['urlRepository'],
         }];
@@ -739,6 +762,26 @@ export default {
         break;
       }
     },
+
+    async beforeNext(activeStep) {
+      if (activeStep.name !== 'basics' || !this.isCreate) {
+        return;
+      }
+
+      await this.value.dryRunCreate({
+        type:     this.value.type,
+        metadata: {
+          name:      this.value.metadata.name,
+          namespace: this.value.metadata.namespace,
+        },
+        spec: {
+          helm: {
+            chart: 'placeholder',
+            repo:  'https://example.com',
+          },
+        }
+      });
+    },
   },
 };
 </script>
@@ -753,11 +796,12 @@ export default {
     :mode="mode"
     :resource="value"
     :subtypes="[]"
-    :validation-passed="true"
+    :validation-passed="fvFormIsValid"
     :errors="errors"
     :steps="!isView ? steps : undefined"
     :finish-mode="'finish'"
     :cancel-event="true"
+    :before-next="beforeNext"
     class="wizard"
     data-testid="helmop-cru-resource"
     @cancel="onCancel"
@@ -773,6 +817,7 @@ export default {
         :mode="mode"
         :is-view="isView"
         data-testid="helmop-metadata-tab"
+        :name-rules="fvGetAndReportPathRules('metadata.name')"
         @update:value="$emit('input', $event)"
       />
     </template>
@@ -1049,6 +1094,7 @@ export default {
       >
         <HelmOpAppCoConfigTab
           v-bind="appCoConfigProps"
+          :name-rules="fvGetAndReportPathRules('metadata.name')"
           data-testid="helmop-appco-edit-config-tab"
           v-on="appCoConfigListeners"
         />

package/edit/helm.cattle.io.projecthelmchart.vue

@@ -150,6 +150,7 @@ export default {
             tabbed="multiple"
             :target-namespace="value.metadata.namespace"
             :source="selectedNamespaceQuestions"
+            :mode="mode"
           />
         </Tabbed>
       </div>

package/edit/{management.cattle.io.setting.vue → management.cattle.io.setting/index.vue}

@@ -32,13 +32,14 @@ export default {
     const t = this.$store.getters['i18n/t'];
 
     return {
-      setting:        ALLOWED_SETTINGS[this.value.id],
-      description:    t(`advancedSettings.descriptions.${ this.value.id }`),
-      editHelp:       t(`advancedSettings.editHelp.${ this.value.id }`),
-      enumOptions:    [],
-      canReset:       false,
-      errors:         [],
-      fvFormRuleSets: [],
+      setting:             ALLOWED_SETTINGS[this.value.id],
+      description:         t(`advancedSettings.descriptions.${ this.value.id }`),
+      editHelp:            t(`advancedSettings.editHelp.${ this.value.id }`),
+      enumOptions:         [],
+      canReset:            false,
+      errors:              [],
+      fvFormRuleSets:      [],
+      customEditComponent: null
     };
   },
 
@@ -60,6 +61,14 @@ export default {
     if (isServerUrl(this.value.id) && !this.value.default) {
       this.canReset = false;
     }
+
+    let component;
+
+    try {
+      component = require(`@shell/edit/management.cattle.io.setting/${ this.value.id }.vue`).default;
+    } catch {}
+
+    this.customEditComponent = component;
   },
 
   computed: {
@@ -195,8 +204,22 @@ export default {
       :label="err"
       data-testid="setting-error-banner"
     />
-
-    <div class="mt-20">
+    <div
+      v-if="customEditComponent"
+      class="mt-20"
+    >
+      <component
+        :is="customEditComponent"
+        :setting-value="value.value"
+        :default-value="value.default"
+        :rules="fvGetAndReportPathRules('value')"
+        @update:setting-value="value.value=$event"
+      />
+    </div>
+    <div
+      v-else
+      class="mt-20"
+    >
       <div v-if="setting.kind === 'enum'">
         <LabeledSelect
           v-model:value="value.value"

package/edit/management.cattle.io.setting/system-default-registry-pull-secrets.vue

@@ -0,0 +1,81 @@
+<script setup lang="ts">
+import { ref, computed, onMounted, toRef } from 'vue';
+import { useStore } from 'vuex';
+import LabeledSelect from '@shell/components/form/LabeledSelect.vue';
+import { SECRET } from '@shell/config/types';
+import { SECRET_TYPES } from '@shell/config/secret';
+
+const AUTH_TYPES = [
+  SECRET_TYPES.DOCKER_JSON,
+  SECRET_TYPES.BASIC,
+  SECRET_TYPES.SSH,
+  SECRET_TYPES.RKE_AUTH_CONFIG
+];
+
+const props = defineProps<{
+  settingValue: Record<string, any>;
+  defaultValue?: Record<string, any>;
+  rules?: Array<(value: any) => string | undefined>;
+}>();
+
+const emit = defineEmits(['update:settingValue']);
+
+const store = useStore();
+const settingValue = toRef(props, 'settingValue');
+const defaultValue = toRef(props, 'defaultValue');
+const secrets = ref<any[]>([]);
+
+const secretOptions = computed(() => secrets.value
+  .filter((s) => AUTH_TYPES.includes(s._type))
+  .map((s) => {
+    const { dataPreview, subTypeDisplay, metadata } = s;
+
+    const label = subTypeDisplay && dataPreview ? `${ metadata.name } (${ subTypeDisplay }: ${ dataPreview })` : `${ metadata.name } (${ subTypeDisplay })`;
+
+    return {
+      label,
+      value: s.metadata?.name
+    };
+  })
+);
+
+const selectedSecrets = computed({
+  get: () => {
+    const sValue = settingValue.value || defaultValue.value || '';
+
+    return sValue.split(',').reduce((all: string[], secret: string) => {
+      if (!!secret.trim()) {
+        all.push(secret.trim());
+      }
+
+      return all;
+    }, []);
+  },
+  set: (neu: string[]) => {
+    const newSettingValue = neu?.length ? neu.join(',') : null;
+
+    emit('update:settingValue', newSettingValue);
+  },
+});
+
+onMounted(async() => {
+  const res = await store.dispatch('management/findAll', {
+    type: SECRET,
+    opt:  { namespaced: 'cattle-system' },
+  });
+
+  secrets.value = Array.isArray(res) ? res : [];
+});
+
+</script>
+
+<template>
+  <LabeledSelect
+    id="pull-secrets"
+    v-model:value="selectedSecrets"
+    label="Image Pull Secrets"
+    :options="secretOptions"
+    :rules="rules"
+    :multiple="true"
+  />
+</template>

package/edit/provisioning.cattle.io.cluster/SelectCredential.vue

@@ -1,7 +1,7 @@
 <script>
 import Loading from '@shell/components/Loading';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
-import { NORMAN, DEFAULT_WORKSPACE } from '@shell/config/types';
+import { NORMAN } from '@shell/config/types';
 import CreateEditView from '@shell/mixins/create-edit-view';
 import CruResource from '@shell/components/CruResource';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
@@ -50,11 +50,8 @@ export default {
     const field = this.$store.getters['plugins/credentialFieldForDriver'](this.driverName);
 
     this.newCredential = await this.$store.dispatch('rancher/create', {
-      type:     NORMAN.CLOUD_CREDENTIAL,
-      metadata: {
-        namespace:   DEFAULT_WORKSPACE,
-        annotations: { [CAPI.CREDENTIAL_DRIVER]: this.driverName }
-      },
+      type:                           NORMAN.CLOUD_CREDENTIAL,
+      annotations:                    { [CAPI.CREDENTIAL_DRIVER]: this.driverName },
       [`${ field }credentialConfig`]: {}
     });
 
@@ -216,12 +213,6 @@ export default {
         }
       }
 
-      if ( this.newCredential.metadata.name ) {
-        delete this.newCredential.metadata.generateName;
-      } else {
-        this.newCredential.metadata.generateName = 'cloud-credential-';
-      }
-
       try {
         const res = await this.newCredential.save();
 

package/edit/provisioning.cattle.io.cluster/__tests__/rke2.test.ts

@@ -806,4 +806,22 @@ describe('component: rke2', () => {
       expect(wrapper.vm.value.spec.rkeConfig.machineGlobalConfig[INGRESS_CONTROLLER]).toBe(INGRESS_NGINX);
     });
   });
+
+  describe('computed: canEditAsYaml', () => {
+    it('should return false when isUpstreamCAPIProvider is true', () => {
+      const vm = { isUpstreamCAPIProvider: true } as any;
+
+      const canEditAsYaml = rke2.computed!.canEditAsYaml.call(vm);
+
+      expect(canEditAsYaml).toBe(false);
+    });
+
+    it('should return true when isUpstreamCAPIProvider is false', () => {
+      const vm = { isUpstreamCAPIProvider: false } as any;
+
+      const canEditAsYaml = rke2.computed!.canEditAsYaml.call(vm);
+
+      expect(canEditAsYaml).toBe(true);
+    });
+  });
 });

package/edit/provisioning.cattle.io.cluster/index.vue

@@ -87,7 +87,7 @@ export default {
       await this.$store.dispatch('management/watch', { type: MANAGEMENT.CLUSTER, registerType: true });
       await this.$store.dispatch('management/watch', { type: CAPI.RANCHER_CLUSTER, registerType: true });
     } else {
-      hash.mgmtClusters = this.value.waitForMgmt();
+      hash.mgmtCluster = this.value.waitForMgmt();
     }
 
     // No need to fetch charts when editing an RKE1 cluster

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

@@ -919,6 +919,10 @@ export default {
       return this.needCredential && !this.credentialId;
     },
 
+    canEditAsYaml() {
+      return !(this.isUpstreamCAPIProvider);
+    },
+
     overallFormValidationPassed() {
       return this.validationPassed &&
             this.fvFormIsValid &&
@@ -1118,7 +1122,6 @@ export default {
 
         this.rkeConfig.etcd.disableSnapshots = disableSnapshots;
       }
-
       // Namespaces if required - this is mainly for custom provisioners via extensions that want
       // to allow creating their resources in a different namespace
       if (this.needsNamespace) {
@@ -1626,7 +1629,7 @@ export default {
       const isIpv6 = this.hasOnlyIpv6Pools;
 
       const flannelMasqInvalid = isIpv6 && isK3s && !flannelMasqEnabled;
-      const stackPrefInvalid = (isIpv6 && stackPreference !== STACK_PREFS.IPV6) || (isDualStack && ![STACK_PREFS.IPV6, STACK_PREFS.DUAL].includes(stackPreference));
+      const stackPrefInvalid = (isIpv6 && stackPreference !== STACK_PREFS.IPV6) || (isDualStack && stackPreference !== STACK_PREFS.DUAL);
 
       const clusterCIDRInvalid = (isIpv6 || isDualStack) && !clusterCIDR.includes(':');
       const serviceCIDRInvalid = (isIpv6 || isDualStack) && !serviceCIDR.includes(':');
@@ -2459,6 +2462,7 @@ export default {
     :done-route="doneRoute"
     :apply-hooks="applyHooks"
     :generate-yaml="generateYaml"
+    :can-yaml="canEditAsYaml"
     class="rke2"
     component-testid="rke2-custom-create"
     @done="done"

package/edit/provisioning.cattle.io.cluster/tabs/etcd/index.vue

@@ -40,7 +40,6 @@ export default {
       type:     Function,
       required: true,
     },
-
   },
 
   computed: {

package/edit/provisioning.cattle.io.cluster/tabs/networking/index.vue

@@ -120,7 +120,7 @@ export default {
 
     stackPreference: {
       get() {
-        return this.localValue.spec?.networking?.stackPreference || STACK_PREFS.IPV4;
+        return this.localValue.spec?.networking?.stackPreference || STACK_PREFS.DUAL;
       },
       set(neu) {
         if (!this.localValue.spec.networking) {
@@ -295,7 +295,7 @@ export default {
       <div class="col span-3">
         <LabeledSelect
           :key="hasSomeIpv6Pools"
-          :value="localValue?.spec?.rkeConfig?.networking?.stackPreference || STACK_PREFS.IPV4"
+          :value="localValue?.spec?.rkeConfig?.networking?.stackPreference || STACK_PREFS.DUAL"
           :mode="mode"
           :options="stackPreferenceOptions"
           data-testid="network-tab-stackpreferences"

package/edit/provisioning.cattle.io.cluster/tabs/registries/index.vue

@@ -1,8 +1,6 @@
 <script>
-import { LabeledInput } from '@components/Form/LabeledInput';
 import { Banner } from '@components/Banner';
-import { Checkbox } from '@components/Form/Checkbox';
-import SelectOrCreateAuthSecret from '@shell/components/form/SelectOrCreateAuthSecret';
+import PrivateRegistry from '@shell/components/form/PrivateRegistry.vue';
 import AdvancedSection from '@shell/components/AdvancedSection.vue';
 import RegistryConfigs from '@shell/edit/provisioning.cattle.io.cluster/tabs/registries/RegistryConfigs';
 import RegistryMirrors from '@shell/edit/provisioning.cattle.io.cluster/tabs/registries/RegistryMirrors';
@@ -10,10 +8,8 @@ import RegistryMirrors from '@shell/edit/provisioning.cattle.io.cluster/tabs/reg
 export default {
   emits:      ['custom-registry-changed', 'registry-host-changed', 'registry-secret-changed', 'input', 'update-configs-changed', 'registry-validation-changed'],
   components: {
-    LabeledInput,
     Banner,
-    Checkbox,
-    SelectOrCreateAuthSecret,
+    PrivateRegistry,
     AdvancedSection,
     RegistryConfigs,
     RegistryMirrors
@@ -65,55 +61,18 @@ export default {
     <div class="row">
       <h3>{{ t('cluster.privateRegistry.label') }}</h3>
     </div>
-    <div class="row">
-      <div class="col span-12">
-        <Banner
-          :closable="false"
-          class="cluster-tools-tip"
-          color="info"
-          label-key="cluster.privateRegistry.description"
-        />
-      </div>
-    </div>
-    <div class="row">
-      <Checkbox
-        :value="showCustomRegistryInput"
-        :mode="mode"
-        :label="t('cluster.privateRegistry.label')"
-        data-testid="registries-enable-checkbox"
-        @update:value="$emit('custom-registry-changed', $event)"
-      />
-    </div>
-    <div
-      v-if="showCustomRegistryInput"
-      class="row mt-20"
-    >
-      <div class="col span-6">
-        <LabeledInput
-          :value="registryHost"
-          :mode="mode"
-          label-key="catalog.chart.registry.custom.inputLabel"
-          placeholder-key="catalog.chart.registry.custom.placeholder"
-          :min-height="30"
-          data-testid="registry-host-input"
-          @update:value="$emit('registry-host-changed', $event)"
-        />
-        <SelectOrCreateAuthSecret
-          :value="registrySecret"
-          :register-before-hook="registerBeforeHook"
-          :hook-priority="1"
-          :mode="mode"
-          in-store="management"
-          :allow-ssh="false"
-          :allow-rke="true"
-          :vertical="true"
-          :namespace="value.metadata.namespace"
-          generate-name="registryconfig-auth-"
-          :cache-secrets="true"
-          @update:value="$emit('registry-secret-changed', $event)"
-        />
-      </div>
-    </div>
+    <PrivateRegistry
+      :value="registryHost"
+      :enabled="showCustomRegistryInput"
+      :mode="mode"
+      :pull-secret="registrySecret"
+      :register-before-hook="registerBeforeHook"
+      checkbox-test-id="registries-enable-checkbox"
+      input-test-id="registry-host-input"
+      @update:value="$emit('registry-host-changed', $event)"
+      @update:enabled="$emit('custom-registry-changed', $event)"
+      @update:pull-secret="$emit('registry-secret-changed', $event)"
+    />
     <div
       class="row"
     >

package/list/management.cattle.io.user.vue

@@ -8,6 +8,8 @@ import ResourceFetch from '@shell/mixins/resource-fetch';
 import { isAdminUser } from '@shell/store/type-map';
 import TableDataUserIcon from '@shell/components/TableDataUserIcon';
 import { RcButton } from '@components/RcButton';
+import { allHash } from '@shell/utils/promise';
+import Loading from '@shell/components/Loading.vue';
 
 export default {
   components: {
@@ -15,7 +17,8 @@ export default {
     ResourceTable,
     Masthead,
     TableDataUserIcon,
-    RcButton
+    RcButton,
+    Loading
   },
   mixins: [ResourceFetch],
   props:  {
@@ -40,9 +43,16 @@ export default {
     }
   },
   async fetch() {
-    await this.$fetchType(this.resource);
+    const promises = {
+      resources:                 this.$fetchType(this.resource),
+      localProviderEnabled:      this.$store.dispatch('auth/getLocalProviderEnabled'),
+      membershipRefreshRequests: this.$store.dispatch('management/create', { type: EXT.GROUP_MEMBERSHIP_REFRESH_REQUESTS }),
+    };
+
+    const res = await allHash(promises);
 
-    this.membershipRefreshRequests = await this.$store.dispatch('management/create', { type: EXT.GROUP_MEMBERSHIP_REFRESH_REQUESTS });
+    this.localProviderEnabled = res.localProviderEnabled;
+    this.membershipRefreshRequests = res.membershipRefreshRequests;
     this.canRefreshMemberships = !!this.membershipRefreshRequests?.canRefreshMemberships;
   },
 
@@ -87,7 +97,14 @@ export default {
 
     isAdmin() {
       return isAdminUser(this.$store.getters);
-    }
+    },
+
+    canCreateUsers() {
+      const userCan = !!this.schema?.collectionMethods?.find((x) => x.toLowerCase() === 'post');
+      const systemCan = this.localProviderEnabled;
+
+      return userCan && systemCan;
+    },
   },
 
   methods: {
@@ -107,13 +124,15 @@ export default {
 </script>
 
 <template>
-  <div>
+  <Loading v-if="$fetchState.pending" />
+  <div v-else>
     <Masthead
       :schema="schema"
       :resource="resource"
       :show-incremental-loading-indicator="incrementalLoadingIndicator"
       :load-resources="loadResources"
       :load-indeterminate="loadIndeterminate"
+      :is-creatable="canCreateUsers"
     >
       <template #extraActions>
         <AsyncButton

package/list/utils/management.cattle.io.cluster.utils.ts

@@ -31,7 +31,7 @@ class ManagementClusterUtils {
     }
 
     const existingFilters = pagination.filters;
-    const requiredFilters = paginationFilterClusters($store, false);
+    const requiredFilters = paginationFilterClusters($store);
 
     for (let i = 0; i < requiredFilters.length; i++) {
       let found = false;