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

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

@@ -17,7 +17,7 @@ import { KEV1 } from './management.cattle.io.kontainerdriver';
 import { requireAsset } from '@shell/utils/require-asset';
 import { PINNED_CLUSTERS } from '@shell/store/prefs';
 import { copyTextToClipboard } from '@shell/utils/clipboard';
-import { isHostedProvider } from '@shell/utils/provider';
+import { isHostedProvider, isCAPIProvider } from '@shell/utils/provider';
 import { ucFirst } from '@shell/utils/string';
 import { sortBy } from '@shell/utils/sort';
 
@@ -180,7 +180,7 @@ export default class MgmtCluster extends SteveModel {
   }
 
   get machineProvider() {
-    return this.status?.info.machineProvider;
+    return this.status?.info?.machineProvider;
   }
 
   get machineProviderDisplay() {
@@ -261,6 +261,22 @@ export default class MgmtCluster extends SteveModel {
     return !!capiMachines;
   }
 
+  get isCAPIProvider() {
+    if (!this.isCapiHybrid || !this.machineProvider) {
+      return false;
+    }
+
+    const context = {
+      dispatch:   this.$dispatch,
+      getters:    this.$getters,
+      axios:      this.$axios,
+      $extension: this.$extension,
+      t:          (...args) => this.t.apply(this, args),
+    };
+
+    return isCAPIProvider(context, this.machineProvider.toLowerCase());
+  }
+
   get isHostedKubernetesProvider() {
     const context = {
       dispatch:   this.$dispatch,

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

@@ -10,7 +10,8 @@ import { notOnlyOfRole } from '@shell/models/cluster.x-k8s.io.machine';
 const RKE1_ALLOWED_ACTIONS = [
   'goToViewYaml',
   'download',
-  'viewInApi'
+  'viewInApi',
+  'showConfiguration'
 ];
 
 export default class MgmtNode extends HybridModel {
@@ -63,6 +64,10 @@ export default class MgmtNode extends HybridModel {
   }
 
   get pool() {
+    if (!this.spec?.nodePoolName) {
+      return undefined;
+    }
+
     const nodePoolID = this.spec.nodePoolName.replace(':', '/');
 
     return this.$rootGetters['management/byId'](MANAGEMENT.NODE_POOL, nodePoolID);
@@ -118,6 +123,42 @@ export default class MgmtNode extends HybridModel {
     return this.status?.addresses || this.status?.internalNodeStatus?.addresses || [];
   }
 
+  get internalIps() {
+    const internal = this.addresses.filter(({ type }) => {
+      return type === ADDRESSES.INTERNAL_IP;
+    });
+
+    if (!internal.length) {
+      // For RKE1 clusters in EC2, node addresses are
+      // under status.rkeNode.address and status.rkeNode.internalAddress
+      if (this.status?.rkeNode) {
+        return this.status.rkeNode.internalAddress ? [this.status.rkeNode.internalAddress] : [];
+      }
+
+      return [];
+    }
+
+    return internal.map(({ address }) => address);
+  }
+
+  get externalIps() {
+    const external = this.addresses.filter(({ type }) => {
+      return type === ADDRESSES.EXTERNAL_IP;
+    });
+
+    if (!external.length) {
+      // For RKE1 clusters in EC2, node addresses are
+      // under status.rkeNode.address and status.rkeNode.internalAddress
+      if (this.status?.rkeNode) {
+        return this.status.rkeNode.address ? [this.status.rkeNode.address] : [];
+      }
+
+      return [];
+    }
+
+    return external.map(({ address }) => address);
+  }
+
   get internalIp() {
     // This shows in the IP address column for RKE1 nodes in the
     // list of nodes in the cluster detail page of Cluster Management.
@@ -131,7 +172,7 @@ export default class MgmtNode extends HybridModel {
 
     // For RKE1 clusters in EC2, node addresses are
     // under status.rkeNode.address and status.rkeNode.internalAddress
-    if (!internal && this.status.rkeNode) {
+    if (!internal && this.status?.rkeNode) {
       return this.status.rkeNode.internalAddress;
     }
 
@@ -147,7 +188,7 @@ export default class MgmtNode extends HybridModel {
 
     // For RKE1 clusters in EC2, node addresses are
     // under status.rkeNode.address and status.rkeNode.internalAddress
-    if (!statusAddress && this.status.rkeNode) {
+    if (!statusAddress && this.status?.rkeNode) {
       return this.status.rkeNode.address;
     }
 

package/models/namespace.js

@@ -68,7 +68,7 @@ export default class Namespace extends SteveModel {
         label:      this.t('namespace.move'),
         bulkable:   true,
         bulkAction: 'move',
-        enabled:    true,
+        enabled:    this.canUpdate,
         icon:       'icon icon-fork',
         weight:     3,
       });

package/models/pod.js

@@ -1,10 +1,11 @@
 import { insertAt } from '@shell/utils/array';
-import { colorForState, stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
+import { colorForState, simpleColorForState, stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
 import { NODE, WORKLOAD_TYPES } from '@shell/config/types';
 import { escapeHtml, shortenedImage } from '@shell/utils/string';
 import WorkloadService from '@shell/models/workload.service';
 import { deleteProperty } from '@shell/utils/object';
 import { POD_RESTARTS_REG_EX } from '@shell/types/resources/pod';
+import { useResourceCardRow } from '@shell/components/Resource/Detail/Card/StateCard/composables';
 
 export const WORKLOAD_PRIORITY = {
   [WORKLOAD_TYPES.DEPLOYMENT]:             1,
@@ -156,6 +157,37 @@ export default class Pod extends WorkloadService {
     return initContainers.includes(container);
   }
 
+  get resourceContainers() {
+    const statuses = [...(this.status?.containerStatuses || []), ...(this.status?.initContainerStatuses || [])];
+
+    return statuses.map((s) => {
+      const state = Object.keys(s.state || {})[0] || 'unknown';
+
+      return {
+        stateDisplay:     stateDisplay(state),
+        stateSimpleColor: simpleColorForState(state),
+      };
+    });
+  }
+
+  get resourcesCardRows() {
+    const rows = [...this._resourcesCardRows];
+
+    if (this.resourceContainers.length) {
+      rows.unshift(useResourceCardRow(this.t('workload.container.titles.containers'), this.resourceContainers, 'stateSimpleColor', 'stateDisplay', '#containers'));
+    }
+
+    return rows;
+  }
+
+  get cards() {
+    return [
+      this.resourcesCard,
+      this.insightCard,
+      ...this._cards
+    ].filter((c) => c);
+  }
+
   get imageNames() {
     return this.spec.containers.map((container) => shortenedImage(container.image));
   }

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

@@ -97,7 +97,7 @@ export default class ProvCluster extends SteveModel {
 
   get canEdit() {
     // If the cluster is a KEV1 cluster, Harvester cluster, or v2 provisioning cluster that uses upstream capi infrastructure providers, then prevent edit
-    if (this.isKev1 || this.isHarvester || this.isCapiHybrid) {
+    if (this.isKev1 || this.isHarvester || this.isCapiWithoutExtension) {
       return false;
     }
 
@@ -105,7 +105,7 @@ export default class ProvCluster extends SteveModel {
   }
 
   get canCustomEdit() {
-    return !this.isCapiHybrid && super.canCustomEdit;
+    return !this.isCapiWithoutExtension && super.canCustomEdit;
   }
 
   get _availableActions() {
@@ -319,8 +319,8 @@ export default class ProvCluster extends SteveModel {
   }
 
   // identify v2 provisioning clusters created using upstream capi infrastructure providers instead of rancher/machine
-  get isCapiHybrid() {
-    return this.mgmt?.isCapiHybrid;
+  get isCapiWithoutExtension() {
+    return this.mgmt?.isCapiHybrid && !this.mgmt?.isCAPIProvider;
   }
 
   get mgmtClusterId() {
@@ -789,7 +789,7 @@ export default class ProvCluster extends SteveModel {
   }
 
   get disableResourceDetailDrawerConfigTab() {
-    return !!this.isHarvester || this.isCapiHybrid;
+    return !!this.isHarvester || this.isCapiWithoutExtension;
   }
 
   get fullDetailPageOverride() {

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.3",
+  "version": "3.0.12-rc.4",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancher/dashboard",
   "license": "Apache-2.0",
@@ -33,13 +33,14 @@
     "@babel/preset-typescript": "7.16.7",
     "@novnc/novnc": "1.2.0",
     "@popperjs/core": "2.11.8",
-    "@rancher/icons": "2.0.60",
+    "@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",
@@ -47,7 +48,7 @@
     "@vue/vue3-jest": "27.0.0",
     "add": "2.0.6",
     "ansi_up": "5.0.0",
-    "axios": "1.15.2",
+    "axios": "1.16.0",
     "axios-retry": "3.1.9",
     "babel-eslint": "10.1.0",
     "babel-preset-vue": "2.0.2",
@@ -80,14 +81,13 @@
     "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",
@@ -124,12 +124,13 @@
     "webpack-virtual-modules": "0.6.2",
     "worker-loader": "3.0.8",
     "xmlbuilder2": "4.0.1",
-    "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",
+    "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": {
@@ -142,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/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

@@ -20,6 +20,7 @@ import FormValidation from '@shell/mixins/form-validation';
 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);
@@ -77,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

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;