@rancher/shell 0.3.0 → 0.3.2

package/models/pod.js

@@ -181,6 +181,21 @@ export default class Pod extends WorkloadService {
     return 0;
   }
 
+  processSaveResponse(res) {
+    if (res._headers && res._headers.warning) {
+      const warnings = res._headers.warning.split('299') || [];
+      const hasPsaWarnings = warnings.filter(warning => warning.includes('violate PodSecurity')).length;
+
+      if (hasPsaWarnings) {
+        this.$dispatch('growl/warning', {
+          title:   this.$rootGetters['i18n/t']('growl.podSecurity.title'),
+          message: this.$rootGetters['i18n/t']('growl.podSecurity.message'),
+          timeout: 5000,
+        }, { root: true });
+      }
+    }
+  }
+
   save() {
     const prev = { ...this };
 

package/models/projectroletemplatebinding.js

@@ -17,4 +17,11 @@ export default class PRTB extends NormanModel {
   get roleTemplate() {
     return this.$rootGetters['management/byId'](MANAGEMENT.ROLE_TEMPLATE, this.roleTemplateId);
   }
+
+  get steve() {
+    return this.$dispatch(`management/find`, {
+      type: MANAGEMENT.PROJECT_ROLE_TEMPLATE_BINDING,
+      id:   this.id?.replace(':', '/')
+    }, { root: true });
+  }
 }

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

@@ -71,6 +71,17 @@ export default class ProvCluster extends SteveModel {
     return super.creationTimestamp;
   }
 
+  // Models can specify a single action that will be shown as a button in the details masthead
+  get detailsAction() {
+    const canExplore = this.mgmt?.isReady && !this.hasError;
+
+    return {
+      action:  'explore',
+      label:   this.$rootGetters['i18n/t']('cluster.explore'),
+      enabled: canExplore,
+    };
+  }
+
   get _availableActions() {
     const out = super._availableActions;
     const isLocal = this.mgmt?.isLocal;
@@ -114,12 +125,12 @@ export default class ProvCluster extends SteveModel {
         label:      this.$rootGetters['i18n/t']('nav.kubeconfig.download'),
         icon:       'icon icon-download',
         bulkable:   true,
-        enabled:    this.mgmt?.hasAction('generateKubeconfig') && ready,
+        enabled:    this.mgmt?.hasAction('generateKubeconfig'),
       }, {
         action:   'copyKubeConfig',
         label:    this.t('cluster.copyConfig'),
         bulkable: false,
-        enabled:  this.mgmt?.hasAction('generateKubeconfig') && ready,
+        enabled:  this.mgmt?.hasAction('generateKubeconfig'),
         icon:     'icon icon-copy',
       }, {
         action:     'snapshotAction',
@@ -165,6 +176,15 @@ export default class ProvCluster extends SteveModel {
     return out;
   }
 
+  explore() {
+    const location = {
+      name:   'c-cluster',
+      params: { cluster: this.mgmt.id }
+    };
+
+    this.currentRouter().push(location);
+  }
+
   goToViewYaml() {
     let location;
 
@@ -423,6 +443,36 @@ export default class ProvCluster extends SteveModel {
     return this.pools.reduce((acc, pool) => acc + (pool.unavailable || 0), 0);
   }
 
+  get unavailableMachines() {
+    if (this.isReady) {
+      if (this.isRke1) {
+        const names = this.nodes.filter((node) => {
+          return node.status.conditions.find(c => c.error && c.type === 'Ready');
+        }).map((node) => {
+          const name = node.status.nodeName || node.metadata.name;
+
+          return this.t('cluster.availabilityWarnings.node', { name });
+        });
+
+        return names.join('<br>');
+      } else {
+        const names = this.machines.filter((machine) => {
+          return machine.status.conditions.find(c => c.error && c.type === 'NodeHealthy');
+        }).map((machine) => {
+          if (machine.status.nodeRef?.name) {
+            return this.t('cluster.availabilityWarnings.node', { name: machine.status.nodeRef.name });
+          }
+
+          return this.t('cluster.availabilityWarnings.machine', { name: machine.metadata.name });
+        });
+
+        return names.join('<br>');
+      }
+    }
+
+    return '';
+  }
+
   get stateParts() {
     const out = [
       {
@@ -580,24 +630,25 @@ export default class ProvCluster extends SteveModel {
     this.$dispatch('promptRestore', [resource]);
   }
 
-  saveAsRKETemplate(resources = this) {
+  saveAsRKETemplate(cluster = this) {
     this.$dispatch('promptModal', {
-      resources,
-      component: 'SaveAsRKETemplateDialog'
+      componentProps: { cluster },
+      component:      'SaveAsRKETemplateDialog'
     });
   }
 
-  rotateCertificates(resources = this) {
+  rotateCertificates(cluster = this) {
     this.$dispatch('promptModal', {
-      resources,
+      componentProps: { cluster },
+
       component: 'RotateCertificatesDialog'
     });
   }
 
-  rotateEncryptionKey(resources = this) {
+  rotateEncryptionKey(cluster = this) {
     this.$dispatch('promptModal', {
-      resources,
-      component: 'RotateEncryptionKeyDialog'
+      componentProps: { cluster },
+      component:      'RotateEncryptionKeyDialog'
     });
   }
 

package/models/rke-machine.cattle.io.pnapmachinetemplate.js

@@ -0,0 +1,15 @@
+import MachineTemplate from './rke-machine.cattle.io.machinetemplate';
+
+export default class PnapMachineTemplate extends MachineTemplate {
+  get provider() {
+    return 'pnap';
+  }
+
+  get providerLocation() {
+    return this.spec.template.spec.serverLocation;
+  }
+
+  get providerSize() {
+    return this.spec.template.spec.serverType;
+  }
+}

package/models/service.js

@@ -128,23 +128,24 @@ export default class extends SteveModel {
     return out;
   }
 
-  get pods() {
+  get podRelationship() {
     const { metadata:{ relationships = [] } } = this;
 
-    return async() => {
-      const podRelationship = (relationships || []).filter(relationship => relationship.toType === POD)[0];
-      let pods = [];
+    return (relationships || []).filter(relationship => relationship.toType === POD)[0];
+  }
 
-      if (podRelationship) {
-        pods = await this.$dispatch('cluster/findMatching', {
-          type:      POD,
-          selector:  podRelationship.selector,
-          namespace: this.namespace
-        }, { root: true });
-      }
+  async fetchPods() {
+    if (this.podRelationship) {
+      await this.$dispatch('cluster/findMatching', {
+        type:      POD,
+        selector:  this.podRelationship.selector,
+        namespace: this.namespace
+      }, { root: true });
+    }
+  }
 
-      return pods;
-    };
+  get pods() {
+    return this.podRelationship ? this.$getters.matching( POD, this.podRelationship.selector, this.namespace ) : [];
   }
 
   get serviceType() {

package/models/storage.k8s.io.storageclass.js

@@ -2,21 +2,26 @@ import { STORAGE } from '@shell/config/labels-annotations';
 import { STORAGE_CLASS } from '@shell/config/types';
 import SteveModel from '@shell/plugins/steve/steve-class';
 
+// These are storage class drivers w/ custom components
+// all but longhorn are in-tree plugins
 export const PROVISIONER_OPTIONS = [
   {
-    labelKey:  'storageClass.aws-ebs.title',
-    value:     'kubernetes.io/aws-ebs',
-    supported: true
+    labelKey:   'storageClass.aws-ebs.title',
+    value:      'kubernetes.io/aws-ebs',
+    supported:  true,
+    deprecated: true,
   },
   {
-    labelKey:  'storageClass.azure-disk.title',
-    value:     'kubernetes.io/azure-disk',
-    supported: true
+    labelKey:   'storageClass.azure-disk.title',
+    value:      'kubernetes.io/azure-disk',
+    supported:  true,
+    deprecated: true
   },
   {
-    labelKey:  'storageClass.azure-file.title',
-    value:     'kubernetes.io/azure-file',
-    supported: true
+    labelKey:   'storageClass.azure-file.title',
+    value:      'kubernetes.io/azure-file',
+    supported:  true,
+    deprecated: true,
   },
   {
     labelKey: 'storageClass.rbd.title',
@@ -27,9 +32,10 @@ export const PROVISIONER_OPTIONS = [
     value:    'kubernetes.io/glusterfs',
   },
   {
-    labelKey:  'storageClass.gce-pd.title',
-    value:     'kubernetes.io/gce-pd',
-    supported: true
+    labelKey:   'storageClass.gce-pd.title',
+    value:      'kubernetes.io/gce-pd',
+    supported:  true,
+    deprecated: true,
   },
   {
     labelKey: 'storageClass.no-provisioner.title',
@@ -41,8 +47,9 @@ export const PROVISIONER_OPTIONS = [
     supported: true
   },
   {
-    labelKey: 'storageClass.cinder.title',
-    value:    'kubernetes.io/cinder',
+    labelKey:   'storageClass.cinder.title',
+    value:      'kubernetes.io/cinder',
+    deprecated: true,
   },
   {
     labelKey: 'storageClass.portworx-volume.title',
@@ -61,17 +68,25 @@ export const PROVISIONER_OPTIONS = [
     value:    'kubernetes.io/storageos',
   },
   {
-    labelKey:  'storageClass.vsphere-volume.title',
-    value:     'kubernetes.io/vsphere-volume',
-    supported: true
+    labelKey:   'storageClass.vsphere-volume.title',
+    value:      'kubernetes.io/vsphere-volume',
+    supported:  true,
+    deprecated: true
+  },
+  {
+    labelKey:      'storageClass.harvesterhci.title',
+    value:         'driver.harvesterhci.io',
+    supported:     true,
+    hideCustomize: true,
   }
 ];
 
 export default class extends SteveModel {
   get provisionerDisplay() {
     const option = PROVISIONER_OPTIONS.find(o => o.value === this.provisioner);
+    const fallback = `${ this.provisioner } ${ this.t('persistentVolume.csi.drivers.suffix') }`;
 
-    return option ? this.t(option.labelKey) : this.provisioner;
+    return option ? this.t(option.labelKey) : this.$rootGetters['i18n/withFallback'](`persistentVolume.csi.drivers.${ this.provisioner.replaceAll('.', '-') }`, null, fallback);
   }
 
   get isDefault() {

package/models/workload.js

@@ -7,6 +7,16 @@ import { convertSelectorObj, matching, matches } from '@shell/utils/selector';
 import { SEPARATOR } from '@shell/components/DetailTop';
 import WorkloadService from '@shell/models/workload.service';
 
+export const defaultContainer = {
+  imagePullPolicy: 'Always',
+  name:            'container-0',
+  securityContext: {
+    runAsNonRoot:             false,
+    readOnlyRootFilesystem:   false,
+    privileged:               false,
+    allowPrivilegeEscalation: false,
+  }
+};
 export default class Workload extends WorkloadService {
   // remove clone as yaml/edit as yaml until API supported
   get _availableActions() {
@@ -98,7 +108,9 @@ export default class Workload extends WorkloadService {
       if (!spec.template) {
         spec.template = {
           spec: {
-            restartPolicy: this.type === WORKLOAD_TYPES.JOB ? 'Never' : 'Always', containers: [{ imagePullPolicy: 'Always', name: 'container-0' }], initContainers: []
+            restartPolicy:  this.type === WORKLOAD_TYPES.JOB ? 'Never' : 'Always',
+            containers:     [{ ...defaultContainer }],
+            initContainers: []
           }
         };
       }
@@ -109,14 +121,14 @@ export default class Workload extends WorkloadService {
     vm.$set(this, 'spec', spec);
   }
 
-  toggleRollbackModal( resources = this ) {
+  toggleRollbackModal( workload = this ) {
     this.$dispatch('promptModal', {
-      resources,
-      component: 'RollbackWorkloadDialog'
+      componentProps: { workload },
+      component:      'RollbackWorkloadDialog'
     });
   }
 
-  async rollBackWorkload( cluster, workload, rollbackRequestData ) {
+  async rollBackWorkload( cluster, workload, type, rollbackRequestData ) {
     const rollbackRequestBody = JSON.stringify(rollbackRequestData);
 
     if ( Array.isArray( workload ) ) {
@@ -125,8 +137,15 @@ export default class Workload extends WorkloadService {
     const namespace = workload.metadata.namespace;
     const workloadName = workload.metadata.name;
 
-    // Ensure we go out to the correct cluster
-    await this.patch(rollbackRequestBody, { url: `/k8s/clusters/${ cluster.id }/apis/apps/v1/namespaces/${ namespace }/deployments/${ workloadName }` });
+    /**
+     * Ensure we go out to the correct cluster
+     *
+     * Build the request body in the same format that kubectl
+     * uses to call the Kubernetes API to roll back a workload.
+     * To see an example request body, run:
+     * kubectl rollout undo deployment/[deployment name] --to-revision=[revision number] -v=8
+     */
+    await this.patch(rollbackRequestBody, { url: `/k8s/clusters/${ cluster.id }/apis/apps/v1/namespaces/${ namespace }/${ type }/${ workloadName }` });
   }
 
   pause() {
@@ -610,6 +629,18 @@ export default class Workload extends WorkloadService {
     return out;
   }
 
+  get currentRevisionNumber() {
+    if (this.ownedByWorkload || this.kind === 'Job' || this.kind === 'CronJob') {
+      return undefined;
+    }
+    if (this.kind === 'Deployment') {
+      return this.metadata.annotations['deployment.kubernetes.io/revision'];
+    }
+
+    // 'DaemonSet', 'StatefulSet'
+    return this.metadata.generation;
+  }
+
   async matchingPods() {
     const all = await this.$dispatch('findAll', { type: POD });
     const allInNamespace = all.filter(pod => pod.metadata.namespace === this.metadata.namespace);

package/nuxt.config.js

@@ -22,16 +22,15 @@ export const API_PATH = api;
 
 const dev = (process.env.NODE_ENV !== 'production');
 const devPorts = dev || process.env.DEV_PORTS === 'true';
-const version = process.env.VERSION ||
-  process.env.DRONE_TAG ||
-  process.env.DRONE_VERSION ||
-  require('./package.json').version;
+
+// human readable version used on rancher dashboard about page
+const dashboardVersion = process.env.DASHBOARD_VERSION;
 
 const prime = process.env.PRIME;
 
 const pl = process.env.PL || STANDARD;
-const commit = process.env.COMMIT || 'head';
 const perfTest = (process.env.PERF_TEST === 'true'); // Enable performance testing when in dev
+const instrumentCode = (process.env.TEST_INSTRUMENT === 'true'); //  Instrument code for code coverage in e2e tests
 
 // Allow skipping of eslint check
 // 0 = Skip browser and console checks
@@ -84,8 +83,21 @@ export default function(dir, _appConfig) {
     }
   }
 
+  // Instrument code for tests
+  const babelPlugins = [
+    // TODO: Browser support
+    // ['@babel/plugin-transform-modules-commonjs'],
+    ['@babel/plugin-proposal-private-property-in-object', { loose: true }]
+  ];
+
+  if (instrumentCode) {
+    babelPlugins.push('babel-plugin-istanbul');
+
+    console.warn('Instrumenting code for coverage'); // eslint-disable-line no-console
+  }
+
   // ===============================================================================================
-  // Functions for the UI Pluginas
+  // Functions for the UI Plugins
   // ===============================================================================================
 
   const appConfig = _appConfig || {};
@@ -225,7 +237,11 @@ export default function(dir, _appConfig) {
 
     if (index !== -1 && (index + 1) < ctx.length) {
       const pkg = ctx[index + 1];
-      const p = path.resolve(dir, 'pkg', pkg, resource.request.substr(5));
+      let p = path.resolve(dir, 'pkg', pkg, resource.request.substr(5));
+
+      if (resource.request.startsWith(`@pkg/${ pkg }`)) {
+        p = path.resolve(dir, 'pkg', resource.request.substr(5));
+      }
 
       resource.request = p;
     }
@@ -266,7 +282,7 @@ export default function(dir, _appConfig) {
   console.log(`Build: ${ dev ? 'Development' : 'Production' }`); // eslint-disable-line no-console
 
   if ( !dev ) {
-    console.log(`Version: ${ version } (${ commit })`); // eslint-disable-line no-console
+    console.log(`Version: ${ dashboardVersion }`); // eslint-disable-line no-console
   }
 
   if ( resourceBase ) {
@@ -305,8 +321,6 @@ export default function(dir, _appConfig) {
 
     // Configuration visible to the client, https://nuxtjs.org/api/configuration-env
     env: {
-      commit,
-      version,
       dev,
       pl,
       perfTest,
@@ -315,7 +329,8 @@ export default function(dir, _appConfig) {
       api
     },
 
-    publicRuntimeConfig: { rancherEnv },
+    // vars accessible via this.$config https://nuxtjs.org/docs/configuration-glossary/configuration-runtime-config/
+    publicRuntimeConfig: { rancherEnv, dashboardVersion },
 
     buildDir: dev ? '.nuxt' : '.nuxt-prod',
 
@@ -538,12 +553,7 @@ export default function(dir, _appConfig) {
             '@babel/preset-typescript',
           ];
         },
-        plugins: [
-          // TODO: Browser support
-          // ['@babel/plugin-transform-modules-commonjs'],
-          ['@babel/plugin-proposal-private-property-in-object', { loose: true }],
-          'babel-plugin-istanbul'
-        ],
+        plugins: babelPlugins
       }
     },
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "0.3.0",
+  "version": "0.3.2",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",
@@ -113,7 +113,7 @@
     "nyc": "15.1.0",
     "papaparse": "5.3.0",
     "portal-vue": "2.1.7",
-    "rancher-icons": "rancher/icons#v2.0.9",
+    "rancher-icons": "rancher/icons#v2.0.13",
     "require-extension-hooks": "0.3.3",
     "require-extension-hooks-babel": "1.0.0",
     "require-extension-hooks-vue": "3.0.0",
@@ -143,11 +143,11 @@
     "vuex": "3.6.2",
     "webpack-bundle-analyzer": "4.5.0",
     "webpack-virtual-modules": "0.4.3",
-    "xterm": "4.9.0",
-    "xterm-addon-fit": "0.4.0",
-    "xterm-addon-search": "0.7.0",
-    "xterm-addon-web-links": "0.4.0",
-    "xterm-addon-webgl": "0.9.0",
+    "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",
     "worker-loader": "3.0.8",
     "yarn": "1.22.18"
   },

package/pages/about.vue

@@ -16,7 +16,8 @@ export default {
   },
   data() {
     return {
-      settings: null,
+      dashboardVersion: this.$config.dashboardVersion,
+      settings:         null,
       SETTING
     };
   },
@@ -117,10 +118,21 @@ export default {
             target="_blank"
             rel="nofollow noopener noreferrer"
           >
-            {{ appName }}
+            {{ t("about.versions.rancher") }}
           </a>
         </td><td>{{ rancherVersion.value }}</td>
       </tr>
+      <tr v-if="dashboardVersion">
+        <td>
+          <a
+            href="https://github.com/rancher/dashboard"
+            target="_blank"
+            rel="nofollow noopener noreferrer"
+          >
+            {{ t("generic.dashboard") }}
+          </a>
+        </td><td>{{ dashboardVersion }}</td>
+      </tr>
       <tr v-if="cliVersion">
         <td>
           <a

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

@@ -21,6 +21,7 @@ import { CATALOG } from '@shell/config/labels-annotations';
 import { isUIPlugin } from '@shell/config/uiplugins';
 
 export default {
+  name:       'Charts',
   components: {
     AsyncButton,
     Banner,
@@ -34,7 +35,7 @@ export default {
   },
 
   async fetch() {
-    await this.$store.dispatch('catalog/load');
+    await this.$store.dispatch('catalog/load', { force: true, reset: true });
 
     const query = this.$route.query;
 
@@ -53,7 +54,7 @@ export default {
       searchQuery:     null,
       showDeprecated:  null,
       showHidden:      null,
-      chartMode:       this.$store.getters['prefs/get'](SHOW_CHART_MODE),
+      isPspLegacy:     false,
       chartOptions:    [
         {
           label: 'Browse',
@@ -71,6 +72,8 @@ export default {
     ...mapGetters(['currentCluster']),
     ...mapGetters({ allCharts: 'catalog/charts', loadingErrors: 'catalog/errors' }),
 
+    chartMode: mapPref(SHOW_CHART_MODE),
+
     hideRepos: mapPref(HIDE_REPOS),
 
     repoOptions() {
@@ -238,6 +241,14 @@ export default {
     }
   },
 
+  created() {
+    const release = this.currentCluster?.status?.version.gitVersion || '';
+    const isRKE2 = release.includes('rke2');
+    const version = release.match(/\d+/g);
+
+    this.isPspLegacy = version?.length ? isRKE2 && (+version[0] === 1 && +version[1] < 25) : false;
+  },
+
   methods: {
     colorForChart(chart) {
       const repos = this.repoOptions;
@@ -339,7 +350,7 @@ export default {
 <template>
   <Loading v-if="$fetchState.pending" />
   <div v-else>
-    <header class="header-layout">
+    <header>
       <div class="title">
         <h1 class="m-0">
           {{ t('catalog.charts.header') }}
@@ -362,6 +373,13 @@ export default {
         @clicked="(row) => selectChart(row)"
       />
     </div>
+
+    <Banner
+      v-if="isPspLegacy"
+      color="warning"
+      :label="t('catalog.chart.banner.legacy')"
+    />
+
     <TypeDescription resource="chart" />
     <div class="left-right-split">
       <Select