@rancher/shell 3.0.3 → 3.0.5-rc.1

package/rancher-components/RcDropdown/useDropdownCollection.ts

@@ -10,6 +10,7 @@ export const useDropdownCollection = () => {
   const dropdownItems = ref<Element[]>([]);
   const dropdownContainer = ref<HTMLElement | null>(null);
   const firstDropdownItem = ref<HTMLElement | null>(null);
+  const lastDropdownItem = ref<HTMLElement | null>(null);
 
   /**
    * Registers the dropdown container and initializes dropdown items.
@@ -22,6 +23,12 @@ export const useDropdownCollection = () => {
       if (dropdownItems.value[0] instanceof HTMLElement) {
         firstDropdownItem.value = dropdownItems.value[0];
       }
+
+      const lastItem = dropdownItems.value[dropdownItems.value.length - 1];
+
+      if (lastItem instanceof HTMLElement) {
+        lastDropdownItem.value = lastItem;
+      }
     }
   };
 
@@ -40,6 +47,7 @@ export const useDropdownCollection = () => {
   return {
     dropdownItems,
     firstDropdownItem,
+    lastDropdownItem,
     dropdownContainer,
     registerDropdownCollection,
   };

package/rancher-components/RcDropdown/useDropdownContext.ts

@@ -17,6 +17,7 @@ export const useDropdownContext = (emit: typeof rcDropdownEmits) => {
   const {
     dropdownItems,
     firstDropdownItem,
+    lastDropdownItem,
     dropdownContainer,
     registerDropdownCollection,
   } = useDropdownCollection();
@@ -70,7 +71,7 @@ export const useDropdownContext = (emit: typeof rcDropdownEmits) => {
   /**
    * Sets focus to the first dropdown item if a keydown event has occurred.
    */
-  const setFocus = () => {
+  const setFocus = (direction: 'down' | 'up') => {
     nextTick(() => {
       if (!didKeydown.value) {
         dropdownContainer.value?.focus();
@@ -78,7 +79,12 @@ export const useDropdownContext = (emit: typeof rcDropdownEmits) => {
         return;
       }
 
-      firstDropdownItem.value?.focus();
+      if (direction === 'down') {
+        firstDropdownItem.value?.focus();
+      } else if (direction === 'up') {
+        lastDropdownItem.value?.focus();
+      }
+
       didKeydown.value = false;
     });
   };
@@ -95,7 +101,7 @@ export const useDropdownContext = (emit: typeof rcDropdownEmits) => {
       dropdownItems,
       close:             () => returnFocus(),
       focusFirstElement: () => {
-        setFocus();
+        setFocus('down');
       },
       handleKeydown,
     });

package/scripts/extension/publish

@@ -1,4 +1,5 @@
 #!/usr/bin/env bash
+set -eo pipefail
 
 SCRIPT_DIR="$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )"
 BASE_DIR="$(pwd)"

package/server/har-file.js

@@ -1,11 +1,15 @@
 const fs = require('fs');
 const path = require('path');
+const querystring = require('querystring');
 
 // When we receive a request to this URL we will reset the session to replay again from the HAR file
 // This allows the user to refresh the browser and replay the HAR file again
 const RESET_URL = '/api/v1/namespaces/cattle-ui-plugin-system/services/http:ui-plugin-operator:80/proxy/index.json';
 
-const EXCLUDES_QS = '?exclude=metadata.managedFields';
+const EXCLUDE_QS = 'exclude';
+
+const LEGACY_UI_PLUGIN_INDEX = '/api/v1/namespaces/cattle-ui-plugin-system/services/http:ui-plugin-operator:80/proxy/index.json';
+const NEW_UI_PLUGIN_INDEX = '/v1/uiplugins';
 
 /**
  * Load the network requests/responses from the har file
@@ -113,10 +117,28 @@ function harProxy(responses, folder) {
     const url = decodeURIComponent(req.originalUrl);
     let playback = session[req.originalUrl];
 
+    // Handle case where HAR file was created with older UI Extension API that used the operator
+    if (!playback && req.originalUrl.includes(NEW_UI_PLUGIN_INDEX)) {
+      // Look for new URl for UI plugins
+      playback = session[LEGACY_UI_PLUGIN_INDEX];
+    }
+
     // If it did not match, try without the metadata excludes query string that was adding in 2.8.0
     // This might allow HAR captures with Rancher < 2.8.0 to be replayed on >= 2.8.0
-    if (!playback && req.originalUrl.endsWith(EXCLUDES_QS)) {
-      playback = session[req.originalUrl.slice(0, -EXCLUDES_QS.length)];
+    if (!playback && req.originalUrl.includes('?')) {
+      const urlParts = req.originalUrl.split('?');
+
+      if (urlParts.length > 1) {
+        const queryString = urlParts[1];
+        const qs = querystring.parse(queryString);
+
+        delete qs[EXCLUDE_QS];
+
+        const newQs = querystring.stringify(qs);
+        const newUrl = newQs.length ? `${ urlParts[0] }?${ newQs }` : urlParts[0];
+
+        playback = session[newUrl];
+      }
     }
 
     if (playback && playback[req.method] && playback[req.method].length) {

package/store/features.js

@@ -1,4 +1,5 @@
 import { MANAGEMENT } from '@shell/config/types';
+import { SCHEDULING_CUSTOMIZATION as SCHEDULING_CUSTOMIZATION_FEATURE } from '@shell/config/features';
 
 const definitions = {};
 
@@ -36,7 +37,7 @@ export const FLEET_WORKSPACE_BACK = create('provisioningv2-fleet-workspace-back-
 export const STEVE_CACHE = create('ui-sql-cache', false);
 export const UIEXTENSION = create('uiextension', true);
 export const PROVISIONING_PRE_BOOTSTRAP = create('provisioningprebootstrap', false);
-export const SCHEDULING_CUSTOMIZATION = create('cluster-agent-scheduling-customization', false);
+export const SCHEDULING_CUSTOMIZATION = create(SCHEDULING_CUSTOMIZATION_FEATURE, false);
 
 // Not currently used.. no point defining ones we don't use
 // export const EMBEDDED_CLUSTER_API = create('embedded-cluster-api', true);

package/store/type-map.js

@@ -107,6 +107,7 @@
 //                               graphConfig: undefined   -- Use this to pass along the graph configuration
 //                               notFilterNamespace:  undefined -- Define namespaces that do not need to be filtered
 //                               localOnly: False -- Hide this type from the nav/search bar on downstream clusters
+//                               custom: any - Custom options for a given type
 //                           }
 // )
 // ignoreGroup(group):        Never show group or any types in it
@@ -524,6 +525,7 @@ export const getters = {
       depaginate:             false,
       customRoute:            undefined,
       resourceEditMasthead:   true,
+      custom:                 {},
     };
 
     return (schemaOrType, pagination) => {
@@ -1729,6 +1731,8 @@ export const mutations = {
     let obj = { ...options, match };
 
     if ( idx >= 0 ) {
+      // Merge the custom data object - multiple configures will update existing rather than overwrite
+      obj.custom = Object.assign(state.typeOptions[idx].custom || {}, obj.custom || {});
       obj = Object.assign(state.typeOptions[idx], obj);
       state.typeOptions.splice(idx, 1, obj);
     } else {

package/types/shell/index.d.ts

@@ -2475,7 +2475,7 @@ export default class Namespace {
     get isObscure(): any;
     get projectId(): any;
     get project(): any;
-    get groupByLabel(): any;
+    get groupById(): any;
     get projectNameSort(): any;
     get istioInstalled(): boolean;
     get injectionEnabled(): boolean;
@@ -3498,6 +3498,13 @@ export function abbreviateClusterName(input: string): string;
 export function labelForAddon(store: any, name: any, configuration?: boolean): any;
 export function filterOutDeprecatedPatchVersions(allVersions: any, currentVersion: any): any;
 export function getAllOptionsAfterCurrentVersion(store: any, versions: any, currentVersion: any, defaultVersion: any): any;
+export function initSchedulingCustomization(value: any, features: any, store: any, mode: any): Promise<{
+    clusterAgentDefaultPC: any;
+    clusterAgentDefaultPDB: any;
+    schedulingCustomizationFeatureEnabled: any;
+    schedulingCustomizationOriginallyEnabled: boolean;
+    errors: any[];
+}>;
 }
 
 // @shell/utils/color
@@ -4361,7 +4368,7 @@ export function random32(count: any): number | number[];
 export function randomStr(length?: number, chars?: string): any;
 export function formatPercent(value: any, maxPrecision?: number): string;
 export function pluralize(str: any): any;
-export function resourceNames(names: any, t: any, options?: {}): any;
+export function resourceNames(names: any, plusMore: any, t: any, endString: any): any;
 export function indent(lines: any, count?: number, token?: string, afterRegex?: any): any;
 export function decamelize(str: any): any;
 export function dasherize(str: any): any;

package/utils/__tests__/string.test.ts

@@ -81,9 +81,9 @@ describe('fx: resourceNames', () => {
     it.each(args)(`having: %p`, (
       names,
       expectation,
-      options,
+      options: any,
     ) => {
-      const result = resourceNames(names, t, options);
+      const result = resourceNames(names, options.plusMore, t, options.endString);
 
       expect(result).toStrictEqual(expectation);
     });

package/utils/cluster.js

@@ -6,6 +6,10 @@ import { SETTING } from '@shell/config/settings';
 import { PaginationFilterField, PaginationParamFilter } from '@shell/types/store/pagination.types';
 import { compare, sortable } from '@shell/utils/version';
 import { sortBy } from '@shell/utils/sort';
+import { SCHEDULING_CUSTOMIZATION } from '@shell/store/features';
+import { _CREATE, _EDIT } from '@shell/config/query-params';
+import isEmpty from 'lodash/isEmpty';
+import { set } from '@shell/utils/object';
 
 /**
  * Combination of paginationFilterHiddenLocalCluster and paginationFilterOnlyKubernetesClusters
@@ -296,3 +300,34 @@ export function getAllOptionsAfterCurrentVersion(store, versions, currentVersion
 
   return sortedWithDeprecatedLabel;
 }
+
+export async function initSchedulingCustomization(value, features, store, mode) {
+  const schedulingCustomizationFeatureEnabled = features(SCHEDULING_CUSTOMIZATION);
+  let clusterAgentDefaultPC = null;
+  let clusterAgentDefaultPDB = null;
+  let schedulingCustomizationOriginallyEnabled = false;
+  const errors = [];
+
+  try {
+    clusterAgentDefaultPC = JSON.parse((await store.dispatch('management/find', { type: MANAGEMENT.SETTING, id: SETTING.CLUSTER_AGENT_DEFAULT_PRIORITY_CLASS })).value) || null;
+  } catch (e) {
+    errors.push(e);
+  }
+  try {
+    clusterAgentDefaultPDB = JSON.parse((await store.dispatch('management/find', { type: MANAGEMENT.SETTING, id: SETTING.CLUSTER_AGENT_DEFAULT_POD_DISTRIBUTION_BUDGET })).value) || null;
+  } catch (e) {
+    errors.push(e);
+  }
+
+  if (schedulingCustomizationFeatureEnabled && mode === _CREATE && isEmpty(value?.clusterAgentDeploymentCustomization?.schedulingCustomization)) {
+    set(value, 'clusterAgentDeploymentCustomization.schedulingCustomization', { priorityClass: clusterAgentDefaultPC, podDisruptionBudget: clusterAgentDefaultPDB });
+  }
+
+  if (mode === _EDIT && !!value?.clusterAgentDeploymentCustomization?.schedulingCustomization) {
+    schedulingCustomizationOriginallyEnabled = true;
+  }
+
+  return {
+    clusterAgentDefaultPC, clusterAgentDefaultPDB, schedulingCustomizationFeatureEnabled, schedulingCustomizationOriginallyEnabled, errors
+  };
+}

package/utils/string.js

@@ -151,11 +151,9 @@ export function pluralize(str) {
   }
 }
 
-export function resourceNames(names, t, options = {}) {
+export function resourceNames(names, plusMore, t, endString) {
   const MAX_NAMES_COUNT = 5;
 
-  let { plusMore, endString } = options;
-
   // plusMore default value
   if (!plusMore) {
     plusMore = t('promptRemove.andOthers', { count: names.length > MAX_NAMES_COUNT ? names.length - MAX_NAMES_COUNT : 0 });

package/utils/validators/machine-pool.ts

@@ -0,0 +1,20 @@
+const FIELDS = {
+  NAME:     'pool.name',
+  QUANTITY: 'pool.quantity'
+};
+
+const RULESETS = [
+  {
+    path:  FIELDS.QUANTITY,
+    rules: ['requiredInt', 'isPositive'],
+  },
+  {
+    path:  FIELDS.NAME,
+    rules: ['required'],
+  }
+];
+
+export const MACHINE_POOL_VALIDATION = {
+  FIELDS,
+  RULESETS
+};

package/components/formatter/ExtensionCache.vue

@@ -1,74 +0,0 @@
-<script>
-import { BadgeState } from '@components/BadgeState';
-import { stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
-
-export default {
-  props: {
-    value: {
-      type:    String,
-      default: ''
-    }
-  },
-
-  components: { BadgeState },
-
-  data() {
-    const STATES = {
-      cached: {
-        color: 'info', icon: 'dot-open', label: 'Cached', compoundIcon: 'checkmark'
-      },
-      pending: {
-        color: 'warning', icon: 'tag', label: 'In Progress', compoundIcon: 'info'
-      },
-      disabled: {
-        color: 'error', icon: 'dot-half', label: 'Cache Disabled', compoundIcon: 'info'
-      },
-    };
-
-    return {
-      STATES,
-      stateDisplay:    '',
-      stateBackground: ''
-    };
-  },
-
-  watch: {
-    value: {
-      handler() {
-        const out = this.value || 'pending';
-        const color = this.colorForState(out);
-
-        this.stateDisplay = stateDisplay(out);
-        this.stateBackground = color.replace('text-', 'bg-');
-      },
-      immediate: true
-    }
-  },
-
-  methods: {
-    colorForState(state) {
-      const key = (state).toLowerCase();
-      let color;
-
-      if ( this.STATES[key] && this.STATES[key].color ) {
-        color = this.STATES[key].color;
-      }
-
-      if ( !color ) {
-        color = 'info';
-      }
-
-      return `text-${ color }`;
-    }
-  }
-};
-</script>
-
-<template>
-  <div>
-    <BadgeState
-      :color="stateBackground"
-      :label="stateDisplay"
-    />
-  </div>
-</template>

package/components/formatter/Port.vue

@@ -1,24 +0,0 @@
-<script>
-export default {
-  props: {
-    value: {
-      type:    Array,
-      default: () => []
-    }
-  },
-  data() {
-    const { hostPort = '', protocol = '' } = this.value[0] || {};
-
-    return { hostPort, protocol };
-  }
-};
-</script>
-
-<template>
-  <div v-if="hostPort">
-    {{ hostPort+'/'+protocol }}
-  </div>
-  <div v-else>
-    —
-  </div>
-</template>

package/components/formatter/SecretType.vue

@@ -1,41 +0,0 @@
-<script>
-import { SERVICE_ACCOUNT } from '@shell/config/types';
-export default {
-  props: {
-    value: {
-      type:    [String, Object],
-      default: 'Opaque'
-    }
-  },
-  data() {
-    if (this.value.typeDisplay) {
-      this.findServiceAccount();
-
-      return { typeDisplay: this.value.typeDisplay, serviceAccountLink: null };
-    }
-
-    return { typeDisplay: this.value, serviceAccountLink: null };
-  },
-  methods: {
-    async findServiceAccount() {
-      const serviceAccount = await this.$store.dispatch('cluster/find', { type: SERVICE_ACCOUNT, id: this.value.serviceAccountID });
-
-      if (serviceAccount) {
-        this.serviceAccountLink = serviceAccount.detailLocation;
-      }
-    }
-  }
-};
-</script>>
-
-<template>
-  <router-link
-    v-if="serviceAccountLink"
-    :to="serviceAccountLink"
-  >
-    {{ typeDisplay }}
-  </router-link>
-  <div v-else>
-    {{ typeDisplay }}
-  </div>
-</template>