@rancher/shell 0.3.29 → 0.5.0

package/pages/auth/verify.vue

@@ -17,9 +17,14 @@ function reply(err, code) {
   }
 }
 
-export default {
-  layout: 'unauthenticated',
+function isSaml($route) {
+  const { query } = $route;
+  const configQuery = get(query, 'config');
+
+  return samlProviders.includes(configQuery);
+}
 
+export default {
   async fetch({ store, route, redirect }) {
     const code = route.query[GITHUB_CODE];
     const stateStr = route.query[GITHUB_NONCE];
@@ -43,9 +48,14 @@ export default {
     try {
       parsed = JSON.parse(base64Decode((stateStr)));
     } catch (err) {
+      if (isSaml(route)) {
+        // This is an ok failure. SAML has no state string so a failure is fine (see similar check in mounted).
+        // This whole file could be re-written with that in mind, but this change keeps things simple and fixes a breaking addition
+        return;
+      }
       const out = store.getters['i18n/t'](`login.error`);
 
-      console.error('Failed to parse nonce'); // eslint-disable-line no-console
+      console.error('Failed to parse nonce', stateStr, err); // eslint-disable-line no-console
 
       redirect(`/auth/login?err=${ escape(out) }`);
 
@@ -117,12 +127,8 @@ export default {
         window.close();
       }
     } else {
-      const { query } = this.$route;
-
       if ( window.opener ) {
-        const configQuery = get(query, 'config');
-
-        if ( samlProviders.includes(configQuery) ) {
+        if (isSaml(this.$route)) {
           if ( window.opener.window.onAuthTest ) {
             reply(null, null);
           } else {

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

@@ -138,6 +138,11 @@ export default {
       return reducedRepos;
     },
 
+    /**
+     * Filter allll charts by invalid entries (deprecated, hidden and ui plugin).
+     *
+     * This does not include any user provided filters (like selected repos, categories and text query)
+     */
     enabledCharts() {
       return (this.allCharts || []).filter((c) => {
         if ( c.deprecated && !this.showDeprecated ) {
@@ -148,10 +153,6 @@ export default {
           return false;
         }
 
-        if ( this.hideRepos.includes(c.repoKey) ) {
-          return false;
-        }
-
         if (isUIPlugin(c)) {
           return false;
         }
@@ -160,26 +161,28 @@ export default {
       });
     },
 
+    /**
+     * Filter enabled charts allll filters. These are what the user will see in the list
+     */
     filteredCharts() {
-      const enabledCharts = (this.enabledCharts || []);
-      const clusterProvider = this.currentCluster.status.provider || 'other';
-
-      return filterAndArrangeCharts(enabledCharts, {
-        clusterProvider,
-        category:       this.category,
-        searchQuery:    this.searchQuery,
-        showDeprecated: this.showDeprecated,
-        showHidden:     this.showHidden,
-        hideRepos:      this.hideRepos,
-        hideTypes:      [CATALOG._CLUSTER_TPL],
-        showPrerelease: this.$store.getters['prefs/get'](SHOW_PRE_RELEASE),
+      return this.filterCharts({
+        category:    this.category,
+        searchQuery: this.searchQuery,
+        hideRepos:   this.hideRepos
       });
     },
 
-    getFeaturedCharts() {
-      const allCharts = (this.filteredCharts || []);
+    /**
+     * Filter valid charts (alll filters minus user provided ones) by whether they are featured or not
+     *
+     * This will power the carousel
+     */
+    featuredCharts() {
+      const filteredCharts = this.filterCharts({});
+
+      // debugger;
 
-      const featuredCharts = allCharts.filter((value) => value.featured).sort((a, b) => a.featured - b.featured);
+      const featuredCharts = filteredCharts.filter((value) => value.featured).sort((a, b) => a.featured - b.featured);
 
       return featuredCharts.slice(0, 5);
     },
@@ -187,7 +190,13 @@ export default {
     categories() {
       const map = {};
 
-      for ( const chart of this.enabledCharts ) {
+      // Filter charts by everything except itself
+      const charts = this.filterCharts({
+        searchQuery: this.searchQuery,
+        hideRepos:   this.hideRepos
+      });
+
+      for ( const chart of charts ) {
         for ( const c of chart.categories ) {
           if ( !map[c] ) {
             const labelKey = `catalog.charts.categories.${ lcFirst(c) }`;
@@ -208,14 +217,14 @@ export default {
       out.unshift({
         label: this.t('catalog.charts.categories.all'),
         value: '',
-        count: this.enabledCharts.length
+        count: charts.length
       });
 
-      return out;
+      return sortBy(out, ['label']);
     },
 
     showCarousel() {
-      return this.chartMode === 'featured' && this.getFeaturedCharts.length;
+      return this.chartMode === 'featured' && this.featuredCharts.length;
     }
 
   },
@@ -334,6 +343,22 @@ export default {
         btnCb(false);
       }
     },
+
+    filterCharts({ category, searchQuery, hideRepos }) {
+      const enabledCharts = (this.enabledCharts || []);
+      const clusterProvider = this.currentCluster.status.provider || 'other';
+
+      return filterAndArrangeCharts(enabledCharts, {
+        clusterProvider,
+        category,
+        searchQuery,
+        showDeprecated: this.showDeprecated,
+        showHidden:     this.showHidden,
+        hideRepos,
+        hideTypes:      [CATALOG._CLUSTER_TPL],
+        showPrerelease: this.$store.getters['prefs/get'](SHOW_PRE_RELEASE),
+      });
+    }
   },
 };
 </script>
@@ -351,7 +376,7 @@ export default {
         </h1>
       </div>
       <div
-        v-if="getFeaturedCharts.length > 0"
+        v-if="featuredCharts.length > 0"
         class="actions-container"
       >
         <ButtonGroup
@@ -363,7 +388,7 @@ export default {
     <div v-if="showCarousel">
       <h3>{{ t('catalog.charts.featuredCharts') }}</h3>
       <Carousel
-        :sliders="getFeaturedCharts"
+        :sliders="featuredCharts"
         @clicked="(row) => selectChart(row)"
       />
     </div>
@@ -514,22 +539,21 @@ export default {
         }
       }
     }
-  }
+}
 
 .checkbox-select {
-   .vs__search {
+  .vs__search {
     position: absolute;
     right: 0
   }
 
- .vs__selected-options  {
+  .vs__selected-options  {
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
     display: inline-block;
     line-height: 2.4rem;
   }
-
 }
 
 .checkbox-outer-container.in-select {
@@ -537,7 +561,7 @@ export default {
   padding: 7px 0 6px 13px;
   width: calc(100% + 10px);
 
-  ::v-deep.checkbox-label {
+  ::v-deep .checkbox-label {
     display: flex;
     align-items: center;
 
@@ -552,7 +576,7 @@ export default {
     }
   }
 
-  &:hover ::v-deep.checkbox-label {
+  &:hover ::v-deep .checkbox-label {
       color: var(--body-text);
     }
 
@@ -560,7 +584,7 @@ export default {
       &:hover {
       background: var(--app-rancher-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-rancher-accent-text);
     }
     & i {
@@ -572,7 +596,7 @@ export default {
       &:hover {
       background: var(--app-partner-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-partner-accent-text);
     }
     & i {
@@ -584,7 +608,7 @@ export default {
     &:hover {
       background: var(--app-color1-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color1-accent-text);
     }
     & i {
@@ -595,10 +619,10 @@ export default {
     &:hover {
       background: var(--app-color2-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color2-accent-text);
     }
-        & i {
+    & i {
       color: var(--app-color2-accent)
     }
   }
@@ -606,7 +630,7 @@ export default {
     &:hover {
       background: var(--app-color3-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color3-accent-text);
     }
     & i {
@@ -628,7 +652,7 @@ export default {
     &:hover {
       background: var(--app-color5-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color5-accent-text);
     }
     & i {
@@ -639,7 +663,7 @@ export default {
     &:hover {
       background: var(--app-color6-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color6-accent-text);
     }
     & i {
@@ -650,7 +674,7 @@ export default {
     &:hover {
       background: var(--app-color7-accent);
     }
-    &:hover ::v-deep.checkbox-label {
+    &:hover ::v-deep .checkbox-label {
       color: var(--app-color7-accent-text);
     }
     & i {
@@ -661,9 +685,6 @@ export default {
     &:hover {
       background: var(--app-color8-accent);
     }
-    &:hover ::v-deep.checkbox-label {
-      color: var(--app-color8-accent-text);
-    }
     & i {
       color: var(--app-color8-accent)
     }

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

@@ -248,7 +248,7 @@ export default {
       return;
     }
 
-    if ( this.version && process.client ) {
+    if ( this.version ) {
       /*
         Check if the Helm chart has provided the name
         of a Vue component to use for configuring
@@ -857,11 +857,9 @@ export default {
         }
 
         if (provCluster?.isRke2) { // isRke2 returns true for both RKE2 and K3s clusters.
-          const agentConfig = provCluster.spec?.rkeConfig?.machineSelectorConfig?.find((x) => !x.machineLabelSelector).config;
-
           // If a cluster scoped registry exists,
           // it should be used by default.
-          const clusterRegistry = agentConfig?.['system-default-registry'] || '';
+          const clusterRegistry = provCluster.agentConfig?.['system-default-registry'] || '';
 
           if (clusterRegistry) {
             return clusterRegistry;
@@ -1603,6 +1601,7 @@ export default {
                 v-if="componentHasTabs"
                 ref="tabs"
                 :side-tabs="true"
+                :hide-single-tab="true"
                 :class="{'with-name': showNameEditor}"
                 class="step__values__content"
                 @changed="tabChanged($event)"
@@ -1647,6 +1646,7 @@ export default {
               v-else-if="hasQuestions && showQuestions"
               ref="tabs"
               :side-tabs="true"
+              :hide-single-tab="true"
               :class="{'with-name': showNameEditor}"
               class="step__values__content"
               @changed="tabChanged($event)"

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

@@ -2,8 +2,6 @@
 import { NAME as APPS } from '@shell/config/product/apps';
 
 export default {
-  layout: 'plain',
-
   middleware({ redirect, route } ) {
     return redirect({
       name:   'c-cluster-apps-charts',

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

@@ -3,8 +3,6 @@ import { NAME as AUTH } from '@shell/config/product/auth';
 import { MANAGEMENT } from '@shell/config/types';
 
 export default {
-  layout: 'plain',
-
   middleware({ redirect, route } ) {
     return redirect({
       name:   'c-cluster-product-resource',

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

@@ -1,8 +1,6 @@
 <script>
 
 export default {
-  layout: 'plain',
-
   mounted() {
     const link = this.$store.getters['backToRancherLink'];
 

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

@@ -15,6 +15,7 @@ import {
   WORKLOAD_TYPES,
   COUNT,
   CATALOG,
+  SECRET
 } from '@shell/config/types';
 import { setPromiseResult } from '@shell/utils/promise';
 import AlertTable from '@shell/components/AlertTable';
@@ -42,6 +43,8 @@ import { fetchClusterResources } from './explorer-utils';
 import SimpleBox from '@shell/components/SimpleBox';
 import { ExtensionPoint, CardLocation } from '@shell/core/types';
 import { getApplicableExtensionEnhancements } from '@shell/core/plugin-helpers';
+import Certificates from '@shell/components/Certificates';
+import { NAME as EXPLORER } from '@shell/config/product/explorer';
 
 export const RESOURCES = [NAMESPACE, INGRESS, PV, WORKLOAD_TYPES.DEPLOYMENT, WORKLOAD_TYPES.STATEFUL_SET, WORKLOAD_TYPES.JOB, WORKLOAD_TYPES.DAEMON_SET, SERVICE];
 
@@ -74,6 +77,7 @@ export default {
     ConfigBadge,
     EventsTable,
     SimpleBox,
+    Certificates
   },
 
   mixins: [metricPoller],
@@ -348,8 +352,18 @@ export default {
       return {
         name:   'c-cluster-product-resource',
         params: {
-          product:  'explorer',
-          resource: 'event',
+          product:  EXPLORER,
+          resource: EVENT,
+        }
+      };
+    },
+
+    allSecretsLink() {
+      return {
+        name:   'c-cluster-product-resource',
+        params: {
+          product:  EXPLORER,
+          resource: SECRET,
         }
       };
     }
@@ -581,6 +595,18 @@ export default {
         >
           <AlertTable v-if="selectedTab === 'cluster-alerts'" />
         </Tab>
+        <Tab
+          name="cluster-certs"
+          :label="t('clusterIndexPage.sections.certs.label')"
+          :weight="1"
+        >
+          <span class="events-table-link">
+            <n-link :to="allSecretsLink">
+              <span>{{ t('glance.secretsTable') }}</span>
+            </n-link>
+          </span>
+          <Certificates v-if="selectedTab === 'cluster-certs'" />
+        </Tab>
       </Tabbed>
     </div>
     <Tabbed

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

@@ -14,7 +14,7 @@ import FleetNoWorkspaces from '@shell/components/fleet/FleetNoWorkspaces.vue';
 import { NAME } from '@shell/config/product/fleet';
 
 export default {
-  name:       'ListGitRepo',
+  name:       'FleetDashboard',
   components: {
     Loading,
     ResourceTable,

package/pages/c/_cluster/index.vue

@@ -2,8 +2,6 @@
 import { NAME as EXPLORER } from '@shell/config/product/explorer';
 
 export default {
-  layout: 'plain',
-
   middleware({ redirect, route } ) {
     return redirect({
       name:   'c-cluster-product',

package/pages/c/_cluster/settings/banners.vue

@@ -53,8 +53,6 @@ const DEFAULT_BANNER_SETTING = {
 };
 
 export default {
-  layout: 'authenticated',
-
   components: {
     Checkbox,
     Loading,

package/pages/c/_cluster/settings/brand.vue

@@ -20,8 +20,6 @@ import { setFavIcon } from '@shell/utils/favicon';
 const Color = require('color');
 
 export default {
-  layout: 'authenticated',
-
   components: {
     LabeledInput, Checkbox, FileImageSelector, Loading, SimpleBox, AsyncButton, Banner, ColorInput, TypeDescription
   },

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

@@ -3,8 +3,6 @@ import { NAME as SETTINGS } from '@shell/config/product/settings';
 import { MANAGEMENT } from '@shell/config/types';
 
 export default {
-  layout: 'plain',
-
   middleware({ redirect, route, store } ) {
     const hasSettings = !!store.getters[`management/schemaFor`](MANAGEMENT.SETTING);
 

package/pages/c/_cluster/settings/links.vue

@@ -13,7 +13,6 @@ import DefaultLinksEditor from './DefaultLinksEditor';
 import { CUSTOM_LINKS_VERSION, fetchLinks } from '@shell/config/home-links';
 
 export default {
-  layout:     'authenticated',
   components: {
     KeyValue,
     Loading,

package/pages/c/_cluster/settings/performance.vue

@@ -22,7 +22,6 @@ const l10n = {
 };
 
 export default {
-  layout:     'authenticated',
   components: {
     Checkbox,
     Loading,

package/pages/c/_cluster/uiplugins/CatalogList/CatalogLoadDialog.vue

@@ -469,7 +469,8 @@ export default {
             <div class="fields">
               <LabeledSelect
                 v-model="imagePullSecrets"
-                :label="t('workload.container.imagePullSecrets')"
+                :label="t('plugins.manageCatalog.imageLoad.fields.imagePullSecrets.label')"
+                :tooltip="t('plugins.manageCatalog.imageLoad.fields.imagePullSecrets.tooltip')"
                 :multiple="true"
                 :taggable="true"
                 :options="imagePullNamespacedSecrets"

package/pages/c/_cluster/uiplugins/CatalogList/index.vue

@@ -7,13 +7,12 @@ import { SERVICE, WORKLOAD_TYPES } from '@shell/config/types';
 import { UI_PLUGIN_LABELS, UI_PLUGIN_NAMESPACE } from '@shell/config/uiplugins';
 import { UI_PLUGIN_CATALOG } from '@shell/config/table-headers';
 
-import ActionMenu from '@shell/components/ActionMenu';
 import ResourceTable from '@shell/components/ResourceTable';
 
 export default {
   name: 'CatalogList',
 
-  components: { ActionMenu, ResourceTable },
+  components: { ResourceTable },
 
   mixins: [ResourceManager],
 
@@ -29,10 +28,7 @@ export default {
 
     return {
       actions,
-      catalogHeaders:    UI_PLUGIN_CATALOG,
-      menuTargetElement: null,
-      menuTargetEvent:   null,
-      menuOpen:          false,
+      catalogHeaders: UI_PLUGIN_CATALOG,
     };
   },
 
@@ -49,6 +45,7 @@ export default {
 
     catalogRows() {
       const rows = [];
+      const actions = this.actions;
 
       if ( !isEmpty(this.namespacedDeployments) ) {
         this.namespacedDeployments.forEach((deploy) => {
@@ -57,11 +54,13 @@ export default {
 
           if ( deployName ) {
             const out = {
-              name:    deployName,
-              state:   deploy.metadata?.state?.name,
-              image:   deploy.spec?.template?.spec?.containers[0]?.image,
-              service: null,
-              repo:    null
+              name:                       deployName,
+              state:                      deploy.metadata?.state?.name,
+              image:                      deploy.spec?.template?.spec?.containers[0]?.image,
+              service:                    null,
+              repo:                       null,
+              availableActions:           actions,
+              showCatalogUninstallDialog: () => this.$emit('showCatalogUninstallDialog', out)
             };
             const keys = ['service', 'repo'];
 
@@ -77,20 +76,6 @@ export default {
       return rows;
     }
   },
-
-  methods: {
-    setMenu(event) {
-      this.menuOpen = !!event;
-
-      if (event) {
-        this.menuTargetElement = this.$refs.catalogActions;
-        this.menuTargetEvent = event;
-      } else {
-        this.menuTargetElement = undefined;
-        this.menuTargetEvent = undefined;
-      }
-    }
-  }
 };
 </script>
 
@@ -118,27 +103,6 @@ export default {
             </button>
           </div>
         </template>
-        <template #row-actions="{row}">
-          <button
-            ref="catalogActions"
-            aria-haspopup="true"
-            type="button"
-            class="btn btn-sm role-multi-action actions"
-            data-testid="extensions-page-catalog-row-menu"
-            @click="setMenu"
-          >
-            <i class="icon icon-actions" />
-          </button>
-          <ActionMenu
-            :custom-actions="actions"
-            :open="menuOpen"
-            :use-custom-target-element="true"
-            :custom-target-element="menuTargetElement"
-            :custom-target-event="menuTargetEvent"
-            @close="setMenu(false)"
-            @showCatalogUninstallDialog="e => $emit('showCatalogUninstallDialog', row, e.event)"
-          />
-        </template>
       </ResourceTable>
     </div>
   </div>

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

@@ -93,8 +93,6 @@ export default {
     };
   },
 
-  layout: 'plain',
-
   async fetch() {
     const hash = {};
 

package/pages/diagnostic.vue

@@ -7,8 +7,7 @@ import { filterOnlyKubernetesClusters, filterHiddenLocalCluster } from '@shell/u
 import { sortBy } from '@shell/utils/sort';
 
 export default {
-  name:   'Diagnostic',
-  layout: 'plain',
+  name: 'Diagnostic',
 
   components: { AsyncButton, PromptModal },
 

package/pages/fail-whale.vue

@@ -4,7 +4,6 @@ import { mapGetters, mapState } from 'vuex';
 import { stringify } from '@shell/utils/error';
 
 export default {
-  layout: 'home',
 
   components: { BrandImage },
 

package/pages/prefs.vue

@@ -18,7 +18,6 @@ import { addObject } from '@shell/utils/array';
 import LocaleSelector from '@shell/components/LocaleSelector';
 
 export default {
-  layout:     'plain',
   components: {
     BackLink, ButtonGroup, LabeledSelect, Checkbox, LandingPagePreference, LocaleSelector
   },