@rancher/shell 3.0.9-rc.5 → 3.0.9

package/components/form/SelectOrCreateAuthSecret.vue

@@ -71,6 +71,11 @@ export default {
       default: 'auth-',
     },
 
+    clientGeneratedName: {
+      type:    String,
+      default: null,
+    },
+
     allowNone: {
       type:    Boolean,
       default: true,
@@ -150,6 +155,42 @@ export default {
       default: false,
     },
 
+    /**
+     * Used specifically to fix the HTTP BASIC auth to generate specific authentication
+     * This is used to clear up the SELECT to make sure it only has HTTP BASIC with some special conditions
+     */
+    fixedHttpBasicAuth: {
+      type:    Boolean,
+      default: false,
+    },
+
+    /** Used together with fixedHttpBasicAuth
+     * It will filter all the cases to use this specific label at the start.
+     */
+    filterBasicAuth: {
+      type:    String,
+      default: '',
+    },
+
+    /**
+     * This works similar to other allow* but this makes specific to create as ImagePullSecret since it is specific for one page that only uses it
+     * To avoid using it in other places.
+     */
+    fixedImagePullSecret: {
+      type:    Boolean,
+      default: false,
+    },
+    /**
+     * Whenever the fixedImagePullSecret is setup the dockerJsonUrlConfig needs to be passed that will be used to create the DockerJsonConfig file
+     */
+    imagePullSecretDockerJsonUrlConfig: {
+      type:    String,
+      default: '',
+    },
+
+    /**
+     * Specific property to change labels if it is Github.com repository
+     */
     isGithubDotComRepository: {
       type:    Boolean,
       default: false,
@@ -157,7 +198,7 @@ export default {
   },
 
   async fetch() {
-    if ( (this.allowSsh || this.allowBasic || this.allowRke) && this.$store.getters[`${ this.inStore }/schemaFor`](SECRET) ) {
+    if ( (this.allowSsh || this.allowBasic || this.allowRke || this.fixedImagePullSecret) && this.$store.getters[`${ this.inStore }/schemaFor`](SECRET) ) {
       if (this.$store.getters[`${ this.inStore }/paginationEnabled`](SECRET)) {
         // Filter results via api (because we shouldn't be fetching them all...)
         this.filteredSecrets = await this.filterSecretsByApi();
@@ -200,6 +241,8 @@ export default {
 
       selected: null,
 
+      previousValue: null,
+
       filterByNamespace: this.namespace && this.limitToNamespace,
 
       publicKey:     '',
@@ -207,10 +250,11 @@ export default {
       sshKnownHosts: '',
       uniqueId:      new Date().getTime(), // Allows form state to be individually tracked if the form is in a list
 
-      SSH:   AUTH_TYPE._SSH,
-      BASIC: AUTH_TYPE._BASIC,
-      S3:    AUTH_TYPE._S3,
-      RKE:   AUTH_TYPE._RKE,
+      SSH:               AUTH_TYPE._SSH,
+      BASIC:             AUTH_TYPE._BASIC,
+      IMAGE_PULL_SECRET: AUTH_TYPE._IMAGE_PULL_SECRET,
+      S3:                AUTH_TYPE._S3,
+      RKE:               AUTH_TYPE._RKE,
     };
   },
 
@@ -218,6 +262,12 @@ export default {
     secretTypes() {
       const types = [];
 
+      if ( this.fixedImagePullSecret ) {
+        types.push(SECRET_TYPES.DOCKER_JSON);
+
+        return types;
+      }
+
       if ( this.allowSsh ) {
         types.push(SECRET_TYPES.SSH);
       }
@@ -325,7 +375,7 @@ export default {
         });
       }
 
-      if (this.allowSsh || this.allowS3 || this.allowBasic || this.allowRke) {
+      if (this.allowSsh || this.allowS3 || this.allowBasic || this.allowRke || this.fixedImagePullSecret) {
         out.unshift({
           label:    'divider',
           disabled: true,
@@ -366,6 +416,18 @@ export default {
         });
       }
 
+      if ( this.fixedImagePullSecret ) {
+        out.unshift({
+          label: this.t('selectOrCreateAuthSecret.createImagePullSecret'),
+          value: AUTH_TYPE._IMAGE_PULL_SECRET,
+          kind:  'highlighted'
+        });
+      }
+
+      if (this.fixedHttpBasicAuth) {
+        out = out.filter((o) => o.label.search(this.filterBasicAuth) === 0 || ['title', 'divider'].includes(o.kind) || o.value === AUTH_TYPE._BASIC);
+      }
+
       return out;
     },
 
@@ -374,7 +436,7 @@ export default {
         return '';
       }
 
-      if ( this.selected === AUTH_TYPE._SSH || this.selected === AUTH_TYPE._BASIC || this.selected === AUTH_TYPE._RKE || this.selected === AUTH_TYPE._S3 ) {
+      if ( this.selected === AUTH_TYPE._SSH || this.selected === AUTH_TYPE._BASIC || this.selected === AUTH_TYPE._RKE || this.selected === AUTH_TYPE._S3 || this.selected === AUTH_TYPE._IMAGE_PULL_SECRET ) {
         return 'col span-4';
       }
 
@@ -395,6 +457,7 @@ export default {
     publicKey:     'updateKeyVal',
     privateKey:    'updateKeyVal',
     sshKnownHosts: 'updateKeyVal',
+    preSelect:     'updateSelectedFromValue',
     value:         'updateSelectedFromValue',
 
     async namespace(ns) {
@@ -478,7 +541,7 @@ export default {
     },
 
     updateKeyVal() {
-      if ( ![AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE].includes(this.selected) ) {
+      if ( ![AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE, AUTH_TYPE._IMAGE_PULL_SECRET].includes(this.selected) ) {
         this.privateKey = '';
         this.publicKey = '';
         this.sshKnownHosts = '';
@@ -498,9 +561,9 @@ export default {
     },
 
     update() {
-      if ( (!this.selected || [AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE, AUTH_TYPE._NONE].includes(this.selected))) {
+      if ( (!this.selected || [AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE, AUTH_TYPE._NONE, AUTH_TYPE._IMAGE_PULL_SECRET].includes(this.selected))) {
         this.$emit('update:value', null);
-      } else if ( this.selected.includes(':') ) {
+      } else if ( this.selected.includes(':')) {
         // Cloud creds
         this.$emit('update:value', this.selected);
       } else {
@@ -522,7 +585,7 @@ export default {
     },
 
     async doCreate() {
-      if ( ![AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE].includes(this.selected) || this.delegateCreateToParent ) {
+      if ( ![AUTH_TYPE._SSH, AUTH_TYPE._BASIC, AUTH_TYPE._S3, AUTH_TYPE._RKE, AUTH_TYPE._IMAGE_PULL_SECRET].includes(this.selected) || this.delegateCreateToParent ) {
         return;
       }
 
@@ -537,12 +600,17 @@ export default {
           },
         });
       } else {
+        const metadata = { namespace: this.namespace };
+
+        if (this.clientGeneratedName) {
+          metadata.name = this.clientGeneratedName;
+        } else {
+          metadata.generateName = this.generateName;
+        }
+
         secret = await this.$store.dispatch(`${ this.inStore }/create`, {
-          type:     SECRET,
-          metadata: {
-            namespace:    this.namespace,
-            generateName: this.generateName
-          },
+          type: SECRET,
+          metadata,
         });
 
         let type, publicField, privateField;
@@ -558,6 +626,11 @@ export default {
           publicField = 'username';
           privateField = 'password';
           break;
+        case AUTH_TYPE._IMAGE_PULL_SECRET:
+          type = SECRET_TYPES.DOCKER_JSON;
+          publicField = 'username';
+          privateField = 'password';
+          break;
         case AUTH_TYPE._RKE:
           type = SECRET_TYPES.RKE_AUTH_CONFIG;
           // Set the 'auth' key to be the base64 of the username and password concatenated with a ':' character
@@ -581,6 +654,22 @@ export default {
           if ((this.selected === AUTH_TYPE._SSH) && this.showSshKnownHosts) {
             secret.data.known_hosts = base64Encode(this.sshKnownHosts || '');
           }
+
+          if (this.selected === AUTH_TYPE._IMAGE_PULL_SECRET && this.imagePullSecretDockerJsonUrlConfig) {
+            const registryHost = this.imagePullSecretDockerJsonUrlConfig ? new URL(this.imagePullSecretDockerJsonUrlConfig).host : '';
+
+            const config = {
+              auths: {
+                [registryHost]: {
+                  [publicField]:  this.publicKey,
+                  [privateField]: this.privateKey,
+                }
+              }
+            };
+            const json = JSON.stringify(config);
+
+            secret.setData('.dockerconfigjson', json);
+          }
         }
       }
 
@@ -609,7 +698,7 @@ export default {
           v-model:value="selected"
           data-testid="auth-secret-select"
           :mode="mode"
-          :label-key="labelKey"
+          :label-key="fixedImagePullSecret ? 'selectOrCreateAuthSecret.imagePullSecret' : labelKey"
           :loading="$fetchState.pending"
           :options="options"
           :selectable="option => !option.disabled"
@@ -645,7 +734,7 @@ export default {
           />
         </div>
       </template>
-      <template v-else-if="selected === BASIC || selected === RKE">
+      <template v-else-if="selected === BASIC || selected === RKE || selected === IMAGE_PULL_SECRET">
         <Banner
           v-if="selected === RKE"
           color="info"

package/components/form/__tests__/NodeScheduling.test.ts

@@ -6,12 +6,17 @@ const requiredSetup = () => {
   return {
     global: {
       mocks: {
-        $store: {
+        $fetchState: { pending: false },
+        $store:      {
           getters: {
-            currentProduct: { inStore: 'cluster' },
-            'i18n/t':       (text: string) => text,
-            t:              (text: string) => text,
-          }
+            currentStore:                () => 'cluster',
+            currentProduct:              { inStore: 'cluster' },
+            'i18n/t':                    (text: string) => text,
+            t:                           (text: string) => text,
+            'cluster/paginationEnabled': () => false,
+            'cluster/all':               () => ['node-0', 'node-1'],
+          },
+          dispatch: jest.fn(),
         }
       },
     }
@@ -21,8 +26,6 @@ const requiredSetup = () => {
 describe('component: NodeScheduling', () => {
   const value = { nodeName: 'node-1' };
 
-  const nodes = ['node-0', 'node-1'];
-
   it.each([
     _VIEW,
     _CREATE,
@@ -32,13 +35,13 @@ describe('component: NodeScheduling', () => {
       NodeScheduling,
       {
         props: {
-          mode, loading: false, value, nodes
+          mode, loading: false, value
         },
         ...requiredSetup(),
       }
     );
 
     expect(wrapper.find('[data-testid="node-scheduling-selectNode"]').exists()).toBeTruthy();
-    expect(wrapper.find('[data-testid="node-scheduling-nodeSelector"]').element.textContent).toContain(value.nodeName);
+    expect(wrapper.find('[data-testid="node-scheduling-nodeSelector"] .vs__selected').text()).toBe(value.nodeName);
   });
 });

package/components/form/__tests__/PodAffinity.test.ts

@@ -3,6 +3,23 @@ import { mount } from '@vue/test-utils';
 import PodAffinity from '@shell/components/form/PodAffinity.vue';
 import { _CREATE } from '@shell/config/query-params';
 
+const requiredSetup = () => {
+  return {
+    global: {
+      mocks: {
+        $store: {
+          getters: {
+            currentStore:        () => 'cluster',
+            'i18n/t':            (text: string) => text,
+            'cluster/schemaFor': jest.fn(),
+            'cluster/canList':   jest.fn(),
+          }
+        }
+      }
+    }
+  };
+};
+
 describe('component: PodAffinity', () => {
   it('should display the weight input when the priority is preferred', () => {
     const podAffinity = {
@@ -15,7 +32,8 @@ describe('component: PodAffinity', () => {
     const wrapper = mount(PodAffinity, {
       props: {
         mode: _CREATE, field: 'overrideAffinity', value: { overrideAffinity: { podAffinity } }
-      }
+      },
+      ...requiredSetup()
     });
 
     expect(wrapper.find('[data-testid="pod-affinity-weight-index0"]').exists()).toBeTruthy();
@@ -33,7 +51,8 @@ describe('component: PodAffinity', () => {
     const wrapper = mount(PodAffinity, {
       props: {
         mode: _CREATE, field: 'overrideAffinity', value: { overrideAffinity: { podAffinity } }
-      }
+      },
+      ...requiredSetup()
     });
 
     const weightInput = wrapper.find('[data-testid="pod-affinity-weight-index0"]');

package/components/form/__tests__/SchedulingCustomization.test.ts

@@ -0,0 +1,240 @@
+import { mount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+import SchedulingCustomization from '@shell/components/form/SchedulingCustomization.vue';
+import { AGENT_CONFIGURATION_TYPES } from '@shell/config/settings';
+import { _CREATE, _EDIT } from '@shell/config/query-params';
+
+const mockStore = { getters: { 'i18n/t': jest.fn().mockImplementation((key: string) => key) } };
+
+const createWrapper = (propsData: any = {}) => {
+  return mount(SchedulingCustomization, {
+    propsData: {
+      type:       AGENT_CONFIGURATION_TYPES.CLUSTER,
+      feature:    true,
+      mode:       _CREATE,
+      defaultPC:  { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+      defaultPDB: { maxUnavailable: 1 },
+      ...propsData
+    },
+    global: {
+      mocks: {
+        $store: mockStore,
+        t:      jest.fn().mockImplementation((key: string) => key)
+      }
+    }
+  });
+};
+
+describe('component: SchedulingCustomization - Agent Type Support', () => {
+  let wrapper: any;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  afterEach(() => {
+    if (wrapper) {
+      wrapper.unmount();
+    }
+  });
+
+  describe('agent Type Prop', () => {
+    it('should accept and use CLUSTER agent type', () => {
+      wrapper = createWrapper({ type: AGENT_CONFIGURATION_TYPES.CLUSTER });
+
+      expect(wrapper.vm.type).toBe(AGENT_CONFIGURATION_TYPES.CLUSTER);
+    });
+
+    it('should accept and use FLEET agent type', () => {
+      wrapper = createWrapper({ type: AGENT_CONFIGURATION_TYPES.FLEET });
+
+      expect(wrapper.vm.type).toBe(AGENT_CONFIGURATION_TYPES.FLEET);
+    });
+
+    it('should emit scheduling-customization-changed event with correct agent type for CLUSTER', async() => {
+      wrapper = createWrapper({ type: AGENT_CONFIGURATION_TYPES.CLUSTER });
+
+      const checkbox = wrapper.findComponent('[data-testid="scheduling-customization-checkbox"]');
+
+      await checkbox.vm.$emit('update:value', true);
+
+      expect(wrapper.emitted('scheduling-customization-changed')).toBeTruthy();
+      expect(wrapper.emitted('scheduling-customization-changed')[0][0]).toStrictEqual({
+        event:     true,
+        agentType: AGENT_CONFIGURATION_TYPES.CLUSTER
+      });
+    });
+
+    it('should emit scheduling-customization-changed event with correct agent type for FLEET', async() => {
+      wrapper = createWrapper({ type: AGENT_CONFIGURATION_TYPES.FLEET });
+
+      const checkbox = wrapper.findComponent('[data-testid="scheduling-customization-checkbox"]');
+
+      await checkbox.vm.$emit('update:value', false);
+
+      expect(wrapper.emitted('scheduling-customization-changed')).toBeTruthy();
+      expect(wrapper.emitted('scheduling-customization-changed')[0][0]).toStrictEqual({
+        event:     false,
+        agentType: AGENT_CONFIGURATION_TYPES.FLEET
+      });
+    });
+  });
+
+  describe('settings Mismatch Detection', () => {
+    it('should detect priority class value mismatch', () => {
+      const value = {
+        priorityClass:       { value: 200, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPC: { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        mode:      _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(true);
+    });
+
+    it('should detect priority class preemption policy mismatch', () => {
+      const value = {
+        priorityClass:       { value: 100, preemptionPolicy: 'Never' },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPC: { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        mode:      _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(true);
+    });
+
+    it('should detect pod disruption budget maxUnavailable mismatch', () => {
+      const value = {
+        priorityClass:       { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { maxUnavailable: 2 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPDB: { maxUnavailable: 1 },
+        mode:       _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(true);
+    });
+
+    it('should detect pod disruption budget minAvailable mismatch', () => {
+      const value = {
+        priorityClass:       { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { minAvailable: 2 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPDB: { minAvailable: 1 },
+        mode:       _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(true);
+    });
+
+    it('should not detect mismatch when values match defaults', () => {
+      const value = {
+        priorityClass:       { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPC:  { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        defaultPDB: { maxUnavailable: 1 },
+        mode:       _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(false);
+    });
+
+    it('should not detect mismatch when no value is provided', () => {
+      wrapper = createWrapper({
+        value: undefined,
+        mode:  _EDIT
+      });
+
+      expect(wrapper.vm.settingMissmatch).toBe(false);
+    });
+  });
+
+  describe('component State', () => {
+    it('should be enabled when value is provided', () => {
+      const value = {
+        priorityClass:       { value: 100 },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({ value });
+
+      expect(wrapper.vm.enabled).toBe(true);
+    });
+
+    it('should be disabled when no value is provided', () => {
+      wrapper = createWrapper({ value: undefined });
+
+      expect(wrapper.vm.enabled).toBe(false);
+    });
+
+    it('should detect edit mode correctly', () => {
+      wrapper = createWrapper({ mode: _EDIT });
+
+      expect(wrapper.vm.isEdit).toBe(true);
+    });
+
+    it('should detect create mode correctly', () => {
+      wrapper = createWrapper({ mode: _CREATE });
+
+      expect(wrapper.vm.isEdit).toBe(false);
+    });
+  });
+
+  describe('banner Display in Edit Mode', () => {
+    it('should show banner when in edit mode and settings mismatch', async() => {
+      const value = {
+        priorityClass:       { value: 200, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPC: { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        mode:      _EDIT,
+        feature:   true
+      });
+
+      await nextTick();
+
+      // The banner should be available in the template when conditions are met
+      expect(wrapper.vm.settingMissmatch).toBe(true);
+      expect(wrapper.vm.isEdit).toBe(true);
+      expect(wrapper.vm.feature).toBe(true);
+    });
+
+    it('should not show banner when not in edit mode', () => {
+      const value = {
+        priorityClass:       { value: 200, preemptionPolicy: 'PreemptLowerPriority' },
+        podDisruptionBudget: { maxUnavailable: 1 }
+      };
+
+      wrapper = createWrapper({
+        value,
+        defaultPC: { value: 100, preemptionPolicy: 'PreemptLowerPriority' },
+        mode:      _CREATE,
+        feature:   true
+      });
+
+      expect(wrapper.vm.isEdit).toBe(false);
+      // Banner should not show because not in edit mode
+    });
+  });
+});

package/components/formatter/ClusterLink.vue

@@ -15,6 +15,10 @@ export default {
     reference: {
       type:    String,
       default: null,
+    },
+    getCustomDetailLink: {
+      type:    Function,
+      default: null
     }
   },
   computed: {
@@ -23,6 +27,10 @@ export default {
         return get(this.row, this.reference);
       }
 
+      if (this.getCustomDetailLink) {
+        return this.getCustomDetailLink(this.row);
+      }
+
       return this.row?.detailLocation;
     },
 

package/components/formatter/SecretOrigin.vue

@@ -0,0 +1,79 @@
+<script>
+import { MANAGEMENT } from '@shell/config/types';
+import { STORE } from '@shell/store/store-types';
+import { mapGetters } from 'vuex';
+
+export default {
+  props: {
+    row: {
+      type:     Object,
+      required: true
+    },
+  },
+  async fetch() {
+    if (this.row.isProjectScoped && this.currentCluster?.isLocal) {
+      const id = this.row.projectScopedClusterId;
+
+      if (id && !this.$store.getters[`${ STORE.MANAGEMENT }/byId`](MANAGEMENT.CLUSTER, id)) {
+        try {
+          await this.$store.dispatch(`${ STORE.MANAGEMENT }/find`, { type: MANAGEMENT.CLUSTER, id });
+        } catch (e) {
+          // Ignore error
+        }
+      }
+    }
+  },
+  computed: {
+    ...mapGetters(['currentCluster']),
+    originText() {
+      if (this.row.isProjectScoped) {
+        return this.t('secret.projectScoped.origin.source');
+      } else if (this.row.isProjectSecretCopy) {
+        return this.t('secret.projectScoped.origin.copy');
+      }
+
+      return '';
+    },
+    tooltip() {
+      if (this.row.isProjectScoped) {
+        const projectName = this.row.project?.nameDisplay || this.row.projectScopedProjectId;
+        const clusterName = this.row.projectCluster?.nameDisplay || this.row.projectScopedClusterId;
+
+        return this.t('secret.projectScoped.tooltip.source', { project: projectName, cluster: clusterName });
+      } else if (this.row.isProjectSecretCopy) {
+        const projectID = this.row.projectScopedProjectId;
+        const clusterId = this.currentCluster?.id;
+
+        // Try to fetch the project.
+        // Note: The management store might not have the project loaded if we haven't visited the cluster list or project list.
+        // However, if we are in the dashboard, we usually have projects loaded.
+        const project = this.$store.getters[`${ STORE.MANAGEMENT }/byId`](MANAGEMENT.PROJECT, `${ clusterId }/${ projectID }`);
+        const projectName = project?.nameDisplay || projectID;
+
+        return this.t('secret.projectScoped.tooltip.copy', { secret: this.row.nameDisplay, project: projectName });
+      }
+
+      return null;
+    }
+  }
+};
+</script>
+
+<template>
+  <div
+    v-if="originText"
+    v-clean-tooltip="tooltip"
+    class="secret-origin"
+  >
+    {{ originText }}
+  </div>
+  <div v-else>
+    —
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.secret-origin {
+  white-space: nowrap;
+}
+</style>