@rancher/shell 0.3.4 → 0.3.5

package/pages/c/_cluster/apps/charts/__tests__/install.helper.test.ts

@@ -0,0 +1,33 @@
+import { ignoreVariables } from '@shell/pages/c/_cluster/apps/charts/install.helpers';
+
+describe('fX: ignoreVariables', () => {
+  describe.each([['epinio', 'global.rbac.pspEnabled']])('given chart %p with path %p', (name, path) => {
+    it.each([
+      ['v1.24.11+rke2r1'],
+    ])('should not return variable path list if cluster has k8s version %p', (version) => {
+      const cluster = { kubernetesVersion: version };
+      const data = {
+        chart:  { name },
+        values: { global: { rbac: { pspEnabled: undefined } } }
+      };
+
+      const paths = ignoreVariables(cluster, data);
+
+      expect(paths).toStrictEqual([]);
+    });
+
+    it.each([
+      ['v1.25.11+rke2r1'],
+    ])('should return questions if cluster has k8s version %p', (version) => {
+      const cluster = { kubernetesVersion: version };
+      const data = {
+        chart:  { name },
+        values: { global: { rbac: { pspEnabled: undefined } } }
+      };
+
+      const paths = ignoreVariables(cluster, data);
+
+      expect(paths).toStrictEqual([path]);
+    });
+  });
+});

package/pages/c/_cluster/apps/charts/chart.vue

