@rancher/shell 3.0.11 → 3.0.12-rc.2

package/store/__tests__/catalog.test.ts

@@ -1,30 +1,54 @@
 import { CATALOG } from '@shell/config/types';
+import { CATALOG as CATALOG_ANNOTATIONS } from '@shell/config/labels-annotations';
 import {
   state, getters, actions, mutations, filterAndArrangeCharts
 } from '../catalog';
 import { createStore } from 'vuex';
 
 const clusterRepo = { _key: 'testClusterRepo' };
-const repoChartName = 'abc';
+const repoChartName = 'regular-chart';
 const repoChart = {
   name:     repoChartName,
   type:     'namespaced',
   version:  1,
   metadata: { name: repoChartName }
 };
-const repoCharts = [repoChart];
+const deprecatedByFieldChartName = 'deprecated-by-field-chart';
+const deprecatedByFieldChart = {
+  name:       deprecatedByFieldChartName,
+  type:       'namespaced',
+  version:    1,
+  deprecated: true,
+  metadata:   { name: deprecatedByFieldChartName }
+};
+const deprecatedByAnnotationChartName = 'deprecated-by-annotation-chart';
+const deprecatedByAnnotationChart = {
+  name:        deprecatedByAnnotationChartName,
+  type:        'namespaced',
+  version:     1,
+  annotations: { [CATALOG_ANNOTATIONS.DEPRECATED]: 'true' },
+  metadata:    { name: deprecatedByAnnotationChartName }
+};
 const repo = {
   metadata:   { name: 'testRepo' },
   _key:       'testRepo',
   links:      { index: 'fetchindex' },
   canLoad:    true,
-  followLink: () => ({ entries: { [repoChartName]: repoCharts } })
+  followLink: () => ({
+    entries: {
+      [repoChartName]:                   [repoChart],
+      [deprecatedByFieldChartName]:      [deprecatedByFieldChart],
+      [deprecatedByAnnotationChartName]: [deprecatedByAnnotationChart]
+    }
+  })
 };
 
 const catalogStoreName = 'catalog';
 const clusterStore = 'cluster';
 
 const expectedChartKey = `namespace/${ repo._key }/${ repoChartName }`;
+const expectedDeprecatedByFieldChartKey = `namespace/${ repo._key }/${ deprecatedByFieldChartName }`;
+const expectedDeprecatedByAnnotationChartKey = `namespace/${ repo._key }/${ deprecatedByAnnotationChartName }`;
 const initialVersionInfo = { junk: true };
 const initialRawChartName = 'cde';
 const initialRawChart = {
@@ -160,10 +184,20 @@ describe('catalog', () => {
       expect(rawCharts[expectedChartKey]).toBeDefined();
       expect(rawCharts[expectedChartKey].id).toBe(expectedChartKey);
       expect(rawCharts[expectedChartKey].versions[0].version).toBe(repoChart.version);
-      expect(charts[0]).toBeDefined();
-      expect(charts[0].id).toBe(initialRawChart.id);
-      expect(charts[1]).toBeDefined();
-      expect(charts[1].id).toBe(expectedChartKey);
+
+      expect(rawCharts[expectedDeprecatedByFieldChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].id).toBe(expectedDeprecatedByFieldChartKey);
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].deprecated).toBe(true);
+
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].id).toBe(expectedDeprecatedByAnnotationChartKey);
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].deprecated).toBe(true);
+
+      expect(charts).toHaveLength(4);
+      expect(charts.find((c: any) => c.id === initialRawChart.id)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByFieldChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByAnnotationChartKey)).toBeDefined();
 
       // Version info should be unchanged
       expect(store.state[catalogStoreName].versionInfos).toStrictEqual(initialVersionInfo);
@@ -197,14 +231,130 @@ describe('catalog', () => {
       expect(rawCharts[expectedChartKey].id).toBe(expectedChartKey);
       expect(rawCharts[expectedChartKey].versions[0].version).toBe(repoChart.version);
 
-      expect(charts).toHaveLength(1);
-      expect(charts[0]).toBeDefined();
-      expect(charts[0].id).toBe(expectedChartKey);
-      expect(charts[0].versions[0].version).toBe(repoChart.version);
+      expect(rawCharts[expectedDeprecatedByFieldChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].id).toBe(expectedDeprecatedByFieldChartKey);
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].deprecated).toBe(true);
+
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].id).toBe(expectedDeprecatedByAnnotationChartKey);
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].deprecated).toBe(true);
+
+      expect(charts).toHaveLength(3);
+      expect(charts.find((c: any) => c.id === expectedChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByFieldChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByAnnotationChartKey)).toBeDefined();
 
       // Version info should be changed (it's now empty given reset)
       expect(store.state[catalogStoreName].versionInfos).toStrictEqual({ });
     });
