@rancher/shell 0.3.29 → 0.5.0

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

@@ -1,4 +1,3 @@
-import Vue from 'vue';
 import { CATALOG, CLUSTER_BADGE } from '@shell/config/labels-annotations';
 import { NODE, FLEET, MANAGEMENT, CAPI } from '@shell/config/types';
 import { insertAt, addObject, removeObject } from '@shell/utils/array';
@@ -15,6 +14,7 @@ import HybridModel from '@shell/plugins/steve/hybrid-class';
 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';
 
 // See translation file cluster.providers for list of providers
 // If the logo is not named with the provider name, add an override here
@@ -408,9 +408,13 @@ export default class MgmtCluster extends HybridModel {
   }
 
   async copyKubeConfig() {
-    const config = await this.generateKubeConfig();
+    try {
+      const config = await this.generateKubeConfig();
 
-    Vue.prototype.$copyText(config);
+      if (config) {
+        await copyTextToClipboard(config);
+      }
+    } catch {}
   }
 
   async fetchNodeMetrics() {

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

@@ -1,6 +1,6 @@
 import HybridModel from '@shell/plugins/steve/hybrid-class';
 
-const HIDDEN = ['rke', 'rancherkubernetesengine'];
+const HIDDEN = ['rke', 'rancherkubernetesengine', 'azureaks'];
 const V2 = ['amazoneks', 'googlegke', 'azureaks'];
 const IMPORTABLE = ['amazoneks', 'googlegke', 'azureaks'];
 

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

@@ -8,6 +8,7 @@ import { insertAt } from '@shell/utils/array';
 import { downloadUrl } from '@shell/utils/download';
 import findLast from 'lodash/findLast';
 import HybridModel from '@shell/plugins/steve/hybrid-class';
+import { notOnlyOfRole } from '@shell/models/cluster.x-k8s.io.machine';
 
 export default class MgmtNode extends HybridModel {
   get _availableActions() {
@@ -21,11 +22,12 @@ export default class MgmtNode extends HybridModel {
     };
 
     const scaleDown = {
-      action:   'scaleDown',
-      enabled:  !!this.canScaleDown,
-      icon:     'icon icon-minus icon-fw',
-      label:    this.t('node.actions.scaleDown'),
-      bulkable: true,
+      action:     'scaleDown',
+      bulkAction: 'scaleDown',
+      enabled:    !!this.canScaleDown,
+      icon:       'icon icon-minus icon-fw',
+      label:      this.t('node.actions.scaleDown'),
+      bulkable:   true,
     };
 
     insertAt(out, 0, { divider: true });
@@ -105,12 +107,12 @@ export default class MgmtNode extends HybridModel {
     }
   }
 
-  async scaleDown(resources) {
-    const safeResources = Array.isArray(resources) ? resources : [this];
-
-    await Promise.all(safeResources.map((node) => {
-      return node.norman?.doAction('scaledown');
-    }));
+  async scaleDown(resources = this) {
+    this.$dispatch('promptModal', {
+      resources,
+      component:  'ScaleMachineDownDialog',
+      modalWidth: '450px'
+    });
   }
 
   get provisioningCluster() {
@@ -166,10 +168,12 @@ export default class MgmtNode extends HybridModel {
   }
 
   get canScaleDown() {
-    const isInOnlyPool = this.pool?.provisioningCluster?.pools?.length === 1;
-    const isOnlyNode = this.pool?.nodes?.length === 1;
+    if (!this.isEtcd && !this.isControlPlane) {
+      return true;
+    }
+
     const hasAction = this.norman?.actions?.scaledown;
 
-    return hasAction && (!isInOnlyPool || !isOnlyNode);
+    return hasAction && notOnlyOfRole(this, this.provisioningCluster?.nodes);
   }
 }

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

@@ -1,6 +1,7 @@
 import { CAPI, MANAGEMENT, NORMAN } from '@shell/config/types';
 import { sortBy } from '@shell/utils/sort';
 import HybridModel from '@shell/plugins/steve/hybrid-class';
+import { notOnlyOfRole } from '@shell/models/cluster.x-k8s.io.machine';
 
 export default class MgmtNodePool extends HybridModel {
   get nodeTemplate() {
@@ -161,6 +162,22 @@ export default class MgmtNodePool extends HybridModel {
     return this.norman?.hasLink('update');
   }
 
+  get isControlPlane() {
+    return this.spec?.controlPlane === true;
+  }
+
+  get isEtcd() {
+    return this.spec?.etcd === true;
+  }
+
+  canScaleDownPool() {
+    if (!this.isEtcd && !this.isControlPlane) {
+      return true;
+    }
+
+    return notOnlyOfRole(this, this?.provisioningCluster?.nodes);
+  }
+
   remove() {
     return this.norman?.remove();
   }

package/models/namespace.js

@@ -87,7 +87,7 @@ export default class Namespace extends SteveModel {
       return true;
     }
 
-    if ( this.metadata.name.endsWith('-system') ) {
+    if ( this.metadata.name.startsWith('cattle-') && this.metadata.name.endsWith('-system') ) {
       return true;
     }
 

package/models/pod.js

@@ -3,6 +3,7 @@ import { colorForState, stateDisplay } from '@shell/plugins/dashboard-store/reso
 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';
 
 export const WORKLOAD_PRIORITY = {
   [WORKLOAD_TYPES.DEPLOYMENT]:             1,
@@ -256,4 +257,23 @@ export default class Pod extends WorkloadService {
       return Promise.reject(e);
     });
   }
+
+  cleanForSave(data) {
+    const val = super.cleanForSave(data);
+
+    // remove fields from containers
+    val.spec?.containers?.forEach((container) => {
+      this.cleanContainerForSave(container);
+    });
+
+    // remove fields from initContainers
+    val.spec?.initContainers?.forEach((container) => {
+      this.cleanContainerForSave(container);
+    });
+
+    // This is probably added by generic workload components that shouldn't be added to pods
+    deleteProperty(val, 'spec.selector');
+
+    return val;
+  }
 }

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

@@ -1,5 +1,5 @@
 import {
-  CAPI, MANAGEMENT, NORMAN, SNAPSHOT, HCI
+  CAPI, MANAGEMENT, NAMESPACE, NORMAN, SNAPSHOT, HCI, LOCAL_CLUSTER
 } from '@shell/config/types';
 import SteveModel from '@shell/plugins/steve/steve-class';
 import { findBy } from '@shell/utils/array';
@@ -180,6 +180,16 @@ export default class ProvCluster extends SteveModel {
     return out;
   }
 
+  async findNormanCluster() {
+    const name = this.status?.clusterName;
+
+    if ( !name ) {
+      return null;
+    }
+
+    return await this.$dispatch('rancher/find', { type: NORMAN.CLUSTER, id: name }, { root: true });
+  }
+
   explore() {
     const location = {
       name:   'c-cluster',
@@ -284,7 +294,7 @@ export default class ProvCluster extends SteveModel {
   }
 
   get isK3s() {
-    return this.mgmt?.status?.provider === 'k3s';
+    return this.mgmt?.status ? this.mgmt?.status.provider === 'k3s' : (this.spec?.kubernetesVersion || '').includes('k3s') ;
   }
 
   get isRke2() {
@@ -827,11 +837,11 @@ export default class ProvCluster extends SteveModel {
   get agentConfig() {
     // The one we want is the first one with no selector.
     // If there are multiple with no selector, that will fall under the unsupported message below.
-    return this.spec.rkeConfig.machineSelectorConfig.find((x) => !x.machineLabelSelector).config;
+    return this.spec.rkeConfig.machineSelectorConfig.find((x) => !x.machineLabelSelector)?.config;
   }
 
   get cloudProvider() {
-    return this.agentConfig['cloud-provider-name'];
+    return this.agentConfig?.['cloud-provider-name'];
   }
 
   get canClone() {
@@ -883,4 +893,29 @@ export default class ProvCluster extends SteveModel {
   get hasError() {
     return this.status?.conditions?.some((condition) => condition.error === true);
   }
+
+  get namespaceLocation() {
+    const localCluster = this.$rootGetters['management/byId'](MANAGEMENT.CLUSTER, LOCAL_CLUSTER);
+
+    if (localCluster) {
+      return {
+        name:   'c-cluster-product-resource-id',
+        params: {
+          cluster:  localCluster.id,
+          product:  this.$rootGetters['productId'],
+          resource: NAMESPACE,
+          id:       this.namespace
+        }
+      };
+    }
+
+    return null;
+  }
+
+  // JSON Paths that should be folded in the YAML editor by default
+  get yamlFolding() {
+    return [
+      'spec.rkeConfig.machinePools.dynamicSchemaSpec',
+    ];
+  }
 }

package/models/secret.js

@@ -6,6 +6,9 @@ import { SERVICE_ACCOUNT } from '@shell/config/types';
 import { set } from '@shell/utils/object';
 import { NAME as MANAGER } from '@shell/config/product/manager';
 import SteveModel from '@shell/plugins/steve/steve-class';
+import { colorForState, stateDisplay, STATES_ENUM } from '@shell/plugins/dashboard-store/resource-class';
+import { diffFrom } from '@shell/utils/time';
+import day from 'dayjs';
 
 export const TYPES = {
   OPAQUE:           'Opaque',
@@ -23,7 +26,12 @@ export const TYPES = {
   RKE_AUTH_CONFIG:  'rke.cattle.io/auth-config'
 };
 
+/** Class a cert as expiring if in eight days */
+const certExpiringPeriod = 1000 * 60 * 60 * 24 * 8;
+
 export default class Secret extends SteveModel {
+  _cachedCertInfo;
+
   get hasSensitiveData() {
     return true;
   }
@@ -46,7 +54,7 @@ export default class Secret extends SteveModel {
     if (annotations[CERTMANAGER.ISSUER]) {
       return annotations[CERTMANAGER.ISSUER];
     } else if (this.isCertificate) {
-      return this.certInfo?.issuer;
+      return this.cachedCertInfo?.issuer;
     } else {
       return null;
     }
@@ -54,7 +62,7 @@ export default class Secret extends SteveModel {
 
   get notAfter() {
     if (this.isCertificate) {
-      return this.certInfo?.notAfter;
+      return this.cachedCertInfo?.notAfter;
     } else {
       return null;
     }
@@ -62,7 +70,7 @@ export default class Secret extends SteveModel {
 
   get cn() {
     if (this.isCertificate) {
-      return this.certInfo?.cn;
+      return this.cachedCertInfo?.cn;
     }
 
     return null;
@@ -80,14 +88,13 @@ export default class Secret extends SteveModel {
   // use text-warning' or 'text-error' if cert is expiring within 8 days or is expired
   get dateClass() {
     if (this.isCertificate) {
-      const eightDays = 691200000;
-
-      if (this.timeTilExpiration > eightDays ) {
-        return '';
-      } else if (this.timeTilExpiration > 0) {
+      switch (this.certState) {
+      case STATES_ENUM.EXPIRING:
         return 'text-warning';
-      } else {
+      case STATES_ENUM.EXPIRED:
         return 'text-error';
+      default:
+        return '';
       }
     }
 
@@ -248,7 +255,7 @@ export default class Secret extends SteveModel {
   // parse TLS certs and return issuer, notAfter, cn, sans
   get certInfo() {
     const pem = base64Decode(this.data['tls.crt']);
-    let issuer, notAfter, cn, sans, x;
+    let issuer, notBefore, notAfter, cn, sans, x;
     const END_MARKER = '-----END CERTIFICATE-----';
 
     if (pem) {
@@ -266,6 +273,7 @@ export default class Secret extends SteveModel {
         const issuerString = x.getIssuerString();
 
         issuer = issuerString.slice(issuerString.indexOf('CN=') + 3);
+        notBefore = r.zulutodate(x.getNotBefore());
         notAfter = r.zulutodate(x.getNotAfter());
 
         const cnString = x.getSubjectString();
@@ -281,25 +289,39 @@ export default class Secret extends SteveModel {
         sans = [];
       }
 
-      return {
-        issuer, notAfter, cn, sans
+      const certInfo = {
+        issuer, notBefore, notAfter, cn, sans
       };
+
+      return certInfo;
     }
 
     return null;
   }
 
+  get cachedCertInfo() {
+    if (!this._cachedCertInfo) {
+      this._cachedCertInfo = this.certInfo;
+    }
+
+    return this._cachedCertInfo;
+  }
+
   // use for + n more name display
   get unrepeatedSans() {
     if (this._type === TYPES.TLS ) {
-      if (this.certInfo?.sans?.filter) {
-        const commonBases = this.certInfo?.sans.filter((name) => name.indexOf('*.') === 0 || name.indexOf('www.') === 0).map((name) => name.substr(name.indexOf('.')));
-        const displaySans = removeObjects(this.certInfo?.sans, commonBases);
+      const certInfo = this.cachedCertInfo;
+
+      if (certInfo?.sans?.filter) {
+        const commonBases = certInfo?.sans
+          .filter((name) => name.indexOf('*.') === 0 || name.indexOf('www.') === 0)
+          .map((name) => name.substr(name.indexOf('.')));
+        const displaySans = removeObjects(certInfo?.sans, commonBases);
 
         return displaySans;
       }
 
-      return this.certInfo?.sans || [];
+      return certInfo?.sans?.array || certInfo?.sans || [];
     }
 
     return null;
@@ -307,16 +329,28 @@ export default class Secret extends SteveModel {
 
   get timeTilExpiration() {
     if (this._type === TYPES.TLS) {
-      const expiration = this.certInfo.notAfter;
+      const certInfo = this.cachedCertInfo;
+
+      if (!certInfo?.notAfter) {
+        return null;
+      }
+
+      const expiration = certInfo.notAfter;
       const timeThen = expiration.valueOf();
       const timeNow = Date.now();
 
-      return timeThen - timeNow;
+      const timeTilExpiration = timeThen - timeNow;
+
+      return timeTilExpiration < 0 ? 0 : timeTilExpiration;
     }
 
     return null;
   }
 
+  get timeTilExpirationDate() {
+    return this.timeTilExpiration > 0 ? this.cachedCertInfo?.notAfter?.valueOf() : null;
+  }
+
   get decodedData() {
     const out = {};
 
@@ -357,4 +391,69 @@ export default class Secret extends SteveModel {
       return 'c-cluster-product-resource';
     }
   }
+
+  get certLifetime() {
+    if (this._type === TYPES.TLS) {
+      const certInfo = this.cachedCertInfo;
+
+      if (certInfo) {
+        return diffFrom(day(certInfo.notBefore), day(certInfo.notAfter), (key, args) => this.t(key, args)).string;
+      }
+    }
+
+    return null;
+  }
+
+  /**
+   * Get the model `state` for secrets of type cert
+   */
+  get certState() {
+    if (this._type !== TYPES.TLS) {
+      return undefined;
+    }
+
+    if (typeof this.timeTilExpiration !== 'number' || this.timeTilExpiration > certExpiringPeriod ) {
+      return '';
+    } else if (this.timeTilExpiration > 0) {
+      return STATES_ENUM.EXPIRING;
+    } else {
+      return STATES_ENUM.EXPIRED;
+    }
+  }
+
+  /**
+   * Get the model `state display` for secrets of type cert
+   */
+  get certStateDisplay() {
+    if (this._type !== TYPES.TLS) {
+      return undefined;
+    }
+
+    return stateDisplay(this.certState);
+  }
+
+  /**
+   * Get the model `state background` for secrets of type cert
+   */
+  get certStateBackground() {
+    if (this._type !== TYPES.TLS) {
+      return undefined;
+    }
+
+    const color = colorForState(this.certState);
+
+    return color.replace('text-', 'bg-');
+  }
+
+  cleanForSave(data, forNew) {
+    const val = super.cleanForSave(data, forNew);
+
+    // Secrets on create with _type will return validation error
+    // Secrets on edit without _type will return http error
+    if (forNew) {
+      delete val._type;
+    }
+
+    return val;
+  }
 }

package/models/workload.js

@@ -649,4 +649,20 @@ export default class Workload extends WorkloadService {
 
     return matching(allInNamespace, selector);
   }
+
+  cleanForSave(data) {
+    const val = super.cleanForSave(data);
+
+    // remove fields from containers
+    val.spec?.template?.spec?.containers?.forEach((container) => {
+      this.cleanContainerForSave(container);
+    });
+
+    // remove fields from initContainers
+    val.spec?.template?.spec?.initContainers?.forEach((container) => {
+      this.cleanContainerForSave(container);
+    });
+
+    return val;
+  }
 }

package/models/workload.service.js

@@ -320,4 +320,22 @@ export default class WorkloadService extends SteveModel {
 
     return { toSave, toRemove };
   }
+
+  cleanForSave(data) {
+    const val = super.cleanForSave(data);
+
+    delete val.__active;
+    delete val.type;
+
+    return val;
+  }
+
+  cleanContainerForSave(container) {
+    delete container.__active;
+    delete container.active;
+    delete container._init;
+    delete container.error;
+
+    return container;
+  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "0.3.29",
+  "version": "0.5.0",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",
@@ -116,11 +116,11 @@
     "start-server-and-test": "1.13.1",
     "style-loader": "1.2.1",
     "ts-node": "8.10.2",
-    "typescript": "4.1.6",
+    "typescript": "4.5.5",
     "url-parse": "1.5.10",
     "v-tooltip": "2.0.3",
     "vue": "2.7.14",
-    "vue-clipboard2": "0.3.1",
+    "clipboard-polyfill": "4.0.1",
     "vue-codemirror": "4.0.6",
     "vue-js-modal": "1.3.35",
     "vue-resize": "0.4.5",
@@ -129,16 +129,16 @@
     "vue-shortkey": "3.1.7",
     "vue-template-compiler": "2.7.14",
     "vue-virtual-scroll-list": "^2.3.4",
-    "vue2-transitions": "0.3.0",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.2",
     "webpack-bundle-analyzer": "4.5.0",
     "webpack-virtual-modules": "0.4.3",
-    "xterm": "5.0.0",
-    "xterm-addon-fit": "0.6.0",
-    "xterm-addon-search": "0.10.0",
-    "xterm-addon-web-links": "0.7.0",
-    "xterm-addon-webgl": "0.13.0",
+    "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",
     "worker-loader": "3.0.8",
     "yarn": "1.22.18"
   },
@@ -151,7 +151,8 @@
     "qs": ">=6.7.3",
     "nth-check": ">=2.0.1",
     "follow-redirects": ">=1.14.7",
-    "merge": ">=2.1.1"
+    "merge": ">=2.1.1",
+    "semver": ">=7.5.2"
   },
   "nyc": {
     "extension": [

package/pages/about.vue

@@ -9,7 +9,6 @@ import { downloadFile } from '@shell/utils/download';
 import { mapGetters } from 'vuex';
 
 export default {
-  layout:     'plain',
   components: { BackLink, Loading },
   mixins:     [BackRoute],
   async fetch() {

package/pages/account/create-key.vue

@@ -3,7 +3,6 @@ import ResourceDetail from '@shell/components/ResourceDetail';
 
 export default {
   name:       'APIKeyCreate',
-  layout:     'plain',
   components: { ResourceDetail },
 };
 </script>

package/pages/account/index.vue

@@ -15,7 +15,6 @@ import CopyToClipboardText from '@shell/components/CopyToClipboardText';
 const API_ENDPOINT = '/v3';
 
 export default {
-  layout:     'plain',
   components: {
     CopyToClipboardText, BackLink, Banner, PromptChangePassword, Loading, ResourceTable, Principal
   },

package/pages/auth/login.vue

@@ -29,7 +29,6 @@ import loadPlugins from '@shell/plugins/plugin';
 
 export default {
   name:       'Login',
-  layout:     'unauthenticated',
   components: {
     LabeledInput, AsyncButton, Checkbox, BrandImage, Banner, InfoBox, CopyCode, Password, LocaleSelector
   },

package/pages/auth/logout.vue

@@ -1,8 +1,6 @@
 <script>
 
 export default {
-  layout: 'unauthenticated',
-
   async asyncData({ redirect, store, router }) {
     await store.dispatch('auth/logout', null, { root: true });
   }

package/pages/auth/setup.vue

@@ -38,8 +38,6 @@ const calcMustChangePassword = async(store) => {
 };
 
 export default {
-  layout: 'unauthenticated',
-
   mixins: [FormValidation],
 
   data() {
@@ -146,8 +144,6 @@ export default {
 
     if (serverUrlSetting?.value) {
       serverUrl = serverUrlSetting.value;
-    } else if ( process.server ) {
-      serverUrl = req.headers.host;
     } else {
       serverUrl = window.location.origin;
     }