@rancher/shell 0.3.11 → 0.3.12

package/assets/translations/en-us.yaml

@@ -1274,9 +1274,6 @@ cluster:
         label: KubeconfigContent
       placeholder: 'Namespace/Name'
       cluster: Imported Harvester Cluster
-      affinity:
-        namespaces:
-          placeholder: e.g. default,system,base
       installGuestAgent: Install guest agent
   description:
     label: Cluster Description
@@ -3994,12 +3991,14 @@ plugins:
     builtin: Built-in
     experimental: Experimental
     third-party: Third-Party
+    image: Image
     installing: Installing ...
     uninstalling: Uninstalling ...
   descriptions:
     experimental: This Extension is marked as experimental
     third-party: This Extension is provided by a Third-Party
     built-in: This Extension is built-in
+    image: This Extension Image has been loaded manually
   error:
     title: Error loading extension
     message: Could not load extension code
@@ -4029,12 +4028,53 @@ plugins:
     available: No Extensions available
     installed: No Extensions installed
     updates: No updates available for installed Extensions
+    images: No Extension Images installed
   loadError: An error occurred loading the code for this extension
   helmError: "An error occurred installing the extension via Helm"
   manageRepos: Manage Repositories
+  manageCharts: Manage Extension Charts
+  manageCatalog:
+    label: Manage Extension Catalogs
+    title: Extension
+    subtitle: Catalogs
+    imageLoad:
+      load: Import Extension Catalog
+      prompt: An Extension Catalog contains extension assets bundled into an image, importing will take the image and host a Helm repository to act as a catalog for custom built Extensions. 
+      fields:
+        image:
+          label: Catalog Image Reference
+          placeholder: "e.g. hub.docker.io/example-org/my-image:latest"
+        secrets:
+          banner: "If the registry that hosts the Catalog Image requires Pull Secrets, they must be created in the following namespace:<pre>cattle-ui-plugin-system</pre>"
+      banner: This will create an Deployment, Service, and Helm repository to serve the extension charts. 
+      imageVersion:
+        title: Image Version Not Found
+        message: Unable to determine image version from {image}, defaulting to latest
+      error:
+        exists:
+          deployment:
+            title: Deployment Conflict
+            message: A container with the image {image} already exists
+          service:
+            title: Service Conflict
+            message: A service with the name {svc} already exists
+          repo:
+            title: Helm Repository Conflict
+            message: A repository with the name {repo} already exists
+      success:
+        title: "Imported Extension Catalog from: {name}"
+        message: Extension Catalog image was imported successfully
+    headers:
+      image:
+        name: images
+        label: Deployment Image
+      cacheState:
+        name: cacheState
+        label: Cache State
   tabs:
     all: All
     available: Available
+    images: Images
     installed: Installed
     updates: Updates
   title: Extensions
@@ -4057,6 +4097,7 @@ plugins:
     label: Uninstall
     title: "Uninstall Extension: {name}"
     prompt: "Are you sure that you want to uninstall this Extension?"
+    custom: "Are you sure that you want to uninstall this Extension Image? This will also remove any Extensions provided by this image."
   upgradeAvailable: A newer version of this Extension is available
   reload: Extensions changed - reload required
   safeMode:
