@rancher/shell 3.0.5 → 3.0.7

package/assets/translations/en-us.yaml

@@ -723,6 +723,17 @@ authConfig:
     tokenEndpoint: Token Endpoint
     userInfoEndpoint: User Info Endpoint
     acrValue: Authorization Context Reference
+    customClaims:
+      label: Custom Claims
+      enable:
+        label: Add custom claims
+        tooltip: Manually map OIDC claims when your provider doesn’t use standard claim names in tokens.
+      nameClaim: 
+        label: Custom Name Claim
+      groupsClaim: 
+        label: Custom Groups Claim
+      emailClaim: 
+        label: Custom Email Claim
     cognitoIssuer: Issuer URL
     cognitoHelp: "You will need to create an application client in Cognito of type <b>Traditional web application</b> with the Return URL set to the URL shown below."
     scope:
@@ -941,10 +952,6 @@ asyncButton:
     success: Updated
     waiting: Updating&hellip;
   upgrade:
-    action: Upgrade
-    success: Upgrading
-    waiting: Starting&hellip;
-  upgradeVersion:
     action: Upgrade
     success: Upgraded
     waiting: Upgrading&hellip;
@@ -1262,7 +1269,6 @@ catalog:
             upgrade { upgrade }
             downgrade { upgrade }
             editVersion { update }
