@rancher/shell 3.0.5-rc.3 → 3.0.5-rc.5

package/edit/management.cattle.io.fleetworkspace.vue

@@ -1,10 +1,12 @@
 <script>
+import { _CREATE } from '@shell/config/query-params';
 import CreateEditView from '@shell/mixins/create-edit-view';
 import CruResource from '@shell/components/CruResource';
 import Labels from '@shell/components/form/Labels';
 import Loading from '@shell/components/Loading';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
 import { FLEET, MANAGEMENT, SCHEMA } from '@shell/config/types';
+import { FLEET as FLEET_ANNOTATIONS } from '@shell/config/labels-annotations';
 // import RoleBindings from '@shell/components/RoleBindings';
 import Tabbed from '@shell/components/Tabbed';
 import Tab from '@shell/components/Tabbed/Tab';
@@ -16,6 +18,7 @@ import { LAST_NAMESPACE, WORKSPACE } from '@shell/store/prefs';
 import { exceptionToErrorsArray } from '@shell/utils/error';
 import Banner from '@components/Banner/Banner.vue';
 import ArrayList from '@shell/components/form/ArrayList.vue';
+import FleetOCIStorageSecret from '@shell/components/fleet/FleetOCIStorageSecret.vue';
 
 export default {
   name: 'FleetCruWorkspace',
@@ -25,6 +28,7 @@ export default {
   inheritAttrs: false,
   components:   {
     CruResource,
+    FleetOCIStorageSecret,
     Labels,
     Loading,
     NameNsDescription,
@@ -126,6 +130,10 @@ export default {
         this.errors = exceptionToErrorsArray(err);
       }
     },
+
+    updateDefaultOCIStorageSecret(secretName) {
+      this.value.metadata.annotations[FLEET_ANNOTATIONS.OCI_STORAGE_SECRET_DEFAULT] = secretName;
+    }
   },
 
   computed: {
@@ -145,6 +153,14 @@ export default {
       }
     },
 
+    defaultOCIStorageSecret() {
+      return this.value.metadata?.annotations?.[FLEET_ANNOTATIONS.OCI_STORAGE_SECRET_DEFAULT];
+    },
+
+    isCreate() {
+      return this.mode === _CREATE;
+    },
+
     SCOPE_NAMESPACE() {
       return SCOPE_NAMESPACE;
     },
@@ -198,19 +214,10 @@ export default {
         />
       </Tab> -->
 
-      <Tab
-        name="labels"
-        label-key="generic.labelsAndAnnotations"
-      >
-        <Labels
-          :value="value"
-          :mode="mode"
-          @update:value="$emit('input', $event)"
-        />
-      </Tab>
       <Tab
         name="allowedtargetnamespaces"
         label-key="fleet.workspaces.tabs.restrictions"
+        :weight="3"
       >
         <Banner
           color="info"
@@ -240,6 +247,32 @@ export default {
           :value-can-be-empty="true"
         />
       </Tab>
+      <Tab
+        v-if="!isCreate"
+        name="ociRegistries"
+        label-key="fleet.workspaces.tabs.ociRegistry"
+        :weight="2"
+      >
+        <FleetOCIStorageSecret
+          data-testid="default-oci-storage-secret"
+          :secret="defaultOCIStorageSecret"
+          :workspace="value.metadata.name"
+          :mode="mode"
+          :allow-default="false"
+          @update:value="updateDefaultOCIStorageSecret"
+        />
+      </Tab>
+      <Tab
+        name="labels"
+        label-key="generic.labelsAndAnnotations"
+        :weight="1"
+      >
+        <Labels
+          :value="value"
+          :mode="mode"
+          @update:value="$emit('input', $event)"
+        />
+      </Tab>
     </Tabbed>
   </CruResource>
 </template>

package/list/fleet.cattle.io.gitrepo.vue

@@ -65,7 +65,7 @@ export default {
 
       }, this.$store);
 
-      this.hasWorkspaces = !!hash.workspaces;
+      this.hasWorkspaces = (hash.workspaces || []).length > 0;
     } catch (e) {
     }
 

package/list/fleet.cattle.io.helmop.vue

@@ -0,0 +1,108 @@
+<script>
+import FleetHelmOps from '@shell/components/fleet/FleetHelmOps.vue';
+import Masthead from '@shell/components/ResourceList/Masthead';
+import FleetNoWorkspaces from '@shell/components/fleet/FleetNoWorkspaces.vue';
+import { FLEET } from '@shell/config/types';
+import ResourceFetch from '@shell/mixins/resource-fetch';
+import { checkPermissions, checkSchemasForFindAllHash } from '@shell/utils/auth';
+
+export default {
+  name:       'ListHelmOps',
+  components: {
+    FleetHelmOps,
+    Masthead,
+    FleetNoWorkspaces,
+  },
+  mixins: [ResourceFetch],
+  props:  {
+    schema: {
+      type:     Object,
+      required: true,
+    },
+
+    resource: {
+      type:     String,
+      required: true,
+    },
+
+    loadIndeterminate: {
+      type:    Boolean,
+      default: false
+    },
+
+    incrementalLoadingIndicator: {
+      type:    Boolean,
+      default: false
+    },
+
+    useQueryParamsForSimpleFiltering: {
+      type:    Boolean,
+      default: false
+    }
+  },
+
+  async fetch() {
+    try {
+      const hash = await checkSchemasForFindAllHash({
+        cluster: {
+          inStoreType: 'management',
+          type:        FLEET.CLUSTER
+        },
+        clusterGroups: {
+          inStoreType: 'management',
+          type:        FLEET.CLUSTER_GROUP
+        },
+
+        helmOps: {
+          inStoreType: 'management',
+          type:        FLEET.HELM_OP
+        },
+
+        workspaces: {
+          inStoreType: 'management',
+          type:        FLEET.WORKSPACE
+        },
+
+      }, this.$store);
+
+      this.hasWorkspaces = (hash.workspaces || []).length > 0;
+    } catch (e) {
+    }
+
+    try {
+      const permissions = await checkPermissions({ workspaces: { type: FLEET.WORKSPACE }, helmOps: { type: FLEET.HELM_OP } }, this.$store.getters);
+
+      this.permissions = permissions;
+    } catch (e) {
+    }
+    await this.$fetchType(this.resource);
+  },
+
+  data() {
+    return { hasWorkspaces: false, permissions: {} };
+  },
+};
+</script>
+
+<template>
+  <div v-if="hasWorkspaces">
+    <Masthead
+      :schema="schema"
+      :resource="resource"
+      :show-incremental-loading-indicator="incrementalLoadingIndicator"
+      :load-resources="loadResources"
+      :load-indeterminate="loadIndeterminate"
+      :create-button-label="t('fleet.helmOp.actions.add')"
+    />
+    <FleetHelmOps
+      :rows="rows"
+      :schema="schema"
+      :loading="loading"
+      :use-query-params-for-simple-filtering="useQueryParamsForSimpleFiltering"
+      :force-update-live-and-delayed="forceUpdateLiveAndDelayed"
+    />
+  </div>
+  <div v-else>
+    <FleetNoWorkspaces :can-view="permissions.workspaces" />
+  </div>
+</template>

package/list/namespace.vue

@@ -42,8 +42,11 @@ export default {
     headers() {
       const headersFromSchema = this.$store.getters['type-map/headersFor'](this.schema);
 
-      if (this.hasHarvesterResourceQuotaSchema) {
-        headersFromSchema.splice(2, 0, NS_SNAPSHOT_QUOTA);
+      // harvester is reusing this namespace.js to render ns page, we need to make sure harvester backend support quota schema to show this column.
+      if (this.hasHarvesterResourceQuotaSchema && Array.isArray(headersFromSchema) && headersFromSchema.length > 1) {
+        const columnIdx = headersFromSchema.length - 1;
+
+        headersFromSchema.splice(columnIdx, 0, NS_SNAPSHOT_QUOTA);
       }
 
       return headersFromSchema;

package/mixins/auth-config.js

@@ -307,7 +307,14 @@ export default {
 
         // KeyCloakOIDCConfig --> OIDCConfig
         this.model.rancherUrl = `${ serverUrl }/verify-auth`;
-        this.model.scope = this.model.id === 'keycloakoidc' ? BASE_SCOPES.keycloakoidc[0] : BASE_SCOPES.genericoidc[0];
+
+        // If there are base scopes defined for this provider, use those
+        if (Array.isArray(BASE_SCOPES[this.model.id])) {
+          this.model.scope = BASE_SCOPES[this.model.id][0];
+        } else {
+          // Default if base scopes not defined for this auth provider
+          this.model.scope = BASE_SCOPES.genericoidc[0];
+        }
         break;
       }
 

package/mixins/preset.js

@@ -0,0 +1,100 @@
+import { watch } from 'vue';
+import { dasherize } from '@shell/utils/string';
+import { NORMAN } from '@shell/config/types';
+
+export default {
+  data() {
+    return {
+      _init:   [],
+      presets: {},
+    };
+  },
+
+  mounted() {
+    this.presetKey = dasherize(this.$options.name || '');
+
+    const version = this.presetVersion;
+
+    if (!version) {
+      console.warn('Preset: version not found, skip.'); // eslint-disable-line no-console
+
+      return;
+    }
+
+    let presets = null;
+
+    try {
+      presets = JSON.parse(window.localStorage.getItem(this.presetKey));
+    } catch (error) {
+      console.warn(`Preset: load presets failed, invalid presets [${ this.presetKey }]`); // eslint-disable-line no-console
+    }
+
+    if (presets?.data && presets?.user === this.user && presets?.version === version) {
+      this.presets = presets;
+
+      return;
+    }
+
+    this.presets = {
+      data: {},
+      user: this.user,
+      version
+    };
+  },
+
+  computed: {
+    user() {
+      const principal = this.$store.getters['rancher/byId'](NORMAN.PRINCIPAL, this.$store.getters['auth/principalId']) || {};
+
+      return principal.loginName;
+    }
+  },
+
+  methods: {
+    preset(key, type) {
+      if (this._init.includes(key)) {
+        return;
+      }
+
+      this._init.push(key);
+
+      if (!this.presetVersion) {
+        return;
+      }
+
+      if (!this.presetKey) {
+        return;
+      }
+
+      if (!this.presets?.data) {
+        return;
+      }
+
+      if (this[key] === undefined) {
+        return;
+      }
+
+      const preset = this.presets.data[key];
+
+      if (preset !== undefined && typeof preset === type) { // eslint-disable-line valid-typeof
+        this[key] = preset;
+      }
+
+      watch(
+        () => this[key],
+        (neu) => {
+          this.presets.data[key] = neu;
+
+          try {
+            const presets = JSON.stringify(this.presets);
+
+            window.localStorage.setItem(this.presetKey, presets);
+          } catch (error) {
+            console.warn(`Preset: save presets failed, invalid presets [${ this.presetKey }]`); // eslint-disable-line no-console
+          }
+        },
+        { deep: true }
+      );
+    },
+  },
+};

package/mixins/resource-fetch-api-pagination.js

@@ -47,6 +47,8 @@ export default {
       },
 
       paginationFromList: null,
+
+      isPaginationManualRefreshEnabled: paginationUtils.isListManualRefreshEnabled({ rootGetters: this.$store.getters }),
     };
   },
 

package/mixins/resource-fetch.js

@@ -280,7 +280,7 @@ export default {
       if (manualDataRefreshEnabled && resourceCount >= manualDataRefreshThreshold) {
         watch = false;
         isTooManyItemsToAutoUpdate = true;
-      } else if (this.canPaginate) {
+      } else if (this.canPaginate && this.isPaginationManualRefreshEnabled) {
         isTooManyItemsToAutoUpdate = true;
       }
 

package/mixins/resource-table-watch.js

@@ -0,0 +1,45 @@
+import { STEVE_WATCH_MODE } from '@shell/types/store/subscribe.types';
+
+// This is functionality used to stop or start sockets used to watch resources in the vai world.
+// Currently disabled via (non-public) perf setting
+// See https://github.com/rancher/dashboard/issues/14359 for long term plan
+
+export default {
+  props: {
+    schema: {
+      type:    Object,
+      default: null,
+    },
+  },
+
+  data() {
+    // Note - does not cover anything fetched by secondary / page functions
+    const watchOpts = this.schema?.id ? {
+      type: this.schema.id,
+      mode: STEVE_WATCH_MODE.RESOURCE_CHANGES
+      // Note - we don't restrict watch by namespace (would involve unwatch, request, watch with new revision on every change to ns filter)
+    } : undefined;
+
+    return { watchOpts };
+  },
+
+  computed: {
+    watching() {
+      return this.$store.getters[`${ this.inStore }/watchStarted`](this.watchOpts);
+    },
+  },
+
+  methods: {
+    toggleWatch(toggle) {
+      if (toggle) {
+        // Assume there's a gap between cache and reality, to restart watch with something that will make a new http request to refresh it
+        this.$store.dispatch(`${ this.inStore }/resyncWatch`, {
+          ...this.watchOpts,
+          resourceType: this.watchOpts?.type
+        });
+      } else {
+        this.$store.dispatch(`${ this.inStore }/unwatch`, this.watchOpts);
+      }
+    }
+  }
+};

package/models/__tests__/chart.test.ts

@@ -0,0 +1,273 @@
+import Chart from '@shell/models/chart';
+import { APP_UPGRADE_STATUS } from '@shell/store/catalog';
+import { CATALOG as CATALOG_ANNOTATIONS } from '@shell/config/labels-annotations';
+
+const base = {
+  chartName:       'my-app',
+  repoName:        'my-repo',
+  repoNameDisplay: 'My Repo',
+  versions:        [
+    {
+      version: '1.3.0', home: 'https://example.com', created: '2024-03-10T12:00:00Z'
+    },
+    { version: '1.2.3', home: 'https://example.com' }
+  ],
+  categories: [],
+  tags:       [],
+  deprecated: false
+};
+
+function makeInstalledApp(upgradeAvailable = APP_UPGRADE_STATUS.NO_UPGRADE) {
+  return {
+    spec: {
+      chart: {
+        metadata: {
+          name:        'my-app',
+          version:     '1.3.0',
+          home:        'https://example.com',
+          annotations: { [CATALOG_ANNOTATIONS.SOURCE_REPO_NAME]: 'my-repo' }
+        }
+      }
+    },
+    upgradeAvailable
+  };
+}
+
+describe('class Chart', () => {
+  describe('matchingInstalledApps', () => {
+    it('matches by name, repo, and home in latest version', () => {
+      const installedApp = makeInstalledApp();
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.matchingInstalledApps).toHaveLength(1);
+    });
+
+    it('does not match if name is different', () => {
+      const installedApp = makeInstalledApp();
+
+      installedApp.spec.chart.metadata.name = 'different-app';
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.matchingInstalledApps).toHaveLength(0);
+    });
+
+    it('does not match if repo is different', () => {
+      const installedApp = makeInstalledApp();
+
+      installedApp.spec.chart.metadata.annotations[CATALOG_ANNOTATIONS.SOURCE_REPO_NAME] = 'different-repo';
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.matchingInstalledApps).toHaveLength(0);
+    });
+
+    it('matches by version+home when not latest', () => {
+      const installedApp = makeInstalledApp();
+
+      installedApp.spec.chart.metadata.version = '1.2.3'; // not the latest in base
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.matchingInstalledApps).toHaveLength(1);
+    });
+
+    it('can use fallback repo from metadata labels', () => {
+      const installedApp = makeInstalledApp();
+
+      installedApp.spec.chart.metadata.annotations = {}; // remove SOURCE_REPO_NAME
+      installedApp.metadata = { labels: { [CATALOG_ANNOTATIONS.CLUSTER_REPO_NAME]: 'my-repo' } };
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.matchingInstalledApps).toHaveLength(1);
+    });
+  });
+
+  describe('isInstalled', () => {
+    it('is true when one app matches', () => {
+      const installedApp = {
+        spec: {
+          chart: {
+            metadata: {
+              name:        'my-app',
+              version:     '1.2.3',
+              home:        'https://example.com',
+              annotations: { [CATALOG_ANNOTATIONS.SOURCE_REPO_NAME]: 'my-repo' }
+            }
+          }
+        }
+      };
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.isInstalled).toBe(true);
+    });
+
+    it('is false when no apps match', () => {
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [] } });
+
+      expect(chart.isInstalled).toBe(false);
+    });
+
+    it('is false when multiple apps match', () => {
+      const appTemplate = {
+        spec: {
+          chart: {
+            metadata: {
+              name:        'my-app',
+              version:     '1.2.3',
+              home:        'https://example.com',
+              annotations: { [CATALOG_ANNOTATIONS.SOURCE_REPO_NAME]: 'my-repo' }
+            }
+          }
+        }
+      };
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [appTemplate, appTemplate] } });
+
+      expect(chart.isInstalled).toBe(false);
+    });
+  });
+
+  describe('upgradeable', () => {
+    it('is true when installed and upgradeAvailable is SINGLE_UPGRADE', () => {
+      const installedApp = {
+        spec: {
+          chart: {
+            metadata: {
+              name:        'my-app',
+              version:     '1.2.3',
+              home:        'https://example.com',
+              annotations: { [CATALOG_ANNOTATIONS.SOURCE_REPO_NAME]: 'my-repo' }
+            }
+          }
+        },
+        upgradeAvailable: APP_UPGRADE_STATUS.SINGLE_UPGRADE
+      };
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.upgradeable).toBe(true);
+    });
+
+    it('is false if upgradeAvailable is different', () => {
+      const installedApp = {
+        spec: {
+          chart: {
+            metadata: {
+              name:        'my-app',
+              version:     '1.2.3',
+              home:        'https://example.com',
+              annotations: { [CATALOG_ANNOTATIONS.SOURCE_REPO_NAME]: 'my-repo' }
+            }
+          }
+        },
+        upgradeAvailable: APP_UPGRADE_STATUS.NO_UPGRADE
+      };
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      expect(chart.upgradeable).toBe(false);
+    });
+
+    it('is false when not installed', () => {
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [] } });
+
+      expect(chart.upgradeable).toBe(false);
+    });
+  });
+
+  describe('cardContent', () => {
+    it('includes correct subHeader and footer info', () => {
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [] } });
+
+      const result = chart.cardContent;
+
+      expect(result.subHeaderItems).toHaveLength(2);
+      expect(result.subHeaderItems[0].label).toBe('1.3.0');
+      expect(result.subHeaderItems[1].label).toBe('Mar 10, 2024');
+
+      expect(result.footerItems).toHaveLength(1);
+      expect(result.footerItems[0].labels).toContain('My Repo');
+
+      expect(result.statuses).toHaveLength(0);
+    });
+
+    it('includes category and tag items when present', () => {
+      const chart = new Chart({
+        ...base,
+        categories: ['database'],
+        tags:       ['linux', 'experimentl']
+      }, { rootGetters: { 'cluster/all': () => [] } });
+
+      const result = chart.cardContent;
+
+      expect(result.footerItems).toHaveLength(3);
+
+      const categoryItem = result.footerItems.find((i) => i.icon === 'icon-category-alt');
+
+      expect(categoryItem).toBeDefined();
+      expect(categoryItem.labels).toContain('database');
+
+      const tagItem = result.footerItems.find((i) => i.icon === 'icon-tag-alt');
+
+      expect(tagItem).toBeDefined();
+      expect(tagItem.labels).toStrictEqual(expect.arrayContaining(['linux', 'experimentl']));
+    });
+
+    it('includes deprecated status when deprecated is true', () => {
+      const chart = new Chart({ ...base, deprecated: true }, { rootGetters: { 'cluster/all': () => [] } });
+
+      const result = chart.cardContent;
+
+      const deprecatedStatus = result.statuses.find((s) => s.tooltip.key === 'generic.deprecated');
+
+      expect(deprecatedStatus).toBeDefined();
+      expect(deprecatedStatus.color).toBe('error');
+    });
+
+    it('includes installed status when app is installed', () => {
+      const installedApp = makeInstalledApp();
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      const result = chart.cardContent;
+
+      const installedStatus = result.statuses.find((s) => s.tooltip.key === 'generic.installed');
+
+      expect(installedStatus).toBeDefined();
+      expect(installedStatus.color).toBe('success');
+    });
+
+    it('includes upgradeable status when upgrade is available', () => {
+      const installedApp = makeInstalledApp(APP_UPGRADE_STATUS.SINGLE_UPGRADE);
+
+      const chart = new Chart(base, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      const result = chart.cardContent;
+
+      const upgradeableStatus = result.statuses.find((s) => s.tooltip.key === 'generic.upgradeable');
+
+      expect(upgradeableStatus).toBeDefined();
+      expect(upgradeableStatus.color).toBe('info');
+    });
+
+    it('shows all statuses together when all conditions are met', () => {
+      const installedApp = makeInstalledApp(APP_UPGRADE_STATUS.SINGLE_UPGRADE);
+
+      const chart = new Chart({ ...base, deprecated: true }, { rootGetters: { 'cluster/all': () => [installedApp] } });
+
+      const result = chart.cardContent;
+
+      const keys = result.statuses.map((s) => s.tooltip.key);
+
+      expect(keys).toStrictEqual(expect.arrayContaining([
+        'generic.deprecated',
+        'generic.upgradeable',
+        'generic.installed'
+      ]));
+    });
+  });
+});