@rancher/shell 3.0.5-rc.8 → 3.0.5

package/models/__tests__/namespace.test.ts

@@ -186,4 +186,73 @@ describe('class Namespace', () => {
   it.todo('should return the resourceQuota');
   it.todo('should set the resourceQuota as reactive Vue property');
   it.todo('should reset project with cleanForNew');
+
+  describe('glance', () => {
+    it('should return projectGlance instead of namespace when namespace is in a project', () => {
+      const t = jest.fn((key) => key);
+      const ctx = { rootGetters: { 'i18n/t': t } };
+      const namespace = new Namespace({}, ctx);
+
+      const project = {
+        detailLocation: 'project-detail',
+        nameDisplay:    'My Project',
+      };
+
+      jest.spyOn(namespace, 'project', 'get').mockReturnValue(project);
+      Object.defineProperty(namespace, '_glance', { get: jest.fn(() => [{ name: 'namespace' }, { name: 'other' }]) });
+
+      const result = namespace.glance;
+
+      expect(result).toHaveLength(2);
+      expect(result[0].name).toBe('project');
+      expect(result[0].label).toBe('component.resource.detail.glance.project');
+      expect(result[0].formatter).toBe('Link');
+      expect(result[0].formatterOpts?.to).toBe('project-detail');
+      expect(result[0].content).toBe('My Project');
+      expect(result[1].name).toBe('other');
+    });
+
+    it('should remove namespace from glance when namespace is not in a project', () => {
+      const namespace = new Namespace({});
+
+      jest.spyOn(namespace, 'project', 'get').mockReturnValue(null);
+      Object.defineProperty(namespace, '_glance', { get: jest.fn(() => [{ name: 'namespace' }, { name: 'other' }]) });
+
+      const result = namespace.glance;
+
+      expect(result).toHaveLength(1);
+      expect(result[0].name).toBe('other');
+    });
+  });
+
+  describe('projectGlance', () => {
+    it('should return undefined if namespace is not in a project', () => {
+      const namespace = new Namespace({});
+
+      jest.spyOn(namespace, 'project', 'get').mockReturnValue(null);
+
+      expect(namespace.projectGlance).toBeUndefined();
+    });
+
+    it('should return project glance information if namespace is in a project', () => {
+      const t = jest.fn((key) => key);
+      const ctx = { rootGetters: { 'i18n/t': t } };
+      const namespace = new Namespace({}, ctx);
+
+      const project = {
+        detailLocation: 'project-detail',
+        nameDisplay:    'My Project',
+      };
+
+      jest.spyOn(namespace, 'project', 'get').mockReturnValue(project);
+
+      const result = namespace.projectGlance;
+
+      expect(result?.name).toBe('project');
+      expect(result?.label).toBe('component.resource.detail.glance.project');
+      expect(result?.formatter).toBe('Link');
+      expect(result?.formatterOpts.to).toBe('project-detail');
+      expect(result?.content).toBe('My Project');
+    });
+  });
 });

package/models/apps.statefulset.js

@@ -1,5 +1,5 @@
 import Workload from './workload';
