@rancher/shell 3.0.1-rc.4 → 3.0.2-rc.1

package/types/store/dashboard-store.types.ts

@@ -38,5 +38,9 @@ export interface ActionFindPageArgs extends ActionCoreFindArgs {
    * The single namespace to filter by (used in url path, not part of pagination params)
    */
   namespaced?: string,
+  /**
+   * Result of request is transient and not persisted to store
+   */
+  transient?: boolean,
   hasManualRefresh?: boolean,
 }

package/types/store/pagination.types.ts

@@ -455,3 +455,16 @@ export interface StorePagination {
    */
   result: StorePaginationResult
 }
+
+/**
+ * The resource and context that the pagination request will be used
+ *
+ * Used to determine if the request is supported
+*/
+export interface PaginationResourceContext {
+  store: string,
+  resource?: {
+    id: string,
+    context?: string,
+  }
+}

package/types/store/vuex.d.ts

@@ -5,5 +5,13 @@
  * Generic interface for Vuex getters
  */
 export interface VuexStoreGetters {
-  [name:string]: Function
+  [name:string]: Function | any
+}
+
+export interface VuexStore {
+  getters: VuexStoreGetters,
+  dispatch: any,
+
+  // When we have exact properties above we can remove below
+  [name:string]: any
 }

package/types/vue-shim.d.ts

@@ -1,36 +1,7 @@
-// eslint-disable-next-line no-unused-vars
-import Vue, { ComponentCustomProperties } from 'vue';
-declare module '*.vue' {
-  export default Vue;
-}
-
-// This is required to keep typescript from complaining. It is required for
-// our i18n plugin. For more info see:
-// https://v2.vuejs.org/v2/guide/typescript.html?redirect=true#Augmenting-Types-for-Use-with-Plugins
-declare module 'vue/types/vue' {
-  // eslint-disable-next-line no-unused-vars
-  interface Vue {
-      /**
-       * Lookup a given string with the given arguments
-       * @param raw if set, do not do HTML escaping.
-       */
-      t: {
-        (key: string, args?: Record<string, any>, raw?: boolean): string;
-        (options: { k: string; raw?: boolean; tag?: string | Record<string, any>; escapehtml?: boolean }): string;
-      };
-  }
-}
+/* eslint-disable */
+export {};
 
