@rancher/shell 3.0.9-rc.2 → 3.0.9-rc.4

package/config/table-headers.js

@@ -1,5 +1,5 @@
 import { CATTLE_PUBLIC_ENDPOINTS, UI_PROJECT_SECRET_COPY } from '@shell/config/labels-annotations';
-import { NODE as NODE_TYPE } from '@shell/config/types';
+import { NODE as NODE_TYPE, NAMESPACE as NAMESPACE_TYPE } from '@shell/config/types';
 import { COLUMN_BREAKPOINTS } from '@shell/types/store/type-map';
 
 // Note: 'id' is always the last sort, so you don't have to specify it here.
@@ -158,12 +158,14 @@ export const NAME_UNLINKED = {
 };
 
 export const NAMESPACE = {
-  name:        'namespace',
-  labelKey:    'tableHeaders.namespace',
-  value:       'namespace',
-  getValue:    (row) => row.namespace,
-  sort:        'namespace',
-  dashIfEmpty: true,
+  name:          'namespace',
+  labelKey:      'tableHeaders.namespace',
+  value:         'namespace',
+  getValue:      (row) => row.namespace,
+  sort:          'namespace',
+  dashIfEmpty:   true,
+  formatter:     'LinkName',
+  formatterOpts: { type: NAMESPACE_TYPE },
 };
 
 export const NODE = {

package/config/types.js

@@ -262,7 +262,10 @@ export const BRAND = {
   RGS:     'rgs',
 };
 
-export const EXT = { USER_ACTIVITY: 'ext.cattle.io.useractivity' };
+export const EXT = {
+  USER_ACTIVITY: 'ext.cattle.io.useractivity',
+  KUBECONFIG:    'ext.cattle.io.kubeconfig',
+};
 
 export const CAPI = {
   CAPI_CLUSTER:         'cluster.x-k8s.io.cluster',

package/detail/management.cattle.io.oidcclient.vue

@@ -7,7 +7,7 @@ import { defineComponent } from 'vue';
 import CopyToClipboardText from '@shell/components/CopyToClipboardText.vue';
 import DateComponent from '@shell/components/formatter/Date.vue';
 import { RcItemCard } from '@components/RcItemCard';
-import ActionMenu from '@shell/components/ActionMenuShell.vue';
+import ActionMenu, { type ActionMenuSelection } from '@shell/components/ActionMenuShell.vue';
 import { Banner } from '@components/Banner';
 
 type SecretActionType = 'create-secret' | 'regen-secret' | 'remove-secret'
@@ -32,7 +32,6 @@ interface SecretManageData {
 const OIDC_SECRETS_NAMESPACE = 'cattle-oidc-client-secrets';
 
 export default defineComponent({
-  emits: ['regenerateSecret', 'removeSecret'],
 
   components: {
     CopyToClipboardText,
@@ -100,6 +99,19 @@ export default defineComponent({
   },
 
   methods: {
+    handleSecretAction(secret: SecretManageData, payload?: ActionMenuSelection) {
+      switch (payload?.action) {
+      case 'regenerateSecret':
+        this.promptSecretsModal(OIDC_CLIENT_SECRET_ACTION.REGEN, secret);
+        break;
+      case 'removeSecret':
+        this.promptSecretsModal(OIDC_CLIENT_SECRET_ACTION.REMOVE, secret);
+        break;
+      default:
+        console.warn(`Unknown secret action: ${ payload?.action }`); // eslint-disable-line no-console
+      }
+    },
+
     promptSecretsModal(actionType: SecretActionType, secret: SecretManageData) {
       this.errors = [];
 
@@ -320,8 +332,7 @@ export default defineComponent({
                 :data-testid="`oidc-client-secret-${i}-action-menu`"
                 :resource="secret"
                 :custom-actions="cardActions"
-                @regenerateSecret="promptSecretsModal(OIDC_CLIENT_SECRET_ACTION.REGEN, secret)"
-                @removeSecret="promptSecretsModal(OIDC_CLIENT_SECRET_ACTION.REMOVE, secret)"
+                @action-invoked="(payload) => handleSecretAction(secret, payload)"
               />
             </template>
           </rc-item-card>

package/edit/__tests__/management.cattle.io.project.test.js

@@ -0,0 +1,137 @@
+import { shallowMount } from '@vue/test-utils';
+import ManagementCattleIoProject from '@shell/edit/management.cattle.io.project.vue';
+import { _EDIT } from '@shell/config/query-params';
+
+const mockStore = {
+  getters: {
+    'management/schemaFor': () => ({}),
+    currentCluster:         () => ({ spec: { kubernetesVersion: 'v1.23.0' } }),
+    isStandaloneHarvester:  () => false,
+    currentProduct:         () => ({ inStore: 'rancher' }),
+    'auth/principalId':     () => 'local://user',
+    'i18n/t':               (key) => key,
+  },
+  dispatch: jest.fn(),
+};
+
+const defaultMountOptions = {
+  props:  { mode: _EDIT },
+  global: { mocks: { $store: mockStore } }
+};
+
+describe('component: ManagementCattleIoProject', () => {
+  it('should remove a standard resource quota correctly', async() => {
+    const value = {
+      spec: {
+        resourceQuota:                 { limit: { limitsCpu: '100m', limitsMemory: '1Gi' } },
+        namespaceDefaultResourceQuota: { limit: { limitsCpu: '50m', limitsMemory: '500Mi' } }
+      },
+      metadata:     { namespace: 'test-ns', annotations: {} },
+      save:         jest.fn(),
+      listLocation: { name: 'list' }
+    };
+
+    const wrapper = shallowMount(
+      ManagementCattleIoProject,
+      {
+        ...defaultMountOptions,
+        props: {
+          ...defaultMountOptions.props,
+          value,
+        },
+      }
+    );
+
+    wrapper.vm.removeQuota('limitsCpu');
+
+    expect(wrapper.vm.value.spec.resourceQuota.limit.limitsCpu).toBeUndefined();
+    expect(wrapper.vm.value.spec.namespaceDefaultResourceQuota.limit.limitsCpu).toBeUndefined();
+    expect(wrapper.vm.value.spec.resourceQuota.limit.limitsMemory).toBe('1Gi'); // Ensure other quotas are not affected
+  });
+
+  it('should remove a custom resource quota with single period in name correctly', async() => {
+    const value = {
+      spec: {
+        resourceQuota:                 { limit: { extended: { test2: '1' } } },
+        namespaceDefaultResourceQuota: { limit: { extended: { test2: '2' } } }
+      },
+      metadata:     { namespace: 'test-ns', annotations: {} },
+      save:         jest.fn(),
+      listLocation: { name: 'list' }
+    };
+
+    const wrapper = shallowMount(
+      ManagementCattleIoProject,
+      {
+        ...defaultMountOptions,
+        props: {
+          ...defaultMountOptions.props,
+          value,
+        },
+      }
+    );
+
+    wrapper.vm.removeQuota(`extended.test2`);
+
+    expect(wrapper.vm.value.spec.resourceQuota.limit.extended).toBeUndefined();
+    expect(wrapper.vm.value.spec.namespaceDefaultResourceQuota.limit.extended).toBeUndefined();
+  });
+
+  it('should remove a custom resource quota with multiple periods in name correctly', async() => {
+    const value = {
+      spec: {
+        resourceQuota:                 { limit: { extended: { 'requests.nvidia.com/gpu': '4' } } },
+        namespaceDefaultResourceQuota: { limit: { extended: { 'requests.nvidia.com/gpu': '2' } } }
+      },
+      metadata:     { namespace: 'test-ns', annotations: {} },
+      save:         jest.fn(),
+      listLocation: { name: 'list' }
+    };
+
+    const wrapper = shallowMount(
+      ManagementCattleIoProject,
+      {
+        ...defaultMountOptions,
+        props: {
+          ...defaultMountOptions.props,
+          value,
+        },
+      }
+    );
+
+    wrapper.vm.removeQuota(`extended.requests.nvidia.com/gpu`);
+
+    expect(wrapper.vm.value.spec.resourceQuota.limit.extended).toBeUndefined();
+    expect(wrapper.vm.value.spec.namespaceDefaultResourceQuota.limit.extended).toBeUndefined();
+  });
+
+  it('should remove one of multiple custom resource quotas correctly', async() => {
+    const value = {
+      spec: {
+        resourceQuota:                 { limit: { extended: { test1: '1', test2: '2' } } },
+        namespaceDefaultResourceQuota: { limit: { extended: { test1: '3', test2: '4' } } }
+      },
+      metadata:     { namespace: 'test-ns', annotations: {} },
+      save:         jest.fn(),
+      listLocation: { name: 'list' }
+    };
+
+    const wrapper = shallowMount(
+      ManagementCattleIoProject,
+      {
+        ...defaultMountOptions,
+        props: {
+          ...defaultMountOptions.props,
+          value,
+        },
+      }
+    );
+
+    wrapper.vm.removeQuota('extended.test1');
+
+    expect(wrapper.vm.value.spec.resourceQuota.limit.extended.test1).toBeUndefined();
+    expect(wrapper.vm.value.spec.resourceQuota.limit.extended.test2).toBe('2');
+    expect(wrapper.vm.value.spec.namespaceDefaultResourceQuota.limit.extended.test1).toBeUndefined();
+    expect(wrapper.vm.value.spec.namespaceDefaultResourceQuota.limit.extended.test2).toBe('4');
+  });
+});

package/edit/management.cattle.io.project.vue

@@ -6,7 +6,7 @@ import FormValidation from '@shell/mixins/form-validation';
 import CruResource from '@shell/components/CruResource';
 import Labels from '@shell/components/form/Labels';
 import ResourceQuota from '@shell/components/form/ResourceQuota/Project';
-import { HARVESTER_TYPES, RANCHER_TYPES } from '@shell/components/form/ResourceQuota/shared';
+import { HARVESTER_TYPES, RANCHER_TYPES, TYPES } from '@shell/components/form/ResourceQuota/shared';
 import Tab from '@shell/components/Tabbed/Tab';
 import Tabbed from '@shell/components/Tabbed';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
@@ -49,6 +49,7 @@ export default {
       HARVESTER_TYPES,
       RANCHER_TYPES,
       fvFormRuleSets:     [{ path: 'spec.displayName', rules: ['required'] }],
+      resourceQuotaKey:   0,
     };
   },
   computed: {
@@ -157,14 +158,42 @@ export default {
     },
 
     removeQuota(key) {
+      const isExtended = key.startsWith(`${ TYPES.EXTENDED }.`);
+      let resourceKey = key;
+
+      if (isExtended) {
+        resourceKey = key.substring(`${ TYPES.EXTENDED }.`.length);
+      }
+
       ['resourceQuota', 'namespaceDefaultResourceQuota'].forEach((specProp) => {
-        if (this.value?.spec[specProp]?.limit && this.value?.spec[specProp]?.limit[key]) {
-          delete this.value?.spec[specProp]?.limit[key];
-        }
-        if (this.value?.spec[specProp]?.usedLimit && this.value?.spec[specProp]?.usedLimit[key]) {
-          delete this.value?.spec[specProp]?.usedLimit[key];
+        const limit = this.value?.spec[specProp]?.limit;
+        const usedLimit = this.value?.spec[specProp]?.usedLimit;
+
+        if (isExtended) {
+          if (limit?.extended && typeof limit.extended[resourceKey] !== 'undefined') {
+            delete limit.extended[resourceKey];
+            if (Object.keys(limit.extended).length === 0) {
+              delete limit.extended;
+            }
+          }
+          if (usedLimit?.extended && typeof usedLimit.extended[resourceKey] !== 'undefined') {
+            delete usedLimit.extended[resourceKey];
+            if (Object.keys(usedLimit.extended).length === 0) {
+              delete usedLimit.extended;
+            }
+          }
+        } else {
+          if (limit && typeof limit[resourceKey] !== 'undefined') {
+            delete limit[resourceKey];
+          }
+          if (usedLimit && typeof usedLimit[resourceKey] !== 'undefined') {
+            delete usedLimit[resourceKey];
+          }
         }
       });
+
+      // Incrementing the key forces the ResourceQuota component to re-render
+      this.resourceQuotaKey++;
     }
   },
 };
@@ -224,6 +253,7 @@ export default {
         :weight="9"
       >
         <ResourceQuota
+          :key="resourceQuotaKey"
           :value="value"
           :mode="canEditTabElements"
           :types="isStandaloneHarvester ? HARVESTER_TYPES : RANCHER_TYPES"

package/edit/monitoring.coreos.com.alertmanagerconfig/index.vue

@@ -177,6 +177,21 @@ export default {
       this.alertmanagerConfigResource.spec.receivers = receiversMinusDeletedItem;
       // After saving the AlertmanagerConfig, the resource has been deleted.
       this.alertmanagerConfigResource.save(...arguments);
+    },
+    handleReceiverAction(payload) {
+      switch (payload?.action) {
+      case 'goToEdit':
+        this.goToEdit();
+        break;
+      case 'goToEditYaml':
+        this.goToEditYaml();
+        break;
+      case 'promptRemove':
+        this.promptRemove();
+        break;
+      default:
+        console.warn(`Unknown receiver action: ${ payload?.action }`); // eslint-disable-line no-console
+      }
     }
   }
 };
@@ -263,9 +278,7 @@ export default {
       :custom-target-element="actionMenuTargetElement"
       :custom-target-event="actionMenuTargetEvent"
       @close="receiverActionMenuIsOpen = false"
-      @goToEdit="goToEdit"
-      @goToEditYaml="goToEditYaml"
-      @promptRemove="promptRemove"
+      @action-invoked="handleReceiverAction"
     />
   </CruResource>
 </template>

package/edit/provisioning.cattle.io.cluster/defaults.ts

@@ -0,0 +1 @@
+export const RETENTION_DEFAULT = 5;

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

@@ -66,6 +66,7 @@ import { DEFAULT_COMMON_BASE_PATH, DEFAULT_SUBDIRS } from '@shell/edit/provision
 import ClusterAppearance from '@shell/components/form/ClusterAppearance';
 import AddOnAdditionalManifest from '@shell/edit/provisioning.cattle.io.cluster/tabs/AddOnAdditionalManifest';
 import VsphereUtils, { VMWARE_VSPHERE } from '@shell/utils/v-sphere';
+import { RETENTION_DEFAULT } from '@shell/edit/provisioning.cattle.io.cluster/defaults';
 import { mapGetters } from 'vuex';
 const HARVESTER = 'harvester';
 const GOOGLE = 'google';
@@ -1061,7 +1062,7 @@ export default {
         this.rkeConfig.etcd = {
           disableSnapshots:     false,
           s3:                   null,
-          snapshotRetention:    5,
+          snapshotRetention:    RETENTION_DEFAULT,
           snapshotScheduleCron: '0 */5 * * *',
         };
       } else if (typeof this.rkeConfig.etcd.disableSnapshots === 'undefined') {

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

@@ -4,6 +4,10 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import SelectOrCreateAuthSecret from '@shell/components/form/SelectOrCreateAuthSecret';
 import { NORMAN } from '@shell/config/types';
 import FormValidation from '@shell/mixins/form-validation';
+import UnitInput from '@shell/components/form/UnitInput';
+import RadioGroup from '@components/Form/Radio/RadioGroup.vue';
+import { _CREATE } from '@shell/config/query-params';
+import { RETENTION_DEFAULT } from '@shell/edit/provisioning.cattle.io.cluster/defaults';
 
 export default {
   emits: ['update:value', 'validationChanged'],
@@ -12,6 +16,8 @@ export default {
     LabeledInput,
     Checkbox,
     SelectOrCreateAuthSecret,
+    UnitInput,
+    RadioGroup
   },
   mixins: [FormValidation],
 
@@ -35,6 +41,10 @@ export default {
       type:     Function,
       required: true,
     },
+    localRetentionCount: {
+      type:    Number,
+      default: null,
+    }
   },
 
   data() {
@@ -47,9 +57,11 @@ export default {
         folder:              '',
         region:              '',
         skipSSLVerify:       false,
+        retention:           null,
         ...(this.value || {}),
       },
-      fvFormRuleSets: [
+      differentRetention: false,
+      fvFormRuleSets:     [
         {
           path: 'endpoint', rootObject: this.config, rules: ['awsStyleEndpoint']
         },
@@ -59,6 +71,9 @@ export default {
       ]
     };
   },
+  mounted() {
+    this.differentRetention = !(this.mode === _CREATE || this.value?.retention === this.localRetentionCount);
+  },
 
   computed: {
 
@@ -73,10 +88,25 @@ export default {
 
       return {};
     },
+
+    localCountToUse() {
+      return this.localRetentionCount === null || this.localRetentionCount === undefined ? RETENTION_DEFAULT : this.localRetentionCount;
+    },
+    retentionOptionsOptions() {
+      return [
+        { label: this.t('cluster.rke2.etcd.s3config.snapshotRetention.options.localDefined', { count: this.localCountToUse }), value: false }, { label: this.t('cluster.rke2.etcd.s3config.snapshotRetention.options.manual'), value: true }
+      ];
+    }
   },
   watch: {
     fvFormIsValid(newValue) {
       this.$emit('validationChanged', !!newValue);
+    },
+    localRetentionCount(neu) {
+      if (!this.differentRetention) {
+        this.config.retention = this.localCountToUse;
+        this.update();
+      }
     }
   },
 
@@ -86,6 +116,10 @@ export default {
 
       this.$emit('update:value', out);
     },
+    resetRetention() {
+      this.config.retention = this.localCountToUse;
+      this.update();
+    }
   },
 };
 </script>
@@ -150,7 +184,6 @@ export default {
         />
       </div>
     </div>
-
     <div
       v-if="!ccData.defaultSkipSSLVerify"
       class="mt-20"
@@ -172,5 +205,27 @@ export default {
         @update:value="update"
       />
     </div>
+    <div class="row mt-20">
+      <div class="col span-6">
+        <h4>{{ t('cluster.rke2.etcd.s3config.snapshotRetention.title') }}</h4>
+        <RadioGroup
+          v-model:value="differentRetention"
+          name="s3config-retention"
+          :mode="mode"
+          :options="retentionOptionsOptions"
+          :row="true"
+          @update:value="resetRetention"
+        />
+        <UnitInput
+          v-if="differentRetention"
+          v-model:value="config.retention"
+          :label="t('cluster.rke2.etcd.s3config.snapshotRetention.label')"
+          :mode="mode"
+          :suffix="t('cluster.rke2.snapshots.s3Suffix')"
+          class="mt-10"
+          @update:value="update"
+        />
+      </div>
+    </div>
   </div>
 </template>

package/edit/provisioning.cattle.io.cluster/tabs/etcd/__tests__/S3Config.test.ts

@@ -0,0 +1,109 @@
+import { shallowMount } from '@vue/test-utils';
+import S3Config from '@shell/edit/provisioning.cattle.io.cluster/tabs/etcd/S3Config.vue';
+
+describe('s3Config', () => {
+  const defaultProps = {
+    mode:                'create',
+    namespace:           'test-ns',
+    registerBeforeHook:  jest.fn(),
+    localRetentionCount: 5,
+    value:               {}
+  };
+
+  const mockStore = { getters: { 'rancher/byId': jest.fn() } };
+
+  const createWrapper = (props = {}) => {
+    return shallowMount(S3Config, {
+      propsData: {
+        ...defaultProps,
+        ...props
+      },
+      mocks: {
+        $store: mockStore,
+        t:      (key) => key,
+      },
+      stubs: {
+        LabeledInput:             true,
+        Checkbox:                 true,
+        SelectOrCreateAuthSecret: true,
+        UnitInput:                true,
+        RadioGroup:               true,
+      }
+    });
+  };
+
+  it('renders correctly', () => {
+    const wrapper = createWrapper();
+
+    expect(wrapper.exists()).toBe(true);
+  });
+
+  it('initializes config with default values', () => {
+    const wrapper = createWrapper();
+
+    expect(wrapper.vm.config.bucket).toBe('');
+    expect(wrapper.vm.config.skipSSLVerify).toBe(false);
+  });
+
+  it('initializes config with provided value prop', () => {
+    const value = {
+      bucket:    'test',
+      region:    'us-east-1',
+      retention: 2
+    };
+    const wrapper = createWrapper({ value });
+
+    expect(wrapper.vm.config.bucket).toBe('test');
+    expect(wrapper.vm.config.region).toBe('us-east-1');
+    expect(wrapper.vm.config.retention).toBe(2);
+  });
+
+  describe('retention Logic', () => {
+    it('computes localCountToUse correctly', () => {
+      const wrapper = createWrapper({ localRetentionCount: 3 });
+
+      expect(wrapper.vm.localCountToUse).toBe(3);
+    });
+
+    it('uses default retention if localRetentionCount is null', () => {
+      const wrapper = createWrapper({ localRetentionCount: null });
+
+      expect(wrapper.vm.localCountToUse).toBe(5);
+    });
+
+    it('sets differentRetention to false in create mode', () => {
+      const wrapper = createWrapper({ mode: 'create' });
+
+      expect(wrapper.vm.differentRetention).toBe(false);
+    });
+
+    it('sets differentRetention to false in edit mode if retention matches', () => {
+      const wrapper = createWrapper({
+        mode:                'edit',
+        value:               { retention: 5 },
+        localRetentionCount: 5
+      });
+
+      expect(wrapper.vm.differentRetention).toBe(false);
+    });
+
+    it('sets differentRetention to true in edit mode if retention differs', () => {
+      const wrapper = createWrapper({
+        mode:                'edit',
+        value:               { retention: 2 },
+        localRetentionCount: 5
+      });
+
+      expect(wrapper.vm.differentRetention).toBe(true);
+    });
+
+    it('updates retention when localRetentionCount changes and differentRetention is false', async() => {
+      const wrapper = createWrapper({ localRetentionCount: 5 });
+
+      // differentRetention is false by default in create mode
+      await wrapper.setProps({ localRetentionCount: 10 });
+      expect(wrapper.vm.config.retention).toBe(10);
+      expect(wrapper.emitted('update:value')).toBeTruthy();
+    });
+  });
+});

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

@@ -124,6 +124,7 @@ export default {
       <S3Config
         v-if="s3Backup"
         v-model:value="etcd.s3"
+        :local-retention-count="etcd.snapshotRetention"
         :namespace="value.metadata.namespace"
         :register-before-hook="registerBeforeHook"
         :mode="mode"

package/initialize/install-plugins.js

@@ -1,7 +1,6 @@
 import PortalVue from 'portal-vue';
 import Vue3Resize from 'vue3-resize';
 import FloatingVue from 'floating-vue';
-import vSelect from 'vue-select';
 import 'vue3-resize/dist/vue3-resize.css';
 
 // import '@shell/plugins/extend-router';
@@ -43,7 +42,6 @@ export async function installPlugins(vueApp) {
       preventContainer: ['#modal-container-element']
     });
   vueApp.use(InstallCodeMirror);
-  vueApp.component('v-select', vSelect);
 }
 
 export async function installInjectedPlugins(app, vueApp) {