@@ -159,14 +159,14 @@ export default {
           v-if="osWarning"
           color="error"
         >
-          <span v-html="osWarning" />
+          <span v-clean-html="osWarning" />
         </Banner>
         <Banner
           v-for="msg in requires"
           :key="msg"
           color="error"
         >
-          <span v-html="msg" />
+          <span v-clean-html="msg" />
         </Banner>
 
         <Banner
@@ -174,14 +174,14 @@ export default {
           :key="msg"
           color="warning"
         >
-          <span v-html="msg" />
+          <span v-clean-html="msg" />
         </Banner>
 
         <Banner
           v-if="targetedAppWarning"
           color="warning"
         >
-          <span v-html="targetedAppWarning" />
+          <span v-clean-html="targetedAppWarning" />
         </Banner>
       </div>
       <div

package/pages/c/_cluster/apps/charts/install.helpers.js

@@ -0,0 +1,26 @@
+/**
+ * Return list of variables to filter chart questions
+ */
+export const ignoreVariables = (cluster, data) => {
+  const pspChartMap = {
+    epinio:                     'global.rbac.pspEnabled',
+    longhorn:                   'enablePSP',
+    'rancher-alerting-drivers': 'global.cattle.psp.enabled',
+    neuvector:                  'global.cattle.psp.enabled',
+    'prometheus-federator':     'global.rbac.pspEnabled',
+  };
+  const path = pspChartMap[data.chart.name];
+
+  if (path) {
+    const clusterVersion = cluster?.kubernetesVersion || '';
+    const version = clusterVersion.match(/\d+/g);
+    const isRequiredVersion = version?.length ? +version[0] === 1 && +version[1] < 25 : false;
+
+    // Provide path as question variable to be ignored
+    if (!isRequiredVersion) {
+      return [path];
+    }
+  }
+
+  return [];
+};

package/pages/c/_cluster/apps/charts/install.vue

@@ -32,6 +32,7 @@ import { CATALOG as CATALOG_ANNOTATIONS, PROJECT } from '@shell/config/labels-an
 
 import { exceptionToErrorsArray } from '@shell/utils/error';
 import { clone, diff, get, set } from '@shell/utils/object';
+import { ignoreVariables } from './install.helpers';
 import { findBy, insertAt } from '@shell/utils/array';
 import Vue from 'vue';
 import { saferDump } from '@shell/utils/create-yaml';
@@ -92,6 +93,7 @@ export default {
     */
     await this.fetchChart();
 
+    await this.fetchAutoInstallInfo();
     this.errors = [];
 
     // If the chart doesn't contain system `systemDefaultRegistry` properties there's no point applying them
@@ -360,6 +362,7 @@ export default {
       migratedApp:            false,
       defaultCmdOpts,
       customCmdOpts:          { ...defaultCmdOpts },
+      autoInstallInfo:        [],
 
       nameDisabled: false,
 
@@ -425,6 +428,13 @@ export default {
     ...mapGetters({ inStore: 'catalog/inStore', features: 'features/get' }),
     mcm: mapFeature(MULTI_CLUSTER),
 
+    /**
+     * Return list of variables to filter chart questions
+     */
+    ignoreVariables() {
+      return ignoreVariables(this.currentCluster, this.versionInfo);
+    },
+
     namespaceIsNew() {
       const all = this.$store.getters['cluster/all'](NAMESPACE);
       const want = this.value?.metadata?.namespace;
@@ -799,7 +809,7 @@ export default {
         }) : {};
 
         if (provCluster.isRke2) { // isRke2 returns true for both RKE2 and K3s clusters.
-          const agentConfig = provCluster.spec.rkeConfig.machineSelectorConfig.find(x => !x.machineLabelSelector).config;
+          const agentConfig = provCluster.spec?.rkeConfig?.machineSelectorConfig?.find(x => !x.machineLabelSelector).config;
 
           // If a cluster scoped registry exists,
           // it should be used by default.
@@ -812,7 +822,7 @@ export default {
         if (provCluster.isRke1) {
           // For RKE1 clusters, the cluster scoped private registry is on the management
           // cluster, not the provisioning cluster.
-          const rke1Registries = mgmCluster.spec.rancherKubernetesEngineConfig.privateRegistries;
+          const rke1Registries = mgmCluster.spec?.rancherKubernetesEngineConfig?.privateRegistries;
 
           if (rke1Registries?.length > 0) {
             const defaultRegistry = rke1Registries.find((registry) => {
@@ -844,10 +854,8 @@ export default {
     },
 
     async loadValuesComponent() {
-      // TODO: Remove RELEASE_NAME. This is only in until the component annotation is added to the OPA Gatekeeper chart.
-
       // The const component is a string, for example, 'monitoring'.
-      const component = this.version?.annotations?.[CATALOG_ANNOTATIONS.COMPONENT] || this.version?.annotations?.[CATALOG_ANNOTATIONS.RELEASE_NAME];
+      const component = this.version?.annotations?.[CATALOG_ANNOTATIONS.COMPONENT];
 
       // Load a values component for the UI if it is named in the Helm chart.
       if ( component ) {
@@ -872,7 +880,7 @@ export default {
     },
 
     async loadChartSteps() {
-      const component = this.version?.annotations?.[CATALOG_ANNOTATIONS.COMPONENT] || this.version?.annotations?.[CATALOG_ANNOTATIONS.RELEASE_NAME];
+      const component = this.version?.annotations?.[CATALOG_ANNOTATIONS.COMPONENT];
 
       if ( component ) {
         const steps = await this.$store.getters['catalog/chartSteps'](component);
@@ -1167,56 +1175,7 @@ export default {
 
       const more = [];
 
-      /*
-        An example value for auto is ["rancher-monitoring-crd=match"].
-        It is an array of chart names that lets Rancher know of other
-        charts that should be auto-installed at the same time.
-      */
-      let auto = (this.version?.annotations?.[CATALOG_ANNOTATIONS.AUTO_INSTALL] || '').split(/\s*,\s*/).filter(x => !!x).reverse();
-
-      for ( const constraint of auto ) {
-        const provider = this.$store.getters['catalog/versionSatisfying']({
-          constraint,
-          repoName:     this.chart.repoName,
-          repoType:     this.chart.repoType,
-          chartVersion: this.version.version,
-        });
-
-        /*
-         An example return value for "provider":
-        [
-            {
-                "name": "rancher-monitoring-crd",
-                "version": "100.1.3+up19.0.3",
-                "description": "Installs the CRDs for rancher-monitoring.",
-                "apiVersion": "v1",
-                "annotations": {
-                    "catalog.cattle.io/certified": "rancher",
-                    "catalog.cattle.io/hidden": "true",
-                    "catalog.cattle.io/namespace": "cattle-monitoring-system",
-                    "catalog.cattle.io/release-name": "rancher-monitoring-crd"
-                },
-                "type": "application",
-                "urls": [
-                    "https://192.168.0.18:8005/k8s/clusters/c-m-hhpg69fv/v1/catalog.cattle.io.clusterrepos/rancher-charts?chartName=rancher-monitoring-crd&link=chart&version=100.1.3%2Bup19.0.3"
-                ],
-                "created": "2022-04-27T10:04:18.343124-07:00",
-                "digest": "ecf07ba23a9cdaa7ffbbb14345d94ea1240b7f3b8e0ce9be4640e3e585c484e2",
-                "key": "cluster/rancher-charts/rancher-monitoring-crd/100.1.3+up19.0.3",
-                "repoType": "cluster",
-                "repoName": "rancher-charts"
-            }
-        ]
-        */
-
-        if ( provider ) {
-          more.push(provider);
-        } else {
-          errors.push(`This chart requires ${ constraint } but no matching chart was found`);
-        }
-      }
-
-      auto = (this.version?.annotations?.[CATALOG_ANNOTATIONS.AUTO_INSTALL_GVK] || '').split(/\s*,\s*/).filter(x => !!x).reverse();
+      const auto = (this.version?.annotations?.[CATALOG_ANNOTATIONS.AUTO_INSTALL_GVK] || '').split(/\s*,\s*/).filter(x => !!x).reverse();
 
       for ( const gvr of auto ) {
         const provider = this.$store.getters['catalog/versionProviding']({
@@ -1232,9 +1191,20 @@ export default {
         }
       }
 
+      /* Chart custom UI components have the ability to edit CRD chart values
+        apply those values in addition to the global values being copied over frm the primary chart
+      */
+      for (const versionInfo of this.autoInstallInfo) {
+        out.charts.unshift({
+          chartName:   versionInfo.chart.name,
+          version:     versionInfo.chart.version,
+          releaseName: versionInfo.chart.annotations[CATALOG_ANNOTATIONS.RELEASE_NAME] || chart.name,
+          projectId:   this.project,
+          values:      merge(versionInfo.values, this.addGlobalValuesTo({ global: values.global }))
+        });
+      }
       /*
-        'more' contains the values for the CRD chart, which needs the same
-        global and cattle values as the chart. It could also contain additional
+        'more' contains additional
         charts that may not be CRD charts but are also meant to be installed at
         the same time.
       */
@@ -1368,7 +1338,7 @@ export default {
               :key="msg"
               color="error"
             >
-              <span v-html="msg" />
+              <span v-clean-html="msg" />
             </Banner>
 
             <Banner
@@ -1376,7 +1346,7 @@ export default {
               :key="msg"
               color="warning"
             >
-              <span v-html="msg" />
+              <span v-clean-html="msg" />
             </Banner>
           </div>
           <div
@@ -1479,7 +1449,7 @@ export default {
             v-if="isNamespaceNew && value.metadata.namespace.length"
             color="info"
           >
-            <div v-html="t('catalog.install.steps.basics.createNamespace', {namespace: value.metadata.namespace}, true) " />
+            <div v-clean-html="t('catalog.install.steps.basics.createNamespace', {namespace: value.metadata.namespace}, true) " />
           </Banner>
         </div>
       </template>
@@ -1557,7 +1527,7 @@ export default {
         </div>
         <div class="scroll__container">
           <div class="scroll__content">
-            <!-- Values (as Custom Component) -->
+            <!-- Values (as Custom Component in ./shell/charts/) -->
             <template v-if="valuesComponent && showValuesComponent">
               <Tabbed
                 v-if="componentHasTabs"
@@ -1576,6 +1546,7 @@ export default {
                   :existing="existing"
                   :version="version"
                   :version-info="versionInfo"
+                  :auto-install-info="autoInstallInfo"
                   @warn="e=>errors.push(e)"
                   @register-before-hook="registerBeforeHook"
                   @register-after-hook="registerAfterHook"
@@ -1592,13 +1563,15 @@ export default {
                   :existing="existing"
                   :version="version"
                   :version-info="versionInfo"
+                  :auto-install-info="autoInstallInfo"
                   @warn="e=>errors.push(e)"
                   @register-before-hook="registerBeforeHook"
                   @register-after-hook="registerAfterHook"
                 />
               </template>
             </template>
-            <!-- Values (as Questions)  -->
+
+            <!-- Values (as Questions, abstracted component based on question.yaml configuration from repositories)  -->
             <Tabbed
               v-else-if="hasQuestions && showQuestions"
               ref="tabs"
@@ -1612,6 +1585,7 @@ export default {
                 :in-store="inStore"
                 :mode="mode"
                 :source="versionInfo"
+                :ignore-variables="ignoreVariables"
                 tabbed="multiple"
                 :target-namespace="targetNamespace"
               />
@@ -1802,17 +1776,17 @@ export default {
           {{ t('catalog.install.error.legacy.label', { legacyType: mcapp ? legacyDefs.mcm : legacyDefs.legacy }, true) }}
         </span>
         <template v-if="!legacyEnabled">
-          <span v-html="t('catalog.install.error.legacy.enableLegacy.prompt', true)" />
+          <span v-clean-html="t('catalog.install.error.legacy.enableLegacy.prompt', true)" />
           <nuxt-link :to="legacyFeatureRoute">
             {{ t('catalog.install.error.legacy.enableLegacy.goto') }}
           </nuxt-link>
         </template>
         <template v-else-if="mcapp">
-          <span v-html="t('catalog.install.error.legacy.mcmNotSupported')" />
+          <span v-clean-html="t('catalog.install.error.legacy.mcmNotSupported')" />
         </template>
         <template v-else>
           <nuxt-link :to="legacyAppRoute">
-            <span v-html="t('catalog.install.error.legacy.navigate')" />
+            <span v-clean-html="t('catalog.install.error.legacy.navigate')" />
           </nuxt-link>
         </template>
       </Banner>

package/pages/c/_cluster/explorer/EventsTable.vue

@@ -1,7 +1,7 @@
 <script>
 
 import SortableTable from '@shell/components/SortableTable';
-import { REASON } from '@shell/config/table-headers';
+import { MESSAGE, NAME, OBJECT, REASON } from '@shell/config/table-headers';
 import { EVENT } from '@shell/config/types';
 import { fetchClusterResources } from './explorer-utils';
 
@@ -21,14 +21,9 @@ export default {
 
     const eventHeaders = [
       reason,
-      {
-        name:          'resource',
-        label:         'Resource',
-        labelKey:      'clusterIndexPage.sections.events.resource.label',
-        value:         'displayInvolvedObject',
-        sort:          ['involvedObject.kind', 'involvedObject.name'],
-        canBeVariable: true,
-      },
+      OBJECT,
+      MESSAGE,
+      NAME,
       {
         name:        'date',
         label:       'Date',
@@ -61,14 +56,5 @@ export default {
     :paging="true"
     :rows-per-page="10"
     default-sort-by="date"
-  >
-    <template #cell:resource="{row, value}">
-      <n-link :to="row.detailLocation">
-        {{ value }}
-      </n-link>
-      <div v-if="row.message">
-        {{ row.displayMessage }}
-      </div>
-    </template>
-  </SortableTable>
+  />
 </template>

package/pages/c/_cluster/explorer/index.vue

@@ -82,27 +82,29 @@ export default {
   fetch() {
     fetchClusterResources(this.$store, NODE);
 
-    setPromiseResult(
-      allDashboardsExist(this.$store, this.currentCluster.id, [CLUSTER_METRICS_DETAIL_URL, CLUSTER_METRICS_SUMMARY_URL]),
-      this,
-      'showClusterMetrics',
-      `Determine cluster metrics`
-    );
-    setPromiseResult(
-      allDashboardsExist(this.$store, this.currentCluster.id, [K8S_METRICS_DETAIL_URL, K8S_METRICS_SUMMARY_URL]),
-      this,
-      'showK8sMetrics',
-      `Determine k8s metrics`
-    );
-    setPromiseResult(
-      allDashboardsExist(this.$store, this.currentCluster.id, [ETCD_METRICS_DETAIL_URL, ETCD_METRICS_SUMMARY_URL]),
-      this,
-      'showEtcdMetrics',
-      `Determine etcd metrics`
-    );
-
-    if (this.currentCluster.isLocal) {
-      this.$store.dispatch('management/findAll', { type: MANAGEMENT.NODE });
+    if (this.currentCluster) {
+      setPromiseResult(
+        allDashboardsExist(this.$store, this.currentCluster.id, [CLUSTER_METRICS_DETAIL_URL, CLUSTER_METRICS_SUMMARY_URL]),
+        this,
+        'showClusterMetrics',
+        `Determine cluster metrics`
+      );
+      setPromiseResult(
+        allDashboardsExist(this.$store, this.currentCluster.id, [K8S_METRICS_DETAIL_URL, K8S_METRICS_SUMMARY_URL]),
+        this,
+        'showK8sMetrics',
+        `Determine k8s metrics`
+      );
+      setPromiseResult(
+        allDashboardsExist(this.$store, this.currentCluster.id, [ETCD_METRICS_DETAIL_URL, ETCD_METRICS_SUMMARY_URL]),
+        this,
+        'showEtcdMetrics',
+        `Determine etcd metrics`
+      );
+
+      if (this.currentCluster.isLocal) {
+        this.$store.dispatch('management/findAll', { type: MANAGEMENT.NODE });
+      }
     }
   },
 
@@ -184,7 +186,7 @@ export default {
     displayProvider() {
       const other = 'other';
 
-      let provider = this.currentCluster.status.provider || other;
+      let provider = this.currentCluster?.status?.provider || other;
 
       if (provider === 'rke.windows') {
         provider = 'rkeWindows';
@@ -444,11 +446,11 @@ export default {
       </div>
       <div>
         <label>{{ t('glance.version') }}: </label>
+        <span>{{ currentCluster.kubernetesVersionBase }}</span>
         <span
           v-if="currentCluster.kubernetesVersionExtension"
-          style="font-size: 0.5em"
+          style="font-size: 0.75em"
         >{{ currentCluster.kubernetesVersionExtension }}</span>
-        <span>{{ currentCluster.kubernetesVersionBase }}</span>
       </div>
       <div>
         <label>{{ t('glance.created') }}: </label>
@@ -602,6 +604,8 @@ export default {
     </div>
     <Tabbed
       v-if="hasMetricsTabs"
+      default-tab="cluster-metrics"
+      :use-hash="false"
       class="mt-30"
     >
       <Tab
@@ -705,7 +709,7 @@ export default {
 }
 
 .etcd-metrics ::v-deep .external-link {
-  top: -102px;
+  top: -107px;
 }
 
 .cluster-tools-tip {

package/pages/c/_cluster/explorer/tools/index.vue

@@ -416,7 +416,7 @@ export default {
 <template>
   <Loading v-if="$fetchState.pending" />
   <div v-else-if="options.length">
-    <h1 v-html="t('catalog.tools.header')" />
+    <h1 v-clean-html="t('catalog.tools.header')" />
     <TypeDescription
       v-if="!legacyEnabled"
       resource="chart"
@@ -466,8 +466,8 @@ export default {
         </div>
         <div class="description">
           <div
+            v-clean-html="opt.chart.chartDescription"
             class="description-content"
-            v-html="opt.chart.chartDescription"
           />
         </div>
         <div
@@ -483,16 +483,16 @@ export default {
         <div class="action">
           <template v-if="opt.blocked">
             <button
+              v-clean-html="t('catalog.tools.action.install')"
               disabled="true"
               class="btn btn-sm role-primary"
-              v-html="t('catalog.tools.action.install')"
             />
           </template>
           <template v-else-if="opt.app && opt.chart.legacy">
             <button
+              v-clean-html="t('catalog.tools.action.manage')"
               class="btn btn-sm role-secondary"
               @click="openV1Tool(opt.chart.legacyPage)"
-              v-html="t('catalog.tools.action.manage')"
             />
           </template>
           <template v-else-if="opt.app && opt.upgradeAvailable && !opt.chart.legacy">
@@ -503,9 +503,9 @@ export default {
               <i class="icon icon-delete icon-lg" />
             </button>
             <button
+              v-clean-html="t('catalog.tools.action.upgrade')"
               class="btn btn-sm role-secondary"
               @click="edit(opt.app, opt.app.upgradeAvailable)"
-              v-html="t('catalog.tools.action.upgrade')"
             />
           </template>
           <template v-else-if="opt.app">
@@ -516,23 +516,23 @@ export default {
               <i class="icon icon-delete icon-lg" />
             </button>
             <button
+              v-clean-html="t('catalog.tools.action.edit')"
               class="btn btn-sm role-secondary"
               @click="edit(opt.app)"
-              v-html="t('catalog.tools.action.edit')"
             />
           </template>
           <template v-else-if="opt.chart.legacy">
             <button
+              v-clean-html="t('catalog.tools.action.install')"
               class="btn btn-sm role-primary"
               @click="openV1Tool(opt.chart.legacyPage)"
-              v-html="t('catalog.tools.action.install')"
             />
           </template>
           <template v-else>
             <button
+              v-clean-html="t('catalog.tools.action.install')"
               class="btn btn-sm role-primary"
               @click="install(opt.chart)"
-              v-html="t('catalog.tools.action.install')"
             />
           </template>
         </div>