-            upgradeVersion { upgrade }
           } the {existing, select,
             true { app}
             false { chart}
@@ -5128,16 +5134,17 @@ plugins:
   closePluginPanel: Close plugin description panel
   viewVersionDetails: View extension {name} version {version} details/Readme
   labels:
-    builtin: Built-in
+    builtin: Built-In
     experimental: Experimental
     third-party: Third-Party
     image: Image
     installing: Installing ...
     uninstalling: Uninstalling ...
-    updating: Updating ...
-    rollingBack: Rolling back ...
+    upgrading: Upgrading ...
+    downgrading: Downgrading ...
     menu: Extensions menu
     reloadRancher: Reload Rancher
+    current: current
   descriptions:
     experimental: This Extension is marked as experimental
     third-party: This Extension is provided by a Third-Party
@@ -5166,6 +5173,8 @@ plugins:
       name: Extension module name
       persist: Persist extension by creating custom resource
   info:
+    actions: Actions
+    noActions: No actions available
     detail: Detail
     versions: Versions
     versionError: Could not load version information
@@ -5229,7 +5238,7 @@ plugins:
   tabs:
     all: All
     available: Available
-    builtin: Built-in
+    builtin: Built-In
     images: Images
     installed: Installed
     updates: Updates
@@ -5237,22 +5246,22 @@ plugins:
   version: "Version: {version}"
   install:
     label: Install
-    title: Install Extension {name}
-    prompt: "Are you sure that you want to install this Extension?"
+    title: Install extension {name}
+    prompt: "Are you sure that you want to install this extension?"
     version: Version
     warnNotCertified: Please ensure that you are aware of the risks of installing Extensions from untrusted authors
-  update:
-    label: Update
-    title: Update Extension {name}
-    prompt: "Are you sure that you want to update this Extension?"
-  rollback:
-    label: Rollback
-    title: Rollback Extension {name}
-    prompt: "Are you sure that you want to rollback this Extension?"
+  upgrade:
+    label: Upgrade
+    title: Upgrade extension {name}
+    prompt: "Are you sure that you want to upgrade this extension?"
+  downgrade:
+    label: Downgrade
+    title: Downgrade extension {name}
+    prompt: "Are you sure that you want to downgrade this extension?"
   uninstall:
     label: Uninstall
-    title: "Uninstall Extension: {name}"
-    prompt: "Are you sure that you want to uninstall this Extension?"
+    title: Uninstall extension {name}
+    prompt: "Are you sure that you want to uninstall this extension?"
     catalog: "Are you sure that you want to uninstall this Extension Catalog Image? This will also remove any Extensions provided by this image."
   upgradeAvailable: A newer version of this Extension is available
   reload: Extensions changed - reload required
@@ -5852,6 +5861,8 @@ resourceTabs:
     tab: Conditions
   events:
     tab: Recent Events
+    namespaceTab: "Events in Namespace"
+    namespaceCaption: "Shows all events from resources in <span class='namespace-name'><b>{namespace}</b></span> namespace"
   related:
     tab: Related Resources
     from: Referred To By
@@ -6558,6 +6569,7 @@ tableHeaders:
   endpoints: Endpoints
   expires: Expires
   firstSeen: First Seen
+  firstSeenTooltip: The time at which the event was first recorded
   flow: Flow
   fingerprint: Fingerprint
   gitRepos: Git Repos

package/components/ClusterIconMenu.vue

@@ -119,7 +119,7 @@ export default {
 
 <style lang="scss" scoped>
   .rancher-icon-fill {
-    fill: var(--primary);
+    fill: var(--link, var(--primary));
   }
 
   .cluster-icon-menu {

package/components/ClusterProviderIcon.vue

@@ -79,7 +79,7 @@ export default {
 
 <style lang="scss" scoped>
   .rancher-icon-fill {
-    fill: var(--primary);
+    fill: var(--link, var(--primary));
   }
   .cluster-icon {
     align-items: center;

package/components/CodeMirror.vue

@@ -327,7 +327,7 @@ export default {
 
       &:focus, &.focus {
         outline: none;
-        border-color: var(--outline);
+        border-color: var(--primary-border);
       }
 
       .CodeMirror-wrap pre {

package/components/FilterPanel.vue

@@ -20,6 +20,8 @@ type FilterOption = {
   componentProps?: Record<string, unknown>;
   /** Label to show next to the checkbox, or a custom component next to the checkbox */
   label?: string | { component: ComponentType; componentProps: Record<string, unknown>; };
+  /** Tooltip to be displayed above the checkbox on hover */
+  labelTooltip?: string;
 };
 
 /**
@@ -97,7 +99,12 @@ const updateFilter = (key: string, value: string[]) => {
             @update:value="updateFilter(filter.key, $event)"
           >
             <template #label>
-              <span v-if="typeof option.label === 'string'">{{ option.label }}</span>
+              <span
+                v-if="typeof option.label === 'string'"
+                v-clean-tooltip="{content: option.labelTooltip, delay: { show: 1000 }}"
+              >
+                {{ option.label }}
+              </span>
               <component
                 :is="option.label.component"
                 v-else

package/components/IconOrSvg.vue

@@ -24,12 +24,20 @@ const cssCache = {};
 
 const colors = {
   header: {
-    color: '--header-btn-text',
-    hover: '--header-btn-text-hover'
+    color:          '--on-tertiary-header',
+    hover:          '--on-tertiary-header-hover',
+    colorFallback:  '--header-btn-text',
+    hoverFallback:  '--header-btn-text-hover',
+    active:         '--on-tertiary-header-hover',
+    activeFallback: '--header-btn-text-hover',
   },
   primary: {
-    color: '--link',
-    hover: '--primary-hover-text'
+    color:          '--link',
+    hover:          '--link',
+    colorFallback:  '--link',
+    hoverFallback:  '--primary-hover-text',
+    active:         '--on-active',
+    activeFallback: '--primary-hover-text',
   }
 };
 
@@ -65,45 +73,48 @@ export default {
   },
 
   methods: {
-    getComputedStyleFor(cssVar) {
-      return normalizeHex(mapStandardColors((window.getComputedStyle(document.body).getPropertyValue(cssVar)).trim()));
+    getComputedStyleFor(cssVar, fallback) {
+      const value = window.getComputedStyle(document.body).getPropertyValue(cssVar).trim();
+
+      return normalizeHex(mapStandardColors(value ?? fallback));
+    },
+
+    resolveColorFilter(cacheKey, rgb) {
+      if (filterCache[cacheKey]) {
+        return filterCache[cacheKey];
+      }
+
+      const solver = new Solver(rgb);
+      const res = solver.solve();
+      const filter = res?.filter;
+
+      filterCache[cacheKey] = filter;
+
+      return filter;
     },
 
     setColor() {
-      const uiColor = this.getComputedStyleFor(colors[this.color].color);
-      const hoverColor = this.getComputedStyleFor(colors[this.color].hover);
+      const colorConfig = colors[this.color];
+      const uiColor = this.getComputedStyleFor(colorConfig.color, colorConfig.colorFallback);
+      const hoverColor = this.getComputedStyleFor(colorConfig.hover, colorConfig.hoverFallback);
+      const activeColor = this.getComputedStyleFor(colorConfig.active, colorConfig.activeFallback);
 
-      if (!uiColor || !hoverColor) {
+      if (!uiColor || !hoverColor || !activeColor) {
         return;
       }
 
       const uiColorRGB = colorToRgb(uiColor);
       const hoverColorRGB = colorToRgb(hoverColor);
+      const activeColorRGB = colorToRgb(activeColor);
       const uiColorStr = `${ uiColorRGB.r }-${ uiColorRGB.g }-${ uiColorRGB.b }`;
       const hoverColorStr = `${ hoverColorRGB.r }-${ hoverColorRGB.g }-${ hoverColorRGB.b }`;
 
       const className = `svg-icon-${ uiColorStr }-${ hoverColorStr }`;
 
       if (!cssCache[className]) {
-        let hoverFilter = filterCache[hoverColor];
-
-        if (!hoverFilter) {
-          const solver = new Solver(hoverColorRGB);
-          const res = solver.solve();
-
-          hoverFilter = res?.filter;
-          filterCache[hoverColor] = hoverFilter;
-        }
-
-        let mainFilter = filterCache[uiColor];
-
-        if (!mainFilter) {
-          const solver = new Solver(uiColorRGB);
-          const res = solver.solve();
-
-          mainFilter = res?.filter;
-          filterCache[uiColor] = mainFilter;
-        }
+        const hoverFilter = this.resolveColorFilter(hoverColor, hoverColorRGB);
+        const mainFilter = this.resolveColorFilter(uiColor, uiColorRGB);
+        const activeFilter = this.resolveColorFilter(activeColor, activeColorRGB);
 
         // Add stylesheet (added as global styles)
         const styles = `
@@ -123,7 +134,7 @@ export default {
             ${ hoverFilter };
           }
           a.option.active-menu-link > img.${ className } {
-            ${ hoverFilter };
+            ${ activeFilter };
           }
         `;
 

package/components/PaginatedResourceTable.vue

@@ -2,6 +2,7 @@
 import { defineComponent } from 'vue';
 import ResourceFetch from '@shell/mixins/resource-fetch';
 import ResourceTable from '@shell/components/ResourceTable.vue';
+import { VuexStore } from '@shell/types/store/vuex';
 
 /**
  * This is meant to enable ResourceList like capabilities outside of List pages / components
@@ -130,13 +131,17 @@ export default defineComponent({
     safeHeaders(): any[] {
       const customHeaders: any[] = this.canPaginate ? this.paginationHeaders : this.headers;
 
-      return customHeaders || this.$store.getters['type-map/headersFor'](this.schema, this.canPaginate);
+      const $store = this.$store as VuexStore;
+
+      return customHeaders || $store.getters['type-map/headersFor'](this.schema, this.canPaginate);
     }
   },
 
   methods: {
     clearSelection() {
-      this.$refs.table.clearSelection();
+      const table = this.$refs.table as { clearSelection: () => void };
+
+      table.clearSelection();
     },
   }
 });

package/components/PromptRemove.vue

@@ -384,6 +384,7 @@ export default {
           >
             <span
               v-clean-html="t('promptRemove.confirmName', { nameToMatch: escapeHtml(nameToMatch) }, true)"
+              class="confirm-text"
             />
           </div>
         </div>
@@ -472,5 +473,9 @@ export default {
         flex: 1;
       }
     }
+
+    .confirm-text b {
+      user-select: all;
+    }
   }
 </style>

package/components/ResourceDetail/index.vue

@@ -181,6 +181,7 @@ export default {
         if (e.status === 404 || e.status === 403) {
           store.dispatch('loadingError', new Error(this.t('nav.failWhale.resourceIdNotFound', { resource: resourceType, fqid }, true)));
         }
+        console.debug(`Could not find '${ resourceType }' with id '${ id }''`, e); // eslint-disable-line no-console
         liveModel = {};
         notFound = fqid;
       }

package/components/ResourceTable.vue

@@ -317,6 +317,7 @@ export default {
       // add custom table columns provided by the extensions ExtensionPoint.TABLE_COL hook
       // gate it so that we prevent errors on older versions of dashboard
       if (this.$store.$plugin?.getUIConfig) {
+        // { column: TableColumn, paginationColumn: PaginationTableColumn }[]
         const extensionCols = getApplicableExtensionEnhancements(this, ExtensionPoint.TABLE_COL, TableColumnLocation.RESOURCE, this.$route);
 
         // Try and insert the columns before the Age column
@@ -339,27 +340,36 @@ export default {
         }
 
         // adding extension defined cols to the correct header config
-        extensionCols.forEach((col) => {
-          if (this.externalPaginationEnabled) {
-            // validate that the required settings are supplied to enable search and sort server-side
-            // these do not check other invalid scenarios like a path is a string but to a model property, or that the field supports sort/search via api (some basic non-breaking checks are done further on)
-            if (
-              col.search !== false && // search is explicitly disabled
-              (typeof col.search !== 'string' && !Array.isArray(col.search)) && // primary property path to search on
-              typeof col.value !== 'string' // secondary property path to search on
-            ) {
-              console.warn(`Unable to support server-side search for extension provided column "${ col.name || col.label || col.labelKey }" (column must provide \`search\` or \`value\` property containing a path to a property in the resource. search can be an array).`); // eslint-disable-line no-console
-
-              col.search = false;
-            }
+        extensionCols.forEach((config) => {
+          let { column: col, paginationColumn } = config;
 
-            if (
-              col.sort !== false && // sort is explicitly disabled
-              (typeof col.sort !== 'string' && !Array.isArray(col.sort)) // primary property path to sort on
-            ) {
-              console.warn(`Unable to support server-side sort for extension provided column "${ col.name || col.label || col.labelKey }" (column must provide \`sort\` property containing a path to a property, or array of paths, in the resource)`); // eslint-disable-line no-console
-
-              col.sort = false;
+          if (this.externalPaginationEnabled) {
+            if (paginationColumn) {
+              // Use the pagination column, no need to
+              col = paginationColumn;
+            } else {
+              // Attempt to fall back on the single column
+
+              // validate that the required settings are supplied to enable search and sort server-side
+              // these do not check other invalid scenarios like a path is a string but to a model property, or that the field supports sort/search via api (some basic non-breaking checks are done further on)
+              if (
+                col.search !== false && // search is explicitly disabled
+                (typeof col.search !== 'string' && !Array.isArray(col.search)) && // primary property path to search on
+                typeof col.value !== 'string' // secondary property path to search on
+              ) {
+                console.warn(`Unable to support server-side search for extension provided column "${ col.name || col.label || col.labelKey }" (column must provide \`search\` or \`value\` property containing a path to a property in the resource. search can be an array).`); // eslint-disable-line no-console
+
+                col.search = false;
+              }
+
+              if (
+                col.sort !== false && // sort is explicitly disabled
+                (typeof col.sort !== 'string' && !Array.isArray(col.sort)) // primary property path to sort on
+              ) {
+                console.warn(`Unable to support server-side sort for extension provided column "${ col.name || col.label || col.labelKey }" (column must provide \`sort\` property containing a path to a property, or array of paths, in the resource)`); // eslint-disable-line no-console
+
+                col.sort = false;
+              }
             }
           }
 

package/components/SortableTable/sorting.js

@@ -68,6 +68,7 @@ export default {
 
   data() {
     let sortBy = null;
+    let descending = false;
 
     this._defaultSortBy = this.defaultSortBy;
 
@@ -78,6 +79,7 @@ export default {
 
       if ( markedColumn ) {
         this._defaultSortBy = markedColumn.name;
+        descending = markedColumn.defaultSortDescending;
       } else if ( nameColumn ) {
         // Use the name column if there is one
         this._defaultSortBy = nameColumn.name;
@@ -101,7 +103,7 @@ export default {
 
     return {
       sortBy,
-      descending: false,
+      descending,
       cachedRows: null,
       cacheKey:   null,
     };

package/components/Tabbed/index.vue

@@ -412,7 +412,7 @@ export default {
     }
 
     .tab.active {
-      border-bottom: solid 2px var(--primary);
+      border-bottom: solid 2px var(--active, var(--primary));
     }
   }
 
@@ -450,7 +450,7 @@ export default {
 
     &.active {
       > A {
-        color: var(--primary);
+        color: var(--active, var(--primary));
         text-decoration: none;
       }
     }
@@ -530,16 +530,16 @@ export default {
       border-left: solid 5px transparent;
 
       &.toggle A {
-        color: var(--primary);
+        color: var(--active, var(--primary));
       }
 
       A {
-        color: var(--primary);
+        color: var(--link, var(--primary));
       }
 
       &.active {
         background-color: var(--body-bg);
-        border-left: solid 5px var(--primary);
+        border-left: solid 5px var(--active, var(--primary));
 
         & A {
           color: var(--input-label);

package/components/form/ResourceTabs/index.vue

@@ -7,14 +7,14 @@ import Tabbed from '@shell/components/Tabbed';
 import Tab from '@shell/components/Tabbed/Tab';
 import CreateEditView from '@shell/mixins/create-edit-view';
 import Conditions from '@shell/components/form/Conditions';
-import { EVENT } from '@shell/config/types';
+import { EVENT, NAMESPACE } from '@shell/config/types';
 import PaginatedResourceTable from '@shell/components/PaginatedResourceTable.vue';
 import { _VIEW } from '@shell/config/query-params';
 import RelatedResources from '@shell/components/RelatedResources';
 import { isConditionReadyAndWaiting } from '@shell/plugins/dashboard-store/resource-class';
 import { PaginationParamFilter } from '@shell/types/store/pagination.types';
 import { MESSAGE, REASON } from '@shell/config/table-headers';
-import { STEVE_EVENT_LAST_SEEN, STEVE_EVENT_TYPE, STEVE_NAME_COL } from '@shell/config/pagination-table-headers';
+import { STEVE_EVENT_FIRST_SEEN, STEVE_EVENT_LAST_SEEN, STEVE_EVENT_TYPE, STEVE_NAME_COL } from '@shell/config/pagination-table-headers';
 import { headerFromSchemaColString } from '@shell/store/type-map.utils';
 import { useIndicateUseCounts } from '@shell/components/form/ResourceTabs/composable';
 
@@ -93,7 +93,7 @@ export default {
       headerFromSchemaColString('Subobject', eventSchema, this.$store.getters, true),
       headerFromSchemaColString('Source', eventSchema, this.$store.getters, true),
       MESSAGE,
-      headerFromSchemaColString('First Seen', eventSchema, this.$store.getters, true),
+      STEVE_EVENT_FIRST_SEEN,
       headerFromSchemaColString('Count', eventSchema, this.$store.getters, true),
       STEVE_NAME_COL,
     ] : [];
@@ -119,6 +119,9 @@ export default {
   },
 
   computed: {
+    isNamespace() {
+      return this.value?.type === NAMESPACE;
+    },
     showEvents() {
       return this.isView && this.needEvents && this.eventSchema;
     },
@@ -190,7 +193,9 @@ export default {
      * Filter out hidden repos from list of all repos
      */
     filterEventsLocal(rows) {
-      return rows.filter((event) => event.involvedObject?.uid === this.value?.metadata?.uid);
+      return rows.filter((event) => {
+        return this.isNamespace ? event.metadata?.namespace === this.value?.metadata?.name : event.involvedObject?.uid === this.value?.metadata?.uid;
+      });
     },
 
     /**
@@ -204,27 +209,22 @@ export default {
         pagination.filters = [];
       }
 
-      const field = `involvedObject.uid`;
-
-      // of type PaginationParamFilter
-      let existing = null;
-
-      for (let i = 0; i < pagination.filters.length; i++) {
-        const filter = pagination.filters[i];
+      // Determine the field and value based on type
+      const field = this.isNamespace ? 'metadata.namespace' : 'involvedObject.uid';
+      const value = this.isNamespace ? this.value.metadata.name : this.value.metadata.uid;
 
-        if (!!filter.fields.find((f) => f.field === field)) {
-          existing = filter;
-          break;
-        }
-      }
+      // Check if a filter for this field already exists
+      const existing = pagination.filters.find((f) => f.fields.some((ff) => ff.field === field));
 
+      // Create the required filter
       const required = PaginationParamFilter.createSingleField({
         field,
         exact:  true,
-        value:  this.value.metadata.uid,
+        value,
         equals: true
       });
 
+      // Merge or add the filter
       if (!!existing) {
         Object.assign(existing, required);
       } else {
@@ -260,10 +260,16 @@ export default {
 
     <Tab
       v-if="showEvents"
-      label-key="resourceTabs.events.tab"
+      :label="isNamespace ? t('resourceTabs.events.namespaceTab') : t('resourceTabs.events.tab')"
       name="events"
       :weight="-2"
     >
+      <!-- Caption for namespace pages -->
+      <div
+        v-if="isNamespace"
+        v-clean-html="t('resourceTabs.events.namespaceCaption', { namespace: value.metadata.name }, true)"
+        class="tab-caption"
+      />
       <!-- namespaced: false given we don't want the default handling of namespaced resource (apply header filter)  -->
       <PaginatedResourceTable
         :schema="eventSchema"
@@ -318,4 +324,17 @@ export default {
     }
   }
 }
+/* Caption for namespace events tab */
+.tab-caption {
+  align-items: center;
+  font-size: 16px;
+  margin-bottom: 24px;
+
+  .namespace-name {
+    display: inline;
+    font-weight: bold;
+    margin-right: 0 4px;
+    white-space: nowrap;
+  }
+}
 </style>

package/components/form/SecretSelector.vue

@@ -61,7 +61,7 @@ export default {
     },
     inStore: {
       type:    String,
-      default: 'cluster',
+      default: undefined,
     }
   },
 
@@ -129,6 +129,10 @@ export default {
       }));
     },
 
+    validInStore() {
+      return this.inStore || this.$store.getters['currentStore']() || 'cluster';
+    },
+
     isView() {
       return this.mode === _VIEW;
     },
@@ -221,7 +225,7 @@ export default {
         :label="secretNameLabel"
         :mode="mode"
         :resource-type="SECRET"
-        :in-store="inStore"
+        :in-store="validInStore"
         :paginated-resource-settings="paginateSecretsSetting"
         :all-resources-settings="allSecretsSettings"
       />