@@ -6349,8 +6390,13 @@ typeLabel:
     }
   management.cattle.io.clusterroletemplatebinding: |-
     {count, plural,
-      one { Cluster Member }
-      other { Cluster Members }
+      one { Cluster Membership }
+      other { Cluster Memberships }
+    }
+  projectroletemplatebinding: |-
+    {count, plural,
+      one { Project Membership }
+      other { Project Memberships }
     }
   management.cattle.io.feature: |-
     {count, plural,

package/chart/monitoring/StorageClassSelector.vue

@@ -2,6 +2,7 @@
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
+  name:       'StorageClassSelector',
   components: { LabeledSelect },
   props:      {
     options: {

package/chart/monitoring/index.vue

@@ -176,6 +176,10 @@ export default {
       const selector =
         prometheusSpec?.storageSpec?.volumeClaimTemplate?.spec?.selector;
 
+      // This works for UI editor installation
+      // However, it doesn't work for yaml editor installation
+      // Global values later merged again in charts/install.vue addGlobalValuesTo()
+      // We still need to remove the global values from charts/install.vue addGlobalValuesTo()
       if (
         selector &&
         isEmpty(selector.matchExpressions) &&

package/chart/monitoring/prometheus/index.vue

@@ -72,7 +72,7 @@ export default {
         let matchExpressions;
 
         if (selector && selector?.matchExpressions) {
-          matchExpressions = convert((selector?.matchLabels || {}), selector.matchExpressions);
+          matchExpressions = convert((selector?.matchLabels || {}), selector?.matchExpressions);
 
           return matchExpressions;
         } else {
@@ -154,7 +154,6 @@ export default {
             spec: {
               accessModes: ['ReadWriteOnce'],
               resources:   { requests: { storage: '50Gi' } },
-              selector:    { matchExpressions: [], matchLabels: {} },
             }
           }
         );
@@ -311,6 +310,7 @@ export default {
         <div class="col span-6">
           <Checkbox
             v-model="enablePersistentStorage"
+            data-testid="checkbox-chart-enable-persistent-storage"
             :label="t('monitoring.prometheus.storage.label')"
           />
         </div>
@@ -325,7 +325,10 @@ export default {
             />
           </div>
           <div class="col span-6">
-            <div v-if="showStorageClasses">
+            <div
+              v-if="showStorageClasses"
+              data-testid="select-chart-prometheus-storage-class"
+            >
               <StorageClassSelector
                 :mode="mode"
                 :options="storageClasses"

package/components/ActionMenu.vue

@@ -60,7 +60,7 @@ export default {
     customTargetEvent: {
       // The event details from the user's click can be used
       // for positioning the menu on the page.
-      type:    PointerEvent,
+      type:    [PointerEvent, MouseEvent],
       default: null
     },
 

package/components/DetailTop.vue

@@ -6,8 +6,6 @@ import { _VIEW } from '@shell/config/query-params';
 import { ExtensionPoint, PanelLocation } from '@shell/core/types';
 import ExtensionPanel from '@shell/components/ExtensionPanel';
 
-export const SEPARATOR = { separator: true };
-
 export default {
   components: {
     DetailText, Tag, ExtensionPanel

package/components/ExplorerMembers.vue

@@ -186,17 +186,25 @@ export default {
 
       // We need to group each of the TemplateRoleBindings by the user + project
       const userRoles = [...fakeRows, ...this.filteredProjectRoleTemplateBindings].reduce((rows, curr) => {
-        const { userId, roleTemplate, projectId } = curr;
+        const {
+          userId, groupPrincipalId, roleTemplate, projectId
+        } = curr;
 
-        const userKey = userId + projectId;
+        const userOrGroup = userId || groupPrincipalId;
 
-        if (!rows[userKey] && userId ) {
-          rows[userKey] = curr;
-          rows[userKey].allRoles = [];
+        if (!userOrGroup) {
+          return rows;
         }
 
-        if (roleTemplate && userId) {
-          rows[userKey].allRoles.push(curr.roleTemplate);
+        const userOrGroupKey = userOrGroup + projectId;
+
+        if (!rows[userOrGroupKey] ) {
+          rows[userOrGroupKey] = curr;
+          rows[userOrGroupKey].allRoles = [];
+        }
+
+        if (roleTemplate) {
+          rows[userOrGroupKey].allRoles.push(curr.roleTemplate);
         }
 
         return rows;
@@ -242,9 +250,13 @@ export default {
     },
 
     getProjectRoleBinding(row, role) {
-      // Each row is a combination of user and project
+      // Each row is a combination of user/group and project
       // So find the specfic roleBindingTemplate corresponding to the specific role + project
-      return this.projectRoleTemplateBindings.find(r => r.roleTemplateId === role.id && r.userId === row.userId);
+      const userOrGroupKey = row.userId ? 'userId' : 'groupPrincipalId';
+
+      return this.projectRoleTemplateBindings.find((r) => {
+        return r.roleTemplateId === role.id && r[userOrGroupKey] === row[userOrGroupKey];
+      });
     },
 
     async removeRole(row, role, event) {
@@ -339,7 +351,7 @@ export default {
                 <button
                   v-if="canEditProjectMembers"
                   type="button"
-                  class="create-namespace btn btn-sm role-secondary mr-5 right"
+                  class="create-namespace btn btn-sm role-secondary mr-10 right"
                   @click="addProjectMember(group)"
                 >
                   {{ t('members.createActionLabel') }}

package/components/ExplorerProjectsNamespaces.vue

@@ -373,6 +373,7 @@ export default {
         <n-link
           :to="createNamespaceLocationFlatList()"
           class="btn role-primary mr-10"
+          data-testid="create_project_namespaces"
         >
           {{ t('projectNamespaces.createNamespace') }}
         </n-link>

package/components/GrafanaDashboard.vue

@@ -40,7 +40,7 @@ export default {
   },
   data() {
     return {
-      loading: false, error: false, interval: null, initialUrl: this.computeUrl(), errorTimer: null, monitoringVersion: null
+      loading: false, error: false, interval: null, errorTimer: null, monitoringVersion: null
     };
   },
   computed: {
@@ -242,7 +242,7 @@ export default {
       v-show="!error"
       ref="frame"
       :class="{loading, frame: true}"
-      :src="initialUrl"
+      :src="currentUrl"
       frameborder="0"
       scrolling="no"
     />

package/components/Inactivity.vue

@@ -134,6 +134,7 @@ export default {
     },
 
     unsubscribe() {
+      console.debug('Unsubscribing from all websocket events'); // eslint-disable-line no-console
       this.$store.dispatch('unsubscribe');
     },
     clearAllTimeouts() {

package/components/ModalWithCard.vue

@@ -66,6 +66,7 @@ export default {
     :height="height"
     v-bind="$attrs"
     class="modal"
+    data-testid="mvc__card"
   >
     <Card
       class="modal"

package/components/Tabbed/index.vue

@@ -239,10 +239,12 @@ export default {
         v-for="tab in sortedTabs"
         :id="tab.name"
         :key="tab.name"
+        :data-testid="tab.name"
         :class="{tab: true, active: tab.active, disabled: tab.disabled, error: (tab.error)}"
         role="presentation"
       >
         <a
+          :data-testid="`btn-${tab.name}`"
           :aria-controls="'#' + tab.name"
           :aria-selected="tab.active"
           role="tab"

package/components/Wizard.vue

@@ -400,7 +400,10 @@ export default {
             @close="errors.splice(idx, 1)"
           />
         </div>
-        <div class="controls-row pt-20">
+        <div
+          id="wizard-footer-controls"
+          class="controls-row pt-20"
+        >
           <slot
             name="cancel"
             :cancel="cancel"
@@ -468,7 +471,6 @@ $spacer: 10px;
   flex-direction: column;
   flex: 1;
   padding: 0;
-  height: 0;
   justify-content: flex-start;
 }
 
@@ -647,7 +649,6 @@ $spacer: 10px;
     overflow: hidden;
     display: flex;
     flex-direction: column;
-    height: 100%;
     flex: 1;
   }
 }

package/components/form/KeyValue.vue

@@ -246,7 +246,11 @@ export default {
     parseLinesFromFile: {
       default: false,
       type:    Boolean
-    }
+    },
+    disabled: {
+      default: false,
+      type:    Boolean
+    },
   },
   data() {
     const rows = this.getRows(this.value);
@@ -614,13 +618,14 @@ export default {
             :keyName="keyName"
             :valueName="valueName"
             :queueUpdate="queueUpdate"
+            :disabled="disabled"
           >
             <Select
               v-if="keyOptions"
               ref="key"
               v-model="row[keyName]"
               :searchable="true"
-              :disabled="isProtected(row.key)"
+              :disabled="disabled || isProtected(row.key)"
               :clearable="false"
               :taggable="keyTaggable"
               :options="calculateOptions(row[keyName])"
@@ -630,7 +635,7 @@ export default {
               v-else
               ref="key"
               v-model="row[keyName]"
-              :disabled="isView || !keyEditable || isProtected(row.key)"
+              :disabled="isView || disabled || !keyEditable || isProtected(row.key)"
               :placeholder="keyPlaceholder"
               @input="queueUpdate"
               @paste="onPaste(i, $event)"
@@ -672,7 +677,7 @@ export default {
               v-else-if="valueMultiline"
               v-model="row[valueName]"
               :class="{'conceal': valueConcealed}"
-              :disabled="isProtected(row.key)"
+              :disabled="disabled || isProtected(row.key)"
               :mode="mode"
               :placeholder="valuePlaceholder"
               :min-height="40"
@@ -682,7 +687,7 @@ export default {
             <input
               v-else
               v-model="row[valueName]"
-              :disabled="isView || isProtected(row.key)"
+              :disabled="isView || disabled || isProtected(row.key)"
               :type="valueConcealed ? 'password' : 'text'"
               :placeholder="valuePlaceholder"
               autocorrect="off"
@@ -717,7 +722,7 @@ export default {
           >
             <button
               type="button"
-              :disabled="isView || isProtected(row.key)"
+              :disabled="isView || isProtected(row.key) || disabled"
               class="btn role-link"
               @click="remove(i)"
             >
@@ -739,7 +744,7 @@ export default {
           v-if="addAllowed"
           type="button"
           class="btn role-tertiary add"
-          :disabled="loading || (keyOptions && filteredKeyOptions.length === 0)"
+          :disabled="loading || disabled || (keyOptions && filteredKeyOptions.length === 0)"
           @click="add()"
         >
           <i

package/components/form/NodeAffinity.vue

@@ -95,10 +95,36 @@ export default {
       const requiredDuringSchedulingIgnoredDuringExecution = { nodeSelectorTerms: [] };
       const preferredDuringSchedulingIgnoredDuringExecution = [] ;
 
-      this.allSelectorTerms.forEach((term) => {
+      this.allSelectorTerms.forEach((t) => {
+        const term = { ...t };
+
+        // the 'matching' field isn't part of the affinity spec: including this in the save request will cause a flood of errors that might cause the request to fail
+        // same deal with term.preference.weight
+        if (term.matchExpressions) {
+          term.matchExpressions = (term.matchExpressions || []).map((expression) => {
+            const out = { ...expression };
+
+            delete out.matching;
+
+            return out;
+          });
+        }
+
+        if (term.matchFields) {
+          term.matchFields = (term.matchFields || []).map((field) => {
+            const out = { ...field };
+
+            delete out.matching;
+
+            return out;
+          });
+        }
+
         if (term.weight) {
           const neu = { weight: term.weight, preference: term };
 
+          delete neu.preference.weight;
+
           preferredDuringSchedulingIgnoredDuringExecution.push(neu);
         } else {
           requiredDuringSchedulingIgnoredDuringExecution.nodeSelectorTerms.push(term);
@@ -144,12 +170,8 @@ export default {
           expressionsMatching[expression.matching || 'matchExpressions'].push(expression);
         });
 
-        if (expressionsMatching.matchFields.length) {
-          this.$set(row, 'matchFields', expressionsMatching.matchFields);
-        }
-        if (expressionsMatching.matchExpressions.length) {
-          this.$set(row, 'matchExpressions', expressionsMatching.matchExpressions);
-        }
+        this.$set(row, 'matchFields', expressionsMatching.matchFields);
+        this.$set(row, 'matchExpressions', expressionsMatching.matchExpressions);
 
         this.update();
       }

package/components/form/PodAffinity.vue

@@ -1,4 +1,5 @@
 <script>
+import { mapGetters } from 'vuex';
 import { _VIEW } from '@shell/config/query-params';
 import { get, set, isEmpty, clone } from '@shell/utils/object';
 import { POD, NODE, NAMESPACE } from '@shell/config/types';
@@ -69,6 +70,11 @@ export default {
       type:    Boolean
     },
 
+    overwriteLabels: {
+      type:    Object,
+      default: null
+    },
+
     loading: {
       default: false,
       type:    Boolean
@@ -131,6 +137,7 @@ export default {
     };
   },
   computed: {
+    ...mapGetters({ t: 'i18n/t' }),
     isView() {
       return this.mode === _VIEW;
     },
@@ -144,7 +151,7 @@ export default {
     },
 
     labeledInputNamespaceLabel() {
-      return this.removeLabeledInputNamespaceLabel ? '' : this.t('workload.scheduling.affinity.matchExpressions.inNamespaces');
+      return this.removeLabeledInputNamespaceLabel ? '' : this.overwriteLabels?.namespaceInputLabel || this.t('workload.scheduling.affinity.matchExpressions.inNamespaces');
     },
 
     allNamespacesOptions() {
@@ -185,6 +192,10 @@ export default {
     },
 
     namespaceSelectionLabels() {
+      if (this.overwriteLabels?.namespaceSelectionLabels) {
+        return this.overwriteLabels?.namespaceSelectionLabels;
+      }
+
       if (this.allNamespacesOptionAvailable) {
         return [
           this.t('workload.scheduling.affinity.thisPodNamespace'),
@@ -199,6 +210,14 @@ export default {
       ];
     },
 
+    addLabel() {
+      return this.overwriteLabels?.addLabel || this.t('podAffinity.addLabel');
+    },
+
+    topologyKeyPlaceholder() {
+      return this.overwriteLabels?.topologyKeyPlaceholder || this.t('workload.scheduling.affinity.topologyKey.placeholder');
+    },
+
     hasNamespaces() {
       return this.allNamespacesOptions.length;
     },
@@ -230,8 +249,9 @@ export default {
       this.allSelectorTerms.forEach((term) => {
         if (term._anti) {
           if (term.weight) {
-            const neu = { podAffinityTerm: term, weight: term.weight || this.defaultWeight };
+            const neu = { podAffinityTerm: { ...term }, weight: term.weight || this.defaultWeight };
 
+            delete neu.podAffinityTerm.weight;
             podAntiAffinity.preferredDuringSchedulingIgnoredDuringExecution.push(neu);
           } else {
             podAntiAffinity.requiredDuringSchedulingIgnoredDuringExecution.push(term);
@@ -340,7 +360,7 @@ export default {
         class="mt-20"
         :default-add-value="defaultAddValue"
         :mode="mode"
-        :add-label="t('podAffinity.addLabel')"
+        :add-label="addLabel"
         @remove="remove"
       >
         <template #default="props">
@@ -389,7 +409,7 @@ export default {
               :multiple="true"
               :taggable="true"
               :options="allNamespacesOptions"
-              :label="t('workload.scheduling.affinity.matchExpressions.inNamespaces')"
+              :label="labeledInputNamespaceLabel"
               :data-testid="`pod-affinity-namespace-select-index${props.i}`"
               @input="updateNamespaces(props.row.value, props.row.value.namespaces)"
             />
@@ -398,7 +418,7 @@ export default {
               v-model="props.row.value._namespaces"
               :mode="mode"
               :label="labeledInputNamespaceLabel"
-              :placeholder="t('cluster.credential.harvester.affinity.namespaces.placeholder')"
+              :placeholder="t('harvesterManager.affinity.namespaces.placeholder')"
               :data-testid="`pod-affinity-namespace-input-index${props.i}`"
               @input="updateNamespaces(props.row.value, props.row.value._namespaces)"
             />
@@ -424,7 +444,7 @@ export default {
                 :mode="mode"
                 required
                 :label="t('workload.scheduling.affinity.topologyKey.label')"
-                :placeholder="t('workload.scheduling.affinity.topologyKey.placeholder')"
+                :placeholder="topologyKeyPlaceholder"
                 :options="existingNodeLabels"
                 :disabled="mode==='view'"
                 :loading="loading"
@@ -436,7 +456,7 @@ export default {
                 v-model="props.row.value.topologyKey"
                 :mode="mode"
                 :label="t('workload.scheduling.affinity.topologyKey.label')"
-                :placeholder="t('workload.scheduling.affinity.topologyKey.placeholder')"
+                :placeholder="topologyKeyPlaceholder"
                 required
                 :data-testid="`pod-affinity-topology-input-index${props.i}`"
                 @input="update"

package/components/form/Taints.vue

@@ -20,6 +20,10 @@ export default {
     mode: {
       type:    String,
       default: _VIEW
+    },
+    disabled: {
+      default: false,
+      type:    Boolean
     }
   },
 
@@ -59,6 +63,7 @@ export default {
       :extra-columns="['effect']"
       :preserve-keys="['effect']"
       :add-label="t('labels.addTaint')"
+      :disabled="disabled"
     >
       <template #label:effect>
         {{ t('tableHeaders.effect') }}
@@ -68,6 +73,7 @@ export default {
         <Select
           v-model="row.effect"
           :options="effectOptions"
+          :disabled="disabled"
           class="compact-select"
           @input="queueUpdate"
         />

package/components/formatter/ExtensionCache.vue

@@ -0,0 +1,74 @@
+<script>
+import { BadgeState } from '@components/BadgeState';
+import { stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
+
+export default {
+  props: {
+    value: {
+      type:    String,
+      default: ''
+    }
+  },
+
+  components: { BadgeState },
+
+  data() {
+    const STATES = {
+      cached: {
+        color: 'info', icon: 'dot-open', label: 'Cached', compoundIcon: 'checkmark'
+      },
+      pending: {
+        color: 'warning', icon: 'tag', label: 'In Progress', compoundIcon: 'info'
+      },
+      disabled: {
+        color: 'error', icon: 'dot-half', label: 'Cache Disabled', compoundIcon: 'info'
+      },
+    };
+
+    return {
+      STATES,
+      stateDisplay:    '',
+      stateBackground: ''
+    };
+  },
+
+  watch: {
+    value: {
+      handler() {
+        const out = this.value || 'pending';
+        const color = this.colorForState(out);
+
+        this.stateDisplay = stateDisplay(out);
+        this.stateBackground = color.replace('text-', 'bg-');
+      },
+      immediate: true
+    }
+  },
+
+  methods: {
+    colorForState(state) {
+      const key = (state).toLowerCase();
+      let color;
+
+      if ( this.STATES[key] && this.STATES[key].color ) {
+        color = this.STATES[key].color;
+      }
+
+      if ( !color ) {
+        color = 'info';
+      }
+
+      return `text-${ color }`;
+    }
+  }
+};
+</script>
+
+<template>
+  <div>
+    <BadgeState
+      :color="stateBackground"
+      :label="stateDisplay"
+    />
+  </div>
+</template>

package/components/nav/Header.vue

@@ -478,6 +478,7 @@ export default {
 
           <button
             v-if="showKubeShell"
+            id="btn-kubectl"
             v-clean-tooltip="t('nav.shellShortcut', {key: shellShortcut})"
             v-shortkey="{windows: ['ctrl', '`'], mac: ['meta', '`']}"
             :disabled="!shellEnabled"