+
+    it('repoKeys provided', async() => {
+      const store = createStore(constructStore());
+
+      // Validate initial state of store
+      expect(store.getters[`${ catalogStoreName }/rawCharts`]).toStrictEqual(initialRawCharts);
+      expect(store.getters[`${ catalogStoreName }/charts`]).toStrictEqual([]);
+
+      // Make the request targeting specific repo (we provide repo._key)
+      await store.dispatch(`${ catalogStoreName }/load`, {
+        force:    true,
+        repoKeys: [repo._key]
+      });
+
+      const rawCharts = store.getters[`${ catalogStoreName }/rawCharts`];
+      const charts = store.getters[`${ catalogStoreName }/charts`];
+
+      // We expect the old chart belonging to this repo to be wiped out
+      // and replaced entirely by the newly fetched chart.
+      expect(rawCharts[initialRawChart.id]).not.toBeDefined();
+      expect(rawCharts[expectedChartKey]).toBeDefined();
+      expect(rawCharts[expectedChartKey].id).toBe(expectedChartKey);
+      expect(rawCharts[expectedChartKey].versions[0].version).toBe(repoChart.version);
+
+      expect(rawCharts[expectedDeprecatedByFieldChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].id).toBe(expectedDeprecatedByFieldChartKey);
+      expect(rawCharts[expectedDeprecatedByFieldChartKey].deprecated).toBe(true);
+
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].id).toBe(expectedDeprecatedByAnnotationChartKey);
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey].deprecated).toBe(true);
+
+      expect(charts).toHaveLength(3);
+      expect(charts.find((c: any) => c.id === expectedChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByFieldChartKey)).toBeDefined();
+      expect(charts.find((c: any) => c.id === expectedDeprecatedByAnnotationChartKey)).toBeDefined();
+    });
+
+    it('repoKeys provided, ignoring unrelated charts and versions', async() => {
+      // We will manually inject an unrelated chart to prove it isn't wiped out
+      const store = createStore(constructStore());
+      const unrelatedChart = {
+        id:       `namespace/unrelatedRepo/unrelatedChart`,
+        repoKey:  'unrelatedRepo',
+        type:     'namespaced',
+        name:     'unrelatedChart',
+        version:  1,
+        metadata: { name: 'unrelatedChart' }
+      };
+
+      const targetedVersionKey = `namespace/testRepo/myChart/1.0.0`;
+      const unrelatedVersionKey = `namespace/unrelatedRepo/unrelatedChart/1.0.0`;
+
+      store.state[catalogStoreName].charts = {
+        ...initialRawCharts,
+        [unrelatedChart.id]: unrelatedChart
+      };
+
+      store.state[catalogStoreName].versionInfos = {
+        [targetedVersionKey]:  { data: 'old-data' },
+        [unrelatedVersionKey]: { data: 'keep-me' }
+      };
+
+      // Make the request targeting specific repo
+      await store.dispatch(`${ catalogStoreName }/load`, {
+        force:    true,
+        repoKeys: [repo._key]
+      });
+
+      const rawCharts = store.getters[`${ catalogStoreName }/rawCharts`];
+      const versionInfos = store.state[catalogStoreName].versionInfos;
+
+      // The unrelated chart should NOT be wiped
+      expect(rawCharts[unrelatedChart.id]).toBeDefined();
+      expect(rawCharts[unrelatedChart.id].repoKey).toBe('unrelatedRepo');
+
+      // The old initialRawChart (with repoKey: repo._key) SHOULD be wiped and replaced
+      expect(rawCharts[initialRawChart.id]).not.toBeDefined();
+      expect(rawCharts[expectedChartKey]).toBeDefined();
+
+      expect(rawCharts[expectedDeprecatedByFieldChartKey]).toBeDefined();
+      expect(rawCharts[expectedDeprecatedByAnnotationChartKey]).toBeDefined();
+
+      // The targeted version info SHOULD be wiped
+      expect(versionInfos[targetedVersionKey]).not.toBeDefined();
+      // The unrelated version info should NOT be wiped
+      expect(versionInfos[unrelatedVersionKey]).toBeDefined();
+      expect(versionInfos[unrelatedVersionKey].data).toBe('keep-me');
+    });
+  });
+
+  describe('refresh', () => {
+    it('calls refresh(false) on all repos and then dispatches a reset load', async() => {
+      const mockRepo1 = { refresh: jest.fn().mockResolvedValue(true) };
+      const mockRepo2 = { refresh: jest.fn().mockResolvedValue(true) };
+
+      const getters = { repos: [mockRepo1, mockRepo2] };
+      const dispatch = jest.fn().mockResolvedValue(true);
+      const commit = jest.fn();
+
+      await actions.refresh({
+        getters, commit, dispatch
+      });
+
+      expect(mockRepo1.refresh).toHaveBeenCalledWith(false);
+      expect(mockRepo2.refresh).toHaveBeenCalledWith(false);
+      expect(dispatch).toHaveBeenCalledWith('load', { force: true, reset: true });
+    });
   });
 
   describe('filterAndArrangeCharts', () => {

package/store/__tests__/type-map.test.ts

@@ -7,6 +7,17 @@ import {
   SCHEMA,
 } from '@shell/config/types';
 
+// Type definitions for test data
+interface TestSchema {
+  id: string;
+  type: string;
+  attributes?: { kind: string };
+  _group?: string;
+  _id?: string;
+}
+
+type SchemaOrType = TestSchema | string;
+
 /**
  * types in the store
  */
@@ -115,9 +126,9 @@ describe('type-map', () => {
       /**
        * Stick in the required mode param to the expected menu items
        */
-      const setTypeMode = (modes, resourcesById) => {
-        return modes.reduce((res, mode) => {
-          const newResource = { };
+      const setTypeMode = (modes: string[], resourcesById: Record<string, any>) => {
+        return modes.reduce((res: Record<string, any>, mode: string) => {
+          const newResource: Record<string, any> = { };
 
           Object.entries(resourcesById).forEach(([id, resource]: [string, any]) => {
             newResource[id] = {
@@ -146,17 +157,17 @@ describe('type-map', () => {
             spoofedTypes: { [productName]: [] }
           },
           typeMapGetters: {
-            labelFor:          (schema, count) => '',
-            optionsFor:        (schema) => {},
+            labelFor:          (schema: SchemaOrType, count: number) => '',
+            optionsFor:        (schema: SchemaOrType) => ({}),
             groupForBasicType: () => {},
-            typeWeightFor:     (label, isBasic) => 1
+            typeWeightFor:     (label: string, isBasic: boolean) => 1
           },
           rootState:   {},
           rootGetters: {
             [`${ productStore }/all`]: (schema: string) => {
               return [];
             },
-            'prefs/get': (pref) => {},
+            'prefs/get': (pref: string) => {},
 
           },
 
@@ -201,9 +212,9 @@ describe('type-map', () => {
 
           const testTypeMapGetters = {
             ...typeMapGetters,
-            labelFor:          (schema, count) => 'Pod',
+            labelFor:          (schema: SchemaOrType, count: number) => 'Pod',
             groupForBasicType: () => true,
-            optionsFor:        (schema) => ({
+            optionsFor:        (schema: SchemaOrType) => ({
               namespaced:  true,
               customRoute: 'cde'
             }),
@@ -320,7 +331,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              groupForBasicType: (product, id) => false
+              groupForBasicType: (product: string, id: string) => false
             };
 
             const groups = getters.allTypes(state, testTypeMapGetters, rootState, rootGetters)(productName, modes);
@@ -473,7 +484,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              optionsFor: (schema) => ({
+              optionsFor: (schema: SchemaOrType) => ({
                 namespaced:       true,
                 customRoute:      'cde',
                 ifRancherCluster: true
@@ -497,7 +508,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              optionsFor: (schema) => ({
+              optionsFor: (schema: SchemaOrType) => ({
                 namespaced:       true,
                 customRoute:      'cde',
                 ifRancherCluster: false
@@ -521,7 +532,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              optionsFor: (schema) => ({
+              optionsFor: (schema: SchemaOrType) => ({
                 namespaced:       true,
                 customRoute:      'cde',
                 ifRancherCluster: true
@@ -545,7 +556,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              optionsFor: (schema) => ({
+              optionsFor: (schema: SchemaOrType) => ({
                 namespaced:  true,
                 customRoute: 'cde',
                 localOnly:   true
@@ -569,7 +580,7 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              optionsFor: (schema) => ({
+              optionsFor: (schema: SchemaOrType) => ({
                 namespaced:  true,
                 customRoute: 'cde',
                 localOnly:   true
@@ -630,9 +641,9 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              labelFor:          (schema, count) => 'Secret',
+              labelFor:          (schema: SchemaOrType, count: number) => 'Secret',
               groupForBasicType: () => true,
-              optionsFor:        (schema) => ({
+              optionsFor:        (schema: SchemaOrType) => ({
                 namespaced:  true,
                 customRoute: 'cde'
               }),
@@ -882,8 +893,10 @@ describe('type-map', () => {
 
             const testTypeMapGetters = {
               ...typeMapGetters,
-              labelFor: (schema, count) => {
-                switch (schema.id) {
+              labelFor: (schema: SchemaOrType, count: number) => {
+                const schemaId = typeof schema === 'object' ? schema.id : schema;
+
+                switch (schemaId) {
                 case 'secret':
                   return 'Secret';
                 default:
@@ -891,11 +904,11 @@ describe('type-map', () => {
                 }
               },
               groupForBasicType: () => true,
-              optionsFor:        (schema) => ({
+              optionsFor:        (schema: SchemaOrType) => ({
                 namespaced:  true,
                 customRoute: 'cde'
               }),
-              isFavorite: (id) => id === 'secret',
+              isFavorite: (id: string) => id === 'secret',
             };
 
             return {
@@ -1134,14 +1147,14 @@ describe('type-map', () => {
         },
       };
 
-      const createProductState = (products) => ({
+      const createProductState = (products: any) => ({
         products,
         schemaGeneration: 1,
       });
 
-      const createProductRootGetters = (moduleSchemas = [], moduleName = 'cluster') => ({
+      const createProductRootGetters = (moduleSchemas: any[] = [], moduleName = 'cluster') => ({
         'prefs/get':             () => false,
-        [`${ moduleName }/all`]: (resource) => {
+        [`${ moduleName }/all`]: (resource: any) => {
           if (resource === SCHEMA) {
             return moduleSchemas;
           }
@@ -1281,4 +1294,51 @@ describe('type-map', () => {
       });
     });
   });
+
+  describe('groupLabel', () => {
+    it('should return groupLabel when it exists in state', () => {
+      const state = { groupLabels: { mygroup: { label: 'My Group Label', labelKey: undefined } } };
+
+      const result = getters.groupLabel(state)('mygroup');
+
+      expect(result).toStrictEqual({ label: 'My Group Label', labelKey: undefined });
+    });
+
+    it('should return groupLabel with labelKey when set', () => {
+      const state = { groupLabels: { anothergroup: { label: undefined, labelKey: 'typeLabel.myKey' } } };
+
+      const result = getters.groupLabel(state)('anothergroup');
+
+      expect(result).toStrictEqual({ label: undefined, labelKey: 'typeLabel.myKey' });
+    });
+
+    it('should handle case-insensitive group names', () => {
+      const state = { groupLabels: { mygroup: { label: 'My Group', labelKey: undefined } } };
+
+      const result = getters.groupLabel(state)('MyGroup');
+
+      expect(result).toStrictEqual({ label: 'My Group', labelKey: undefined });
+    });
+
+    it('should return undefined when group label does not exist', () => {
+      const state = { groupLabels: {} };
+
+      const result = getters.groupLabel(state)('nonexistent');
+
+      expect(result).toBeUndefined();
+    });
+
+    it('should return undefined for empty, null, undefined, or non-existent group name', () => {
+      const state = { groupLabels: { mygroup: { label: 'My Group', labelKey: undefined } } };
+
+      // Empty string fails the groupName check and returns undefined
+      expect(getters.groupLabel(state)('')).toBeUndefined();
+      // null returns undefined
+      expect(getters.groupLabel(state)(null)).toBeUndefined();
+      // undefined returns undefined
+      expect(getters.groupLabel(state)(undefined)).toBeUndefined();
+      // Non-existent group returns undefined
+      expect(getters.groupLabel(state)('nonexistent')).toBeUndefined();
+    });
+  });
 });

package/store/auth.js

@@ -3,7 +3,6 @@ import { MANAGEMENT, EXT } from '@shell/config/types';
 import { addObjects, findBy, joinStringList } from '@shell/utils/array';
 import { openAuthPopup, returnTo } from '@shell/utils/auth';
 import { base64Encode } from '@shell/utils/crypto';
-import { removeEmberPage } from '@shell/utils/ember-page';
 import { randomStr } from '@shell/utils/string';
 import { addParams, parse as parseUrl, removeParam } from '@shell/utils/url';
 
@@ -429,8 +428,6 @@ export const actions = {
   },
 
   uiLogout({ commit, dispatch }, options = {}) {
-    removeEmberPage();
-
     commit('loggedOut');
     dispatch('onLogout', options, { root: true });
 

package/store/catalog.js

@@ -325,8 +325,12 @@ export const actions = {
    * force: Always refresh catalog's helm repo by re-fetching index.yaml
    *
    * reset: clear existing charts and version cache
+   *
+   * repoKeys: Optional array of specific repo keys (IDs) to refresh. When provided, only these specific
+   * repos will be fetched, and only their existing charts will be cleared from the cache to avoid
+   * duplicate chart entries or wiping out unrelated chart data.
    */
-  async load(ctx, { force, reset } = {}) {
+  async load(ctx, { force, reset, repoKeys = [] } = {}) {
     const {
       state, getters, rootGetters, commit, dispatch
     } = ctx;
@@ -360,14 +364,34 @@ export const actions = {
     promises = {};
 
     for ( const repo of repos ) {
-      if ( (force === true || !getters.isLoaded(repo)) && repo.canLoad ) {
+      let shouldLoad = false;
+
+      if (repoKeys.length) {
+        // If repoKeys are explicitly provided (e.g. refreshing a single repo from the UI),
+        // we ONLY want to load the repos in that array. We intentionally ignore `!getters.isLoaded(repo)`
+        // here so we don't accidentally fetch other unrelated repos just because they haven't loaded yet.
+        shouldLoad = repoKeys.includes(repo._key);
+      } else {
+        // Default behavior: load if explicitly forced, OR if the repo hasn't been loaded into state yet.
+        shouldLoad = force === true || !getters.isLoaded(repo);
+      }
+
+      if ( shouldLoad && repo.canLoad ) {
         console.info('Loading index for repo', repo.name, `(${ repo._key })`); // eslint-disable-line no-console
         promises[repo._key] = repo.followLink('index');
       }
     }
 
     const res = await allHashSettled(promises);
-    const charts = reset ? {} : state.charts;
+    const charts = reset ? {} : { ...state.charts };
+    let versionInfos = null;
+
+    if (reset) {
+      versionInfos = {};
+    } else if (repoKeys.length) {
+      versionInfos = { ...state.versionInfos };
+    }
+
     const errors = [];
 
     for ( const key of Object.keys(res) ) {
@@ -379,6 +403,28 @@ export const actions = {
         continue;
       }
 
+      // We are targeting specific repos. To prevent duplicate chart versions from appearing,
+      // we must remove the old charts for this specific repo before appending the newly fetched ones,
+      // but ONLY if the fetch was successful.
+      if (repoKeys.length && repoKeys.includes(key)) {
+        for (const chartKey in charts) {
+          if (charts[chartKey].repoKey === key) {
+            delete charts[chartKey];
+          }
+        }
+
+        // Also clear out cached version info for this repo so we don't display stale READMEs/values
+        const repoType = repo.type === CATALOG.CLUSTER_REPO ? 'cluster' : 'namespace';
+        const repoName = repo.metadata.name;
+        const versionPrefix = `${ repoType }/${ repoName }/`;
+
+        for (const versionKey in versionInfos) {
+          if (versionKey.startsWith(versionPrefix)) {
+            delete versionInfos[versionKey];
+          }
+        }
+      }
+
       for ( const k in obj.value.entries ) {
         for ( const entry of obj.value.entries[k] ) {
           addChart(ctx, charts, entry, repo);
@@ -394,13 +440,17 @@ export const actions = {
       loaded,
     });
 
-    if (reset) {
-      commit('setVersions', {});
+    if (versionInfos) {
+      commit('setVersions', versionInfos);
     }
   },
 
+  /**
+   * Globally refreshes all loaded repositories by triggering their refresh actions concurrently,
+   * bypassing individual catalog loads, and then performs a single, global catalog/load.
+   */
   async refresh({ getters, commit, dispatch }) {
-    const promises = getters.repos.map((x) => x.refresh());
+    const promises = getters.repos.map((x) => x.refresh(false));
 
     // @TODO wait for repo state to indicate they're done once the API has that
 
@@ -488,7 +538,9 @@ function addChart(ctx, map, chart, repo) {
     certified = CATALOG_ANNOTATIONS._OTHER;
   }
 
-  if ( chart.deprecated ) {
+  const isDeprecated = !!chart.deprecated || chart.annotations?.[CATALOG_ANNOTATIONS.DEPRECATED] === 'true';
+
+  if ( isDeprecated ) {
     sideLabel = DEPRECATED;
   } else if ( chart.annotations?.[CATALOG_ANNOTATIONS.EXPERIMENTAL] ) {
     sideLabel = EXPERIMENTAL;
@@ -546,7 +598,7 @@ function addChart(ctx, map, chart, repo) {
       versions:         [],
       keywords:         chart.keywords || [],
       categories:       filterCategories(chart.keywords),
-      deprecated:       !!chart.deprecated,
+      deprecated:       isDeprecated,
       primeOnly,
       experimental,
       hidden:           !!chart.annotations?.[CATALOG_ANNOTATIONS.HIDDEN],

package/store/type-map.js

@@ -317,6 +317,12 @@ export function DSL(store, product, module = 'type-map') {
       }
     },
 
+    labelGroup(group, label, labelKey) {
+      store.commit(`${ module }/labelGroup`, {
+        group, label, labelKey
+      });
+    },
+
     setGroupDefaultType(input, defaultType) {
       if ( isArray(input) ) {
         store.commit(`${ module }/setGroupDefaultType`, { groups: input, defaultType });
@@ -397,6 +403,7 @@ export const state = function() {
     groupIgnore:             [],
     groupWeights:            {},
     groupDefaultTypes:       {},
+    groupLabels:             {},
     basicGroupWeights:       { [ROOT]: 1000 },
     groupMappings:           [],
     typeIgnore:              [],
@@ -499,6 +506,23 @@ export const getters = {
     };
   },
 
+  groupLabel(state) {
+    return (group) => {
+      // Handle null/undefined
+      if (!group) {
+        return;
+      }
+
+      // commit is done with lowercase group names, so lowercase here to match
+      const groupName = group.toLowerCase();
+
+      // If this has been explicitly set, use that
+      if (groupName) {
+        return state.groupLabels[groupName];
+      }
+    };
+  },
+
   groupForBasicType(state) {
     return (product, schemaId) => {
       return state.basicTypes?.[product]?.[schemaId];
@@ -740,10 +764,21 @@ export const getters = {
 
         // Translate if an entry exists
         let label = name;
-        // i18n-uses nav.group.*
-        const key = `nav.group."${ name }"`;
+        let key;
+
+        // See if we have a configured label for this group
+        const groupLabel = getters['groupLabel'](name);
+
+        if (groupLabel?.label) {
+          label = groupLabel.label;
+        } else if (groupLabel?.labelKey) {
+          key = groupLabel.labelKey;
+        } else {
+          // i18n-uses nav.group.*
+          key = `nav.group."${ name }"`;
+        }
 
-        if ( rootGetters['i18n/exists'](key) ) {
+        if (key && rootGetters['i18n/exists'](key) ) {
           label = rootGetters['i18n/t'](key);
         }
 
@@ -1680,6 +1715,10 @@ export const mutations = {
     }
   },
 
+  labelGroup(state, { group, label, labelKey }) {
+    state.groupLabels[group.toLowerCase()] = { label, labelKey };
+  },
+
   // setGroupDefaultType({group: 'core', defaultType: 'name'});
   // By default when a group is clicked, the first item is selected - this allows
   // this behaviour to be changed and a named child type can be chosen

package/tsconfig.paths.json

@@ -14,6 +14,7 @@
         "../shell/pkg/*"
       ],
       "@components/*": [
+        "./rancher-components/*",
         "../pkg/rancher-components/src/components/*"
       ]
     },