@rancher/shell 0.3.16 → 0.3.18

package/edit/networking.k8s.io.ingress/RulePath.vue

@@ -140,8 +140,6 @@ export default {
     >
       <Select
         v-model="serviceName"
-        option-label="label"
-        option-key="label"
         :options="serviceTargets"
         :status="serviceTargetStatus"
         :taggable="true"

package/edit/persistentvolume/__tests__/persistentvolume.test.ts

@@ -0,0 +1,82 @@
+import { mount } from '@vue/test-utils';
+import PersistentVolume from '@shell/edit/persistentvolume/index';
+import { ExtendedVue, Vue } from 'vue/types/vue';
+
+describe('view: PersistentVolume', () => {
+  it('should list enabled PV storage option if supported', () => {
+    const plugin = {
+      labelKey: 'persistentVolume.csi.label', supported: true, value: 'csi'
+    };
+    const resource = 'PersistentVolume';
+    const wrapper = mount(PersistentVolume as ExtendedVue<Vue, {}, {}, {}, PersistentVolume>, {
+      propsData: { value: { spec: { } } },
+      mocks:     {
+        $store: {
+          dispatch: () => jest.fn(),
+          getters:  {
+            'i18n/t':            jest.fn(),
+            'i18n/exists':       jest.fn(),
+            currentStore:        () => 'cluster',
+            'features/get':      () => jest.fn(),
+            'prefs/get':         () => resource,
+            'cluster/schemaFor': () => {},
+            'cluster/all':       () => [{}],
+          }
+        },
+        $fetchState: {
+          pending: false, error: true, timestamp: Date.now()
+        },
+        $route: {
+          params: { resource },
+          query:  { AS: '' },
+          hash:   '',
+        },
+        $router: {
+          currentRoute: {},
+          replace:      jest.fn(),
+        }
+      },
+      stubs: { LabeledSelect: true }
+    });
+
+    const select = wrapper.find('[data-testid="persistent-volume-plugin-select"]');
+
+    expect((select.vm as unknown as any).options).toStrictEqual(expect.arrayContaining([plugin]));
+  });
+
+  it('should select current plugin', () => {
+    const plugin = 'csi';
+    const resource = 'PersistentVolume';
+    const wrapper = mount(PersistentVolume as ExtendedVue<Vue, {}, {}, {}, PersistentVolume>, {
+      propsData: { value: { spec: { [plugin]: { value: plugin } } } },
+      mocks:     {
+        $store: {
+          dispatch: () => jest.fn(),
+          getters:  {
+            'i18n/t':            jest.fn(),
+            'i18n/exists':       jest.fn(),
+            currentStore:        () => 'cluster',
+            'features/get':      () => jest.fn(),
+            'prefs/get':         () => resource,
+            'cluster/schemaFor': () => {},
+            'cluster/all':       () => [{}],
+          }
+        },
+        $fetchState: {
+          pending: false, error: true, timestamp: Date.now()
+        },
+        $route: {
+          params: { resource },
+          query:  { AS: '' },
+          hash:   '',
+        },
+        $router: {
+          currentRoute: {},
+          replace:      jest.fn(),
+        }
+      }
+    });
+
+    expect(wrapper.vm.plugin).toBe(plugin);
+  });
+});

package/edit/persistentvolume/index.vue

@@ -13,9 +13,9 @@ import NodeAffinity from '@shell/components/form/NodeAffinity';
 import { Checkbox } from '@components/Form/Checkbox';
 import uniq from 'lodash/uniq';
 import UnitInput from '@shell/components/form/UnitInput';
+import { VOLUME_PLUGINS, LONGHORN_PLUGIN } from '@shell/config/persistentVolume';
 import { NODE, PVC, STORAGE_CLASS } from '@shell/config/types';
 import Loading from '@shell/components/Loading';
-import { LONGHORN_PLUGIN, VOLUME_PLUGINS } from '@shell/models/persistentvolume';
 import { _CREATE, _VIEW } from '@shell/config/query-params';
 import { clone } from '@shell/utils/object';
 import InfoBox from '@shell/components/InfoBox';
@@ -258,6 +258,7 @@ export default {
           :label="t('persistentVolume.plugin.label')"
           :localized-label="true"
           option-label="labelKey"
+          data-testid="persistent-volume-plugin-select"
           :options="plugins"
           :mode="modeOverride"
           :required="true"

package/edit/persistentvolume/plugins/csi.vue

@@ -70,7 +70,9 @@ export default {
   },
   methods: {
     selectDriver(e) {
-      set(this.value, 'spec.csi.driver', e.value ? e.value : e.label);
+      const name = e.value || e.label || e;
+
+      set(this.value, 'spec.csi.driver', name);
     }
   }
 };

package/edit/persistentvolume/plugins/longhorn.vue

@@ -3,7 +3,7 @@ import KeyValue from '@shell/components/form/KeyValue';
 import { LabeledInput } from '@components/Form/LabeledInput';
 import { RadioGroup } from '@components/Form/Radio';
 import { _CREATE } from '@shell/config/query-params';
-import { LONGHORN_DRIVER } from '@shell/models/persistentvolume';
+import { LONGHORN_DRIVER } from '@shell/config/types';
 
 export default {
   components: {
@@ -54,20 +54,20 @@ export default {
   <div>
     <div class="row mb-20">
       <div class="col span-6">
-        <LabeledInput
-          v-model="value.spec.csi.fsType"
-          :mode="mode"
-          :label="t('persistentVolume.shared.filesystemType.label')"
-          :placeholder="t('persistentVolume.shared.filesystemType.placeholder')"
+        <LabeledInput
+          v-model="value.spec.csi.fsType"
+          :mode="mode"
+          :label="t('persistentVolume.shared.filesystemType.label')"
+          :placeholder="t('persistentVolume.shared.filesystemType.placeholder')"
         />
       </div>
       <div class="col span-6">
-        <LabeledInput
-          v-model="value.spec.csi.volumeHandle"
-          :mode="mode"
-          :label="t('persistentVolume.longhorn.volumeHandle.label')"
-          :placeholder="t('persistentVolume.longhorn.volumeHandle.placeholder')"
-          :required="true"
+        <LabeledInput
+          v-model="value.spec.csi.volumeHandle"
+          :mode="mode"
+          :label="t('persistentVolume.longhorn.volumeHandle.label')"
+          :placeholder="t('persistentVolume.longhorn.volumeHandle.placeholder')"
+          :required="true"
         />
       </div>
     </div>

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

@@ -9,35 +9,6 @@ import { cleanUp } from '@shell/utils/object';
 import { fetchSetting } from '@shell/utils/settings';
 import { RadioGroup } from '@components/Form/Radio';
 
-export function cleanAgentConfiguration(model, key) {
-  if (!model || !model[key]) {
-    return;
-  }
-
-  const v = model[key];
-
-  if (Array.isArray(v) && v.length === 0) {
-    delete model[key];
-  } else if (v && typeof v === 'object') {
-    Object.keys(v).forEach((k) => {
-      // delete these auxiliary props used in podAffinity and nodeAffinity that shouldn't be sent to the server
-      if (k === '_namespaceOption' || k === '_namespaces' || k === '_anti' || k === '_id') {
-        delete v[k];
-      }
-
-      // prevent cleanup of "namespaceSelector" when an empty object because it represents all namespaces in pod/node affinity
-      // https://kubernetes.io/docs/reference/generated/kubernetes-api/v1.25/#podaffinityterm-v1-core
-      if (k !== 'namespaceSelector') {
-        cleanAgentConfiguration(v, k);
-      }
-    });
-
-    if (Object.keys(v).length === 0) {
-      delete model[key];
-    }
-  }
-}
-
 // Affinity radio button choices
 const DEFAULT = 'default';
 const CUSTOM = 'custom';
@@ -215,7 +186,7 @@ export default {
 </script>
 
 <template>
-  <div v-if="value && Object.keys(value).length">
+  <div>
     <Banner
       :closable="false"
       color="info"

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

@@ -43,14 +43,28 @@ export default {
     const configMap = this.value.spec.rkeConfig?.registries?.configs || {};
     const entries = [];
 
+    const defaultAddValue = {
+      hostname:             '',
+      authConfigSecretName: null,
+      caBundle:             '',
+      insecureSkipVerify:   false,
+      tlsSecretName:        null,
+    };
+
     for ( const hostname in configMap ) {
+      if (configMap[hostname]) {
+        configMap[hostname].insecureSkipVerify = configMap[hostname].insecureSkipVerify ?? defaultAddValue.insecureSkipVerify;
+        configMap[hostname].authConfigSecretName = configMap[hostname].authConfigSecretName ?? defaultAddValue.authConfigSecretName;
+        configMap[hostname].caBundle = configMap[hostname].caBundle ?? defaultAddValue.caBundle;
+        configMap[hostname].tlsSecretName = configMap[hostname].tlsSecretName ?? defaultAddValue.tlsSecretName;
+      }
       entries.push({
         hostname,
         ...configMap[hostname],
       });
     }
 
-    return { entries };
+    return { entries, defaultAddValue };
   },
 
   computed: {
@@ -59,16 +73,6 @@ export default {
         return TYPES.TLS;
       },
     },
-
-    defaultAddValue() {
-      return {
-        hostname:             '',
-        authConfigSecretName: null,
-        caBundle:             '',
-        insecureSkipVerify:   false,
-        tlsSecretName:        null,
-      };
-    },
   },
 
   mounted() {

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

@@ -1,4 +1,4 @@
-import { mount } from '@vue/test-utils';
+import { mount, shallowMount } from '@vue/test-utils';
 import rke2 from '@shell/edit/provisioning.cattle.io.cluster/rke2.vue';
 
 /**
@@ -14,6 +14,7 @@ const defaultStubs = {
   LabeledSelect:            true,
   ACE:                      true,
   AgentEnv:                 true,
+  AgentConfiguration:       true,
   ArrayList:                true,
   ArrayListGrouped:         true,
   BadgeState:               true,
@@ -267,4 +268,81 @@ describe('component: rke2', () => {
 
     expect((wrapper.vm as any).validationPassed).toBe(true);
   });
+
+  // TODO: Complete test after implementing fetch https://github.com/rancher/dashboard/issues/9322
+  // eslint-disable-next-line jest/no-disabled-tests
+  describe.skip('should initialize agent configuration values', () => {
+    it('adding default values if none', async() => {
+      const wrapper = shallowMount(rke2, {
+        propsData: {
+          mode:     'create',
+          value:    { spec: { ...defaultSpec } },
+          provider: 'custom'
+        },
+        computed: defaultComputed,
+        mocks:    {
+          ...defaultMocks,
+          $store: {
+            getters:  defaultGetters,
+            dispatch: {
+              'management/request': jest.fn(),
+              'management/find':    jest.fn(),
+              'management/findAll': () => ([]),
+            }
+          },
+        },
+        stubs: defaultStubs
+      });
+      const defaultAgentConfig = {
+        clusterAgentDeploymentCustomization: {
+          overrideAffinity:             {},
+          appendTolerations:            [],
+          overrideResourceRequirements: {}
+        },
+        fleetAgentDeploymentCustomization: {
+          overrideAffinity:             {},
+          appendTolerations:            [],
+          overrideResourceRequirements: {}
+        }
+      };
+
+      // Setting RKE to avoid calls
+      wrapper.setData({ rke2Versions: [] });
+
+      // await rke2.fetch.call(wrapper.vm);
+
+      expect(wrapper.props().value.spec).toContain(defaultAgentConfig);
+    });
+
+    it('should display agent configuration tab', async() => {
+      const wrapper = shallowMount(rke2, {
+        propsData: {
+          mode:     'create',
+          value:    { spec: { ...defaultSpec } },
+          provider: 'custom'
+        },
+        computed: defaultComputed,
+        mocks:    {
+          ...defaultMocks,
+          $store: {
+            getters:  defaultGetters,
+            dispatch: {
+              'management/request': jest.fn(),
+              'management/find':    jest.fn(),
+              'management/findAll': () => ([]),
+            }
+          },
+        },
+        stubs: defaultStubs
+      });
+      const agent = wrapper.find('[data-testid="rke2-cluster-agent-config"]');
+
+      // Setting RKE to avoid calls
+      wrapper.setData({ rke2Versions: [] });
+
+      await rke2.fetch.call(wrapper.vm);
+
+      expect(agent.element).toBeDefined();
+    });
+  });
 });

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

@@ -17,7 +17,7 @@ import { CATALOG } from '@shell/config/labels-annotations';
 import { CAPI, MANAGEMENT, DEFAULT_WORKSPACE } from '@shell/config/types';
 import { mapFeature, RKE2 as RKE2_FEATURE } from '@shell/store/features';
 import { allHash } from '@shell/utils/promise';
-import { BLANK_CLUSTER } from '@shell/store';
+import { BLANK_CLUSTER } from '@shell/store/store-types.js';
 import { ELEMENTAL_PRODUCT_NAME, ELEMENTAL_CLUSTER_PROVIDER } from '../../config/elemental-types';
 import Rke2Config from './rke2';
 import Import from './import';
@@ -138,6 +138,27 @@ export default {
         this.iconClasses[name] = `machine-driver ${ name }`;
       }
     });
+
+    // Custom Providers from extensions - initialize each with the store and the i18n service
+    // Wrap in try ... catch, to prevent errors in an extension breaking the page
+    try {
+      const extensionClasses = this.$plugin.listDynamic('provisioner').map((name) => this.$plugin.getDynamic('provisioner', name));
+
+      // We can't pass in this.$store as this leads to a circular-reference that causes Vue to freeze,
+      // so pass in specific services that the provisioner extension may need
+      this.extensions = extensionClasses.map((c) => new c({
+        dispatch: this.$store.dispatch,
+        getters:  this.$store.getters,
+        axios:    this.$store.$axios,
+        $plugin:  this.$store.app.$plugin,
+        t:        (...args) => this.t.apply(this, args),
+        isCreate: this.isCreate,
+        isEdit:   this.isEdit,
+        isView:   this.isView,
+      }));
+    } catch (e) {
+      console.error('Error loading provisioner(s) from extensions', e); // eslint-disable-line no-console
+    }
   },
 
   data() {
@@ -148,6 +169,7 @@ export default {
     return {
       nodeDrivers:      [],
       kontainerDrivers: [],
+      extensions:       [],
       subType,
       chart,
       isImport,
@@ -285,6 +307,11 @@ export default {
             addType(id, 'rke2', false);
           });
 
+          // Add from extensions
+          this.extensions.forEach((ext) => {
+            addExtensionType(ext, getters);
+          });
+
           addType('custom', 'custom2', false);
 
           if (isElementalActive) {
@@ -295,6 +322,31 @@ export default {
 
       return out;
 
+      function addExtensionType(ext, getters) {
+        let iconClass = ext.iconClass;
+        let icon = ext.icon;
+
+        if (icon) {
+          iconClass = undefined;
+        } else if (!iconClass) {
+          icon = require('~shell/assets/images/generic-driver.svg');
+        }
+
+        const subtype = {
+          id:          ext.id,
+          label:       ext.label || getters['i18n/t'](`cluster.provider.${ ext.id }`),
+          description: ext.description,
+          icon,
+          iconClass,
+          group:       ext.group || 'rke2',
+          disabled:    ext.disabled || false,
+          link:        ext.link,
+          tag:         ext.tag
+        };
+
+        out.push(subtype);
+      }
+
       function addType(id, group, disabled = false, link = null, iconClass = undefined) {
         const label = getters['i18n/withFallback'](`cluster.provider."${ id }"`, null, id);
         const description = getters['i18n/withFallback'](`cluster.providerDescription."${ id }"`, null, '');