@rancher/shell 3.0.12-rc.2 → 3.0.12-rc.4

package/models/workload.js

@@ -1,9 +1,9 @@
 import { findBy, insertAt } from '@shell/utils/array';
 import { CATTLE_PUBLIC_ENDPOINTS } from '@shell/config/labels-annotations';
-import { WORKLOAD_TYPES, SERVICE, POD } from '@shell/config/types';
+import { WORKLOAD_TYPES, SERVICE, INGRESS, POD } from '@shell/config/types';
 import { set } from '@shell/utils/object';
 import day from 'dayjs';
-import { convertSelectorObj, parse, matches } from '@shell/utils/selector';
+import { convertSelectorObj, parse, matches, convert } from '@shell/utils/selector';
 import { SEPARATOR } from '@shell/config/workload';
 import WorkloadService from '@shell/models/workload.service';
 import { matching } from '@shell/utils/selector-typed';
@@ -586,6 +586,29 @@ export default class Workload extends WorkloadService {
     return undefined;
   }
 
+  async fetchSummaries() {
+    const summaries = { pods: null };
+
+    try {
+      if (this.podMatchExpression) {
+        summaries.pods = await this.$dispatch('fetchResourceSummary', {
+          type: POD,
+          opt:  {
+            summaryField:  'metadata.state.name',
+            namespace:     this.metadata.namespace,
+            labelSelector: { matchExpressions: this.podMatchExpression },
+          }
+        });
+      }
+    } catch (e) {
+      console.warn('fetchSummaries: failed to fetch pod summary', e); // eslint-disable-line no-console
+    }
+
+    set(this, '_summaries', summaries);
+
+    return summaries;
+  }
+
   async unWatchPods() {
     return await this.$dispatch('unwatch', { type: POD, all: true });
   }