-import { WORKLOAD_TYPES, POD, WORKLOAD_TYPE_TO_KIND_MAPPING } from '@shell/config/types';
+import { WORKLOAD_TYPES, WORKLOAD_TYPE_TO_KIND_MAPPING } from '@shell/config/types';
 
 export default class StatefulSet extends Workload {
   async rollBack(cluster, statefulSet, revision) {
@@ -21,16 +21,14 @@ export default class StatefulSet extends Workload {
     await this.rollBackWorkload(cluster, statefulSet, 'statefulsets', body);
   }
 
-  // we need to provide a new pods getter for statefulsets because the relationship
-  // done on the parent model "workload" is not correct
+  /**
+   * See fetchPods description for more info
+   */
   get pods() {
-    const relationships = this.metadata?.relationships || [];
-    const podRelationship = relationships.filter((relationship) => relationship.toType === POD)[0];
-
-    if (podRelationship) {
-      const pods = this.$getters['podsByNamespace'](this.metadata.namespace);
-
-      return pods.filter((pod) => {
+    if (this.podMatchExpression) {
+      // Given https://github.com/rancher/dashboard/issues/7555 we want to avoid scenarios where we show pods that have an applicable label but aren't applicable (?!)
+      // super.pods is the pods that match the statefulsets podSelector, so start from that and then filter further by pod's owner
+      return super.pods.filter((pod) => {
         // a bit of a duplication of podRelationship, but always safe to check...
         if (pod.metadata?.ownerReferences?.length) {
           const ownerReferencesStatefulSet = pod.metadata?.ownerReferences?.find((own) => own.kind === WORKLOAD_TYPE_TO_KIND_MAPPING[WORKLOAD_TYPES.STATEFUL_SET]);

package/models/chart.js

@@ -1,6 +1,6 @@
 import { compatibleVersionsFor, APP_UPGRADE_STATUS } from '@shell/store/catalog';
 import {
-  REPO_TYPE, REPO, CHART, VERSION, _FLAGGED, HIDE_SIDE_NAV, CATEGORY, TAG
+  REPO_TYPE, REPO, CHART, VERSION, _FLAGGED, HIDE_SIDE_NAV, CATEGORY, TAG, DEPRECATED as DEPRECATED_QUERY
 } from '@shell/config/query-params';
 import { BLANK_CLUSTER } from '@shell/store/store-types.js';
 import SteveModel from '@shell/plugins/steve/steve-class';
@@ -29,6 +29,10 @@ export default class Chart extends SteveModel {
       [VERSION]:   version,
     };
 
+    if (this.deprecated) {
+      out[DEPRECATED_QUERY] = true;
+    }
+
     if ( from ) {
       out[from] = _FLAGGED;
     }

package/models/fleet-application.js

@@ -1,7 +1,7 @@
 import { matching, convertSelectorObj } from '@shell/utils/selector';
 import isEmpty from 'lodash/isEmpty';
 import { escapeHtml } from '@shell/utils/string';
-import { FLEET, MANAGEMENT } from '@shell/config/types';
+import { FLEET } from '@shell/config/types';
 import { FLEET as FLEET_ANNOTATIONS } from '@shell/config/labels-annotations';
 import { addObject, addObjects, findBy } from '@shell/utils/array';
 import SteveModel from '@shell/plugins/steve/steve-class';
@@ -29,8 +29,19 @@ function normalizeStateCounts(data) {
 }
 
 export default class FleetApplication extends SteveModel {
-  get currentUser() {
-    return this.$rootGetters['auth/v3User'] || {};
+  async getCurrentUser() {
+    const user = this.$rootGetters['auth/v3User'];
+
+    if (user?.id) {
+      return user;
+    }
+
+    const res = await this.$dispatch('rancher/request', {
+      url:    '/v3/users?me=true',
+      method: 'get',
+    }, { root: true });
+
+    return res?.data?.[0] || {};
   }
 
   pause() {
@@ -48,10 +59,6 @@ export default class FleetApplication extends SteveModel {
       delete this.metadata.labels[FLEET_ANNOTATIONS.CREATED_BY_USER_ID];
     }
 
-    if (this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME]) {
-      delete this.metadata.labels[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME];
-    }
-
     super.goToClone();
   }
 
@@ -144,11 +151,11 @@ export default class FleetApplication extends SteveModel {
   }
 
   statusResourceCountsForCluster(clusterId) {
-    if (!this.targetClusters.some((c) => c.id === clusterId)) {
+    if (!(this.targetClusters || []).some((c) => c.id === clusterId)) {
       return {};
     }
 
-    return this.status?.perClusterResourceCounts[clusterId] || { desiredReady: 0 };
+    return this.status?.perClusterResourceCounts?.[clusterId] || { desiredReady: 0 };
   }
 
   get resourcesStatuses() {
@@ -224,43 +231,6 @@ export default class FleetApplication extends SteveModel {
     return primaryDisplayStatusFromCount(resourceCounts) || STATES_ENUM.ACTIVE;
   }
 
-  get authorId() {
-    return this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_ID];
-  }
-
-  get author() {
-    if (this.authorId) {
-      return this.$rootGetters['management/byId'](MANAGEMENT.USER, this.authorId);
-    }
-
-    return null;
-  }
-
-  get createdBy() {
-    const displayName = this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME];
-
-    if (!displayName) {
-      return null;
-    }
-
-    return {
-      displayName,
-      location: !this.author ? null : {
-        name:   'c-cluster-product-resource-id',
-        params: {
-          cluster:  '_',
-          product:  'auth',
-          resource: MANAGEMENT.USER,
-          id:       this.author.id,
-        }
-      }
-    };
-  }
-
-  get showCreatedBy() {
-    return !!this.createdBy;
-  }
-
   get clustersList() {
     return this.$getters['all'](FLEET.CLUSTER);
   }

package/models/fleet.cattle.io.bundle.js

@@ -1,7 +1,7 @@
 import { escapeHtml, ucFirst } from '@shell/utils/string';
 import SteveModel from '@shell/plugins/steve/steve-class';
 import { addObject, addObjects, findBy } from '@shell/utils/array';
-import { FLEET, MANAGEMENT } from '@shell/config/types';
+import { FLEET } from '@shell/config/types';
 import { FLEET as FLEET_ANNOTATIONS } from '@shell/config/labels-annotations';
 import { convertSelectorObj, matching } from '@shell/utils/selector';
 
@@ -129,41 +129,4 @@ export default class FleetBundle extends SteveModel {
       );
     }
   }
-
-  get authorId() {
-    return this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_ID];
-  }
-
-  get author() {
-    if (this.authorId) {
-      return this.$rootGetters['management/byId'](MANAGEMENT.USER, this.authorId);
-    }
-
-    return null;
-  }
-
-  get createdBy() {
-    const displayName = this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME];
-
-    if (!displayName) {
-      return null;
-    }
-
-    return {
-      displayName,
-      location: !this.author ? null : {
-        name:   'c-cluster-product-resource-id',
-        params: {
-          cluster:  '_',
-          product:  'auth',
-          resource: MANAGEMENT.USER,
-          id:       this.author.id,
-        }
-      }
-    };
-  }
-
-  get showCreatedBy() {
-    return !!this.createdBy;
-  }
 }

package/models/fleet.cattle.io.gitrepo.js

@@ -209,4 +209,8 @@ export default class GitRepo extends FleetApplication {
       display: this.commitDisplay
     };
   }
+
+  get fullDetailPageOverride() {
+    return true;
+  }
 }

package/models/fleet.cattle.io.helmop.js

@@ -199,4 +199,8 @@ export default class HelmOp extends FleetApplication {
   get bundleDeployments() {
     return this.$getters['matching'](FLEET.BUNDLE_DEPLOYMENT, { [FLEET_ANNOTATIONS.HELM_NAME]: this.name });
   }
+
+  get fullDetailPageOverride() {
+    return true;
+  }
 }

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

@@ -278,7 +278,7 @@ export default class MgmtCluster extends SteveModel {
 
   // Color to use as the underline for the icon in the app bar
   get iconColor() {
-    return this.metadata?.annotations[CLUSTER_BADGE.COLOR];
+    return this.metadata?.annotations?.[CLUSTER_BADGE.COLOR];
   }
 
   // Custom badge to show for the Cluster (if the appropriate annotations are set)

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

@@ -179,4 +179,16 @@ export default class Project extends HybridModel {
   get confirmRemove() {
     return true;
   }
+
+  get glance() {
+    const glance = [...this._glance];
+
+    const namespaceIndex = glance.findIndex((item) => item.name === 'namespace');
+
+    if (namespaceIndex > -1) {
+      glance.splice(namespaceIndex, 1);
+    }
+
+    return glance;
+  }
 }

package/models/namespace.js

@@ -269,4 +269,34 @@ export default class Namespace extends SteveModel {
   get hideDetailLocation() {
     return !!this.$rootGetters['currentProduct'].hideNamespaceLocation;
   }
+
+  get glance() {
+    const glance = [...this._glance];
+
+    const namespaceIndex = glance.findIndex((item) => item.name === 'namespace');
+
+    if (namespaceIndex > -1) {
+      glance.splice(namespaceIndex, 1, this.projectGlance);
+    }
+
+    // projectGlance could be undefined
+    return glance.filter(Boolean);
+  }
+
+  get projectGlance() {
+    // Not all namespaces are in a project
+    if (!this.project) {
+      return undefined;
+    }
+
+    return {
+      name:          'project',
+      label:         this.t('component.resource.detail.glance.project'),
+      formatter:     'Link',
+      formatterOpts: {
+        to: this.project.detailLocation, row: {}, options: { internal: true }
+      },
+      content: this.project.nameDisplay
+    };
+  }
 }

package/models/workload.js

@@ -43,7 +43,7 @@ export default class Workload extends WorkloadService {
       insertAt(out, 0, {
         action:  'toggleRollbackModal',
         label:   this.t('action.rollback'),
-        icon:    'icon icon-history',
+        icon:    'icon icon-downgrade-alt',
         enabled: !!this.links.update,
       });
 
@@ -595,6 +595,9 @@ export default class Workload extends WorkloadService {
     return selector;
   }
 
+  /**
+   * Match Expression version of the podSelector
+   */
   get podMatchExpression() {
     return this.podSelector ? parse(this.podSelector) : null;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "3.0.5-rc.8",
+  "version": "3.0.5",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@aws-sdk/client-ec2": "3.863.0",
-    "@aws-sdk/client-eks": "3.863.0",
+    "@aws-sdk/client-eks": "3.879.0",
     "@aws-sdk/client-iam": "3.863.0",
     "@aws-sdk/client-kms": "3.863.0",
     "@smithy/fetch-http-handler": "5.1.1",
@@ -52,7 +52,7 @@
     "add": "2.0.6",
     "ansi_up": "5.0.0",
     "axios-retry": "3.1.9",
-    "axios": "1.8.4",
+    "axios": "1.12.2",
     "babel-eslint": "10.1.0",
     "babel-plugin-module-resolver": "4.0.0",
     "babel-preset-vue": "2.0.2",
@@ -64,7 +64,7 @@
     "color": "4.2.3",
     "cookie-universal": "2.2.2",
     "cookie": "0.7.0",
-    "core-js": "3.40.0",
+    "core-js": "3.45.0",
     "cron-validator": "1.4.0",
     "cronstrue": "2.53.0",
     "cross-env": "7.0.3",
@@ -74,7 +74,7 @@
     "cypress": "11.1.0",
     "d3-selection": "3.0.0",
     "d3": "7.3.0",
-    "dayjs": "1.8.29",
+    "dayjs": "1.11.18",
     "defu": "5.0.1",
     "diff2html": "3.4.24",
     "dompurify": "3.2.5",
@@ -84,7 +84,7 @@
     "eslint-import-resolver-node": "0.3.9",
     "eslint-module-utils": "2.6.1",
     "eslint-plugin-cypress": "2.12.1",
-    "eslint-plugin-import": "2.31.0",
+    "eslint-plugin-import": "2.32.0",
     "eslint-plugin-jest": "24.4.0",
     "eslint-plugin-n": "15.2.0",
     "eslint-plugin-vue": "9.32.0",
@@ -130,15 +130,15 @@
     "ufo": "0.7.11",
     "unfetch": "4.2.0",
     "url-parse": "1.5.10",
-    "vue-router": "4.5.0",
+    "vue-router": "4.5.1",
     "vue-select": "4.0.0-beta.6",
     "vue-server-renderer": "2.7.16",
-    "vue": "^3.2.13",
+    "vue": "3.5.18",
     "vue3-resize": "0.2.0",
     "vue3-virtual-scroll-list": "0.2.1",
     "vuedraggable": "4.1.0",
     "vuex": "4.1.0",
-    "webpack-bundle-analyzer": "4.5.0",
+    "webpack-bundle-analyzer": "4.10.2",
     "webpack-virtual-modules": "0.4.3",
     "worker-loader": "3.0.8",
     "xterm-addon-canvas": "0.5.0",
@@ -172,4 +172,4 @@
       ".vue"
     ]
   }
-}
+}

package/pages/auth/login.vue

@@ -134,7 +134,8 @@ export default {
   },
 
   async fetch() {
-    const username = this.$cookies.get(USERNAME, { parseJSON: false }) || '';
+    const cookie = this.$store.getters['cookies/get']({ key: USERNAME, options: { parseJSON: false } });
+    const username = cookie || '';
 
     this.username = username;
     this.remember = !!username;
@@ -272,15 +273,19 @@ export default {
         }
 
         if ( this.remember ) {
-          this.$cookies.set(USERNAME, this.username, {
+          const options = {
             encode:   (x) => x,
             maxAge:   86400 * 365,
             path:     '/',
             sameSite: true,
             secure:   true,
+          };
+
+          this.$store.commit('cookies/set', {
+            key: USERNAME, value: this.username, options
           });
         } else {
-          this.$cookies.remove(USERNAME);
+          this.$store.commit('cookies/remove', { key: USERNAME });
         }
 
         // User logged with local login - we don't do any redirect/reload, so the boot-time plugin will not run again to laod the plugins

package/pages/auth/logout.vue

@@ -1,19 +1,20 @@
 <script>
 import { configType } from '@shell/models/management.cattle.io.authconfig';
+import { SLO_AUTH_PROVIDERS } from '@shell/store/auth';
 
 export default {
   async fetch() {
     const publicAuthProviders = await this.$store.dispatch('auth/getAuthProviders');
 
-    const samlAuthProvider = publicAuthProviders.find((authProvider) => configType[authProvider.id] === 'saml');
+    const sloAuthProvider = publicAuthProviders.find((authProvider) => SLO_AUTH_PROVIDERS.includes(configType[authProvider?.id]));
 
-    if (!!samlAuthProvider) {
-      const { logoutAllSupported, logoutAllEnabled, logoutAllForced } = samlAuthProvider;
+    if (!!sloAuthProvider) {
+      const { logoutAllSupported, logoutAllEnabled, logoutAllForced } = sloAuthProvider;
 
       if (logoutAllSupported && logoutAllEnabled && logoutAllForced) {
-        // SAML - force SLO (logout from all apps)
+        // force SLO (logout from all apps)
         await this.$store.dispatch('auth/logout', {
-          force: true, slo: true, provider: samlAuthProvider
+          force: true, slo: true, provider: sloAuthProvider
         }, { root: true });
       } else {
         // simple logout

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

@@ -5,12 +5,15 @@ interface FooterItem {
   icon?: string;
   iconTooltip?: Record<{key?: string, text?: string}>;
   labels: string[];
+  labelTooltip?: string;
+  type?: string;
 }
 
 const emit = defineEmits<{(e: 'click:item', type: string, label: string): void; }>();
 
 defineProps<{
   items: FooterItem[];
+  clickable?: boolean;
 }>();
 
 function onClickItem(type: string, label: string) {
@@ -32,20 +35,32 @@ function onClickItem(type: string, label: string) {
         v-clean-tooltip="t(footerItem.iconTooltip?.key)"
         :class="['icon', 'app-chart-card-footer-item-icon', footerItem.icon]"
       />
-      <rc-item-card-action
+      <template
         v-for="(label, j) in footerItem.labels"
         :key="j"
-        v-clean-tooltip="footerItem.labelTooltip"
-        class="app-chart-card-footer-item-text secondary-text-link"
-        data-testid="app-chart-card-footer-item-text"
-        tabindex="0"
-        :aria-label="t('catalog.charts.appChartCard.footerItem.ariaLabel')"
-        @click="onClickItem(footerItem.type, label)"
-        @keydown.enter="onClickItem(footerItem.type, label)"
-        @keydown.space.prevent="onClickItem(footerItem.type, label)"
       >
-        {{ label }}<span v-if="footerItem.labels.length > 1 && j !== footerItem.labels.length - 1">, </span>
-      </rc-item-card-action>
+        <rc-item-card-action
+          v-if="clickable && footerItem.type"
+          v-clean-tooltip="footerItem.labelTooltip"
+          class="app-chart-card-footer-item-text secondary-text-link"
+          data-testid="app-chart-card-footer-item-text"
+          tabindex="0"
+          :aria-label="t('catalog.charts.appChartCard.footerItem.ariaLabel')"
+          @click="onClickItem(footerItem.type, label)"
+        >
+          {{ label }}
+          <span v-if="footerItem.labels.length > 1 && j !== footerItem.labels.length - 1">, </span>
+        </rc-item-card-action>
+        <span
+          v-else
+          v-clean-tooltip="footerItem.labelTooltip"
+          class="app-chart-card-footer-item-text"
+          data-testid="app-chart-card-footer-item-text"
+        >
+          {{ label }}
+          <span v-if="footerItem.labels.length > 1 && j !== footerItem.labels.length - 1">, </span>
+        </span>
+      </template>
     </div>
   </div>
 </template>

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

@@ -6,7 +6,7 @@ import ChartReadme from '@shell/components/ChartReadme';
 import LazyImage from '@shell/components/LazyImage';
 import isEqual from 'lodash/isEqual';
 import {
-  CHART, REPO, REPO_TYPE, VERSION, SEARCH_QUERY, CATEGORY, TAG
+  CHART, REPO, REPO_TYPE, VERSION, SEARCH_QUERY, CATEGORY, TAG, DEPRECATED
 } from '@shell/config/query-params';
 import { DATE_FORMAT } from '@shell/store/prefs';
 import { ZERO_TIME } from '@shell/config/types';
@@ -50,7 +50,14 @@ export default {
     ...mapGetters(['currentCluster']),
 
     headerContent() {
-      return this.chart.cardContent;
+      return {
+        ...this.chart.cardContent,
+        subHeaderItems: this.chart.cardContent.subHeaderItems.map((item, i) => i === 0 ? ({
+          icon:        'icon-version-alt',
+          iconTooltip: { key: 'tableHeaders.version' },
+          label:       this.query.versionName
+        }) : item)
+      };
     },
 
     versions() {
@@ -144,10 +151,11 @@ export default {
           product: this.$store.getters['productId'],
         },
         query: {
-          [REPO_TYPE]: this.query.repoType,
-          [REPO]:      this.query.repoName,
-          [CHART]:     this.query.chartName,
-          [VERSION]:   this.query.versionName,
+          [REPO_TYPE]:  this.query.repoType,
+          [REPO]:       this.query.repoName,
+          [CHART]:      this.query.chartName,
+          [VERSION]:    this.query.versionName,
+          [DEPRECATED]: this.query.deprecated,
         }
       });
     },
@@ -210,17 +218,6 @@ export default {
 <template>
   <Loading v-if="$fetchState.pending" />
   <main v-else>
-    <Banner
-      v-if="versionInfoError"
-      color="error"
-      :label="versionInfoError"
-    />
-    <Banner
-      v-if="warningMessage"
-      color="warning"
-      :label="warningMessage"
-      data-testid="deprecation-and-experimental-banner"
-    />
     <div
       v-if="chart"
       class="chart-header"
@@ -284,6 +281,7 @@ export default {
         </div>
         <div class="header-bottom">
           <AppChartCardFooter
+            :clickable="true"
             :items="headerContent.footerItems"
             @click:item="handleHeaderItemClick"
           />
@@ -296,15 +294,26 @@ export default {
         @click.prevent="install"
       >
         <i
-          v-if="action === 'upgrade'"
-          class="icon icon-upgrade-alt mmr-2"
+          :class="['icon', action.icon, 'mmr-2']"
         />
-        {{ t(`asyncButton.${action}.action` ) }}
+        {{ t(`catalog.chart.chartButton.action.${action.tKey}` ) }}
       </RcButton>
     </div>
 
     <div class="dashed-spacer" />
 
+    <Banner
+      v-if="versionInfoError"
+      color="error"
+      :label="versionInfoError"
+    />
+    <Banner
+      v-if="warningMessage"
+      color="warning"
+      :label="warningMessage"
+      data-testid="deprecation-and-experimental-banner"
+    />
+
     <div
       v-if="requires.length || warnings.length || targetedAppWarning || osWarning"
       class="chart-banners"