@rancher/shell 1.2.0 → 2.0.0

package/store/type-map.js

@@ -37,6 +37,7 @@
 //   ifHaveType,              -- Show this product only if the given type exists in the store [inStore], This can also be specified as an object { type: TYPE, store: 'management' } if the type isn't in the current [inStore]
 //   ifHaveVerb,              -- In combination with ifHaveTYpe, show it only if the type also has this collectionMethod
 //   inStore,                 -- Which store to look at for if* above and the left-nav, defaults to "cluster"
+//   rootProduct,             -- Optional root (parent) product - if set, used to optimize navigation when product changes stays within root product
 //   inExplorer,              -- Determines if the product is to be scoped to the explorer
 //   public,                  -- If true, show to all users.  If false, only show when the Developer Tools pref is on (default true)
 //   category,                -- Group to show the product in for the nav hamburger menu
@@ -133,7 +134,7 @@ import {
 } from '@shell/config/types';
 import { VIEW_IN_API, EXPANDED_GROUPS, FAVORITE_TYPES } from '@shell/store/prefs';
 import {
-  addObject, findBy, insertAt, isArray, removeObject, filterBy
+  addObject, findBy, isArray, removeObject, filterBy
 } from '@shell/utils/array';
 import { clone, get } from '@shell/utils/object';
 import {
@@ -150,15 +151,54 @@ import { sortBy } from '@shell/utils/sort';
 
 import { haveV2Monitoring } from '@shell/utils/monitoring';
 import { NEU_VECTOR_NAMESPACE } from '@shell/config/product/neuvector';
+import { createHeaders, rowValueGetter } from '@shell/store/type-map.utils';
 
 export const NAMESPACED = 'namespaced';
 export const CLUSTER_LEVEL = 'cluster';
 export const BOTH = 'both';
 
-export const ALL = 'all';
-export const BASIC = 'basic';
-export const FAVORITE = 'favorite';
-export const USED = 'used';
+export const TYPE_MODES = {
+  /**
+   * allTypes usage: All resource types
+   *
+   * getTree usage: Remove ignored schemas, resources not applicable to ns, etc
+   */
+  ALL:      'all',
+  /**
+   * Represents resource types that should be shown at the top of the side nav.
+   *
+   * For example all fixed resource types above `More Resources` in the cluster explorer
+   *
+   * These will always be shown in the side nav
+   *
+   * allTypes usage: Resources that are in a group
+   *
+   * getTree usage: Remove ignored schemas, resources not applicable to ns, etc
+   */
+  BASIC:    'basic',
+  /**
+   * Represents any type of resource type that has been favourited
+   *
+   * These will always be shown in the side nav.
+   *
+   * allTypes usage: Resource types that have been favorited
+   *
+   * getTree usage: Remove ignored schemas, resources not applicable to ns, etc
+   */
+  FAVORITE: 'favorite',
+  /**
+   * Represents no virtual or spoofed types that have a count.
+   *
+   * For example the `More Resource` in the cluster explorer
+   *
+   * These will be shown in the side nav if there are resources in the ns filter OR the resource is not namespaces
+   *
+   * allTypes usage: All resource types that are not virtual or spoofed
+   *
+   * getTree usage: Remove types with no counts. Remove ignored schemas, resources not applicable to ns, etc
+   */
+  USED:     'used',
+};
 
 export const ROOT = 'root';
 
@@ -168,8 +208,6 @@ export const SPOOFED_API_PREFIX = '__[[spoofedapi]]__';
 const instanceMethods = {};
 const graphConfigMap = {};
 
-const FIELD_REGEX = /^\$\.metadata\.fields\[([0-9]*)\]/;
-
 export const IF_HAVE = {
   V2_MONITORING:            'v2-monitoring',
   PROJECT:                  'project',
@@ -200,9 +238,14 @@ export function DSL(store, product, module = 'type-map') {
         ...inOpt
       };
 
+      // Convert strings to regex's - we do this once here for efficiency
       for ( const k of ['ifHaveGroup', 'ifHaveType'] ) {
         if ( opt[k] ) {
-          opt[k] = regexToString(ensureRegex(opt[k]));
+          if (Array.isArray(opt[k])) {
+            opt[k] = opt[k].map((r) => regexToString(ensureRegex(r)));
+          } else {
+            opt[k] = regexToString(ensureRegex(opt[k]));
+          }
         }
       }
 
@@ -225,7 +268,7 @@ export function DSL(store, product, module = 'type-map') {
       store.commit(`${ module }/groupBy`, { type, field });
     },
 
-    headers(type, headers) {
+    headers(type, headers, paginationHeaders = []) {
       headers.forEach((header) => {
         // If on the client, then use the value getter if there is one
         if (header.getValue) {
@@ -238,6 +281,7 @@ export function DSL(store, product, module = 'type-map') {
       });
 
       store.commit(`${ module }/headers`, { type, headers });
+      store.commit(`${ module }/paginationHeaders`, { type, paginationHeaders });
     },
 
     hideBulkActions(type, field) {
@@ -367,6 +411,7 @@ export const state = function() {
     typeOptions:             [],
     groupBy:                 {},
     headers:                 {},
+    paginationHeaders:       {},
     hideBulkActions:         {},
     schemaGeneration:        1,
     cache:                   {
@@ -395,6 +440,7 @@ export const getters = {
   labelFor(state, getters, rootState, rootGetters) {
     return (schema, count = 1, language = null) => {
       return _applyMapping(schema, state.typeMappings, 'id', false, () => {
+        // i18n-uses typeLabel.*
         const key = `typeLabel."${ schema.id.toLowerCase() }"`;
 
         if ( rootGetters['i18n/exists'](key, language) ) {
@@ -462,22 +508,26 @@ export const getters = {
     };
   },
 
-  optionsFor(state) {
+  optionsFor(state, getters, rootState, rootGetters) {
     const def = {
-      isCreatable:          true,
-      isEditable:           true,
-      isRemovable:          true,
-      showState:            true,
-      showAge:              true,
-      canYaml:              true,
-      namespaced:           null,
-      listGroups:           [],
-      depaginate:           false,
-      customRoute:          undefined,
-      resourceEditMasthead: true,
+      isCreatable:            true,
+      isEditable:             true,
+      isRemovable:            true,
+      showState:              true,
+      showAge:                true,
+      canYaml:                true,
+      namespaced:             null,
+      listGroups:             [],
+      listGroupsWillOverride: false,
+      listMandatorySort:      null,
+      depaginate:             false,
+      customRoute:            undefined,
+      resourceEditMasthead:   true,
     };
 
-    return (schemaOrType) => {
+    return (schemaOrType, pagination) => {
+      // Note - This can run a LOT so needs to be performant
+
       if (!schemaOrType) {
         return {};
       }
@@ -491,7 +541,20 @@ export const getters = {
 
       const opts = Object.assign({}, def, found || {});
 
-      return opts;
+      // As this runs a lot, avoid anything we don't strictly need (like going out to another store)
+      if (!pagination) {
+        return opts;
+      }
+
+      const storeOptionsFor = schemaOrType?.$ctx?.getters?.['optionsFor'];
+      const storeOpts = storeOptionsFor ? storeOptionsFor({ getters, state }, {
+        schema: schemaOrType, pagination, opts
+      }) : {};
+
+      return {
+        ...opts,
+        ...storeOpts,
+      };
     };
   },
 
@@ -534,17 +597,16 @@ export const getters = {
   },
 
   getTree(state, getters, rootState, rootGetters) {
-    return (productId, mode, allTypes, clusterId, namespaceMode, namespaces, currentType, search) => {
+    // Name the function so it's easily identifiable when performance tracing
+    return function getTree(productId, mode, allTypes, clusterId, namespaceMode, currentType, search) {
       // getTree has four modes:
-      // - `basic` matches data types that should always be shown even if there
-      //    are 0 of them.
-      // - `used` matches the data types where there are more than 0 of them
-      //    in the current set of namespaces.
+      // - `basic` matches data types that should always be shown (even if there are 0 of them).
+      // - `used` matches the data types where there are more than 0 of them in the current set of namespaces.
       // - `all` matches all types.
       // - `favorite` matches starred types.
       // namespaceMode: 'namespaced', 'cluster', or 'both'
       // namespaces: null means all, otherwise it will be an array of specific namespaces to include
-      const isBasic = mode === BASIC;
+      const isBasic = mode === TYPE_MODES.BASIC;
 
       let searchRegex;
 
@@ -577,7 +639,8 @@ export const getters = {
           continue;
         }
 
-        const count = _matchingCounts(typeObj, namespaces);
+        const inStore = rootGetters.currentStore(typeObj.name);
+        const count = rootGetters[`${ inStore }/count`](typeObj);
         const groupForBasicType = getters.groupForBasicType(productId, typeObj.name);
 
         if ( typeObj.id === currentType ) {
@@ -585,15 +648,15 @@ export const getters = {
         } else if ( isBasic && !groupForBasicType ) {
           // If we want the basic tree only return basic types;
           continue;
-        } else if ( mode === USED && count <= 0 ) {
+        } else if ( mode === TYPE_MODES.USED && count <= 0 ) {
           // If there's none of this type, ignore this entry when viewing only in-use types
-          // Note: count is sometimes null, which is <= 0.
+          // Note: count is sometimes null, in js `null <= 0` is `true`.
           continue;
         }
 
         const label = typeObj.labelKey ? rootGetters['i18n/t'](typeObj.labelKey) || typeObj.label : typeObj.label;
 
-        const labelDisplay = highlightLabel(label, typeObj.count, typeObj.schema);
+        const labelDisplay = highlightLabel(label, count, typeObj.schema);
 
         if ( !labelDisplay ) {
           // Search happens in highlight and returns null if not found
@@ -604,10 +667,10 @@ export const getters = {
 
         if ( isBasic ) {
           group = _ensureGroup(root, groupForBasicType, true);
-        } else if ( mode === FAVORITE ) {
+        } else if ( mode === TYPE_MODES.FAVORITE ) {
           group = _ensureGroup(root, 'starred');
           group.weight = 1000;
-        } else if ( mode === USED ) {
+        } else if ( mode === TYPE_MODES.USED ) {
           group = _ensureGroup(root, `inUse::${ getters.groupLabelFor(typeObj.schema) }`);
         } else {
           group = _ensureGroup(root, typeObj.schema || typeObj.group || ROOT);
@@ -639,14 +702,14 @@ export const getters = {
         group.children.push({
           label,
           labelDisplay,
-          mode:     typeObj.mode,
-          count,
-          exact:    typeObj.exact || false,
+          mode:         typeObj.mode,
+          exact:        typeObj.exact || false,
+          'exact-path': typeObj['exact-path'] || false,
           namespaced,
           route,
-          name:     typeObj.name,
-          weight:   typeObj.weight || getters.typeWeightFor(typeObj.schema?.id || label, isBasic),
-          overview: !!typeObj.overview,
+          name:         typeObj.name,
+          weight:       typeObj.weight || getters.typeWeightFor(typeObj.schema?.id || label, isBasic),
+          overview:     !!typeObj.overview,
         });
       }
 
@@ -670,6 +733,7 @@ export const getters = {
 
         // Translate if an entry exists
         let label = name;
+        // i18n-uses nav.group.*
         const key = `nav.group."${ name }"`;
 
         if ( rootGetters['i18n/exists'](key) ) {
@@ -810,55 +874,93 @@ export const getters = {
     });
   },
 
+  /**
+   * Given many things, create a list of menu items per schema given the mode
+   */
   allTypes(state, getters, rootState, rootGetters) {
-    return (product, mode = ALL) => {
-      const module = findBy(state.products, 'name', product)?.inStore;
+    // Name the function so it's easily identifiable when performance tracing
+    return function allTypes(product, modes = [TYPE_MODES.ALL]) {
+      const module = state.products.find((p) => p.name === product)?.inStore;
       const schemas = rootGetters[`${ module }/all`](SCHEMA);
+      const isLocal = !rootGetters.currentCluster?.isLocal;
+      const isRancher = rootGetters.isRancher;
       const counts = rootGetters[`${ module }/all`](COUNT)?.[0]?.counts || {};
-      const isDev = rootGetters['prefs/get'](VIEW_IN_API);
-      const isBasic = mode === BASIC;
 
       const out = {};
 
+      // For performance reasons this must be super quick to iterate over.
+      // For each schema...
+      // 1) Determine if it's applicable given the mode
+      // 2) For each applicable mode create a `Type` entry
       for ( const schema of schemas ) {
+        let schemaModes = { };
+
+        modes.forEach((m) => {
+          schemaModes[m] = true;
+        });
+
         const attrs = schema.attributes || {};
-        const count = counts[schema.id];
-        const label = getters.labelFor(schema, count);
-        const weight = getters.typeWeightFor(schema?.id || label, isBasic);
         const typeOptions = getters['optionsFor'](schema);
 
-        if ( isBasic ) {
-          // These are separate ifs so that things with no kind can still be basic
-          if ( !getters.groupForBasicType(product, schema.id) ) {
-            continue;
-          }
-        } else if ( mode === FAVORITE && !getters.isFavorite(schema.id) ) {
-          continue;
-        } else if ( !attrs.kind ) {
-          // Skip the schemas that aren't top-level types
-          continue;
-        } else if ( typeof typeOptions.ifRancherCluster !== 'undefined' && typeOptions.ifRancherCluster !== rootGetters.isRancher ) {
+        schemaModes[TYPE_MODES.BASIC] = schemaModes[TYPE_MODES.BASIC] && getters.groupForBasicType(product, schema.id);
+
+        if (Object.values(schemaModes).every((s) => !s)) {
           continue;
-        } else if (typeOptions.localOnly && !rootGetters.currentCluster?.isLocal) {
+        }
+
+        schemaModes[TYPE_MODES.FAVORITE] = schemaModes[TYPE_MODES.FAVORITE] && getters.isFavorite(schema.id);
+
+        if (Object.values(schemaModes).every((s) => !s)) {
           continue;
         }
 
-        out[schema.id] = {
-          label,
-          mode,
-          weight,
-          schema,
-          name:        schema.id,
-          namespaced:  typeOptions.namespaced === null ? attrs.namespaced : typeOptions.namespaced,
-          count:       count ? count.summary.count || 0 : null,
-          byNamespace: count ? count.namespaces : {},
-          revision:    count ? count.revision : null,
-          route:       typeOptions.customRoute
-        };
+        const onlyBasic = schemaModes[TYPE_MODES.BASIC] && modes.length === 1;
+
+        // This clause is only valid for non-basic modes. So if we have only basic... skip it
+        if (!onlyBasic) {
+          const invalidType = !attrs.kind ||
+          (typeof typeOptions.ifRancherCluster !== 'undefined' && typeOptions.ifRancherCluster !== isRancher) ||
+          (typeOptions.localOnly && isLocal);
+
+          if (invalidType) {
+            // Remove anything not basic
+            schemaModes = { [TYPE_MODES.BASIC]: schemaModes[TYPE_MODES.BASIC] };
+          }
+        }
+
+        // This is an expensive request to make, so only do it if we really need to
+        let label;
+
+        Object.entries(schemaModes).forEach(([mode, enabled]) => {
+          if (!enabled) {
+            return;
+          }
+
+          if (!out[mode]) {
+            out[mode] = {};
+          }
+
+          if (!label) {
+            label = getters.labelFor(schema, counts[schema.id]);
+          }
+
+          out[mode][schema.id] = {
+            label,
+            mode,
+            weight:     getters.typeWeightFor(schema?.id || label, mode === TYPE_MODES.BASIC),
+            schema,
+            name:       schema.id,
+            namespaced: typeOptions.namespaced === null ? attrs.namespaced : typeOptions.namespaced,
+            route:      typeOptions.customRoute
+          };
+        });
       }
 
+      const nonUsedModes = modes.filter((m) => m !== TYPE_MODES.USED);
+      const isDev = rootGetters['prefs/get'](VIEW_IN_API);
+
       // Add virtual and spoofed types
-      if ( mode !== USED ) {
+      if ( nonUsedModes.length ) {
         const virtualTypes = state.virtualTypes[product] || [];
         const spoofedTypes = state.spoofedTypes[product] || [];
         const allTypes = [...virtualTypes, ...spoofedTypes];
@@ -866,13 +968,15 @@ export const getters = {
         for ( const type of allTypes ) {
           const item = clone(type);
           const id = item.name;
-          const weight = type.weight || getters.typeWeightFor(item.label, isBasic);
+          const virtSpoofedModes = [...nonUsedModes];
 
           // Is there a virtual/spoofed type override for schema type?
           // Currently used by harvester, this should be investigated and removed if possible
-          if (out[id]) {
-            delete out[id];
-          }
+          virtSpoofedModes.forEach((mode) => {
+            if (out[mode]?.[id]) {
+              delete out[mode][id];
+            }
+          });
 
           if ( item['public'] === false && !isDev ) {
             continue;
@@ -883,16 +987,29 @@ export const getters = {
           }
 
           if ( item.ifHaveType ) {
-            const targetedSchemas = typeof item.ifHaveType === 'string' ? schemas : rootGetters[`${ item.ifHaveType.store }/all`](SCHEMA);
-            const type = typeof item.ifHaveType === 'string' ? item.ifHaveType : item.ifHaveType?.type;
+            const ifHaveTypeArray = Array.isArray(item.ifHaveType) ? item.ifHaveType : [item.ifHaveType];
+            let satisfiesIfHave = true;
 
-            const haveIds = filterBy(targetedSchemas, 'id', normalizeType(type)).map((s) => s.id);
+            // Support an array of required types that the user must have access to
+            for (let i = 0; i < ifHaveTypeArray.length; i++) {
+              const ifHaveType = ifHaveTypeArray[i];
+              const targetedSchemas = typeof ifHaveType === 'string' ? schemas : rootGetters[`${ ifHaveType.store }/all`](SCHEMA);
+              const type = typeof ifHaveType === 'string' ? ifHaveType : ifHaveType?.type;
 
-            if (!haveIds.length) {
-              continue;
+              const haveIds = filterBy(targetedSchemas, 'id', normalizeType(type)).map((s) => s.id);
+
+              if (!haveIds.length) {
+                satisfiesIfHave = false;
+                break;
+              }
+
+              if (item.ifHaveVerb && !ifHaveVerb(rootGetters, module, item.ifHaveVerb, haveIds)) {
+                satisfiesIfHave = false;
+                break;
+              }
             }
 
-            if (item.ifHaveVerb && !ifHaveVerb(rootGetters, module, item.ifHaveVerb, haveIds)) {
+            if (!satisfiesIfHave) {
               continue;
             }
           }
@@ -911,14 +1028,27 @@ export const getters = {
             continue;
           }
 
-          if ( isBasic && !getters.groupForBasicType(product, id) ) {
-            continue;
-          } else if ( mode === FAVORITE && !getters.isFavorite(id) ) {
-            continue;
+          if (item.ifFeature) {
+            if (item.ifFeature[0] === '!') {
+              const feature = item.ifFeature.replace('!', '');
+
+              if (rootGetters['features/get'](feature)) {
+                continue;
+              }
+            } else {
+              if (!rootGetters['features/get'](item.ifFeature)) {
+                continue;
+              }
+            }
+          }
+
+          if (virtSpoofedModes.includes(TYPE_MODES.BASIC) && !getters.groupForBasicType(product, id) ) {
+            virtSpoofedModes.splice(virtSpoofedModes.indexOf(TYPE_MODES.BASIC), 1);
           }
 
-          item.mode = mode;
-          item.weight = weight;
+          if (virtSpoofedModes.includes(TYPE_MODES.FAVORITE) && !getters.isFavorite(id) ) { // mode === TYPE_MODES.FAVORITE &&
+            virtSpoofedModes.splice(virtSpoofedModes.indexOf(TYPE_MODES.FAVORITE), 1);
+          }
 
           // Ensure labelKey is taken into account... with a mock count
           // This is harmless if the translation doesn't require count
@@ -929,7 +1059,17 @@ export const getters = {
             item.label = item.label || item.name;
           }
 
-          out[id] = item;
+          virtSpoofedModes.forEach((mode) => {
+            const isBasic = mode === TYPE_MODES.BASIC;
+            const weight = type.weight || getters.typeWeightFor(item.label, isBasic);
+
+            item.mode = mode;
+            item.weight = weight;
+            if (!out[mode]) {
+              out[mode] = {};
+            }
+            out[mode][id] = item;
+          });
         }
       }
 
@@ -950,99 +1090,46 @@ export const getters = {
   },
 
   headersFor(state, getters, rootState, rootGetters) {
-    return (schema) => {
-      const attributes = schema.attributes || {};
-      const columns = attributes.columns || [];
-      const typeOptions = getters['optionsFor'](schema);
-
-      // A specific list has been provided
-      if ( state.headers[schema.id] ) {
-        return state.headers[schema.id].map((entry) => {
-          if ( typeof entry === 'string' ) {
-            const col = findBy(columns, 'name', entry);
-
-            if ( col ) {
-              return fromSchema(col, rootGetters);
-            } else {
-              return null;
-            }
-          } else {
-            return entry;
-          }
-        }).filter((col) => !!col);
-      }
+    return (schema, pagination) => {
+      if (pagination) {
+        const storeHeadersFor = schema?.$ctx?.getters?.['headersFor'];
 
-      // Otherwise make one up from schema
-      const out = typeOptions.showState ? [STATE] : [];
-      const namespaced = attributes.namespaced || false;
-      let hasName = false;
-
-      for ( const col of columns ) {
-        if ( col.format === 'name' ) {
-          hasName = true;
-          out.push(NAME);
-          if ( namespaced ) {
-            out.push(NAMESPACE_COL);
-          }
-        } else {
-          out.push(fromSchema(col, rootGetters));
-        }
-      }
+        if (storeHeadersFor) {
+          const res = storeHeadersFor({ getters, state }, { schema, pagination });
 
-      if ( !hasName ) {
-        insertAt(out, 1, NAME);
-        if ( namespaced ) {
-          insertAt(out, 2, NAMESPACE_COL);
-        }
-      }
-
-      // Age always goes last
-      if ( out.includes(AGE) ) {
-        removeObject(out, AGE);
-        if ( typeOptions.showAge ) {
-          out.push(AGE);
+          if (res) {
+            return res;
+          }
         }
       }
 
-      return out;
-
-      function fromSchema(col, rootGetters) {
-        let formatter, width, formatterOpts;
-
-        if ( (col.format === '' || col.format === 'date') && col.name === 'Age' ) {
-          return AGE;
-        }
-
-        if ( col.format === 'date' || col.type === 'date' ) {
-          formatter = 'Date';
-          width = 120;
-          formatterOpts = { multiline: true };
-        }
+      return createHeaders({ rootGetters }, {
+        headers:     state.headers,
+        typeOptions: getters['optionsFor'](schema, false),
+        schema,
+        columns:     {
+          state:     STATE,
+          name:      NAME,
+          namespace: NAMESPACE_COL,
+          age:       AGE,
+        },
+        pagination
+      });
+    };
+  },
 
-        if ( col.type === 'number' || col.type === 'int' ) {
-          formatter = 'Number';
-        }
+  /**
+   * Simple getter to fetch pre-configured headers used in pagination
+   */
+  configuredPaginationHeaders(state) {
+    return (schemaOrType) => state.paginationHeaders?.[schemaOrType.id || schemaOrType];
+  },
 
-        const colName = col.name.includes(' ') ? col.name.split(' ').map((word) => word.charAt(0).toUpperCase() + word.substring(1) ).join('') : col.name;
-
-        const exists = rootGetters['i18n/exists'];
-        const t = rootGetters['i18n/t'];
-        const labelKey = `tableHeaders.${ colName.charAt(0).toLowerCase() + colName.slice(1) }`;
-        const description = col.description || '';
-        const tooltip = description && description[description.length - 1] === '.' ? description.slice(0, -1) : description;
-
-        return {
-          name:  col.name.toLowerCase(),
-          label: exists(labelKey) ? t(labelKey) : col.name,
-          value: _rowValueGetter(col),
-          sort:  [col.field],
-          formatter,
-          formatterOpts,
-          width,
-          tooltip
-        };
-      }
-    };
+  /**
+   * Simple getter to fetch pre-configured headers (not used in paginated lists)
+   */
+  configuredHeaders(state) {
+    return (schemaOrType) => state.headers?.[schemaOrType.id || schemaOrType];
   },
 
   // ------------------------------------
@@ -1352,7 +1439,7 @@ export const getters = {
     return (schema, colName) => {
       const col = _findColumnByName(schema, colName);
 
-      return _rowValueGetter(col);
+      return rowValueGetter(col);
     };
   },
 
@@ -1363,6 +1450,10 @@ export const getters = {
       return !!prod;
     };
   },
+
+  productByName(state) {
+    return (productName) => state.products.find((p) => p.name === productName);
+  }
 };
 
 export const mutations = {
@@ -1422,12 +1513,27 @@ export const mutations = {
   },
 
   product(state, obj) {
-    const existing = findBy(state.products, 'name', obj.name);
+    let existing = state.products.find((p) => p.name === obj.name);
 
     if ( existing ) {
       Object.assign(existing, obj);
     } else {
       addObject(state.products, obj);
+      existing = state.products.find((p) => p.name === obj.name);
+    }
+
+    // Make sure deprecated `inExplorer` is synchronized with `rootProduct` (and vice-versa)
+    if (existing?.inExplorer) {
+      existing.rootProduct = EXPLORER;
+    } else if (existing?.rootProduct === EXPLORER) {
+      existing.inExplorer = true;
+    }
+
+    // We make an assumption that if the store for a product is 'cluster' it will be displayed within cluster explorer
+    // Detect that here and set rootProduct and inExporer in this case
+    if (!existing?.rootProduct && existing?.inStore === 'cluster') {
+      existing.rootProduct = EXPLORER;
+      existing.inExplorer = (existing.rootProduct === EXPLORER);
     }
   },
 
@@ -1523,6 +1629,10 @@ export const mutations = {
     state.headers[type] = headers;
   },
 
+  paginationHeaders(state, { type, paginationHeaders }) {
+    state.paginationHeaders[type] = paginationHeaders;
+  },
+
   hideBulkActions(state, { type, field }) {
     state.hideBulkActions[type] = field;
   },
@@ -1679,22 +1789,6 @@ function _sortGroup(tree, mode) {
   }
 }
 
-function _matchingCounts(typeObj, namespaces) {
-  // That was easy
-  if ( !typeObj.namespaced || !typeObj.byNamespace || namespaces === null || typeObj.count === null) {
-    return typeObj.count;
-  }
-
-  let out = 0;
-
-  // Otherwise start with 0 and count up
-  for ( const namespace of namespaces ) {
-    out += typeObj.byNamespace[namespace]?.count || 0;
-  }
-
-  return out;
-}
-
 function _applyMapping(objOrValue, mappings, keyField, cache, defaultFn) {
   let key = objOrValue;
   let found = false;
@@ -1835,25 +1929,6 @@ function _findColumnByName(schema, colName) {
   return findBy(columns, 'name', colName);
 }
 
-function _rowValueGetter(col) {
-  // 'field' comes from the schema - typically it is of the form $.metadata.field[N]
-  // We will use JsonPath to look up this value, which is costly - so if we can detect this format
-  // Use a more efficient function to get the value
-  const value = col.field.startsWith('.') ? `$${ col.field }` : col.field;
-
-  if (process.client) {
-    const found = value.match(FIELD_REGEX);
-
-    if (found && found.length === 2) {
-      const fieldIndex = parseInt(found[1], 10);
-
-      return (row) => row.metadata?.fields?.[fieldIndex];
-    }
-  }
-
-  return value;
-}
-
 // Is V1 Istio installed?
 function isV1Istio(getters) {
   const cluster = getters['currentCluster'];