@rancher/shell 0.3.16 → 0.3.17

package/initialize/App.js

@@ -1,23 +1,13 @@
 import Vue from 'vue';
 
-import {
-  getMatchedComponentsInstances, getChildrenComponentInstancesUsingFetch, promisify, globalHandleError, sanitizeComponent
-} from '../utils/nuxt';
+import { getMatchedComponentsInstances, getChildrenComponentInstancesUsingFetch, promisify, globalHandleError } from '../utils/nuxt';
 import NuxtError from '../layouts/error.vue';
 import NuxtLoading from '../components/nav/GlobalLoading.vue';
 
 import '../assets/styles/app.scss';
+import { getLayouts } from './layouts';
 
-import blank from '../layouts/blank.vue';
-import defaultLayout from '../layouts/default.vue';
-import home from '../layouts/home.vue';
-import plain from '../layouts/plain.vue';
-import unauthenticated from '../layouts/unauthenticated.vue';
-import standalone from '../layouts/standalone.vue';
-
-const layouts = {
-  _blank: sanitizeComponent(blank), _default: sanitizeComponent(defaultLayout), _home: sanitizeComponent(home), _plain: sanitizeComponent(plain), _unauthenticated: sanitizeComponent(unauthenticated), _standalone: sanitizeComponent(standalone)
-};
+const layouts = getLayouts();
 
 export default {
   render(h) {

package/initialize/layouts.ts

@@ -0,0 +1,26 @@
+import { sanitizeComponent } from '@shell/utils/nuxt';
+import blank from '@shell/layouts/blank.vue';
+import defaultLayout from '@shell/layouts/default.vue';
+import home from '@shell/layouts/home.vue';
+import plain from '@shell/layouts/plain.vue';
+import unauthenticated from '@shell/layouts/unauthenticated.vue';
+import standalone from '@shell/layouts/standalone.vue';
+
+export type Component = { [key: string]: any };
+export type Layouts = { [key: string]: Component };
+const layouts: Layouts = { };
+
+export function getLayouts(): Layouts {
+  return layouts;
+}
+
+export function registerLayout(name: string, component: Component): void {
+  layouts[`_${ name }`] = sanitizeComponent(component);
+}
+
+registerLayout('blank', blank) ;
+registerLayout('default', defaultLayout) ;
+registerLayout('home', home) ;
+registerLayout('plain', plain) ;
+registerLayout('unauthenticated', unauthenticated) ;
+registerLayout('standalone', standalone);

package/list/provisioning.cattle.io.cluster.vue

@@ -135,6 +135,13 @@ export default {
     },
 
     harvesterEnabled: mapFeature(HARVESTER_FEATURE),
+
+    nonStandardNamespaces() {
+      // Show the namespace grouping option if there's clusters with namespaces other than 'fleet-default' or 'fleet-local'
+      // This will be used when there's clusters from extension based provisioners
+      // We should re-visit this for scaling reasons
+      return this.filteredRows.some((c) => c.metadata.namespace !== 'fleet-local' && c.metadata.namespace !== 'fleet-default');
+    }
   },
 
   $loadingResources() {
@@ -182,7 +189,7 @@ export default {
     <ResourceTable
       :schema="schema"
       :rows="filteredRows"
-      :namespaced="false"
+      :namespaced="nonStandardNamespaces"
       :loading="loading"
       :use-query-params-for-simple-filtering="useQueryParamsForSimpleFiltering"
       :data-testid="'cluster-list'"

package/middleware/authenticated.js

@@ -26,6 +26,16 @@ const getPackageFromRoute = (route) => {
   return arraySafe.find((m) => !!m.pkg)?.pkg;
 };
 
+const getResourceFromRoute = (to) => {
+  let resource = to.params?.resource;
+
+  if (!resource) {
+    resource = findMeta(to, 'resource');
+  }
+
+  return resource;
+};
+
 let beforeEachSetup = false;
 
 function findMeta(route, key) {
@@ -71,9 +81,18 @@ export function getProductFromRoute(to) {
   return product;
 }
 
-function setProduct(store, to) {
+function setProduct(store, to, redirect) {
   let product = getProductFromRoute(to);
 
+  // since all products are hardcoded as routes (ex: c-local-explorer), if we match the wildcard route it means that the product does not exist
+  if ((product && (!to.matched.length || (to.matched.length && to.matched[0].path === '/c/:cluster/:product'))) ||
+  // if the product grabbed from the route is not registered, then we don't have it!
+  (product && !store.getters['type-map/isProductRegistered'](product))) {
+    store.dispatch('loadingError', new Error(store.getters['i18n/t']('nav.failWhale.productNotFound', { productNotFound: product }, true)));
+
+    return () => redirect(302, '/fail-whale');
+  }
+
   if ( !product ) {
     product = EXPLORER;
   }
@@ -92,6 +111,42 @@ function setProduct(store, to) {
     // There might be management catalog items in it vs cluster.
     store.commit('catalog/reset');
   }
+
+  return false;
+}
+
+/**
+ * Check that the resource is valid, if not redirect to fail whale
+ *
+ * This requires that
+ * - product is set
+ * - product's store is set and setup (so we can check schema's within it)
+ * - product's store has the schemaFor getter (extension stores might not have it)
+ * - there's a resource associated with route (meta or param)
+ */
+function invalidResource(store, to, redirect) {
+  const product = store.getters['currentProduct'];
+  const inStore = product?.inStore;
+  const schemaFor = store.getters[`${ inStore }/schemaFor`]; // There's a chance we're in an extension's product who's store could be anything
+  const resource = getResourceFromRoute(to);
+
+  // In order to check a resource is valid we need all of these
+  if (!product || !inStore || !schemaFor || !resource) {
+    return false;
+  }
+
+  // Resource is valid if a schema exists for it (standard resource, spoofed resource) or it's a virtual resource
+  const validResource = schemaFor(resource) || store.getters['type-map/isVirtual'](resource);
+
+  if (validResource) {
+    return false;
+  }
+
+  // Unknown resource, redirect to fail whale
+
+  store.dispatch('loadingError', new Error(store.getters['i18n/t']('nav.failWhale.resourceNotFound', { resource }, true)));
+
+  return () => redirect(302, '/fail-whale');
 }
 
 export default async function({
@@ -281,19 +336,39 @@ export default async function({
   store.dispatch('gcRouteChanged', route);
 
   // Load stuff
+  let localCheckResource = false;
+
   await applyProducts(store, $plugin);
+
   // Setup a beforeEach hook once to keep track of the current product
   if ( !beforeEachSetup ) {
     beforeEachSetup = true;
+    // This only needs to happen when beforeEach hook hasn't run (the initial load)
+    localCheckResource = true;
 
     store.app.router.beforeEach((to, from, next) => {
       // NOTE - This beforeEach runs AFTER this middleware. So anything in this middleware that requires it must set it manually
-      setProduct(store, to);
+      let redirected = setProduct(store, to, redirect);
+
+      if (redirected) {
+        return redirected();
+      }
+
+      redirected = invalidResource(store, to, redirect);
+
+      if (redirected) {
+        return redirected();
+      }
+
       next();
     });
 
     // Call it for the initial pageload
-    setProduct(store, route);
+    const redirected = setProduct(store, route, redirect);
+
+    if (redirected) {
+      return redirected();
+    }
 
     if (process.client) {
       store.app.router.afterEach((to, from) => {
@@ -376,7 +451,12 @@ export default async function({
     // 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) {
       // See note above for store.app.router.beforeEach, need to setProduct manually, for the moment do this in a targeted way
-      setProduct(store, route);
+      const redirected = setProduct(store, route, redirect);
+
+      if (redirected) {
+        return redirected();
+      }
+
       store.commit('updateWorkspace', {
         value:   store.getters['prefs/get'](WORKSPACE) || DEFAULT_WORKSPACE,
         getters: store.getters
@@ -397,6 +477,14 @@ export default async function({
       })
     ]);
 
+    if (localCheckResource) {
+      const redirected = invalidResource(store, route, redirect);
+
+      if (redirected) {
+        return redirected();
+      }
+    }
+
     if (!clusterId) {
       clusterId = store.getters['defaultClusterId']; // This needs the cluster list, so no parallel
       const isSingleProduct = store.getters['isSingleProduct'];
@@ -422,7 +510,7 @@ export default async function({
       return redirect(302, '/home');
     } else {
       // Sets error 500 if lost connection to API
-      store.commit('setError', { error: e, locationError: new Error('Auth Middleware') });
+      store.commit('setError', { error: e, locationError: new Error(store.getters['i18n/t']('nav.failWhale.authMiddleware')) });
 
       return redirect(302, '/fail-whale');
     }

package/mixins/brand.js

@@ -1,3 +1,4 @@
+import { mapGetters } from 'vuex';
 import { CATALOG, MANAGEMENT } from '@shell/config/types';
 import { getVendor } from '@shell/config/private-label';
 import { SETTING } from '@shell/config/settings';
@@ -5,6 +6,12 @@ import { findBy } from '@shell/utils/array';
 import { createCssVars } from '@shell/utils/color';
 import { _ALL_IF_AUTHED } from '@shell/plugins/dashboard-store/actions';
 
+const cspAdaptorApp = ['rancher-csp-adapter', 'rancher-csp-billing-adapter'];
+
+export const hasCspAdapter = (apps) => {
+  return apps?.find((a) => cspAdaptorApp.includes(a.metadata?.name));
+};
+
 export default {
   async fetch() {
     // For the login page, the schemas won't be loaded - we don't need the apps in this case
@@ -23,13 +30,19 @@ export default {
         }
       });
     } catch (e) {}
+
+    // Setting this up front will remove `computed` churn, and we only care that we've initialised them
+    this.haveAppsAndSettings = !!this.apps && !!this.globalSettings;
   },
 
   data() {
-    return { apps: [], globalSettings: [] };
+    return {
+      apps: null, globalSettings: null, haveAppsAndSettings: null
+    };
   },
 
   computed: {
+    ...mapGetters({ loggedIn: 'auth/loggedIn' }),
 
     brand() {
       const setting = findBy(this.globalSettings, 'id', SETTING.BRAND);
@@ -61,7 +74,23 @@ export default {
     },
 
     cspAdapter() {
-      return findBy(this.apps, 'metadata.name', 'rancher-csp-adapter' );
+      if (!this.canCalcCspAdapter) {
+        // We only have a watch on cspAdapter to kick off persisting the brand setting.
+        // So we need to ensure we don't return an undefined here... which would match the undefined gave if no csp app was found...
+        // .. and wouldn't kick off the watcher
+        return '';
+      }
+
+      // Note! this used to be `findBy(this.app)` however for that case we lost reactivity on the collection
+      // (computed fires before fetch, fetch happens and update apps, computed would not fire again - even with vue.set)
+      // So use `.find` in method instead
+      return hasCspAdapter(this.apps);
+    },
+
+    canCalcCspAdapter() {
+      // We need to take consider the loggedIn state, as the brand mixin is used in the logout page where we can be in a mixed state
+      // (things in store but user has no auth to make changes)
+      return this.loggedIn && this.haveAppsAndSettings;
     }
   },
 
@@ -90,7 +119,13 @@ export default {
     },
 
     cspAdapter(neu) {
+      if (!this.canCalcCspAdapter) {
+        return;
+      }
+
+      // The brand setting will only get updated if...
       if (neu && !this.brand) {
+        // 1) There should be a brand... but there's no brand setting
         const brandSetting = findBy(this.globalSettings, 'id', SETTING.BRAND);
 
         if (brandSetting) {
@@ -109,7 +144,8 @@ export default {
       } else if (!neu) {
         const brandSetting = findBy(this.globalSettings, 'id', SETTING.BRAND);
 
-        if (brandSetting) {
+        if (brandSetting && brandSetting.value !== '') {
+          // 2) There should not be a brand... but there is a brand setting
           brandSetting.value = '';
           brandSetting.save();
         }

package/mixins/child-hook.js

@@ -20,8 +20,8 @@ export default {
       });
     },
 
-    registerAfterHook(boundFn, name, priority) {
-      this._registerHook(AFTER_SAVE_HOOKS, boundFn, name, priority);
+    registerAfterHook(boundFn, name, priority = 99, boundFnContext) {
+      this._registerHook(AFTER_SAVE_HOOKS, boundFn, name, priority, boundFnContext);
     },
 
     async applyHooks(key, ...args) {

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

@@ -124,7 +124,7 @@ export default {
       }
 
       try {
-        await this.applyHooks(BEFORE_SAVE_HOOKS);
+        await this.applyHooks(BEFORE_SAVE_HOOKS, this.value);
 
         // Remove the labels map if it's empty
         if ( this.value?.metadata?.labels && Object.keys(this.value.metadata.labels || {}).length === 0 ) {
@@ -152,7 +152,7 @@ export default {
           await this.$store.dispatch('cluster/findAll', { type: this.value.type, opt: { force: true } }, { root: true });
         }
 
-        await this.applyHooks(AFTER_SAVE_HOOKS);
+        await this.applyHooks(AFTER_SAVE_HOOKS, this.value);
         buttonDone && buttonDone(true);
 
         this.done();

package/models/fleet.cattle.io.gitrepo.js

@@ -30,6 +30,7 @@ export default class GitRepo extends SteveModel {
 
     spec.paths = spec.paths || [];
     spec.clientSecretName = spec.clientSecretName || null;
+    spec.correctDrift = { enabled: false };
 
     set(this, 'spec', spec);
     set(this, 'metadata', meta);

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

@@ -9,10 +9,11 @@ import { ucFirst } from '@shell/utils/string';
 import { compare } from '@shell/utils/version';
 import { AS, MODE, _VIEW, _YAML } from '@shell/config/query-params';
 import { HARVESTER_NAME as HARVESTER } from '@shell/config/features';
+import { CAPI as CAPI_ANNOTATIONS } from '@shell/config/labels-annotations';
 
 /**
  * Class representing Cluster resource.
- * @extends SteveModal
+ * @extends SteveModel
  */
 export default class ProvCluster extends SteveModel {
   get details() {
@@ -381,6 +382,13 @@ export default class ProvCluster extends SteveModel {
   }
 
   get machineProvider() {
+    // First check annotation - useful for clusters created by extension providers
+    const fromAnnotation = this.annotations?.[CAPI_ANNOTATIONS.UI_CUSTOM_PROVIDER];
+
+    if (fromAnnotation) {
+      return fromAnnotation;
+    }
+
     if (this.isHarvester) {
       return HARVESTER;
     } else if ( this.isImported ) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "0.3.16",
+  "version": "0.3.17",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",
@@ -69,7 +69,7 @@
     "d3-selection": "1.4.1",
     "dagre-d3": "0.6.4",
     "dayjs": "1.8.29",
-    "diff2html": "2.11.2",
+    "diff2html": "3.4.24",
     "dompurify": "2.4.5",
     "eslint": "7.32.0",
     "eslint-config-standard": "16.0.3",

package/pages/about.vue

@@ -6,6 +6,7 @@ import { MANAGEMENT } from '@shell/config/types';
 import { SETTING } from '@shell/config/settings';
 import { getVendor } from '@shell/config/private-label';
 import { downloadFile } from '@shell/utils/download';
+import { mapGetters } from 'vuex';
 
 export default {
   layout:     'plain',
@@ -22,6 +23,7 @@ export default {
     };
   },
   computed: {
+    ...mapGetters(['releaseNotesUrl']),
     rancherVersion() {
       return this.settings.find((s) => s.id === SETTING.VERSION_RANCHER);
     },
@@ -168,9 +170,13 @@ export default {
       </tr>
     </table>
     <p class="pt-20">
-      <nuxt-link :to="{ path: 'docs/whats-new'}">
+      <a
+        :href="releaseNotesUrl"
+        target="_blank"
+        rel="nofollow noopener noreferrer"
+      >
         {{ t('about.versions.releaseNotes') }}
-      </nuxt-link>
+      </a>
     </p>
     <template v-if="downloadImageList.length">
       <h3 class="pt-40">

package/pages/auth/login.vue

@@ -544,7 +544,7 @@ export default {
 
   .gutless {
     height: 100vh;
-    .span-6 {
+    & > .span-6 {
       overflow-y: auto;
       display: flex;
       flex-direction: column;

package/pages/auth/logout.vue

@@ -11,8 +11,16 @@ export default {
 
 <template>
   <main class="main-layout">
-    <h1 class="text-center mt-50">
-      Logging Out&hellip;
-    </h1>
+    <div>
+      <h1 v-t="'logout.message'" />
+    </div>
   </main>
 </template>
+<style lang="scss" scoped>
+  main > div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+  }
+</style>

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

@@ -242,7 +242,7 @@ export default {
   },
 
   created() {
-    const release = this.currentCluster?.status?.version.gitVersion || '';
+    const release = this.currentCluster?.status?.version?.gitVersion || '';
     const isRKE2 = release.includes('rke2');
     const version = release.match(/\d+/g);
 
@@ -352,7 +352,10 @@ export default {
   <div v-else>
     <header>
       <div class="title">
-        <h1 class="m-0">
+        <h1
+          data-testid="charts-header-title"
+          class="m-0"
+        >
           {{ t('catalog.charts.header') }}
         </h1>
       </div>

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

@@ -1251,6 +1251,10 @@ export default {
       this.steps[0].ready = okRequires && okChart;
     },
 
+    updateStepTwoReady(update) {
+      this.updateStep('helmValues', { ready: update });
+    },
+
     getOptionLabel(opt) {
       return opt?.chartNameDisplay;
     },
@@ -1567,6 +1571,7 @@ export default {
                   @warn="e=>errors.push(e)"
                   @register-before-hook="registerBeforeHook"
                   @register-after-hook="registerAfterHook"
+                  @valid="updateStepTwoReady($event)"
                 />
               </Tabbed>
               <template v-else>

package/pages/c/_cluster/explorer/index.vue

@@ -27,7 +27,7 @@ import {
   STATE,
 } from '@shell/config/table-headers';
 
-import { mapPref, CLUSTER_TOOLS_TIP, PSP_DEPRECATION_BANNER } from '@shell/store/prefs';
+import { mapPref, PSP_DEPRECATION_BANNER } from '@shell/store/prefs';
 import { haveV1Monitoring, monitoringStatus } from '@shell/utils/monitoring';
 import Tabbed from '@shell/components/Tabbed';
 import Tab from '@shell/components/Tabbed/Tab';
@@ -173,7 +173,6 @@ export default {
       return this.$store.getters['management/all'](MANAGEMENT.CLUSTER);
     },
 
-    hideClusterToolsTip:      mapPref(CLUSTER_TOOLS_TIP),
     hidePspDeprecationBanner: mapPref(PSP_DEPRECATION_BANNER),
 
     hasV1Monitoring() {
@@ -441,14 +440,6 @@ export default {
         :raw="true"
       />
     </Banner>
-    <Banner
-      v-if="!hideClusterToolsTip"
-      :closable="true"
-      class="cluster-tools-tip"
-      color="info"
-      label-key="cluster.toolsTip"
-      @close="hideClusterToolsTip = true"
-    />
     <div
       class="cluster-dashboard-glance"
     >