@rancher/shell 3.0.2-rc.5 → 3.0.2

package/models/fleet.cattle.io.gitrepo.js

@@ -2,7 +2,7 @@ import { convert, matching, convertSelectorObj } from '@shell/utils/selector';
 import jsyaml from 'js-yaml';
 import isEmpty from 'lodash/isEmpty';
 import { escapeHtml } from '@shell/utils/string';
-import { FLEET } from '@shell/config/types';
+import { FLEET, MANAGEMENT } from '@shell/config/types';
 import { FLEET as FLEET_ANNOTATIONS } from '@shell/config/labels-annotations';
 import { addObject, addObjects, findBy, insertAt } from '@shell/utils/array';
 import { set } from '@shell/utils/object';
@@ -42,6 +42,10 @@ function normalizeStateCounts(data) {
 }
 
 export default class GitRepo extends SteveModel {
+  get currentUser() {
+    return this.$rootGetters['auth/v3User'] || {};
+  }
+
   applyDefaults() {
     const spec = this.spec || {};
     const meta = this.metadata || {};
@@ -68,7 +72,7 @@ export default class GitRepo extends SteveModel {
 
     insertAt(out, 0, {
       action:   'pause',
-      label:    'Pause',
+      label:    this.t('fleet.gitRepo.actions.pause.label'),
       icon:     'icon icon-pause',
       bulkable: true,
       enabled:  !!this.links.update && !this.spec?.paused
@@ -76,21 +80,38 @@ export default class GitRepo extends SteveModel {
 
     insertAt(out, 1, {
       action:   'unpause',
-      label:    'Unpause',
+      label:    this.t('fleet.gitRepo.actions.unpause.label'),
       icon:     'icon icon-play',
       bulkable: true,
       enabled:  !!this.links.update && this.spec?.paused === true
     });
 
     insertAt(out, 2, {
-      action:   'forceUpdate',
-      label:    'Force Update',
-      icon:     'icon icon-refresh',
+      action:   'enablePolling',
+      label:    this.t('fleet.gitRepo.actions.enablePolling.label'),
+      icon:     'icon icon-endpoints_connected',
       bulkable: true,
-      enabled:  !!this.links.update
+      enabled:  !!this.links.update && !!this.spec?.disablePolling
     });
 
-    insertAt(out, 3, { divider: true });
+    insertAt(out, 3, {
+      action:   'disablePolling',
+      label:    this.t('fleet.gitRepo.actions.disablePolling.label'),
+      icon:     'icon icon-endpoints_disconnected',
+      bulkable: true,
+      enabled:  !!this.links.update && !this.spec?.disablePolling
+    });
+
+    insertAt(out, 4, {
+      action:     'forceUpdate',
+      label:      this.t('fleet.gitRepo.actions.forceUpdate.label'),
+      icon:       'icon icon-refresh',
+      bulkable:   true,
+      bulkAction: 'forceUpdateBulk',
+      enabled:    !!this.links.update
+    });
+
+    insertAt(out, 5, { divider: true });
 
     return out;
   }
@@ -105,13 +126,42 @@ export default class GitRepo extends SteveModel {
     this.save();
   }
 
-  forceUpdate() {
-    const now = this.spec.forceSyncGeneration || 1;
+  enablePolling() {
+    this.spec.disablePolling = false;
+    this.save();
+  }
 
-    this.spec.forceSyncGeneration = now + 1;
+  disablePolling() {
+    this.spec.disablePolling = true;
     this.save();
   }
 
+  goToClone() {
+    if (this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_ID]) {
+      delete this.metadata.labels[FLEET_ANNOTATIONS.CREATED_BY_USER_ID];
+    }
+
+    if (this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME]) {
+      delete this.metadata.labels[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME];
+    }
+
+    super.goToClone();
+  }
+
+  forceUpdate(resources = [this]) {
+    this.$dispatch('promptModal', {
+      componentProps: { repositories: resources },
+      component:      'GitRepoForceUpdateDialog'
+    });
+  }
+
+  forceUpdateBulk(resources) {
+    this.$dispatch('promptModal', {
+      componentProps: { repositories: resources },
+      component:      'GitRepoForceUpdateDialog'
+    });
+  }
+
   get state() {
     if (this.spec?.paused === true) {
       return 'paused';
@@ -326,47 +376,32 @@ export default class GitRepo extends SteveModel {
   }
 
   get bundles() {
-    return this.$getters['matching'](FLEET.BUNDLE, { 'fleet.cattle.io/repo-name': this.name }, this.namespace);
+    return this.$getters['matching'](FLEET.BUNDLE, { [FLEET_ANNOTATIONS.REPO_NAME]: this.name }, this.namespace);
   }
 
   get bundleDeployments() {
-    const bds = this.$getters['all'](FLEET.BUNDLE_DEPLOYMENT);
-
-    return bds.filter((bd) => bd.metadata?.labels?.['fleet.cattle.io/repo-name'] === this.name);
+    return this.$getters['matching'](FLEET.BUNDLE_DEPLOYMENT, { [FLEET_ANNOTATIONS.REPO_NAME]: this.name });
   }
 
   get allBundlesStatuses() {
-    const bundleDeploymentCountsPerBundle = this.bundleDeployments.reduce((acc, bd) => {
-      const bundleId = FleetUtils.bundleIdFromBundleDeploymentLabels(bd.metadata?.labels);
-      const state = mapStateToEnum(FleetUtils.bundleDeploymentState(bd));
-
-      if (!acc[bundleId]) {
-        acc[bundleId] = {
-          total:  0,
-          states: { [STATES_ENUM.READY]: 0 },
-        };
-      }
-      acc[bundleId].total++;
-
-      if (!acc[bundleId].states[state]) {
-        acc[bundleId].states[state] = 0;
+    return this.bundles.reduce((acc, bundle) => {
+      if (isEmpty(bundle.status?.summary)) {
+        return acc;
       }
-      acc[bundleId].states[state]++;
 
-      return acc;
-    }, {});
-    const bundleIds = Object.keys(bundleDeploymentCountsPerBundle);
+      const { nonReadyResources, ...summary } = bundle.status?.summary;
 
-    return bundleIds.reduce((acc, bundleId) => {
-      const state = primaryDisplayStatusFromCount(bundleDeploymentCountsPerBundle[bundleId].states);
+      const bdCounts = normalizeStateCounts(summary);
+      const state = primaryDisplayStatusFromCount(bdCounts.states);
 
       if (!acc.states[state]) {
         acc.states[state] = 0;
       }
       acc.states[state]++;
+      acc.total++;
 
       return acc;
-    }, { total: bundleIds.length, states: { [STATES_ENUM.READY]: 0 } } );
+    }, { total: 0, states: { [STATES_ENUM.READY]: 0 } } );
   }
 
   get allResourceStatuses() {
@@ -378,91 +413,79 @@ export default class GitRepo extends SteveModel {
       return {};
     }
 
-    return this.bundleDeployments
-      .filter((bd) => FleetUtils.clusterIdFromBundleDeploymentLabels(bd.metadata?.labels) === clusterId)
-      .map((bd) => FleetUtils.resourcesFromBundleDeploymentStatus(bd.status))
-      .flat()
-      .map((r) => r.state)
-      .reduce((prev, state) => {
-        if (!prev[state]) {
-          prev[state] = 0;
-        }
-        prev[state]++;
-        prev.desiredReady++;
-
-        return prev;
-      }, { desiredReady: 0 });
+    return this.status?.perClusterResourceCounts[clusterId] || { desiredReady: 0 };
   }
 
   get resourcesStatuses() {
-    const bundleDeployments = this.bundleDeployments || [];
+    if (isEmpty(this.status?.resources)) {
+      return [];
+    }
+
     const clusters = (this.targetClusters || []).reduce((res, c) => {
       res[c.id] = c;
 
       return res;
     }, {});
+    const resources = this.status?.resources?.reduce((acc, resourceInfo) => {
+      const { perClusterState, ...resource } = resourceInfo;
 
-    const out = [];
-
-    for (const bd of bundleDeployments) {
-      const clusterId = FleetUtils.clusterIdFromBundleDeploymentLabels(bd.metadata?.labels);
-      const c = clusters[clusterId];
-
-      if (!c) {
-        continue;
-      }
-
-      const resources = FleetUtils.resourcesFromBundleDeploymentStatus(bd.status);
-
-      resources.forEach((r) => {
-        const id = FleetUtils.resourceId(r);
-        const type = FleetUtils.resourceType(r);
-        const state = r.state;
-
-        const color = colorForState(state).replace('text-', 'bg-');
-        const display = stateDisplay(state);
-
-        const detailLocation = {
-          name:   `c-cluster-product-resource${ r.namespace ? '-namespace' : '' }-id`,
-          params: {
-            product:   NAME,
-            cluster:   c.metadata.labels[FLEET_ANNOTATIONS.CLUSTER_NAME], // explorer uses the "management" Cluster name, which differs from the Fleet Cluster name
-            resource:  type,
-            namespace: r.namespace,
-            id:        r.name,
-          }
-        };
-
-        const key = `${ c.id }-${ type }-${ r.namespace }-${ r.name }`;
-
-        out.push({
-          key,
-          tableKey: key,
-
-          // Needed?
-          id,
-          type,
-          clusterId: c.id,
-
-          // columns, see FleetResources.vue
-          state:             mapStateToEnum(state),
-          clusterName:       c.nameDisplay,
-          apiVersion:        r.apiVersion,
-          kind:              r.kind,
-          name:              r.name,
-          namespace:         r.namespace,
-          creationTimestamp: r.createdAt,
-
-          // other properties
-          stateBackground: color,
-          stateDisplay:    display,
-          stateSort:       stateSort(color, display),
-          detailLocation,
+      Object.entries(perClusterState).forEach(([state, clusterIds]) => {
+        clusterIds.filter((id) => !!clusters[id]).forEach((clusterId) => {
+          acc.push(Object.assign({}, resource, { clusterId, state }));
         });
       });
-    }
 
-    return out;
+      return acc;
+    }, []);
+
+    return resources.map((r) => {
+      const {
+        namespace, name, clusterId, state
+      } = r;
+      const id = FleetUtils.resourceId(r);
+      const type = FleetUtils.resourceType(r);
+      const c = clusters[clusterId];
+
+      const color = colorForState(state).replace('text-', 'bg-');
+      const display = stateDisplay(state);
+
+      const detailLocation = state !== STATES_ENUM.MISSING ? {
+        name:   `c-cluster-product-resource${ r.namespace ? '-namespace' : '' }-id`,
+        params: {
+          product:  NAME,
+          cluster:  c.metadata.labels[FLEET_ANNOTATIONS.CLUSTER_NAME], // explorer uses the "management" Cluster name, which differs from the Fleet Cluster name
+          resource: type,
+          namespace,
+          id:       name,
+        }
+      } : undefined;
+
+      const key = `${ clusterId }-${ type }-${ namespace }-${ name }`;
+
+      return {
+        key,
+        tableKey: key,
+
+        // Needed?
+        id,
+        type,
+        clusterId,
+
+        // columns, see FleetResources.vue
+        state:       mapStateToEnum(state),
+        clusterName: c.nameDisplay,
+        apiVersion:  r.apiVersion,
+        kind:        r.kind,
+        name:        r.name,
+        namespace:   r.namespace,
+
+        // other properties
+        stateBackground: color,
+        stateDisplay:    display,
+        stateSort:       stateSort(color, display),
+        detailLocation,
+      };
+    });
   }
 
   get clusterInfo() {
@@ -485,4 +508,41 @@ export default class GitRepo extends SteveModel {
   get clustersList() {
     return this.$getters['all'](FLEET.CLUSTER);
   }
+
+  get authorId() {
+    return this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_ID];
+  }
+
+  get author() {
+    if (this.authorId) {
+      return this.$rootGetters['management/byId'](MANAGEMENT.USER, this.authorId);
+    }
+
+    return null;
+  }
+
+  get createdBy() {
+    const displayName = this.metadata?.labels?.[FLEET_ANNOTATIONS.CREATED_BY_USER_NAME];
+
+    if (!displayName) {
+      return null;
+    }
+
+    return {
+      displayName,
+      location: !this.author ? null : {
+        name:   'c-cluster-product-resource-id',
+        params: {
+          cluster:  '_',
+          product:  'auth',
+          resource: MANAGEMENT.USER,
+          id:       this.author.id,
+        }
+      }
+    };
+  }
+
+  get showCreatedBy() {
+    return !!this.createdBy;
+  }
 }

package/models/management.cattle.io.fleetworkspace.js

@@ -83,4 +83,8 @@ export default class Workspace extends HybridModel {
 
     await norman.remove();
   }
+
+  get confirmRemove() {
+    return true;
+  }
 }

package/models/management.cattle.io.kontainerdriver.js

@@ -29,6 +29,13 @@ export const KONTAINER_TO_DRIVER = {
   opentelekomcloudcontainerengine:  'otccce',
 };
 
+// Legacy KEV1 Hosted cluster drivers
+export const KEV1 = [
+  'amazonelasticcontainerservice',
+  'azurekubernetesservice',
+  'googlekubernetesengine',
+];
+
 // And the Import page has even shorter ones that don't match kontainer or create...
 export const DRIVER_TO_IMPORT = {
   googlegke: 'gke',

package/models/nodedriver.js

@@ -3,7 +3,10 @@ import Driver from '@shell/models/driver';
 /**
  * Overrides for spec.addCloudCredential
  */
-export const CLOUD_CREDENTIAL_OVERRIDE = { nutanix: true };
+export const CLOUD_CREDENTIAL_OVERRIDE = {
+  nutanix: true,
+  oci:     true
+};
 
 export default class NodeDriver extends Driver {
   get doneRoute() {

package/models/provisioning.cattle.io.cluster.js

@@ -10,6 +10,7 @@ import { compare } from '@shell/utils/version';
 import { AS, MODE, _VIEW, _YAML } from '@shell/config/query-params';
 import { HARVESTER_NAME as HARVESTER } from '@shell/config/features';
 import { CAPI as CAPI_ANNOTATIONS, NODE_ARCHITECTURE } from '@shell/config/labels-annotations';
+import { KEV1 } from '@shell/models/management.cattle.io.kontainerdriver';
 
 /**
  * Class representing Cluster resource.
@@ -180,6 +181,15 @@ export default class ProvCluster extends SteveModel {
 
     const all = actions.concat(out);
 
+    // If the cluster is a KEV1 cluster then prevent edit
+    if (this.isKev1) {
+      const edit = all.find((action) => action.action === 'goToEdit');
+
+      if (edit) {
+        edit.enabled = false;
+      }
+    }
+
     // If we have a helper that wants to modify the available actions, let it do it
     if (this.customProvisionerHelper?.availableActions) {
       // Provider can either modify the provided list or return one of its own
@@ -189,6 +199,15 @@ export default class ProvCluster extends SteveModel {
     return all;
   }
 
+  get detailLocation() {
+    // Prevent going to detail page for a KEV1 cluster
+    if (this.isKev1) {
+      return undefined;
+    }
+
+    return super.detailLocation;
+  }
+
   get normanCluster() {
     const name = this.status?.clusterName;
 
@@ -289,6 +308,11 @@ export default class ProvCluster extends SteveModel {
     return this.mgmt?.isLocal;
   }
 
+  // Is the cluster a legacy (unsupported) KEV1 cluster?
+  get isKev1() {
+    return KEV1.includes(this.mgmt?.spec?.genericEngineConfig?.driverName);
+  }
+
   get isImported() {
     if (this.isLocal) {
       return false;

package/models/secret.js

@@ -51,7 +51,7 @@ export default class Secret extends SteveModel {
 
   // For Fleet SSH secrets - does the secret have the 'known_hosts' data key?
   get supportsSshKnownHosts() {
-    return this._type === TYPES.SSH && 'known_hosts' in this.data;
+    return this._type === TYPES.SSH && !!this.data && 'known_hosts' in this.data;
   }
 
   get issuer() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rancher/shell",
-  "version": "3.0.2-rc.5",
+  "version": "3.0.2",
   "description": "Rancher Dashboard Shell",
   "repository": "https://github.com/rancherlabs/dashboard",
   "license": "Apache-2.0",
@@ -79,13 +79,13 @@
     "element-matches": "^0.1.2",
     "entities": "4.5.0",
     "eslint-config-standard": "16.0.3",
-    "eslint-import-resolver-node": "0.3.4",
+    "eslint-import-resolver-node": "0.3.9",
     "eslint-module-utils": "2.6.1",
     "eslint-plugin-cypress": "2.12.1",
     "eslint-plugin-import": "2.31.0",
     "eslint-plugin-jest": "24.4.0",
     "eslint-plugin-n": "15.2.0",
-    "eslint-plugin-vue": "9.10.0",
+    "eslint-plugin-vue": "9.32.0",
     "eslint": "7.32.0",
     "event-target-shim": "5.0.1",
     "express": "4.17.1",
@@ -101,7 +101,7 @@
     "jexl": "2.3.0",
     "jest": "27.5.1",
     "jquery": "3.5.1",
-    "js-cookie": "2.2.1",
+    "js-cookie": "3.0.5",
     "js-yaml-loader": "1.2.2",
     "js-yaml": "4.1.0",
     "jsdiff": "1.1.1",
@@ -170,4 +170,4 @@
       ".vue"
     ]
   }
-}
+}

package/pages/auth/login.vue

@@ -30,7 +30,6 @@ import {
 } from '@shell/config/private-label';
 import loadPlugins from '@shell/plugins/plugin';
 import Loading from '@shell/components/Loading';
-import { getGlobalBannerFontSizes } from '@shell/utils/banners';
 import { HARVESTER_NAME as HARVESTER } from '@shell/config/features';
 
 export default {
@@ -105,6 +104,10 @@ export default {
         return this.t('login.clientError');
       } else if (this.err === LOGIN_ERRORS.CLIENT || this.err === LOGIN_ERRORS.SERVER) {
         return this.t('login.error');
+      } else if (this.err === LOGIN_ERRORS.NONCE) {
+        return this.t('login.invalidResponseError');
+      } else if (this.err === LOGIN_ERRORS.USER_UNAUTHORIZED) {
+        return this.t('login.userUnauthorized');
       }
 
       return this.err?.length ? this.t('login.specificError', { msg: this.err }) : '';
@@ -129,13 +132,6 @@ export default {
     hasLoginMessage() {
       return this.errorToDisplay || this.loggedOut || this.timedOut;
     },
-
-    // Apply bottom margin so that the locale secletor control lifts up to avoid the footer fixed banner, if it is shown
-    localeSelectorStyle() {
-      const globalBannerSettings = getGlobalBannerFontSizes(this.$store);
-
-      return { marginBottom: globalBannerSettings?.footerFont };
-    }
   },
 
   async fetch() {
@@ -433,7 +429,6 @@ export default {
               <div class="mb-20">
                 <LabeledInput
                   v-if="!firstLogin"
-                  id="username"
                   ref="username"
                   v-model:value.trim="username"
                   data-testid="local-login-username"
@@ -443,7 +438,6 @@ export default {
               </div>
               <div class="">
                 <Password
-                  id="password"
                   ref="password"
                   v-model:value="password"
                   data-testid="local-login-password"
@@ -507,7 +501,6 @@ export default {
           class="locale-selector"
         >
           <LocaleSelector
-            :style="localeSelectorStyle"
             mode="login"
           />
         </div>
@@ -524,6 +517,7 @@ export default {
 <style lang="scss" scoped>
   .login {
     overflow: hidden;
+    position: relative;  // Used to keep the locale selector positioned correctly
 
     .row {
       align-items: center;

package/pages/auth/verify.vue

@@ -5,9 +5,12 @@ import {
 import { get } from '@shell/utils/object';
 import { base64Decode } from '@shell/utils/crypto';
 import loadPlugins from '@shell/plugins/plugin';
+import { LOGIN_ERRORS } from '@shell/store/auth';
 
 const samlProviders = ['ping', 'adfs', 'keycloak', 'okta', 'shibboleth'];
 
+const oauthProviders = ['github', 'googleoauth', 'azuread'];
+
 function reply(err, code) {
   try {
     window.opener.window.onAuthTest(err, code);
@@ -114,7 +117,14 @@ export default {
         this.$router.replace(`/auth/login?err=${ escape(res) }`);
       }
     } catch (err) {
-      this.$router.replace(`/auth/login?err=${ escape(err) }`);
+      let errCode = err;
+
+      // If the provider is OAUTH, then the client error is not that the credentials are wrong, but that the user is not authorized
+      if (oauthProviders.includes(provider) && err === LOGIN_ERRORS.CLIENT_UNAUTHORIZED) {
+        errCode = LOGIN_ERRORS.USER_UNAUTHORIZED;
+      }
+
+      this.$router.replace(`/auth/login?err=${ escape(errCode) }`);
     }
   },
 

package/pages/c/_cluster/apps/charts/index.vue

@@ -58,12 +58,14 @@ export default {
       showHidden:      null,
       chartOptions:    [
         {
-          label: 'Browse',
-          value: 'browse',
+          label:     this.t('catalog.charts.browseBtn'),
+          value:     'browse',
+          ariaLabel: this.t('catalog.charts.browseAriaLabel')
         },
         {
-          label: 'Featured',
-          value: 'featured'
+          label:     this.t('catalog.charts.featuredBtn'),
+          value:     'featured',
+          ariaLabel: this.t('catalog.charts.featuredAriaLabel')
         }
       ]
     };

package/pages/c/_cluster/apps/charts/install.vue

@@ -502,7 +502,7 @@ export default {
     },
 
     charts() {
-      const current = this.existing?.matchingChart(true);
+      const current = this.existing?.matchingCharts(true)[0];
 
       const out = this.$store.getters['catalog/charts'].filter((x) => {
         if ( x.key === current?.key || x.chartName === current?.chartName ) {

package/pages/c/_cluster/explorer/ConfigBadge.vue

@@ -27,16 +27,14 @@ export default {
   <div class="config-badge">
     <div>
       <button
+        v-clean-tooltip="{content: tooltip, triggers: ['hover', 'touch', 'focus'] }"
+        v-stripped-aria-label="tooltip"
         class="badge-install btn btn-sm role-secondary"
         data-testid="add-custom-cluster-badge"
         role="button"
-        tabindex="0"
         @click="customBadgeDialog"
       >
-        <i
-          v-clean-tooltip="tooltip"
-          class="icon icon-brush-icon"
-        />
+        <i class="icon icon-brush-icon" />
       </button>
     </div>
   </div>

package/pages/c/_cluster/explorer/EventsTable.vue

@@ -35,7 +35,7 @@ export default {
 
     const schema = this.$store.getters['cluster/schemaFor'](EVENT);
 
-    const paginationHeaders = [
+    const paginationHeaders = schema ? [
       reason,
       STEVE_EVENT_OBJECT,
       MESSAGE,
@@ -49,7 +49,7 @@ export default {
         defaultSort: true,
       },
       headerFromSchemaColString('Count', schema, this.$store.getters, true),
-    ];
+    ] : [];
 
     return {
       schema,
@@ -88,6 +88,7 @@ export default {
 
 <template>
   <PaginatedResourceTable
+    v-if="!!schema"
     :schema="schema"
     :headers="eventHeaders"
     :pagination-headers="paginationHeaders"