@rancher/shell 3.0.8-rc.8 → 3.0.8

package/models/chart.js

@@ -136,91 +136,87 @@ export default class Chart extends SteveModel {
    * @returns {Object} Card content object with `subHeaderItems`, `footerItems`, and `statuses` arrays.
    */
   get cardContent() {
-    if (!this._cardContent) {
-      const latestVersion = this.latestCompatibleVersion;
-      const subHeaderItems = [];
-
-      if (latestVersion) {
-        const hasZeroTime = latestVersion.created === ZERO_TIME;
-
-        subHeaderItems.push({
-          icon:        'icon-version-alt',
-          iconTooltip: { key: 'tableHeaders.version' },
-          label:       latestVersion.version
-        });
-
-        const lastUpdatedItem = {
-          icon:        'icon-refresh-alt',
-          iconTooltip: { key: 'tableHeaders.lastUpdated' },
-          label:       hasZeroTime ? this.t('generic.na') : day(latestVersion.created).format('MMM D, YYYY')
-        };
-
-        if (hasZeroTime) {
-          lastUpdatedItem.labelTooltip = this.t('catalog.charts.appChartCard.subHeaderItem.missingVersionDate');
-        }
-
-        subHeaderItems.push(lastUpdatedItem);
-      }
+    const latestVersion = this.latestCompatibleVersion;
+    const subHeaderItems = [];
+
+    if (latestVersion) {
+      const hasZeroTime = latestVersion.created === ZERO_TIME;
+
+      subHeaderItems.push({
+        icon:        'icon-version-alt',
+        iconTooltip: { key: 'tableHeaders.version' },
+        label:       latestVersion.version
+      });
+
+      const lastUpdatedItem = {
+        icon:        'icon-refresh-alt',
+        iconTooltip: { key: 'tableHeaders.lastUpdated' },
+        label:       hasZeroTime ? this.t('generic.na') : day(latestVersion.created).format('MMM D, YYYY')
+      };
 
-      const footerItems = [
-        {
-          type:         REPO,
-          icon:         'icon-repository-alt',
-          iconTooltip:  { key: 'tableHeaders.repoName' },
-          labels:       [this.repoNameDisplay],
-          labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.repo') }, true)
-        }
-      ];
-
-      if (this.categories.length) {
-        footerItems.push( {
-          type:         CATEGORY,
-          icon:         'icon-category-alt',
-          iconTooltip:  { key: 'generic.category' },
-          labels:       this.categories,
-          labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.category') }, true)
-        });
+      if (hasZeroTime) {
+        lastUpdatedItem.labelTooltip = this.t('catalog.charts.appChartCard.subHeaderItem.missingVersionDate');
       }
 
-      if (this.tags.length) {
-        footerItems.push({
-          type:         TAG,
-          icon:         'icon-tag-alt',
-          iconTooltip:  { key: 'generic.tags' },
-          labels:       this.tags,
-          labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.tag') }, true)
-        });
+      subHeaderItems.push(lastUpdatedItem);
+    }
+
+    const footerItems = [
+      {
+        type:         REPO,
+        icon:         'icon-repository-alt',
+        iconTooltip:  { key: 'tableHeaders.repoName' },
+        labels:       [this.repoNameDisplay],
+        labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.repo') }, true)
       }
+    ];
+
+    if (this.categories.length) {
+      footerItems.push( {
+        type:         CATEGORY,
+        icon:         'icon-category-alt',
+        iconTooltip:  { key: 'generic.category' },
+        labels:       this.categories,
+        labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.category') }, true)
+      });
+    }
 
-      const statuses = [];
+    if (this.tags.length) {
+      footerItems.push({
+        type:         TAG,
+        icon:         'icon-tag-alt',
+        iconTooltip:  { key: 'generic.tags' },
+        labels:       this.tags,
+        labelTooltip: this.t('catalog.charts.findSimilar.message', { type: this.t('catalog.charts.findSimilar.types.tag') }, true)
+      });
+    }
 
-      if (this.deprecated) {
-        statuses.push({
-          icon: 'icon-alert-alt', color: 'error', tooltip: { key: 'generic.deprecated' }
-        });
-      }
+    const statuses = [];
 
-      if (this.upgradeable) {
-        statuses.push({
-          icon: 'icon-upgrade-alt', color: 'info', tooltip: { key: 'generic.upgradeable' }
-        });
-      }
+    if (this.deprecated) {
+      statuses.push({
+        icon: 'icon-alert-alt', color: 'error', tooltip: { key: 'generic.deprecated' }
+      });
+    }
 
-      if (this.isInstalled) {
-        const installedVersion = this.matchingInstalledApps[0]?.spec?.chart?.metadata?.version;
+    if (this.upgradeable) {
+      statuses.push({
+        icon: 'icon-upgrade-alt', color: 'info', tooltip: { key: 'generic.upgradeable' }
+      });
+    }
 
-        statuses.push({
-          icon: 'icon-confirmation-alt', color: 'success', tooltip: { text: `${ this.t('generic.installed') } (${ installedVersion })` }
-        });
-      }
+    if (this.isInstalled) {
+      const installedVersion = this.matchingInstalledApps[0]?.spec?.chart?.metadata?.version;
 
-      this._cardContent = {
-        subHeaderItems,
-        footerItems,
-        statuses
-      };
+      statuses.push({
+        icon: 'icon-confirmation-alt', color: 'success', tooltip: { text: `${ this.t('generic.installed') } (${ installedVersion })` }
+      });
     }
 
-    return this._cardContent;
+    return {
+      subHeaderItems,
+      footerItems,
+      statuses
+    };
   }
 }

package/models/management.cattle.io.cluster.js

@@ -15,6 +15,7 @@ import { LINUX, WINDOWS } from '@shell/store/catalog';
 import { KONTAINER_TO_DRIVER } from './management.cattle.io.kontainerdriver';
 import { PINNED_CLUSTERS } from '@shell/store/prefs';
 import { copyTextToClipboard } from '@shell/utils/clipboard';
+import { isHostedProvider } from '@shell/utils/provider';
 
 const DEFAULT_BADGE_COLOR = '#707070';
 
@@ -171,9 +172,20 @@ export default class MgmtCluster extends SteveModel {
     return this.isCondition('Ready');
   }
 
+  get config() {
+    if (!this.spec?.[`${ this.provisioner }Config`]) {
+      const allKeys = Object.keys(this.spec);
+      const configKey = allKeys.find( (k) => k.endsWith('Config'));
+
+      return this.spec[configKey];
+    }
+
+    return this.spec?.[`${ this.provisioner }Config`];
+  }
+
   get kubernetesVersionRaw() {
     const fromStatus = this.status?.version?.gitVersion;
-    const fromSpec = this.spec?.[`${ this.provisioner }Config`]?.kubernetesVersion;
+    const fromSpec = this.config?.kubernetesVersion;
 
     return fromStatus || fromSpec;
   }
@@ -239,9 +251,15 @@ export default class MgmtCluster extends SteveModel {
   }
 
   get isHostedKubernetesProvider() {
-    const providers = ['AKS', 'EKS', 'GKE'];
+    const context = {
+      dispatch:   this.$dispatch,
+      getters:    this.$getters,
+      axios:      this.$axios,
+      $extension: this.$extension,
+      t:          (...args) => this.t.apply(this, args),
+    };
 
-    return providers.includes(this.provisioner);
+    return isHostedProvider(context, this.provisioner);
   }
 
   get providerLogo() {

package/models/provisioning.cattle.io.cluster.js

@@ -16,6 +16,7 @@ import jsyaml from 'js-yaml';
 import { defineAsyncComponent, markRaw } from 'vue';
 import stevePaginationUtils from '@shell/plugins/steve/steve-pagination-utils';
 import { PaginationFilterField, PaginationParamFilter } from '@shell/types/store/pagination.types';
+import { isHostedProvider } from '@shell/utils/provider';
 
 const RKE1_ALLOWED_ACTIONS = [
   'promptRemove',
@@ -272,9 +273,26 @@ export default class ProvCluster extends SteveModel {
   }
 
   get isHostedKubernetesProvider() {
-    const providers = ['AKS', 'EKS', 'GKE'];
+    const context = {
+      dispatch:   this.$dispatch,
+      getters:    this.$getters,
+      axios:      this.$axios,
+      $extension: this.$extension,
+      t:          (...args) => this.t.apply(this, args),
+    };
 
-    return providers.includes(this.provisioner);
+    return isHostedProvider(context, this.provisioner);
+  }
+
+  get providerConfig() {
+    if ( this.isRke2 ) {
+      return this.spec.rkeConfig;
+    }
+    if (this.mgmt && this.mgmt.config) {
+      return this.mgmt.config;
+    }
+
+    return null;
   }
 
   get isPrivateHostedProvider() {
@@ -308,19 +326,21 @@ export default class ProvCluster extends SteveModel {
 
     // imported rke2 and k3s have status.driver === rke2 and k3s respectively
     // Provisioned rke2 and k3s have status.driver === imported
-    if (this.mgmt?.status?.provider === 'k3s' || this.mgmt?.status?.provider === 'rke2') {
-      return this.mgmt?.status?.driver === this.mgmt?.status?.provider;
+    const provider = this.mgmt?.status?.provider;
+    const driver = this.mgmt?.status?.driver;
+
+    // The main case
+    if (provider === 'k3s' || provider === 'rke2') {
+      return driver === provider;
+    }
+    // The 'waiting' case
+    if (!provider && (driver === 'k3s' || driver === 'rke2')) {
+      return true;
     }
 
     // imported KEv2
     // we can't rely on this.provisioner to determine imported-ness for these clusters, as it will return 'aks' 'eks' 'gke' for both provisioned and imported clusters
-    const kontainerConfigs = ['aksConfig', 'eksConfig', 'gkeConfig'];
-
-    const isImportedKontainer = kontainerConfigs.filter((key) => {
-      return this.mgmt?.spec?.[key]?.imported === true;
-    }).length;
-
-    if (isImportedKontainer) {
+    if (this.isHostedKubernetesProvider && !!this.providerConfig.imported) {
       return true;
     }
 

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@rancher/shell",
-  "version": "3.0.8-rc.8",
+  "version": "3.0.8",
   "description": "Rancher Dashboard Shell",
-  "repository": "https://github.com/rancherlabs/dashboard",
+  "repository": "https://github.com/rancher/dashboard",
   "license": "Apache-2.0",
   "author": "SUSE",
   "private": false,
+  "types": "types/shell/index.d.ts",
   "engines": {
     "node": ">=20.0.0"
   },
@@ -38,7 +39,7 @@
     "@babel/preset-typescript": "7.16.7",
     "@novnc/novnc": "1.2.0",
     "@popperjs/core": "2.11.8",
-    "@rancher/icons": "2.0.53",
+    "@rancher/icons": "2.0.54",
     "@types/is-url": "1.2.30",
     "@types/node": "20.10.8",
     "@types/semver": "^7.5.8",
@@ -52,16 +53,16 @@
     "add": "2.0.6",
     "ansi_up": "5.0.0",
     "axios-retry": "3.1.9",
-    "axios": "1.12.2",
+    "axios": "1.13.2",
     "babel-eslint": "10.1.0",
-    "babel-plugin-module-resolver": "4.0.0",
+    "babel-plugin-module-resolver": "5.0.2",
     "babel-preset-vue": "2.0.2",
     "cache-loader": "4.1.0",
-    "chart.js": "4.4.8",
+    "chart.js": "4.5.1",
     "clipboard-polyfill": "4.0.1",
     "codemirror-editor-vue3": "2.8.0",
     "codemirror": ">=5.64.0 <6",
-    "color": "4.2.3",
+    "color": "5.0.3",
     "cookie-universal": "2.2.2",
     "cookie": "0.7.0",
     "core-js": "3.45.0",
@@ -105,7 +106,7 @@
     "jquery": "3.5.1",
     "js-cookie": "3.0.5",
     "js-yaml-loader": "1.2.2",
-    "js-yaml": "4.1.0",
+    "js-yaml": "4.1.1",
     "jsdiff": "1.1.1",
     "jsonpath-plus": "10.3.0",
     "jsrsasign": "11.0.0",
@@ -114,7 +115,7 @@
     "marked": "4.0.17",
     "node-polyfill-webpack-plugin": "3.0.0",
     "nodemon": "2.0.22",
-    "nyc": "15.1.0",
+    "nyc": "17.1.0",
     "papaparse": "5.3.0",
     "portal-vue": "~3.0.0",
     "sass-loader": "12.6.0",
@@ -139,7 +140,7 @@
     "vuedraggable": "4.1.0",
     "vuex": "4.1.0",
     "webpack-bundle-analyzer": "4.10.2",
-    "webpack-virtual-modules": "0.4.3",
+    "webpack-virtual-modules": "0.6.2",
     "worker-loader": "3.0.8",
     "xterm-addon-canvas": "0.5.0",
     "xterm-addon-fit": "0.8.0",

package/pages/auth/login.vue

@@ -137,9 +137,7 @@ export default {
     },
 
     customizations() {
-      const globalSettings = this.$store.getters['management/all'](MANAGEMENT.SETTING);
-      const setting = globalSettings?.find((gs) => gs.id === SETTING.BRAND);
-      const brandMeta = getBrandMeta(setting?.value);
+      const brandMeta = getBrandMeta(this.$store.getters['management/brand']);
       const login = brandMeta?.login || {};
 
       return {
@@ -317,9 +315,9 @@ export default {
         // so we manually load them here - other SSO auth providers bounce out and back to the Dashboard, so on the bounce-back
         // the plugins will load via the boot-time plugin
         await loadPlugins({
-          app:     this.$store.app,
-          store:   this.$store,
-          $plugin: this.$store.$plugin
+          app:        this.$store.app,
+          store:      this.$store,
+          $extension: this.$store.$extension,
         });
 
         if (this.firstLogin || user[0]?.mustChangePassword) {

package/pages/auth/setup.vue

@@ -209,7 +209,7 @@ export default {
       const promises = [];
 
       try {
-        await applyProducts(this.$store, this.$plugin);
+        await applyProducts(this.$store, this.$extension);
         await this.$store.dispatch('loadManagement');
 
         if ( this.mustChangePassword ) {

package/pages/auth/verify.vue

@@ -119,9 +119,9 @@ export default {
 
         // Load plugins
         await loadPlugins({
-          app:     this.$store.app,
-          store:   this.$store,
-          $plugin: this.$store.$plugin
+          app:        this.$store.app,
+          store:      this.$store,
+          $extension: this.$store.$extension,
         });
 
         this.$router.replace(backTo);

package/pages/c/_cluster/apps/charts/__tests__/chart.test.ts

@@ -0,0 +1,135 @@
+import Chart from '@shell/pages/c/_cluster/apps/charts/chart.vue';
+
+jest.mock('clipboard-polyfill', () => ({ writeText: () => {} }));
+
+describe('page: Chart Detail', () => {
+  describe('computed: maintainers', () => {
+    it('should return an empty array if no maintainers are provided', () => {
+      const thisContext = {
+        version:     {},
+        versionInfo: null,
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+
+      expect(result).toStrictEqual([]);
+    });
+
+    it('should return an empty array for empty maintainers arrays', () => {
+      const thisContext = {
+        version:     { maintainers: [] },
+        versionInfo: { chart: { maintainers: [] } },
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+
+      expect(result).toStrictEqual([]);
+    });
+
+    it('should prioritize maintainers from "version"', () => {
+      const thisContext = {
+        version: {
+          maintainers: [
+            { name: 'Version Maintainer', email: 'version@test.com' }
+          ]
+        },
+        versionInfo: {
+          chart: {
+            maintainers: [
+              { name: 'VersionInfo Maintainer', email: 'versioninfo@test.com' }
+            ]
+          }
+        },
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].name).toBe('Version Maintainer');
+    });
+
+    it('should fall back to maintainers from "versionInfo"', () => {
+      const thisContext = {
+        version:     {},
+        versionInfo: {
+          chart: {
+            maintainers: [
+              { name: 'VersionInfo Maintainer', email: 'versioninfo@test.com' }
+            ]
+          }
+        },
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+
+      expect(result).toHaveLength(1);
+      expect(result[0].name).toBe('VersionInfo Maintainer');
+    });
+
+    it('should correctly map all maintainer fields', () => {
+      const thisContext = {
+        version: {
+          maintainers: [
+            {
+              name: 'Full Maintainer', email: 'full@test.com', url: 'http://full.com'
+            }
+          ]
+        },
+        versionInfo: null,
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+      const expected = {
+        id:    'Full Maintainer-0',
+        name:  'Full Maintainer',
+        href:  'http://full.com',
+        label: 'Full Maintainer'
+      };
+
+      expect(result[0]).toStrictEqual(expected);
+    });
+
+    it('should handle maintainers with missing optional fields', () => {
+      const thisContext = {
+        version: {
+          maintainers: [
+            { name: 'No Email Maintainer', url: 'http://noemail.com' },
+            { name: 'No URL Maintainer', email: 'nourl@test.com' },
+            { name: 'Name Only Maintainer' },
+            { url: 'http://noname.com' },
+            { email: 'noname@test.com' }
+          ]
+        },
+        versionInfo: null,
+      };
+      const result = (Chart.computed!.maintainers as () => any[]).call(thisContext);
+
+      expect(result).toHaveLength(5);
+      expect(result[0]).toStrictEqual({
+        id:    'No Email Maintainer-0',
+        name:  'No Email Maintainer',
+        href:  'http://noemail.com',
+        label: 'No Email Maintainer'
+      });
+      expect(result[1]).toStrictEqual({
+        id:    'No URL Maintainer-1',
+        name:  'No URL Maintainer',
+        href:  'mailto:nourl@test.com',
+        label: 'No URL Maintainer'
+      });
+      expect(result[2]).toStrictEqual({
+        id:    'Name Only Maintainer-2',
+        name:  'Name Only Maintainer',
+        href:  null,
+        label: 'Name Only Maintainer'
+      });
+      expect(result[3]).toStrictEqual({
+        id:    'undefined-3',
+        name:  undefined,
+        href:  'http://noname.com',
+        label: 'http://noname.com'
+      });
+      expect(result[4]).toStrictEqual({
+        id:    'undefined-4',
+        name:  undefined,
+        href:  'mailto:noname@test.com',
+        label: 'noname@test.com'
+      });
+    });
+  });
+});

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

@@ -84,11 +84,21 @@ export default {
     maintainers() {
       const maintainers = this.version.maintainers || this.versionInfo?.chart?.maintainers || [];
 
-      return maintainers.map((m) => {
+      return maintainers.map((m, i) => {
+        const label = m.name || m.url || m.email || this.t('generic.unknown');
+        let href = null;
+
+        if (m.url) {
+          href = m.url;
+        } else if (m.email) {
+          href = `mailto:${ m.email }`;
+        }
+
         return {
-          id:   m.name,
-          text: m.name,
-          url:  m.email ? `mailto:${ m.email }` : m.url
+          id:   `${ m.name }-${ i }`,
+          name: m.name,
+          label,
+          href
         };
       });
     },
@@ -456,18 +466,26 @@ export default {
             data-testid="chart-home-link"
           >{{ home }}<i class="icon icon-external-link" /><span class="sr-only">{{ t('generic.opensInNewTab') }}</span></a>
         </div>
-        <div
-          v-if="maintainers.length"
-          class="chart-body__info-section"
-        >
+        <div class="chart-body__info-section">
           <h4>{{ t('catalog.chart.info.maintainers') }}</h4>
-          <a
-            v-for="m of maintainers"
-            :key="m.id"
-            :href="m.url"
-            rel="nofollow noopener noreferrer"
-            target="_blank"
-          >{{ m.text }}<span class="sr-only">{{ t('generic.opensInNewTab') }}</span></a>
+          <template v-if="maintainers.length">
+            <div
+              v-for="m of maintainers"
+              :key="m.id"
+            >
+              <a
+                v-if="m.href"
+                v-clean-tooltip="m.name ? t('catalog.chart.info.maintainerContactTooltip', { maintainer: m.name }) : undefined"
+                :href="m.href"
+                rel="nofollow noopener noreferrer"
+                target="_blank"
+              >
+                {{ m.label }}
+              </a>
+              <span v-else>{{ m.label }}</span>
+            </div>
+          </template>
+          <span v-else>{{ t('generic.unknown') }}</span>
         </div>
         <div
           v-if="version.sources"