-declare module '@vue/runtime-core' {
-  // eslint-disable-next-line no-unused-vars
-  interface Vue {
-    t: {
-      (key: string, args?: Record<string, any>, raw?: boolean): string;
-      (options: { k: string; raw?: boolean; tag?: string | Record<string, any>; escapehtml?: boolean }): string;
-    }
-  }
-
-  // eslint-disable-next-line no-unused-vars
+declare module 'vue' {
   interface ComponentCustomProperties {
     t: {
       (key: string, args?: Record<string, any>, raw?: boolean): string;
@@ -47,5 +18,3 @@ declare module '@vue/runtime-core' {
     }
   }
 }
-
-declare module 'js-yaml';

package/utils/cluster.js

@@ -3,8 +3,99 @@ import { camelToTitle } from '@shell/utils/string';
 import { CAPI } from '@shell/config/labels-annotations';
 import { MANAGEMENT, VIRTUAL_HARVESTER_PROVIDER } from '@shell/config/types';
 import { SETTING } from '@shell/config/settings';
+import { PaginationFilterField, PaginationParamFilter } from '@shell/types/store/pagination.types';
 
-// Filter out any clusters that are not Kubernetes Clusters
+/**
+ * Combination of paginationFilterHiddenLocalCluster and paginationFilterOnlyKubernetesClusters
+ *
+ * @param {*} store
+ * @returns PaginationParam[]
+ */
+export function paginationFilterClusters(store, filterMgmtCluster = true) {
+  const paginationRequestFilters = [];
+
+  // Commenting out for the moment. This is broken for non-paginated world
+  // filterOnlyKubernetesClusters expects a mgmt cluster, however in the home page it's given a prov cluster
+  // note - filterHiddenLocalCluster works because it uses model isLocal which is on both cluster types
+  // const pFilterOnlyKubernetesClusters = paginationFilterOnlyKubernetesClusters(store);
+  // if (pFilterOnlyKubernetesClusters) {
+  //   paginationRequestFilters.push(pFilterOnlyKubernetesClusters);
+  // }
+  const pFilterHiddenLocalCluster = paginationFilterHiddenLocalCluster(store, filterMgmtCluster);
+
+  if (pFilterHiddenLocalCluster) {
+    paginationRequestFilters.push(pFilterHiddenLocalCluster);
+  }
+
+  return paginationRequestFilters;
+}
+
+/**
+ * The vai backed api's `filter` equivalent of `filterHiddenLocalCluster`
+ *
+ * @export
+ * @param {*} store
+ * @returns PaginationParam | null
+ */
+export function paginationFilterHiddenLocalCluster(store, filterMgmtCluster = true) {
+  const hideLocalSetting = store.getters['management/byId'](MANAGEMENT.SETTING, SETTING.HIDE_LOCAL_CLUSTER) || {};
+  const value = hideLocalSetting.value || hideLocalSetting.default || 'false';
+  const hideLocal = value === 'true';
+
+  if (!hideLocal) {
+    return null;
+  }
+
+  const filter = filterMgmtCluster ? [
+    new PaginationFilterField({
+      field: `spec.internal`,
+      value: false,
+    })
+  ] : [
+    new PaginationFilterField({
+      field:  `id`,
+      value:  'fleet-local/local',
+      exact:  true,
+      equals: false,
+    })
+  ];
+
+  return PaginationParamFilter.createMultipleFields(filter);
+}
+
+/**
+ * The vai backed api's `filter` equivalent of `filterOnlyKubernetesClusters`
+ *
+ * @export
+ * @param {*} store
+ * @returns PaginationParam | null
+ */
+export function paginationFilterOnlyKubernetesClusters(store) {
+  const openHarvesterContainerWorkload = store.getters['features/get']('harvester-baremetal-container-workload');
+
+  if (!openHarvesterContainerWorkload) {
+    return null;
+  }
+
+  return PaginationParamFilter.createMultipleFields([
+    new PaginationFilterField({
+      field:  `metadata.labels."${ CAPI.PROVIDER }"`,
+      equals: false,
+      value:  VIRTUAL_HARVESTER_PROVIDER,
+      exact:  true
+    }),
+    new PaginationFilterField({
+      field:  `status.provider`,
+      equals: false,
+      value:  VIRTUAL_HARVESTER_PROVIDER,
+      exact:  true
+    }),
+  ]);
+}
+
+/**
+ * Filter out any clusters that are not Kubernetes Clusters
+ **/
 export function filterOnlyKubernetesClusters(mgmtClusters, store) {
   const openHarvesterContainerWorkload = store.getters['features/get']('harvester-baremetal-container-workload');
 

package/utils/pagination-utils.ts

@@ -9,7 +9,7 @@ import {
   NAMESPACE_FILTER_NS_FULL_PREFIX,
   NAMESPACE_FILTER_P_FULL_PREFIX,
 } from '@shell/utils/namespace-filter';
-import { PaginationArgs, PaginationParam, PaginationSort } from '@shell/types/store/pagination.types';
+import { PaginationArgs, PaginationResourceContext, PaginationParam, PaginationSort } from '@shell/types/store/pagination.types';
 import { sameArrayObjects } from '@shell/utils/array';
 import { isEqual } from '@shell/utils/object';
 import { STEVE_CACHE } from '@shell/store/features';
@@ -40,12 +40,7 @@ class PaginationUtils {
   /**
    * Is pagination enabled at a global level or for a specific resource
    */
-  isEnabled({ rootGetters }: any, enabledFor: {
-    store: string,
-    resource?: {
-      id: string,
-    }
-  }) {
+  isEnabled({ rootGetters }: any, enabledFor: PaginationResourceContext) {
     // Cache must be enabled to support pagination api
     if (!this.isSteveCacheEnabled({ rootGetters })) {
       return false;
@@ -95,7 +90,21 @@ class PaginationUtils {
       return true;
     }
 
-    if (storeSettings.resources.enableSome.enabled.includes(enabledFor.resource.id)) {
+    if (storeSettings.resources.enableSome.enabled.find((setting) => {
+      if (typeof setting === 'string') {
+        return setting === enabledFor.resource?.id;
+      }
+
+      if (setting.resource === enabledFor.resource?.id) {
+        if (!!setting.context) {
+          return enabledFor.resource?.context ? setting.context.includes(enabledFor.resource.context) : false;
+        }
+
+        return true;
+      }
+
+      return false;
+    })) {
       return true;
     }
 

package/utils/pagination-wrapper.ts

@@ -0,0 +1,70 @@
+import paginationUtils from '@shell/utils/pagination-utils';
+import { PaginationArgs, PaginationResourceContext, StorePagination } from '@shell/types/store/pagination.types';
+import { VuexStore } from '@shell/types/store/vuex';
+import { ActionFindPageArgs } from '@shell/types/store/dashboard-store.types';
+
+interface Result<T> {
+  data: Array<T>
+  pagination: StorePagination
+}
+
+/**
+ * This is a helper class that will assist in fetching a resource
+ * - Handle if the resource can be fetched by the new pagination api
+ * - Make a request to get a page (including classify)
+ * - Provide updates when the resource changes
+ *
+ * This is designed to work in places where we don't/can't store the resource in the store
+ * - There already exists a resource we don't want to overwrite
+ * - We're transient and want something nicer than just cluster/request
+ */
+class PaginationWrapper<T = any> {
+    private $store: VuexStore;
+    private enabledFor: PaginationResourceContext;
+
+    // Blocked on https://github.com/rancher/rancher/issues/40773 / https://github.com/rancher/dashboard/issues/12734
+    private onUpdate: (out: Result<T>) => void;
+
+    public isEnabled: boolean;
+
+    constructor({
+      $store,
+      enabledFor,
+      onUpdate,
+    }: {
+        $store: VuexStore,
+        onUpdate: (res: Result<T>) => void,
+        enabledFor: PaginationResourceContext,
+    }) {
+      this.$store = $store;
+      this.isEnabled = paginationUtils.isEnabled({ rootGetters: $store.getters }, enabledFor);
+      this.enabledFor = enabledFor;
+      this.onUpdate = onUpdate;
+    }
+
+    async request(args: {
+        pagination: PaginationArgs,
+        classify?: boolean,
+    }): Promise<Result<T>> {
+      if (!this.isEnabled) {
+        throw new Error(`Wrapper for type '${ this.enabledFor.store }/${ this.enabledFor.resource?.id }' in context '${ this.enabledFor.resource?.context }' not supported`);
+      }
+      const { pagination, classify: doClassify } = args;
+      const opt: ActionFindPageArgs = {
+        transient: true,
+        pagination
+      };
+
+      const out: Result<T> = await this.$store.dispatch(`${ this.enabledFor.store }/findPage`, { opt, type: this.enabledFor.resource?.id });
+
+      if (doClassify) {
+        for (let i = 0; i < out.data.length; i++) {
+          out.data[i] = await this.$store.dispatch(`${ this.enabledFor.store }/create`, out.data[i]);
+        }
+      }
+
+      return out;
+    }
+}
+
+export default PaginationWrapper;

package/utils/string.js

@@ -330,3 +330,9 @@ export function sanitizeIP(v) {
 export function xOfy(x, y) {
   return `${ typeof x === 'number' ? x : '?' }/${ typeof y === 'number' ? y : '?' }`;
 }
+
+export function isBase64(value) {
+  const base64regex = /^([0-9a-zA-Z+/]{4})*(([0-9a-zA-Z+/]{2}==)|([0-9a-zA-Z+/]{3}=))?$/;
+
+  return base64regex.test(value);
+}

package/utils/uiplugins.ts

@@ -1,6 +1,6 @@
 import { CATALOG as CATALOG_ANNOTATIONS } from '@shell/config/labels-annotations';
 import { CATALOG } from '@shell/config/types';
-import { UI_PLUGIN_BASE_URL } from '@shell/config/uiplugins';
+import { UI_PLUGIN_BASE_URL, isSupportedChartVersion } from '@shell/config/uiplugins';
 
 const MAX_RETRIES = 10;
 const RETRY_WAIT = 2500;
@@ -13,15 +13,29 @@ export type HelmChart = any;
  *
  * @param store Vue store
  * @param chartName The chartName
+ * @param rancherVersion Rancher version
+ * @param kubeVersion K8s version
  * @param opt Store options
- * @returns The latest compatible version of the extension
+ * @returns The latest compatible version of the extension; return null If there are no compatible versions.
  */
-export async function getLatestExtensionVersion(store: any, chartName: string, opt = { reset: true, force: true }) {
+export async function getLatestExtensionVersion(
+  store: any,
+  chartName: string,
+  rancherVersion: string,
+  kubeVersion: string,
+  opt = { reset: true, force: true },
+) {
   await store.dispatch('catalog/load', opt);
 
   const chart = store.getters['catalog/chart']({ chartName });
 
-  return chart?.versions?.[0]?.version;
+  const versions = chart?.versions || [];
+
+  const compatibleVersions = versions.filter((version: any) => isSupportedChartVersion({
+    version, rancherVersion, kubeVersion
+  }));
+
+  return compatibleVersions[0]?.version;
 }
 
 /**

package/vue.config.js

@@ -456,7 +456,7 @@ const printLogs = (dev, dashboardVersion, resourceBase, routerBasePath, pl, ranc
  * - as list: [/.shell/, /dist-pkg/, /scripts\/standalone/, /\/pkg.test-pkg/, /\/pkg.harvester/]
  * - as chained regex rule: /.shell|dist-pkg|scripts\/standalone|\/pkg.test-pkg|\/pkg.harvester/
  */
-const getWatcherIgnored = (excludes) => {
+const getWatcherIgnored = (excludes = []) => {
   const paths = [
     /node_modules/,
     /dist-pkg/,
@@ -474,12 +474,11 @@ const getWatcherIgnored = (excludes) => {
  * This takes the directory of the application as the first argument so that we can derive folder locations
  * from it, rather than from the location of this file
  */
-module.exports = function(dir, _appConfig) {
+module.exports = function(dir, appConfig = {}) {
   require('events').EventEmitter.defaultMaxListeners = 20;
   require('dotenv').config();
 
   const { SHELL_ABS, COMPONENTS_DIR } = getShellPaths(dir);
-  const appConfig = _appConfig || {};
   const excludes = appConfig.excludes || [];
 
   const includePkg = (name) => {
@@ -557,7 +556,7 @@ module.exports = function(dir, _appConfig) {
       config.resolve.extensions.push(...['.tsx', '.ts', '.js', '.vue', '.scss']);
       config.watchOptions = {
         ...(config.watchOptions || {}),
-        ignored: getWatcherIgnored(excludes)
+        ignored: getWatcherIgnored()
       };
 
       if (dev) {