@rancher/shell 0.1.1 → 0.1.3

package/machine-config/harvester.vue

@@ -13,14 +13,36 @@ import { Banner } from '@components/Banner';
 import { get } from '@shell/utils/object';
 import { mapGetters } from 'vuex';
 import {
-  HCI, NAMESPACE, MANAGEMENT, CONFIG_MAP, NORMAN, NODE
+  HCI,
+  NAMESPACE,
+  MANAGEMENT,
+  CONFIG_MAP,
+  NORMAN,
+  NODE
 } from '@shell/config/types';
 import { base64Decode, base64Encode } from '@shell/utils/crypto';
 import { allHashSettled } from '@shell/utils/promise';
 import { podAffinity as podAffinityValidator } from '@shell/utils/validators/pod-affinity';
 import { stringify, exceptionToErrorsArray } from '@shell/utils/error';
 import { HCI as HCI_ANNOTATIONS } from '@shell/config/labels-annotations';
-import { isReady } from '@shell/models/harvester/harvesterhci.io.virtualmachineimage';
+
+export function isReady() {
+  function getStatusConditionOfType(type, defaultValue = []) {
+    const conditions = Array.isArray(get(this, 'status.conditions')) ? this.status.conditions : defaultValue;
+
+    return conditions.find( cond => cond.type === type);
+  }
+
+  const initialized = getStatusConditionOfType.call(this, 'Initialized');
+  const imported = getStatusConditionOfType.call(this, 'Imported');
+  const isCompleted = this.status?.progress === 100;
+
+  if ([initialized?.status, imported?.status].includes('False')) {
+    return false;
+  } else {
+    return isCompleted && true;
+  }
+}
 
 export default {
   name: 'ConfigComponentHarvester',
@@ -34,12 +56,12 @@ export default {
   props: {
     credentialId: {
       type:     String,
-      required: true,
+      required: true
     },
 
     uuid: {
       type:     String,
-      required: true,
+      required: true
     },
 
     disabled: {
@@ -49,47 +71,55 @@ export default {
 
     poolIndex: {
       type:     Number,
-      required: true,
+      required: true
     },
 
     machinePools: {
       type:    Array,
       default: () => []
-    },
+    }
   },
 
   async fetch() {
     this.errors = [];
 
     try {
-      this.credential = await this.$store.dispatch('rancher/find', { type: NORMAN.CLOUD_CREDENTIAL, id: this.credentialId });
+      this.credential = await this.$store.dispatch('rancher/find', {
+        type: NORMAN.CLOUD_CREDENTIAL,
+        id:   this.credentialId
+      });
       const clusterId = get(this.credential, 'decodedData.clusterId');
 
       const url = `/k8s/clusters/${ clusterId }/v1`;
 
-      const isImportCluster = this.credential.decodedData.clusterType === 'imported';
+      const isImportCluster =
+        this.credential.decodedData.clusterType === 'imported';
 
       this.isImportCluster = isImportCluster;
 
       if (clusterId && isImportCluster) {
         const res = await allHashSettled({
-          namespaces:   this.$store.dispatch('harvester/findAll', { type: NAMESPACE, opt: { url: `${ url }/${ NAMESPACE }s` } }),
+          namespaces:   this.$store.dispatch('cluster/request', { url: `${ url }/${ NAMESPACE }s` }),
           images:       this.$store.dispatch('cluster/request', { url: `${ url }/${ HCI.IMAGE }s` }),
           configMaps:   this.$store.dispatch('cluster/request', { url: `${ url }/${ CONFIG_MAP }s` }),
           networks:     this.$store.dispatch('cluster/request', { url: `${ url }/k8s.cni.cncf.io.network-attachment-definitions` }),
         });
 
-        for ( const key of Object.keys(res) ) {
+        for (const key of Object.keys(res)) {
           const obj = res[key];
 
-          if ( obj.status === 'rejected' ) {
+          if (obj.status === 'rejected') {
             this.errors.push(stringify(obj.reason));
             continue;
           }
         }
 
-        if (this.errors.length > 0) { // If an error is reported in the request data, see if it is due to a cluster error
-          const cluster = await this.$store.dispatch('management/find', { type: MANAGEMENT.CLUSTER, id: clusterId });
+        if (this.errors.length > 0) {
+          // If an error is reported in the request data, see if it is due to a cluster error
+          const cluster = await this.$store.dispatch('management/find', {
+            type: MANAGEMENT.CLUSTER,
+            id:   clusterId
+          });
 
           if (cluster.stateDescription && !cluster.isReady) {
             this.errors = [cluster.stateDescription];
@@ -100,7 +130,8 @@ export default {
         const networkDataOptions = [];
 
         (res.configMaps.value?.data || []).map((O) => {
-          const cloudTemplate = O.metadata?.labels?.[HCI_ANNOTATIONS.CLOUD_INIT];
+          const cloudTemplate =
+            O.metadata?.labels?.[HCI_ANNOTATIONS.CLOUD_INIT];
 
           if (cloudTemplate === 'user') {
             userDataOptions.push({
@@ -120,7 +151,7 @@ export default {
         this.userDataOptions = userDataOptions;
         this.networkDataOptions = networkDataOptions;
         this.images = res.images.value?.data;
-        this.networkOptions = (res.networks.value?.data || []).map( (O) => {
+        this.networkOptions = (res.networks.value?.data || []).map((O) => {
           let value;
           let label;
 
@@ -139,7 +170,7 @@ export default {
           };
         });
 
-        (res.namespaces.value || []).forEach((namespace) => {
+        (res.namespaces.value.data || []).forEach((namespace) => {
           if (!namespace.isSystem) {
             const value = namespace.metadata.name;
             const label = namespace.metadata.name;
@@ -239,11 +270,11 @@ export default {
 
     namespaceDisabled() {
       return this.disabledEdit || this.poolIndex > 0;
-    },
+    }
   },
 
   watch: {
-    'credentialId'() {
+    credentialId() {
       if (!this.isEdit) {
         this.imageOptions = [];
         this.networkOptions = [];
@@ -277,7 +308,7 @@ export default {
           this.value.vmNamespace = vmNamespace;
         }
       },
-      deep: true,
+      deep: true
     }
   },
 
@@ -288,43 +319,57 @@ export default {
       const errors = [];
 
       if (!this.value.cpuCount) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.cpu'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.cpu')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.vmNamespace) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.namespace'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.namespace')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.memorySize) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.memory'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.memory')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.diskSize) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.disk'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.disk')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.imageName) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.image'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.image')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.sshUser) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.sshUser'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.sshUser')
+        );
 
         errors.push(message);
       }
 
       if (!this.value.networkName) {
-        const message = this.validatorRequiredField(this.t('cluster.credential.harvester.network'));
+        const message = this.validatorRequiredField(
+          this.t('cluster.credential.harvester.network')
+        );
 
         errors.push(message);
       }
@@ -384,7 +429,7 @@ export default {
 
       this.updateScheduling(this.vmAffinity);
     }
-  },
+  }
 };
 </script>
 
@@ -447,7 +492,9 @@ export default {
             :required="true"
             :disabled="namespaceDisabled"
             label-key="cluster.credential.harvester.namespace"
-            :placeholder="t('cluster.harvester.machinePool.namespace.placeholder')"
+            :placeholder="
+              t('cluster.harvester.machinePool.namespace.placeholder')
+            "
           />
 
           <LabeledInput
@@ -457,7 +504,9 @@ export default {
             :required="true"
             :mode="mode"
             :disabled="namespaceDisabled"
-            :placeholder="t('cluster.harvester.machinePool.namespace.placeholder')"
+            :placeholder="
+              t('cluster.harvester.machinePool.namespace.placeholder')
+            "
           />
         </div>
       </div>
@@ -485,7 +534,9 @@ export default {
             :required="true"
             :disabled="disabledEdit"
             label-key="cluster.credential.harvester.network"
-            :placeholder="t('cluster.harvester.machinePool.network.placeholder')"
+            :placeholder="
+              t('cluster.harvester.machinePool.network.placeholder')
+            "
           />
         </div>
       </div>
@@ -522,7 +573,9 @@ export default {
             :required="true"
             :mode="mode"
             :disabled="disabled"
-            :placeholder="t('cluster.harvester.machinePool.sshUser.placeholder')"
+            :placeholder="
+              t('cluster.harvester.machinePool.sshUser.placeholder')
+            "
             tooltip-key="cluster.harvester.machinePool.sshUser.toolTip"
           />
         </div>
@@ -574,7 +627,7 @@ export default {
           />
         </div>
 
-        <h3>{{ t("cluster.credential.harvester.networkData.title") }}</h3>
+        <h3>{{ t('cluster.credential.harvester.networkData.title') }}</h3>
         <div>
           <LabeledSelect
             v-if="isImportCluster && isCreate"
@@ -599,29 +652,23 @@ export default {
       </portal>
     </div>
     <div v-if="errors.length">
-      <div
-        v-for="(err, idx) in errors"
-        :key="idx"
-      >
-        <Banner
-          color="error"
-          :label="stringify(err.Message || err)"
-        />
+      <div v-for="(err, idx) in errors" :key="idx">
+        <Banner color="error" :label="stringify(err.Message || err)" />
       </div>
     </div>
   </div>
 </template>
 
 <style lang="scss" scoped>
-  $yaml-height: 200px;
-
-  ::v-deep .yaml-editor{
-    flex: 1;
+$yaml-height: 200px;
+
+::v-deep .yaml-editor {
+  flex: 1;
+  min-height: $yaml-height;
+  & .code-mirror .CodeMirror {
+    position: initial;
+    height: auto;
     min-height: $yaml-height;
-    & .code-mirror .CodeMirror {
-      position: initial;
-      height: auto;
-      min-height: $yaml-height;
-    }
   }
+}
 </style>

package/middleware/authenticated.js

@@ -10,10 +10,10 @@ import { applyProducts } from '@shell/store/type-map';
 import { findBy } from '@shell/utils/array';
 import { ClusterNotFoundError } from '@shell/utils/error';
 import { get } from '@shell/utils/object';
+import { setFavIcon, haveSetFavIcon } from '@shell/utils/favicon';
+import dynamicPluginLoader from '@shell/pkg/dynamic-plugin-loader';
 import { AFTER_LOGIN_ROUTE, WORKSPACE } from '@shell/store/prefs';
-import { NAME as VIRTUAL } from '@shell/config/product/harvester';
 import { BACK_TO } from '@shell/config/local-storage';
-import { setFavIcon, haveSetFavIcon } from '@shell/utils/favicon';
 import { NAME as FLEET_NAME } from '@shell/config/product/fleet.js';
 
 const getPackageFromRoute = (route) => {
@@ -28,7 +28,7 @@ const getPackageFromRoute = (route) => {
 
 let beforeEachSetup = false;
 
-function getProduct(to) {
+export function getProductFromRoute(to) {
   let product = to.params?.product;
 
   if ( !product ) {
@@ -43,7 +43,7 @@ function getProduct(to) {
 }
 
 function setProduct(store, to) {
-  let product = getProduct(to);
+  let product = getProductFromRoute(to);
 
   if ( !product ) {
     product = EXPLORER;
@@ -66,7 +66,7 @@ function setProduct(store, to) {
 }
 
 export default async function({
-  route, app, store, redirect, $cookies, req, isDev, from, $plugin
+  route, app, store, redirect, $cookies, req, isDev, from, $plugin, next
 }) {
   if ( route.path && typeof route.path === 'string') {
     // Ignore webpack hot module reload requests
@@ -245,10 +245,8 @@ export default async function({
       window.location.href = backTo;
     }
   }
-
   // Load stuff
   await applyProducts(store, $plugin);
-
   // Setup a beforeEach hook once to keep track of the current product
   if ( !beforeEachSetup ) {
     beforeEachSetup = true;
@@ -276,10 +274,10 @@ export default async function({
     let clusterId = get(route, 'params.cluster');
 
     const pkg = getPackageFromRoute(route);
-    const product = getProduct(route);
+    const product = getProductFromRoute(route);
 
     const oldPkg = getPackageFromRoute(from);
-    const oldProduct = getProduct(from);
+    const oldProduct = getProductFromRoute(from);
 
     // Leave an old pkg where we weren't before?
     const oldPkgPlugin = oldPkg ? Object.values($plugin.getPlugins()).find(p => p.name === oldPkg) : null;
@@ -316,6 +314,24 @@ export default async function({
       });
     }
 
+    if (!route.matched?.length) {
+      // If there are no matching routes we could be trying to nav to a page belonging to a dynamic plugin which needs loading
+      await Promise.all([
+        ...always,
+      ]);
+
+      // If a plugin claims the route and is loaded correctly we'll get a route back
+      const newLocation = await dynamicPluginLoader.check({ route, store });
+
+      // If we have a new location, double check that it's actually valid
+      const resolvedRoute = newLocation ? store.app.router.resolve(newLocation) : null;
+
+      if (resolvedRoute?.route.matched.length) {
+        // Note - don't use `redirect` or `store.app.route` (breaks feature by failing to run middleware in default layout)
+        return next(newLocation);
+      }
+    }
+
     // Ensure that the activeNamespaceCache is updated given the change of context either from or to a place where it uses workspaces
     // When fleet moves to it's own package this should be moved to pkg onEnter/onLeave
     if ((oldProduct === FLEET_NAME || product === FLEET_NAME) && oldProduct !== product) {
@@ -327,49 +343,37 @@ export default async function({
       });
     }
 
-    if (product === VIRTUAL || route.name === `c-cluster-${ VIRTUAL }` || route.name?.startsWith(`c-cluster-${ VIRTUAL }-`)) {
-      setProduct(store, route);
-      const res = [
-        ...always,
-        store.dispatch('loadVirtual', {
-          id: clusterId,
-          oldProduct,
-        }),
-      ];
-
-      await Promise.all(res);
-    } else {
-      // Always run loadCluster, it handles 'unload' as well
-      // Run them in parallel
-      await Promise.all([
-        ...always,
-        store.dispatch('loadCluster', {
-          id:     clusterId,
-          oldPkg: oldPkgPlugin,
-          newPkg: newPkgPlugin,
-          product,
-          oldProduct,
-        })]);
-
-      if (!clusterId) {
-        clusterId = store.getters['defaultClusterId']; // This needs the cluster list, so no parallel
-        const isSingleProduct = store.getters['isSingleProduct'];
-
-        if (isSingleProduct?.afterLoginRoute) {
-          const value = {
-            name:   'c-cluster-product',
-            ...isSingleProduct.afterLoginRoute,
-            params: {
-              cluster: clusterId,
-              ...isSingleProduct.afterLoginRoute?.params
-            },
-          };
-
-          await store.dispatch('prefs/set', {
-            key: AFTER_LOGIN_ROUTE,
-            value,
-          });
-        }
+    // Always run loadCluster, it handles 'unload' as well
+    // Run them in parallel
+    await Promise.all([
+      ...always,
+      store.dispatch('loadCluster', {
+        id:     clusterId,
+        oldPkg: oldPkgPlugin,
+        newPkg: newPkgPlugin,
+        product,
+        oldProduct,
+      })
+    ]);
+
+    if (!clusterId) {
+      clusterId = store.getters['defaultClusterId']; // This needs the cluster list, so no parallel
+      const isSingleProduct = store.getters['isSingleProduct'];
+
+      if (isSingleProduct?.afterLoginRoute) {
+        const value = {
+          name:   'c-cluster-product',
+          ...isSingleProduct.afterLoginRoute,
+          params: {
+            cluster: clusterId,
+            ...isSingleProduct.afterLoginRoute?.params
+          },
+        };
+
+        await store.dispatch('prefs/set', {
+          key: AFTER_LOGIN_ROUTE,
+          value,
+        });
       }
     }
   } catch (e) {

package/mixins/brand.js

@@ -12,16 +12,15 @@ export default {
         this.apps = await this.$store.dispatch('management/findAll', { type: CATALOG.APP });
       }
     } catch (e) {}
+
+    this.globalSettings = await this.$store.dispatch('management/findAll', { type: MANAGEMENT.SETTING });
   },
 
   data() {
-    return { apps: [] };
+    return { apps: [], globalSettings: [] };
   },
 
   computed: {
-    globalSettings() {
-      return this.$store.getters['management/all'](MANAGEMENT.SETTING);
-    },
 
     brand() {
       const setting = findBy(this.globalSettings, 'id', SETTING.BRAND);

package/mixins/create-edit-view/impl.js

@@ -12,14 +12,6 @@ export default {
 
   mixins: [ChildHook],
 
-  mounted() {
-    // For easy access debugging...
-    if ( typeof window !== 'undefined' ) {
-      window.v = this.value;
-      window.c = this;
-    }
-  },
-
   data() {
     // Keep label and annotation filters in data so each resource CRUD page can alter individually
     return { errors: [] };

package/mixins/form-validation.js

@@ -1,5 +1,5 @@
 import { getAllValues } from '@shell/utils/object';
-import formRulesGenerator from '@shell/utils/validators/formRules';
+import formRulesGenerator from '@shell/utils/validators/formRules/index';
 
 export default {
   data() {

package/mixins/resource-fetch.js

@@ -2,7 +2,7 @@ import { mapGetters } from 'vuex';
 import {
   COUNT, MANAGEMENT, POD, WORKLOAD_TYPES, WORKLOAD, SECRET
 } from '@shell/config/types';
-import { SETTING } from '@shell/config/settings';
+import { SETTING, DEFAULT_PERF_SETTING } from '@shell/config/settings';
 
 // Number of pages to fetch when loading incrementally
 const PAGES = 4;
@@ -33,6 +33,8 @@ export default {
       } catch (e) {
         console.warn('ui-performance setting contains invalid data'); // eslint-disable-line no-console
       }
+    } else {
+      perfConfig = DEFAULT_PERF_SETTING;
     }
 
     return {

package/models/chart.js

@@ -10,7 +10,7 @@ export default class Chart extends SteveModel {
     let version;
     const chartVersions = this.versions;
     const currentCluster = this.$rootGetters['currentCluster'];
-    const workerOSs = currentCluster.workerOSs;
+    const workerOSs = currentCluster?.workerOSs;
     const compatibleVersions = compatibleVersionsFor(this, workerOSs);
 
     if (compatibleVersions.length) {

package/models/cluster/node.js

@@ -7,6 +7,7 @@ import { parseSi } from '@shell/utils/units';
 import findLast from 'lodash/findLast';
 
 import SteveModel from '@shell/plugins/steve/steve-class';
+import { LOCAL } from '@shell/config/query-params';
 
 export default class ClusterNode extends SteveModel {
   get _availableActions() {
@@ -254,10 +255,20 @@ export default class ClusterNode extends SteveModel {
     }));
   }
 
+  /**
+   *Find the node's cluster id from it's url
+   */
   get clusterId() {
     const parts = this.links.self.split('/');
 
-    return parts[parts.length - 4];
+    // Local cluster url links omit `/k8s/clusters/<cluster id>`
+    // `/v1/nodes` vs `k8s/clusters/c-m-274kcrc4/v1/nodes`
+    // Be safe when determining this, so work back through the url from a known point
+    if (parts.length > 6 && parts[parts.length - 6] === 'k8s' && parts[parts.length - 5] === 'clusters') {
+      return parts[parts.length - 4];
+    }
+
+    return LOCAL;
   }
 
   get normanNodeId() {