@@ -747,16 +770,70 @@ export default class Workload extends WorkloadService {
   }
 
   get relatedServices() {
-    // Find Services that have selectors that match this workload's Pod(s).
+    if (this.type === WORKLOAD_TYPES.JOB || this.type === WORKLOAD_TYPES.CRON_JOB) {
+      return [];
+    }
+
+    const podTemplateLabels = this.spec?.template?.metadata?.labels;
+
+    if (!podTemplateLabels || Object.keys(podTemplateLabels).length === 0) {
+      return [];
+    }
+
+    const templateAsObj = { metadata: { labels: podTemplateLabels } };
+
     return this.servicesInNamespace.filter((service) => {
       const selector = service.spec.selector;
 
-      for (let i = 0; i < this.pods.length; i++) {
-        const pod = this.pods[i];
+      if (!selector || typeof selector !== 'object') {
+        return false;
+      }
+
+      return matches(templateAsObj, convert(selector));
+    });
+  }
+
+  get matchingIngresses() {
+    const allIngresses = this.$rootGetters['cluster/all'](INGRESS);
+    const services = this.relatedServices;
 
-        if (service.metadata?.namespace === this.metadata?.namespace && matches(pod, selector)) {
-          return true;
+    if (!services.length) {
+      return [];
+    }
+
+    return allIngresses.filter((ingress) => {
+      try {
+        const rules = ingress.spec?.rules;
+
+        if (!rules || !Array.isArray(rules)) {
+          return false;
         }
+
+        for (const rule of rules) {
+          const paths = rule?.http?.paths;
+
+          if (!paths || !Array.isArray(paths)) {
+            continue;
+          }
+
+          for (const pathData of paths) {
+            const targetServiceName = pathData?.backend?.service?.name;
+
+            if (!targetServiceName) {
+              continue;
+            }
+
+            for (const service of services) {
+              if (ingress.metadata?.namespace === this.metadata?.namespace && service?.metadata?.name === targetServiceName) {
+                return true;
+              }
+            }
+          }
+        }
+      } catch (err) {
+        console.warn(`matchingIngresses: failed to match ingress "${ ingress.id }"`, err); // eslint-disable-line no-console
+
+        return false;
       }
 
       return false;
@@ -764,10 +841,23 @@ export default class Workload extends WorkloadService {
   }
 
   get resourcesCardRows() {
-    return [
-      useResourceCardRow(this.t('component.resource.detail.card.resourcesCard.rows.services'), this.relatedServices, undefined, undefined, '#services'),
-      ...this._resourcesCardRows,
-    ];
+    const rows = [...this._resourcesCardRows];
+    const showsIngressesAndServices = this.type !== WORKLOAD_TYPES.JOB && this.type !== WORKLOAD_TYPES.CRON_JOB;
+
+    if (showsIngressesAndServices) {
+      const services = this.relatedServices || [];
+      const ingresses = this.matchingIngresses || [];
+
+      if (ingresses.length) {
+        rows.unshift(useResourceCardRow(this.t('component.resource.detail.card.resourcesCard.rows.ingresses'), ingresses, undefined, undefined, '#ingresses'));
+      }
+
+      if (services.length) {
+        rows.unshift(useResourceCardRow(this.t('component.resource.detail.card.resourcesCard.rows.services'), services, undefined, undefined, '#services'));
+      }
+    }
+
+    return rows;
   }
 
   get podsCard() {
@@ -779,8 +869,11 @@ export default class Workload extends WorkloadService {
 
     const scalingTypes = [WORKLOAD_TYPES.DEPLOYMENT, WORKLOAD_TYPES.STATEFUL_SET];
     const canScale = this.canUpdate && scalingTypes.includes(this.type);
+    const summaryData = this._summaries?.pods || null;
+    const hasPods = this.pods?.length > 0;
+    const hasSummary = summaryData?.count > 0;
 
-    if (!this.pods || (this.pods.length === 0 && !canScale)) {
+    if (!hasPods && !hasSummary && !canScale) {
       return null;
     }
 
@@ -789,6 +882,7 @@ export default class Workload extends WorkloadService {
       props:     {
         title:              this.t('component.resource.detail.card.podsCard.title'),
         resources:          this.pods,
+        summaryData,
         showScaling:        canScale,
         onIncrease:         () => this.scale(true),
         onDecrease:         () => this.scale(false),
@@ -818,8 +912,9 @@ export default class Workload extends WorkloadService {
     return [
       this.podsCard,
       this.jobsCard,
+      this.resourcesCard,
       this.insightCard,
       ...this._cards
-    ];
+    ].filter((c) => c);
   }
 }

package/models/workload.service.js

@@ -5,8 +5,13 @@ import { WORKLOAD_TYPES, SERVICE } from '@shell/config/types';
 import { clone, get } from '@shell/utils/object';
 import SteveModel from '@shell/plugins/steve/steve-class';
 import { shortenedImage } from '@shell/utils/string';
+import { stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
 
 export default class WorkloadService extends SteveModel {
+  get stateDisplay() {
+    return stateDisplay(this.state, true);
+  }
+
   async getPortsWithServiceType() {
     const ports = [];
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "3.0.12-rc.2",
+  "version": "3.0.12-rc.4",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancher/dashboard",
   "license": "Apache-2.0",
@@ -20,31 +20,27 @@
     "dev": "./node_modules/.bin/vue-cli-service dev",
     "build": "./node_modules/.bin/vue-cli-service build",
     "analyze": "./node_modules/.bin/vue-cli-service build --report",
-    "start": "./node_modules/.bin/vue-cli-service start",
-    "cy:run": "cypress run",
-    "cy:open": "cypress open",
-    "e2e:pre": "NODE_ENV=dev yarn build",
-    "e2e:run": "NODE_ENV=dev START_SERVER_AND_TEST_INSECURE=1 start-server-and-test start  https://localhost:8005/ cy:run",
-    "e2e:dev": "start-server-and-test dev https://localhost:8005 cy:open"
+    "start": "./node_modules/.bin/vue-cli-service start"
   },
   "dependencies": {
-    "@aws-sdk/client-ec2": "3.863.0",
-    "@aws-sdk/client-eks": "3.879.0",
-    "@aws-sdk/client-iam": "3.863.0",
-    "@aws-sdk/client-kms": "3.863.0",
+    "@aws-sdk/client-ec2": "3.1041.0",
+    "@aws-sdk/client-eks": "3.1041.0",
+    "@aws-sdk/client-iam": "3.1041.0",
+    "@aws-sdk/client-kms": "3.1041.0",
     "@babel/plugin-proposal-optional-chaining": "7.21.0",
     "@babel/plugin-proposal-private-methods": "7.18.6",
     "@babel/plugin-proposal-private-property-in-object": "7.14.5",
     "@babel/preset-typescript": "7.16.7",
     "@novnc/novnc": "1.2.0",
     "@popperjs/core": "2.11.8",
-    "@rancher/icons": "2.0.55",
+    "@rancher/icons": "2.0.62",
     "@smithy/fetch-http-handler": "5.1.1",
     "@types/is-url": "1.2.30",
     "@types/node": "25.3.3",
     "@types/semver": "^7.5.8",
     "@typescript-eslint/eslint-plugin": "5.62.0",
     "@typescript-eslint/parser": "5.62.0",
+    "@vee-validate/zod": "4.15.0",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-typescript": "~5.0.0",
     "@vue/cli-service": "5.0.8",
@@ -52,10 +48,9 @@
     "@vue/vue3-jest": "27.0.0",
     "add": "2.0.6",
     "ansi_up": "5.0.0",
-    "axios": "1.15.0",
+    "axios": "1.16.0",
     "axios-retry": "3.1.9",
     "babel-eslint": "10.1.0",
-    "babel-plugin-module-resolver": "5.0.2",
     "babel-preset-vue": "2.0.2",
     "cache-loader": "4.1.0",
     "chart.js": "4.5.1",
@@ -63,50 +58,43 @@
     "codemirror": ">=5.64.0 <6",
     "codemirror-editor-vue3": "2.8.0",
     "color": "5.0.3",
-    "cookie": "0.7.0",
     "cookie-universal": "2.2.2",
     "core-js": "3.48.0",
     "cron-validator": "1.4.0",
     "cronstrue": "3.9.0",
-    "cross-env": "7.0.3",
     "css-loader": "6.7.3",
     "csv-loader": "3.0.3",
     "custom-event-polyfill": "^1.0.7",
-    "cypress": "11.1.0",
     "d3": "7.3.0",
-    "d3-selection": "3.0.0",
     "dayjs": "1.11.18",
+    "diff": "9.0.0",
     "diff2html": "3.4.24",
-    "dompurify": "3.2.5",
+    "dompurify": "3.3.2",
     "element-matches": "^0.1.2",
     "entities": "4.5.0",
     "eslint": "7.32.0",
     "eslint-config-standard": "16.0.3",
     "eslint-import-resolver-node": "0.3.9",
     "eslint-module-utils": "2.6.1",
-    "eslint-plugin-cypress": "2.12.1",
     "eslint-plugin-import": "2.32.0",
     "eslint-plugin-jest": "24.4.0",
     "eslint-plugin-n": "15.2.0",
     "eslint-plugin-vue": "9.32.0",
     "event-target-shim": "5.0.1",
-    "express": "4.17.1",
-    "file-saver": "2.0.2",
+    "express": "4.22.2",
+    "file-saver": "2.0.5",
     "floating-vue": "5.2.2",
     "focus-trap": "7.6.5",
     "frontmatter-markdown-loader": "3.7.0",
     "identicon.js": "2.3.3",
     "intl-messageformat": "7.8.4",
-    "ip": "2.0.1",
     "is-url": "1.2.4",
     "jest": "27.5.1",
     "jest-serializer-vue": "2.0.2",
     "jexl": "2.3.0",
     "jquery": "3.5.1",
-    "js-cookie": "3.0.5",
     "js-yaml": "4.1.1",
     "js-yaml-loader": "1.2.2",
-    "jsdiff": "1.1.1",
     "jsonpath-plus": "10.3.0",
     "jsrsasign": "11.1.1",
     "jszip": "3.10.1",
@@ -120,21 +108,14 @@
     "sass": "1.97.3",
     "sass-loader": "12.6.0",
     "serve-static": "1.14.1",
-    "set-cookie-parser": "2.4.6",
-    "shell-quote": "1.7.3",
-    "sinon": "8.1.1",
-    "start-server-and-test": "2.0.10",
     "style-loader": "1.2.1",
-    "ts-node": "8.10.2",
     "typescript": "5.6.3",
     "ufo": "0.7.11",
     "unfetch": "4.2.0",
-    "url-parse": "1.5.10",
     "vee-validate": "^4.15.1",
     "vue": "3.5.29",
     "vue-router": "4.6.4",
     "vue-select": "4.0.0-beta.6",
-    "vue-server-renderer": "2.7.16",
     "vue3-resize": "0.2.0",
     "vue3-virtual-scroll-list": "0.2.1",
     "vuedraggable": "4.1.0",
@@ -142,12 +123,14 @@
     "webpack-bundle-analyzer": "4.10.2",
     "webpack-virtual-modules": "0.6.2",
     "worker-loader": "3.0.8",
-    "xterm": "5.2.1",
-    "xterm-addon-canvas": "0.5.0",
-    "xterm-addon-fit": "0.8.0",
-    "xterm-addon-search": "0.13.0",
-    "xterm-addon-web-links": "0.9.0",
-    "xterm-addon-webgl": "0.16.0",
+    "xmlbuilder2": "4.0.1",
+    "zod": "3.24.3",
+    "@xterm/xterm": "6.0.0",
+    "@xterm/addon-fit": "0.11.0",
+    "@xterm/addon-search": "0.16.0",
+    "@xterm/addon-web-links": "0.12.0",
+    "@xterm/addon-webgl": "0.19.0",
+    "@xterm/addon-canvas": "0.7.0",
     "yarn": "1.22.22"
   },
   "resolutions": {
@@ -160,7 +143,7 @@
     "merge": "2.1.1",
     "node-forge": "1.3.1",
     "nth-check": "2.1.1",
-    "qs": "6.11.1",
+    "qs": "6.15.2",
     "roarr": "7.0.4",
     "semver": "7.5.4",
     "@types/lodash": "4.17.5",

package/pages/__tests__/readme.test.ts

@@ -0,0 +1,49 @@
+import Readme from '@shell/pages/readme.vue';
+
+describe('page: Readme', () => {
+  describe('computed', () => {
+    it('showAppReadme defaults to false', () => {
+      const thisContext = { $route: { query: {} } };
+
+      const result = (Readme.computed!.showAppReadme as () => boolean).call(thisContext);
+
+      expect(result).toBe(false);
+    });
+
+    it('hideReadmeFirstTitle defaults to false', () => {
+      const thisContext = { $route: { query: {} } };
+
+      const result = (Readme.computed!.hideReadmeFirstTitle as () => boolean).call(thisContext);
+
+      expect(result).toBe(false);
+    });
+
+    it('parses showAppReadme and hideReadmeFirstTitle from query', () => {
+      const thisContext = {
+        $route: {
+          query: {
+            showAppReadme:        'true',
+            hideReadmeFirstTitle: 'true',
+          }
+        }
+      };
+
+      const showAppReadme = (Readme.computed!.showAppReadme as () => boolean).call(thisContext);
+      const hideReadmeFirstTitle = (Readme.computed!.hideReadmeFirstTitle as () => boolean).call(thisContext);
+
+      expect(showAppReadme).toBe(true);
+      expect(hideReadmeFirstTitle).toBe(true);
+    });
+  });
+
+  describe('fetch', () => {
+    it('calls fetchChart', async() => {
+      const fetchChart = jest.fn();
+      const thisContext = { fetchChart };
+
+      await (Readme.fetch as () => Promise<void>).call(thisContext);
+
+      expect(fetchChart).toHaveBeenCalledWith();
+    });
+  });
+});

package/pages/about.vue

@@ -10,10 +10,11 @@ import TabTitle from '@shell/components/TabTitle';
 import { PanelLocation, ExtensionPoint } from '@shell/core/types';
 import ExtensionPanel from '@shell/components/ExtensionPanel';
 import { getVersionInfo } from '@shell/utils/version';
+import { RcButton } from '@components/RcButton';
 
 export default {
   components: {
-    BackLink, ExtensionPanel, Loading, TabTitle
+    BackLink, ExtensionPanel, Loading, TabTitle, RcButton
   },
   mixins: [BackRoute],
   async fetch() {
@@ -85,16 +86,14 @@ export default {
           {{ t('about.title') }}
         </TabTitle>
       </h1>
-      <router-link
+      <rc-button
+        size="large"
         :to="{ name: 'diagnostic' }"
-        class="btn role-primary"
         data-testid="about__diagnostics_button"
-        role="button"
         :aria-label="t('about.diagnostic.title')"
-        @keyup.space="$router.push({ name: 'diagnostic' })"
       >
         {{ t('about.diagnostic.title') }}
-      </router-link>
+      </rc-button>
     </div>
     <!-- Extensions area -->
     <ExtensionPanel

package/pages/auth/login.vue

@@ -410,41 +410,6 @@ export default {
             k="setup.defaultPassword.intro"
             :raw="true"
           />
-
-          <div>
-            <t
-              k="setup.defaultPassword.dockerPrefix"
-              :raw="true"
-            />
-          </div>
-          <ul>
-            <li>
-              <t
-                k="setup.defaultPassword.dockerPs"
-                :raw="true"
-              />
-            </li>
-            <li>
-              <CopyCode>
-                docker logs <u>container-id</u> 2&gt;&amp;1 | grep "Bootstrap Password:"
-              </CopyCode>
-            </li>
-          </ul>
-          <div>
-            <t
-              k="setup.defaultPassword.dockerSuffix"
-              :raw="true"
-            />
-          </div>
-
-          <br>
-          <div>
-            <t
-              k="setup.defaultPassword.helmPrefix"
-              :raw="true"
-            />
-          </div>
-          <br>
           <CopyCode>
             {{ kubectlCmd }}
           </CopyCode>

package/pages/auth/setup.vue

@@ -17,10 +17,10 @@ import BrandImage from '@shell/components/BrandImage';
 import { waitFor } from '@shell/utils/async';
 import { Banner } from '@components/Banner';
 import FormValidation from '@shell/mixins/form-validation';
-import isUrl from 'is-url';
-import { isLocalhost } from '@shell/utils/validators/setting';
+import { isLocalhost, isValidUrl } from '@shell/utils/validators/setting';
 import Loading from '@shell/components/Loading';
 import { getBrandMeta } from '@shell/utils/brand';
+import { findMe } from '@shell/utils/auth';
 
 const calcIsFirstLogin = (store) => {
   const firstLoginSetting = store.getters['management/byId'](MANAGEMENT.SETTING, SETTING.FIRST_LOGIN);
@@ -78,6 +78,16 @@ export default {
       // Always show setup if this is the first log in
       return;
     } else if (mustChangePassword) {
+      // Skip password change for non-local sessions
+      try {
+        const me = await findMe(this.$store);
+
+        if (me && me.provider !== 'local') {
+          return this.$router.replace('/');
+        }
+      } catch (e) {
+      }
+
       // If the password needs changing and this isn't the first log in ensure we have the password
       if (!!this.$store.getters['auth/initialPass']) {
         // Got it... show setup
@@ -171,7 +181,7 @@ export default {
         }
       }
 
-      if (!isUrl(this.serverUrl) || this.fvGetPathErrors(['serverUrl']).length > 0) {
+      if (!isValidUrl(this.serverUrl) || this.fvGetPathErrors(['serverUrl']).length > 0) {
         return false;
       }
 

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

@@ -3,7 +3,7 @@ import { reactive } from 'vue';
 import { RcItemCardAction } from '@components/RcItemCard';
 import { RcButton } from '@components/RcButton';
 import { isTruncated } from '@shell/utils/style';
-import RcIcon from '@components/RcIcon/RcIcon.vue';
+import { RcIcon } from '@components/RcIcon';
 import type { RcIconType } from '@components/RcIcon/types';
 
 interface FooterItem {
@@ -195,7 +195,7 @@ function getTooltip(key: string, fallback?: string): string | undefined {
   }
 }
 
-button.variant-ghost.app-chart-card-footer-button {
+button.rc-button.variant-ghost.app-chart-card-footer-button {
   padding: 0;
   gap: 0;
   min-height: 20px;

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

@@ -9,12 +9,16 @@ interface SubHeaderItem {
 
 defineProps<{
   items: SubHeaderItem[];
+  removeMarginBottom?: boolean;
 }>();
 
 </script>
 
 <template>
-  <div class="app-chart-card-sub-header">
+  <div
+    class="app-chart-card-sub-header"
+    :class="{ 'no-margin-bottom': removeMarginBottom }"
+  >
     <div
       v-for="(subHeaderItem, i) in items"
       :key="i"
@@ -38,8 +42,13 @@ defineProps<{
   flex-wrap: wrap;
   gap: var(--gap) var(--gap-md);
   color: var(--link-text-secondary);
+  height: 22px;
   margin-bottom: 8px;
 
+  &.no-margin-bottom {
+    margin-bottom: 0;
+  }
+
   &-item {
     display: flex;
     align-items: center;

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

@@ -1,5 +1,8 @@
 import Chart from '@shell/pages/c/_cluster/apps/charts/chart.vue';
 import { APP_UPGRADE_STATUS } from '@shell/store/catalog';
+import {
+  CHART, REPO, REPO_TYPE, VERSION, DEPRECATED
+} from '@shell/config/query-params';
 
 jest.mock('clipboard-polyfill', () => ({ writeText: () => {} }));
 
@@ -321,4 +324,77 @@ describe('page: Chart Detail', () => {
       expect(result[2].label).toBe('monitoring/app-three');
     });
   });
+
+  describe('methods: openReadme', () => {
+    it('opens standalone readme URL with chart context and without theme query', () => {
+      const openSpy = jest.spyOn(window, 'open').mockImplementation(() => null);
+      const resolve = jest.fn(() => ({ href: '/c/local/readme?x=y' }));
+      const thisContext = {
+        $router: { resolve },
+        $route:  { params: { cluster: 'local' } },
+        query:   {
+          repoType:    'cluster',
+          repoName:    'rancher-charts',
+          chartName:   'test-chart',
+          versionName: '',
+          deprecated:  'false',
+        },
+        targetVersion: '1.2.3'
+      };
+
+      (Chart.methods!.openReadme as () => void).call(thisContext);
+
+      expect(resolve).toHaveBeenCalledWith({
+        name:   'readme',
+        params: { cluster: 'local' },
+        query:  {
+          [REPO_TYPE]:          'cluster',
+          [REPO]:               'rancher-charts',
+          [CHART]:              'test-chart',
+          [VERSION]:            '1.2.3',
+          [DEPRECATED]:         'false',
+          showAppReadme:        'false',
+          hideReadmeFirstTitle: 'false',
+        }
+      });
+      expect(openSpy).toHaveBeenCalledWith('/c/local/readme?x=y', '_blank');
+      openSpy.mockRestore();
+    });
+  });
+
+  describe('methods: installNewInstance', () => {
+    it('should navigate to install page with correct query parameters', () => {
+      const mockRouterPush = jest.fn();
+      const thisContext = {
+        $router: { push: mockRouterPush },
+        $route:  { params: { cluster: 'local' } },
+        $store:  { getters: { productId: 'explorer' } },
+        query:   {
+          repoType:    'cluster',
+          repoName:    'rancher-charts',
+          chartName:   'my-chart',
+          versionName: '1.2.3',
+          deprecated:  'false'
+        }
+      };
+
+      (Chart.methods!.installNewInstance as () => void).call(thisContext);
+
+      expect(mockRouterPush).toHaveBeenCalledWith({
+        name:   'c-cluster-apps-charts-install',
+        params: {
+          cluster: 'local',
+          product: 'explorer',
+        },
+        query: {
+          'repo-type':    'cluster',
+          repo:           'rancher-charts',
+          chart:          'my-chart',
+          version:        '1.2.3',
+          deprecated:     'false',
+          'new-instance': null
+        }
+      });
+    });
+  });
 });