@rancher/shell 3.0.8-rc.9 → 3.0.8

package/pkg/auto-import.js

@@ -15,7 +15,7 @@ function registerFile(file, type, pkg, f) {
   const importType = (f === 'models') ? 'require' : 'import';
   const chunkName = (f === 'l10n') ? '' : `/* webpackChunkName: "${ f }" */`;
 
-  return `  $plugin.register('${ f }', '${ type }', () => ${ importType }(${ chunkName }'${ pkg }/${ f }/${ file }'));\n`;
+  return `  $extension.register('${ f }', '${ type }', () => ${ importType }(${ chunkName }'${ pkg }/${ f }/${ file }'));\n`;
 }
 
 function register(file, pkg, f) {
@@ -29,7 +29,7 @@ function register(file, pkg, f) {
 // This ensures that the webpackChunkName is respected (require.context does not support this) - so when build as a library
 // the code splitting will be respected
 function generateTypeImport(pkg, dir) {
-  let content = 'export function importTypes($plugin) { \n';
+  let content = 'export function importTypes($extension) { \n';
 
   // Auto-import if the folder exists
   contextFolders.forEach((f) => {
@@ -77,7 +77,7 @@ function generateTypeImport(pkg, dir) {
 // and then restart the dev server for it to be picked up.
 function generateDynamicTypeImport(pkg, dir) {
   const template = fs.readFileSync(path.join(__dirname, 'import.js'), { encoding: 'utf8' });
-  let content = 'export function importTypes($plugin) { \n';
+  let content = 'export function importTypes($extension) { \n';
 
   // Auto-import if the folder exists
   contextFolders.forEach((f) => {

package/pkg/dynamic-importer.lib.js

@@ -41,7 +41,7 @@ export function listProducts() {
   return [];
 }
 
-export function loadProduct(name, $plugin) {
+export function loadProduct(name, $extension) {
   return () => undefined;
 }
 

package/pkg/import.js

@@ -6,5 +6,5 @@ _NAME.forEach((f) => {
 
   name = name.substr(0, ext);
 
-  $plugin.register('DIR', name, () => REQUIRE(CHUNK`BASE/DIR/${ name }EXT`)); // eslint-disable-line no-undef
+  $extension.register('DIR', name, () => REQUIRE(CHUNK`BASE/DIR/${ name }EXT`)); // eslint-disable-line no-undef
 });

package/plugins/__tests__/mutations.tests.ts

@@ -0,0 +1,179 @@
+import mutations from '@shell/plugins/dashboard-store/mutations';
+import getters from '@shell/plugins/steve/getters';
+import { StorePagination } from '@shell/types/store/pagination.types';
+import { VuexStore } from '@shell/types/store/vuex';
+import Pod from '@shell/models/pod';
+
+describe('mutations', () => {
+  jest.mock('vue', () => ({ reactive: jest.fn((arr) => arr) }));
+
+  // Import the function we are testing
+  const { loadPage } = mutations;
+
+  let state: any;
+  let ctx: Partial<VuexStore>;
+  let resourceType: string;
+  let pagination: Partial<StorePagination>;
+  let revision: string;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    state = { types: {} };
+    ctx = {
+      getters: {
+        keyFieldForType: jest.fn(() => 'id'),
+        cleanResource:   getters.cleanResource()
+      }
+    };
+    resourceType = 'pod';
+    pagination = { request: undefined, result: undefined };
+    revision = 'abc-123';
+    ctx.getters.classify = () => Pod;
+  });
+
+  describe('loadPage', () => {
+    it('should perform an initial load into an empty cache', () => {
+      const data = [
+        {
+          id: 'a', name: 'pod-a', type: resourceType
+        },
+        {
+          id: 'b', name: 'pod-b', type: resourceType
+        }
+      ];
+
+      loadPage(state, {
+        type: resourceType, data, ctx, pagination, revision
+      });
+
+      // Get the cache created by the *real* 'registerType'
+      const cache = state.types[resourceType];
+
+      // Check cache metadata
+      expect(cache.generation).toBe(1);
+      expect(cache.havePage).toBe(pagination);
+      expect(cache.revision).toBe(revision);
+
+      // Check 'list' (should contain classified proxies)
+      expect(cache.list).toHaveLength(2);
+      expect(cache.list[0]).toStrictEqual(expect.objectContaining({ id: 'a' }));
+      expect(cache.list[1]).toStrictEqual(expect.objectContaining({ id: 'b' }));
+
+      // Check 'map'
+      expect(cache.map.size).toBe(2);
+      expect(cache.map.get('a')).toBe(cache.list[0]); // Map and list must reference the *same* objects
+      expect(cache.map.get('b')).toBe(cache.list[1]);
+    });
+
+    it('should update existing resources in-place (tests "replaceResource" effect)', () => {
+      const v1Resource = new Pod({ id: 'a', metadata: { a: 'v1-a' } }, ctx);
+
+      state.types[resourceType] = {
+        list:       [v1Resource],
+        map:        new Map([['a', v1Resource]]),
+        generation: 1,
+      };
+
+      // Keep a reference to the *original list array* and *original resource object*
+      const originalListRef = state.types[resourceType].list;
+      const originalResourceRef = v1Resource;
+
+      const newData = [
+        { id: 'a', metadata: { a: 'v2-a' } }, // This is the update
+      ];
+      const newRevision = 'rev-2';
+
+      loadPage(state, {
+        type: resourceType, data: newData, ctx, pagination, revision: newRevision
+      });
+
+      const cache = state.types[resourceType];
+
+      expect(cache.list).toBe(originalListRef);
+      expect(cache.list).toHaveLength(1);
+
+      expect(cache.list[0]).toBe(originalResourceRef);
+
+      expect(originalResourceRef.metadata.a).toBe('v2-a');
+
+      expect(cache.map.get('a')).toBe(originalResourceRef);
+
+      expect(cache.generation).toBe(2);
+      expect(cache.revision).toBe(newRevision);
+    });
+
+    it('should remove stale data from list and map (paging)', () => {
+      const page1Proxy = new Pod({ id: 'a', name: 'stale-pod' }, ctx);
+
+      state.types[resourceType] = {
+        list:       [page1Proxy],
+        map:        new Map([['a', page1Proxy]]),
+        generation: 1,
+      };
+
+      const listRef = state.types[resourceType].list;
+
+      const page2Data = [
+        { id: 'b', name: 'new-pod' },
+      ];
+
+      loadPage(state, {
+        type: resourceType, data: page2Data, ctx, pagination, revision
+      });
+
+      const cache = state.types[resourceType];
+
+      expect(cache.list).toBe(listRef); // List reference must be preserved
+
+      expect(cache.list).toHaveLength(1);
+      expect(cache.list[0].id).toBe('b');
+
+      expect(cache.map.size).toBe(1);
+      expect(cache.map.has('a')).toBe(false); // Stale 'a' is gone
+      expect(cache.map.has('b')).toBe(true);
+    });
+
+    it('should handle partial overlaps (update, remove stale, add new)', () => {
+      // 1. Pre-load cache
+      const staleResource = new Pod({ id: 'a', prop: 'stale-pod' }, ctx);
+      const v1Resource = new Pod({ id: 'b', prop: 'v1-pod-b' }, ctx);
+
+      state.types[resourceType] = {
+        list:       [staleResource, v1Resource],
+        map:        new Map([['a', staleResource], ['b', v1Resource]]),
+        generation: 1,
+      };
+
+      const listRef = state.types[resourceType].list;
+      const v1ResourceRef = v1Resource;
+
+      const newData = [
+        { id: 'b', prop: 'v2-pod-b' }, // Updated
+        { id: 'c', prop: 'new-pod-c' }, // New
+      ];
+
+      loadPage(state, {
+        type: resourceType, data: newData, ctx, pagination, revision
+      });
+
+      const cache = state.types[resourceType];
+
+      expect(cache.list).toBe(listRef); // List reference preserved
+
+      expect(cache.list).toHaveLength(2);
+      expect(cache.list[0].id).toBe('b');
+      expect(cache.list[1].id).toBe('c');
+
+      expect(cache.list[0]).toBe(v1ResourceRef);
+      expect(v1ResourceRef.prop).toBe('v2-pod-b');
+
+      expect(cache.list[1]).toStrictEqual(expect.objectContaining({ id: 'c' }));
+
+      expect(cache.map.size).toBe(2);
+      expect(cache.map.has('a')).toBe(false); // Stale, removed
+      expect(cache.map.get('b')).toBe(v1ResourceRef); // Updated
+      expect(cache.map.get('c')).toBe(cache.list[1]); // Added
+    });
+  });
+});

package/plugins/dashboard-store/getters.js

@@ -543,7 +543,7 @@ export default {
     const store = state.config.namespace;
     const resource = id || context ? { id, context } : null;
 
-    return paginationUtils.isEnabled({ rootGetters, $plugin: rootState.$plugin }, { store, resource });
+    return paginationUtils.isEnabled({ rootGetters, $extension: rootState.$extension }, { store, resource });
   },
 
   /**

package/plugins/dashboard-store/model-loader.js

@@ -13,7 +13,7 @@ function find(cache, type, rootState) {
   }
 
   try {
-    const pluginModel = rootState.$plugin.getDynamic('models', type);
+    const pluginModel = rootState.$extension.getDynamic('models', type);
     let base;
 
     if (!pluginModel) {

package/plugins/dashboard-store/mutations.js

@@ -515,8 +515,29 @@ export default {
     cache.generation++;
 
     // Update list
-    clear(cache.list);
-    addObjects(cache.list, proxies);
+    // We want to update the old page with the new page
+    // We need to keep the cache.list object reference the same
+    // We need to keep objects that represent the same resource the same (don't remove the old object and add a new object for the same resource)
+    // - this helps anywhere that works with object references (sortable table selection is maintained by object reference)
+
+    // Create a map of the current references in cache.list
+    const currentPageMap = new Map(cache.list.map((i) => [i[keyField], i]));
+
+    // Create an array containing the new page, but using the same object for resources that exist in old and new page
+    const newPage = proxies.map((p) => {
+      const existing = currentPageMap.get(p[keyField]);
+
+      if (existing) {
+        replaceResource(existing, p, ctx.getters);
+
+        return existing;
+      }
+
+      return p;
+    });
+
+    // Replace the old cache.list entries with the new page
+    cache.list.splice(0, cache.list.length, ...newPage);
 
     // Update Map (remove stale)
     cache.map.forEach((value, key) => {

package/plugins/dashboard-store/resource-class.js

@@ -610,7 +610,11 @@ export default class Resource {
   }
 
   get '$plugin'() {
-    return this.$ctx.rootState?.$plugin;
+    return this.$ctx.rootState?.$extension;
+  }
+
+  get '$extension'() {
+    return this.$ctx.rootState?.$extension;
   }
 
   get customValidationRules() {
@@ -1359,6 +1363,7 @@ export default class Resource {
 
   get _detailLocation() {
     const schema = this.$getters['schemaFor'](this.type);
+    const isNamespaced = schema?.attributes?.namespaced;
 
     const id = this.id?.replace(/.*\//, '');
 
@@ -1368,7 +1373,7 @@ export default class Resource {
         product:   this.$rootGetters['productId'],
         cluster:   this.$rootGetters['clusterId'],
         resource:  this.type,
-        namespace: this.metadata?.namespace,
+        namespace: isNamespaced && this.metadata?.namespace ? this.metadata.namespace : undefined,
         id,
       }
     };
@@ -1777,7 +1782,7 @@ export default class Resource {
             CustomValidators[validatorName](pathValue, this.$rootGetters, errors, validatorArgs, displayKey, data);
           } else if (!isEmpty(validatorName) && !validatorExists) {
             // Check if validator is imported from plugin
-            const pluginValidator = this.$rootState.$plugin?.getValidator(validatorName);
+            const pluginValidator = this.$rootState.$extension?.getValidator(validatorName);
 
             if (pluginValidator) {
               pluginValidator(pathValue, this.$rootGetters, errors, validatorArgs, displayKey, data);

package/plugins/plugin.js

@@ -44,7 +44,7 @@ export default async function(context) {
     const res = await allHashSettled(fetches);
 
     // Initialize the built-in extensions now - this is now done here so that built-in extensions get the same, correct environment data (version etc)
-    context.$plugin.loadBuiltinExtensions();
+    context.$extension.loadBuiltinExtensions();
 
     if (res.plugins?.status === 'rejected') {
       throw new Error(res.reason);
@@ -60,7 +60,7 @@ export default async function(context) {
       const shouldNotLoad = shouldNotLoadPlugin(plugin, { rancherVersion, kubeVersion }, context.store.getters['uiplugins/plugins'] || []); // Error key string or boolean
 
       if (!shouldNotLoad) {
-        hash[plugin.name] = context.$plugin.loadPluginAsync(plugin);
+        hash[plugin.name] = context.$extension.loadPluginAsync(plugin);
       } else {
         context.store.dispatch('uiplugins/setError', { name: plugin.name, error: shouldNotLoad });
       }