@rancher/shell 0.3.27 → 0.3.29

package/rancher-components/components/StringList/StringList.test.ts

@@ -398,6 +398,276 @@ describe('stringList.vue', () => {
     });
   });
 
+  describe('bulk delimiter', () => {
+    const delimiter = /;/;
+
+    describe('add', () => {
+      const items: string[] = [];
+
+      beforeEach(() => {
+        wrapper = mount(StringList, {
+          propsData: {
+            items,
+            bulkAdditionDelimiter: delimiter,
+            errorMessages:         { duplicate: 'error, item is duplicate.' },
+          }
+        });
+      });
+
+      it('should split values if delimiter set', async() => {
+        const value = 'test;test1;test2';
+        const result = ['test', 'test1', 'test2'];
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should show warning if one of the values is a duplicate', async() => {
+        const value = 'test;test1;test2';
+
+        await wrapper.setProps({ items: ['test1'] });
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const isDuplicate = (wrapper.emitted('errors') || [])[0][0].duplicate;
+
+        expect(isDuplicate).toBe(true);
+      });
+
+      it('should show a warning if the new values are all duplicates', async() => {
+        const value = 'test;test';
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const isDuplicate = (wrapper.emitted('errors') || [])[0][0].duplicate;
+
+        expect(isDuplicate).toBe(true);
+      });
+
+      it('should not consider empty strings at the beginning', async() => {
+        const value = ';test;test1;test2';
+        const result = ['test', 'test1', 'test2'];
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should not consider empty strings in the middle', async() => {
+        const value = 'test;test1;;test2';
+        const result = ['test', 'test1', 'test2'];
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should not consider empty strings at the end', async() => {
+        const value = 'test;test1;test2;';
+        const result = ['test', 'test1', 'test2'];
+
+        // activate create mode
+        await wrapper.setData({ isCreateItem: true });
+        const inputField = wrapper.find('[data-testid="item-create"]');
+
+        await inputField.setValue(value);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+    });
+
+    describe('edit', () => {
+      const items = ['test1', 'test2'];
+
+      beforeEach(() => {
+        wrapper = mount(StringList, {
+          propsData: {
+            items,
+            bulkAdditionDelimiter: delimiter,
+            errorMessages:         { duplicate: 'error, item is duplicate.' },
+          }
+        });
+      });
+
+      it('should split values if delimiter set', async() => {
+        const newValue = 'test1;new;values';
+        const result = ['test1', 'new', 'values', 'test2'];
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should show warning if one of the values is a duplicate', async() => {
+        const newValue = 'test1;test2';
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const isDuplicate = (wrapper.emitted('errors') || [])[0][0].duplicate;
+
+        expect(isDuplicate).toBe(true);
+      });
+
+      it('should show a warning if the new values are all duplicates', async() => {
+        const newValue = 'test;test';
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const isDuplicate = (wrapper.emitted('errors') || [])[0][0].duplicate;
+
+        expect(isDuplicate).toBe(true);
+      });
+
+      it('should not consider empty strings at the beginning', async() => {
+        const newValue = ';test1;new;value';
+        const result = ['test1', 'new', 'value', 'test2'];
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should not consider empty strings in the middle 1', async() => {
+        const newValue = 'test1; ;new;value';
+        const result = ['test1', 'new', 'value', 'test2'];
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should not consider empty strings in the middle 2', async() => {
+        const newValue = 'test1;;new;value';
+        const result = ['test1', 'new', 'value', 'test2'];
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+
+      it('should not consider empty strings at the end', async() => {
+        const newValue = 'test1;new;value;';
+        const result = ['test1', 'new', 'value', 'test2'];
+
+        await wrapper.setData({ editedItem: items[0] });
+        const inputField = wrapper.find('[data-testid^="item-edit"]');
+
+        await inputField.setValue(newValue);
+
+        // press enter
+        await inputField.trigger('keydown.enter');
+        await wrapper.vm.$nextTick();
+
+        const itemsResult = (wrapper.emitted('change') || [])[0][0];
+
+        expect(JSON.stringify(itemsResult)).toBe(JSON.stringify(result));
+      });
+    });
+  });
+
   describe('errors handling', () => {
     it('show duplicate warning icon when errorMessages is defined', async() => {
       const items = ['test'];

package/rancher-components/components/StringList/StringList.vue

@@ -82,6 +82,13 @@ export default Vue.extend({
         return {} as ErrorMessages;
       },
     },
+    /**
+     * Enables bulk addition and defines the delimiter to split the input string.
+     */
+    bulkAdditionDelimiter: {
+      type:    RegExp,
+      default: null,
+    }
   },
   data() {
     return {
@@ -125,13 +132,9 @@ export default Vue.extend({
   },
 
   methods: {
-    onChange(value: string) {
+    onChange(value: string, index?: number) {
       this.value = value;
-
-      const items = [
-        ...this.items,
-        this.value
-      ];
+      const items = this.addValueToItems(this.items, value, index);
 
       this.toggleError(
         'duplicate',
@@ -321,10 +324,7 @@ export default Vue.extend({
       const value = this.value?.trim();
 
       if (value) {
-        const items = [
-          ...this.items,
-          value,
-        ];
+        const items = this.addValueToItems(this.items, value);
 
         if (!hasDuplicatedStrings(items, this.caseSensitive)) {
           this.updateItems(items);
@@ -343,12 +343,8 @@ export default Vue.extend({
       const value = this.value?.trim();
 
       if (value) {
-        const items = [...this.items];
-        const index = findStringIndex(items, item, false);
-
-        if (index !== -1) {
-          items[index] = value;
-        }
+        const index = findStringIndex(this.items, item, false);
+        const items = index !== -1 ? this.addValueToItems(this.items, value, index) : this.items;
 
         if (!hasDuplicatedStrings(items, this.caseSensitive)) {
           this.updateItems(items);
@@ -360,6 +356,49 @@ export default Vue.extend({
       }
     },
 
+    /**
+     * Add a new or update an exiting item in the items list.
+     *
+     * @param items The current items list.
+     * @param value The new value to be added.
+     * @param index The list index of the item to be updated (optional).
+     * @returns Updated items list.
+     */
+    addValueToItems(items: string[], value: string, index?: number): string[] {
+      const updatedItems = [...items];
+
+      // Add new item
+      if (index === undefined) {
+        if (this.bulkAdditionDelimiter && value.search(this.bulkAdditionDelimiter) >= 0) {
+          updatedItems.push(...this.splitBulkValue(value));
+        } else {
+          updatedItems.push(value);
+        }
+      } else { // Update existing item
+        if (this.bulkAdditionDelimiter && value.search(this.bulkAdditionDelimiter) >= 0) {
+          updatedItems.splice(index, 1, ...this.splitBulkValue(value));
+        } else {
+          updatedItems[index] = value;
+        }
+      }
+
+      return updatedItems;
+    },
+
+    /**
+     * Split the value by the defined delimiter and remove empty strings.
+     *
+     * @param value The value to be split.
+     * @returns Array containing split values.
+     */
+    splitBulkValue(value: string): string[] {
+      return value
+        .split(this.bulkAdditionDelimiter)
+        .filter((item) => {
+          return item.trim().length > 0;
+        });
+    },
+
     /**
      * Remove an item from items list
      */
@@ -393,7 +432,7 @@ export default Vue.extend({
       @dblclick="onClickEmptyBody()"
     >
       <div
-        v-for="item in items"
+        v-for="(item, index) in items"
         :key="item"
         :ref="item"
         :class="{
@@ -421,7 +460,7 @@ export default Vue.extend({
           :data-testid="`item-edit-${item}`"
           class="edit-input static"
           :value="value != null ? value : item"
-          @input="onChange($event)"
+          @input="onChange($event, index)"
           @blur.prevent="updateItem(item)"
           @keydown.native.enter="updateItem(item, !errors.duplicate)"
         />

package/store/prefs.js

@@ -112,9 +112,6 @@ export const _RKE1 = 'rke1';
 export const _RKE2 = 'rke2';
 export const PROVISIONER = create('provisioner', _RKE2, { options: [_RKE1, _RKE2] });
 
-// Promo for Pod Security Policies (PSPs) being deprecated on kube version 1.25 on Cluster Dashboard page
-export const PSP_DEPRECATION_BANNER = create('hide-psp-deprecation-banner', false, { parseJSON });
-
 // Maximum number of clusters to show in the slide-in menu
 export const MENU_MAX_CLUSTERS = 10;
 // Prompt for confirm when scaling down node pool in GUI and save the pref

package/types/shell/index.d.ts

@@ -1765,8 +1765,6 @@ export const NODE: "node";
 export const NETWORK_POLICY: "networking.k8s.io.networkpolicy";
 export const POD: "pod";
 export const POD_DISRUPTION_BUDGET: "policy.poddisruptionbudget";
-export const PSP: "policy.podsecuritypolicy";
-export const PSPS: "policy.podsecuritypolicies";
 export const PV: "persistentvolume";
 export const PVC: "persistentvolumeclaim";
 export const RESOURCE_QUOTA: "resourcequota";
@@ -1884,8 +1882,6 @@ export namespace MANAGEMENT {
     export { GLOBAL_ROLE_1 as GLOBAL_ROLE };
     const GLOBAL_ROLE_BINDING_1: string;
     export { GLOBAL_ROLE_BINDING_1 as GLOBAL_ROLE_BINDING };
-    export const POD_SECURITY_POLICY_TEMPLATE: string;
-    export const PSP_TEMPLATE_BINDING: string;
     export const PSA: string;
     export const MANAGED_CHART: string;
     export const USER_NOTIFICATION: string;
@@ -2869,7 +2865,6 @@ export const PLUGIN_DEVELOPER: any;
 export const _RKE1: "rke1";
 export const _RKE2: "rke2";
 export const PROVISIONER: any;
-export const PSP_DEPRECATION_BANNER: any;
 export const MENU_MAX_CLUSTERS: 10;
 export const SCALE_POOL_PROMPT: any;
 export function state(): {
@@ -3301,7 +3296,6 @@ declare namespace _default {
     export { cronSchedule };
     export { podAffinity };
     export { roleTemplateRules };
-    export { isHttps };
 }
 export default _default;
 }
@@ -3361,8 +3355,17 @@ declare module '@shell/utils/error' {
 export function stringify(err: any): any;
 export function exceptionToErrorsArray(err: any): any;
 export class ClusterNotFoundError extends Error {
+    static name: string;
     constructor(message: any);
 }
+/**
+ * An error occurred and the user should be redirected to a certain location (where this is handled)
+ */
+export class RedirectToError extends Error {
+    static name: string;
+    constructor(message: any, url: any);
+    url: any;
+}
 export class ApiError extends Error {
     constructor(res: any);
     status: any;
@@ -4173,7 +4176,10 @@ export function externalName(spec: any, getters: any, errors: any, validatorArgs
 // @shell/utils/validators/setting
 
 declare module '@shell/utils/validators/setting' {
-export function isHttps(value: any, getters: any, errors: any, validatorArgs: any, displayKey: any): any;
+export function isServerUrl(value: any): boolean;
+export function isHttps(value: any): any;
+export function isLocalhost(value: any): boolean;
+export function hasTrailingForwardSlash(value: any): any;
 }
 
 // @shell/utils/version

package/utils/custom-validators.js

@@ -8,7 +8,6 @@ import { cronSchedule } from '@shell/utils/validators/cron-schedule';
 import { podAffinity } from '@shell/utils/validators/pod-affinity';
 import { roleTemplateRules } from '@shell/utils/validators/role-template';
 import { clusterName } from '@shell/utils/validators/cluster-name';
-import { isHttps } from '@shell/utils/validators/setting';
 
 /**
 * Custom validation functions beyond normal scalr types
@@ -30,5 +29,4 @@ export default {
   cronSchedule,
   podAffinity,
   roleTemplateRules,
-  isHttps,
 };

package/utils/error.js

@@ -1,9 +1,24 @@
 import { isArray } from '@shell/utils/array';
 
 export class ClusterNotFoundError extends Error {
+  static name = 'ClusterNotFoundError'
+
   constructor(message) {
     super(message);
-    this.name = 'ClusterNotFoundError';
+    this.name = ClusterNotFoundError.name;
+  }
+}
+
+/**
+ * An error occurred and the user should be redirected to a certain location (where this is handled)
+ */
+export class RedirectToError extends Error {
+  static name = 'RedirectToError'
+
+  constructor(message, url) {
+    super(message);
+    this.url = url;
+    this.name = RedirectToError.name;
   }
 }
 

package/utils/validators/formRules/__tests__/index.test.ts

@@ -43,21 +43,66 @@ describe('formRules', () => {
     expect(formRuleResult).toStrictEqual(expectedResult);
   });
 
-  it('"isHttps" : returns undefined when valid https url value is supplied', () => {
+  it('"https" : returns undefined when valid https url value is supplied', () => {
     const testValue = 'https://url.com';
-    const formRuleResult = formRules.isHttps('server-url')(testValue);
+    const formRuleResult = formRules.https(testValue);
 
     expect(formRuleResult).toBeUndefined();
   });
 
-  it('"isHttps" : returns correct message when http url value is supplied', () => {
+  it('"https" : returns correct message when http url value is supplied', () => {
     const testValue = 'http://url.com';
-    const formRuleResult = formRules.isHttps('server-url')(testValue);
+    const formRuleResult = formRules.https(testValue);
     const expectedResult = JSON.stringify({ message: 'validation.setting.serverUrl.https' });
 
     expect(formRuleResult).toStrictEqual(expectedResult);
   });
 
+  describe('localhost', () => {
+    const message = JSON.stringify({ message: 'validation.setting.serverUrl.localhost' });
+    const testCases = [
+      ['http://LOCALhosT:8005', message],
+      ['http://localhost:8005', message],
+      ['https://localhost:8005', message],
+      ['localhost', message],
+      ['http://127.0.0.1', message],
+      ['https://127.0.0.1', message],
+      ['127.0.0.1', message],
+      ['https://test.com', undefined],
+      ['https://test.com/localhost', undefined],
+      [undefined, undefined]
+    ];
+
+    it.each(testCases)(
+      'should return undefined or correct message based on the provided url',
+      (url, expected) => {
+        const formRuleResult = formRules.localhost(url);
+
+        expect(formRuleResult).toStrictEqual(expected);
+      }
+    );
+  });
+
+  describe('trailingForwardSlash', () => {
+    const message = JSON.stringify({ message: 'validation.setting.serverUrl.trailingForwardSlash' });
+    const testCases = [
+      ['https://test.com', undefined],
+      ['https://test.com/', message],
+      ['https://', undefined],
+      ['/', undefined],
+      [undefined, undefined]
+    ];
+
+    it.each(testCases)(
+      'should return undefined or correct message based on the provided url',
+      (url, expected) => {
+        const formRuleResult = formRules.trailingForwardSlash(url);
+
+        expect(formRuleResult).toStrictEqual(expected);
+      }
+    );
+  });
+
   it('"interval" : returns undefined when valid hour interval value is supplied', () => {
     const testValue = '5h';
     const formRuleResult = formRules.interval(testValue);

package/utils/validators/formRules/index.ts

@@ -2,9 +2,11 @@ import { RBAC } from '@shell/config/types';
 import { HCI } from '@shell/config/labels-annotations';
 import isEmpty from 'lodash/isEmpty';
 import has from 'lodash/has';
+import isUrl from 'is-url';
 // import uniq from 'lodash/uniq';
 import cronstrue from 'cronstrue';
 import { Translation } from '@shell/types/t';
+import { isHttps, isLocalhost, hasTrailingForwardSlash } from '@shell/utils/validators/setting';
 
 // import uniq from 'lodash/uniq';
 export type Validator<T = undefined | string> = (val: any, arg?: any) => T;
@@ -34,10 +36,6 @@ export class Port {
   }
 }
 
-const httpsKeys = [
-  'server-url'
-];
-
 const runValidators = (val: any, validators: Validator[]) => {
   for (const validator of validators) {
     const message = validator(val);
@@ -139,11 +137,13 @@ export default function(t: Translation, { key = 'Value' }: ValidationOptions): {
     }
   };
 
-  const isHttps: ValidatorFactory = (key: string) => {
-    const isHttps: Validator = (val: string) => httpsKeys.includes(key) && !val.toLowerCase().startsWith('https://') ? t('validation.setting.serverUrl.https') : undefined;
+  const https: Validator = (val: string) => val && !isHttps(val) ? t('validation.setting.serverUrl.https') : undefined;
 
-    return isHttps;
-  };
+  const localhost: Validator = (val: string) => isLocalhost(val) ? t('validation.setting.serverUrl.localhost') : undefined;
+
+  const trailingForwardSlash: Validator = (val: string) => hasTrailingForwardSlash(val) ? t('validation.setting.serverUrl.trailingForwardSlash') : undefined;
+
+  const url: Validator = (val: string) => val && !isUrl(val) ? t('validation.setting.serverUrl.url') : undefined;
 
   const interval: Validator = (val: string) => !/^\d+[hms]$/.test(val) ? t('validation.monitoring.route.interval', { key }) : undefined;
 
@@ -475,7 +475,10 @@ export default function(t: Translation, { key = 'Value' }: ValidationOptions): {
     hostname,
     imageUrl,
     interval,
-    isHttps,
+    https,
+    localhost,
+    trailingForwardSlash,
+    url,
     matching,
     maxLength,
     maxValue,

package/utils/validators/setting.js

@@ -1,13 +1,9 @@
-const httpsKeys = [
-  'server-url'
-];
+import isUrl from 'is-url';
 
-export function isHttps(value, getters, errors, validatorArgs, displayKey) {
-  const key = validatorArgs[0];
+export const isServerUrl = (value) => value === 'server-url';
 
-  if (httpsKeys.includes(key) && !value.toLowerCase().startsWith('https://')) {
-    errors.push(getters['i18n/t']('validation.setting.serverUrl.https'));
-  }
+export const isHttps = (value) => value.toLowerCase().startsWith('https://');
 
-  return errors;
-}
+export const isLocalhost = (value) => (/^(?:https?:\/\/)?(?:localhost|127\.0\.0\.1)/i).test(value);
+
+export const hasTrailingForwardSlash = (value) => isUrl(value) && value?.toLowerCase().endsWith('/');