@rancher/shell 0.3.3 → 0.3.5

package/detail/provisioning.cattle.io.cluster.vue

@@ -11,6 +11,7 @@ import { CAPI, MANAGEMENT, NORMAN, SNAPSHOT } from '@shell/config/types';
 import {
   STATE, NAME as NAME_COL, AGE, AGE_NORMAN, INTERNAL_EXTERNAL_IP, STATE_NORMAN, ROLES, MACHINE_NODE_OS, MANAGEMENT_NODE_OS, NAME,
 } from '@shell/config/table-headers';
+import { STATES_ENUM } from '@shell/plugins/dashboard-store/resource-class';
 import CustomCommand from '@shell/edit/provisioning.cattle.io.cluster/CustomCommand';
 import AsyncButton from '@shell/components/AsyncButton.vue';
 import AnsiUp from 'ansi_up';
@@ -30,6 +31,7 @@ import Socket, {
 import { get } from '@shell/utils/object';
 import CapiMachineDeployment from '@shell/models/cluster.x-k8s.io.machinedeployment';
 import { isAlternate } from '@shell/utils/platform';
+import { defaultTableSortGenerationFn } from '@shell/components/ResourceTable.vue';
 
 let lastId = 1;
 const ansiup = new AnsiUp();
@@ -248,15 +250,33 @@ export default {
     },
 
     fakeMachines() {
+      const machineNameFn = (clusterName, machinePoolName) => `${ clusterName }-${ machinePoolName }`;
+
       // When we scale up, the quantity will change to N+1 - so from 0 to 1, the quantity changes,
       // but it takes tiem for the machine to appear, so the pool is empty, but if we just go off on a non-zero quqntity
       // then the pool would be hidden - so we find empty pool by checking the machines
       const emptyPools = (this.value.spec.rkeConfig?.machinePools || []).filter((mp) => {
-        const machinePrefix = `${ this.value.name }-${ mp.name }`;
+        const machineFullName = machineNameFn(this.value.name, mp.name);
+
         const machines = this.value.machines.filter((machine) => {
           const isElementalCluster = machine.spec?.infrastructureRef?.apiVersion.startsWith('elemental.cattle.io');
+          const machinePoolInfName = machine.spec?.infrastructureRef?.name;
+
+          if (isElementalCluster) {
+            return machinePoolInfName.includes(machineFullName);
+          }
+
+          // if labels exist, then the machineFullName must unequivocally be equal to manchineLabelFullName (based on labels)
+          const machineLabelClusterName = machine.metadata?.labels?.['cluster.x-k8s.io/cluster-name'];
+          const machineLabelPoolName = machine.metadata?.labels?.['rke.cattle.io/rke-machine-pool-name'];
+
+          if (machineLabelClusterName && machineLabelPoolName) {
+            const manchineLabelFullName = machineNameFn(machineLabelClusterName, machineLabelPoolName);
+
+            return machineFullName === manchineLabelFullName;
+          }
 
-          return !isElementalCluster ? machine.spec?.infrastructureRef?.name.startsWith(machinePrefix) : machine.spec?.infrastructureRef?.name.includes(machinePrefix);
+          return machinePoolInfName.startsWith(machineFullName);
         });
 
         return machines.length === 0;
@@ -335,7 +355,7 @@ export default {
     },
 
     showEksNodeGroupWarning() {
-      if ( this.value.provisioner === 'EKS' ) {
+      if ( this.value.provisioner === 'EKS' && this.value.state !== STATES_ENUM.ACTIVE) {
         const desiredTotal = this.value.eksNodeGroups.filter(g => g.desiredSize === 0);
 
         if ( desiredTotal.length === this.value.eksNodeGroups.length ) {
@@ -620,6 +640,26 @@ export default {
         return day(time).format(this.dateTimeFormatStr);
       }
     },
+
+    machineSortGenerationFn() {
+      // The sort generation function creates a unique value and is used to create a key including sort details.
+      // The unique key determines if the list is redrawn or a cached version is shown.
+      // Because we ensure the 'not in a pool' group is there via a row, and timing issues, the unqiue key doesn't change
+      // after a machine is added/removed... so the list won't update... so we need to inject a string to ensure the key is fresh
+      const base = defaultTableSortGenerationFn(this.machineSchema, this.$store);
+
+      return base + (!!this.fakeMachines.length ? '-fake' : '');
+    },
+
+    nodeSortGenerationFn() {
+      // The sort generation function creates a unique value and is used to create a key including sort details.
+      // The unique key determines if the list is redrawn or a cached version is shown.
+      // Because we ensure the 'not in a pool' group is there via a row, and timing issues, the unqiue key doesn't change
+      // after a machine is added/removed... so the list won't update... so we need to inject a string to ensure the key is fresh
+      const base = defaultTableSortGenerationFn(this.mgmtNodeSchema, this.$store);
+
+      return base + (!!this.fakeNodes.length ? '-fake' : '');
+    },
   }
 };
 </script>
@@ -663,6 +703,7 @@ export default {
           :group-by="value.isCustom ? null : 'poolId'"
           group-ref="pool"
           :group-sort="['pool.nameDisplay']"
+          :sort-generation-fn="machineSortGenerationFn"
         >
           <template #main-row:isFake="{fullColspan}">
             <tr class="main-row">
@@ -686,11 +727,11 @@ export default {
               >
                 <div
                   v-if="group && group.ref"
-                  v-html="group.ref.groupByPoolShortLabel"
+                  v-clean-html="group.ref.groupByPoolShortLabel"
                 />
                 <div
                   v-else
-                  v-html="t('resourceTable.groupLabel.notInANodePool')"
+                  v-clean-html="t('resourceTable.groupLabel.notInANodePool')"
                 />
                 <div
                   v-if="group.ref && group.ref.template"
@@ -747,6 +788,7 @@ export default {
           :group-by="value.isCustom ? null : 'spec.nodePoolName'"
           group-ref="pool"
           :group-sort="['pool.nameDisplay']"
+          :sort-generation-fn="nodeSortGenerationFn"
         >
           <template #main-row:isFake="{fullColspan}">
             <tr class="main-row">
@@ -770,11 +812,11 @@ export default {
               >
                 <div
                   v-if="group.ref"
-                  v-html="t('resourceTable.groupLabel.nodePool', { name: group.ref.spec.hostnamePrefix}, true)"
+                  v-clean-html="t('resourceTable.groupLabel.nodePool', { name: group.ref.spec.hostnamePrefix}, true)"
                 />
                 <div
                   v-else
-                  v-html="t('resourceTable.groupLabel.notInANodePool')"
+                  v-clean-html="t('resourceTable.groupLabel.notInANodePool')"
                 />
                 <div
                   v-if="group.ref && group.ref.nodeTemplate"
@@ -846,13 +888,13 @@ export default {
               >
                 <td
                   :key="line.id + '-time'"
+                  v-clean-html="format(line.time)"
                   class="time"
-                  v-html="format(line.time)"
                 />
                 <td
                   :key="line.id + '-msg'"
+                  v-clean-html="line.msg"
                   class="msg"
-                  v-html="line.msg"
                 />
               </tr>
             </template>
@@ -890,22 +932,22 @@ export default {
           @copied-windows="hasWindowsMachine ? null : showWindowsWarning = true"
         />
         <template v-else>
-          <h4 v-html="t('cluster.import.commandInstructions', null, true)" />
+          <h4 v-clean-html="t('cluster.import.commandInstructions', null, true)" />
           <CopyCode class="m-10 p-10">
             {{ clusterToken.command }}
           </CopyCode>
 
           <h4
+            v-clean-html="t('cluster.import.commandInstructionsInsecure', null, true)"
             class="mt-10"
-            v-html="t('cluster.import.commandInstructionsInsecure', null, true)"
           />
           <CopyCode class="m-10 p-10">
             {{ clusterToken.insecureCommand }}
           </CopyCode>
 
           <h4
+            v-clean-html="t('cluster.import.clusterRoleBindingInstructions', null, true)"
             class="mt-10"
-            v-html="t('cluster.import.clusterRoleBindingInstructions', null, true)"
           />
           <CopyCode class="m-10 p-10">
             {{ t('cluster.import.clusterRoleBindingCommand', null, true) }}

package/detail/workload/index.vue

@@ -108,8 +108,8 @@ export default {
   computed: {
     ...mapGetters(['currentCluster']),
 
-    isActive() {
-      return this.value.metadata.state.name === 'active';
+    isScalable() {
+      return this.value?.canUpdate;
     },
 
     isJob() {
@@ -335,7 +335,7 @@ export default {
         class="text-right"
         :label="t('tableHeaders.scale')"
         :value="value.spec.replicas"
-        :disabled="!isActive"
+        :disabled="!isScalable"
         @minus="scaleDown"
         @plus="scaleUp"
       />

package/dialog/AddClusterMemberDialog.vue

@@ -39,8 +39,8 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="t('addClusterMemberDialog.title')"
       class="text-default-text"
-      v-html="t('addClusterMemberDialog.title')"
     />
 
     <div

package/dialog/AddProjectMemberDialog.vue

@@ -63,7 +63,7 @@ export default {
     async principalProperty() {
       const principal = await this.principal;
 
-      return principal.principalType === 'group' ? 'groupPrincipalId' : 'userPrincipalId';
+      return principal?.principalType === 'group' ? 'groupPrincipalId' : 'userPrincipalId';
     },
 
     close() {
@@ -114,8 +114,8 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="t('addProjectMemberDialog.title')"
       class="text-default-text"
-      v-html="t('addProjectMemberDialog.title')"
     />
 
     <div

package/dialog/AddonConfigConfirmationDialog.vue

@@ -46,7 +46,7 @@ export default {
 
 <template>
   <Card
-    class="addon-config-confirmation"
+    class="prompt-restore"
     :show-highlight-border="false"
   >
     <h4
@@ -66,24 +66,36 @@ export default {
       slot="actions"
       class="bottom"
     >
-      <button
-        type="button"
-        class="btn role-secondary mr-10"
-        @click="close"
-      >
-        {{ t('generic.cancel') }}
-      </button>
-      <AsyncButton
-        mode="continue"
-        @click="apply"
-      />
+      <div class="buttons">
+        <button
+          type="button"
+          class="btn role-secondary mr-10"
+          @click="close"
+        >
+          {{ t('generic.cancel') }}
+        </button>
+        <AsyncButton
+          mode="continue"
+          @click="apply"
+        />
+      </div>
     </div>
   </Card>
 </template>
 <style lang='scss' scoped>
-  ::v-deep .card-actions {
+.prompt-restore {
+  margin: 0;
+}
+
+.bottom {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+
+  .buttons {
     display: flex;
-    flex-direction: row;
-    justify-content: center;
+    justify-content: flex-end;
+    width: 100%;
   }
+}
 </style>

package/dialog/DiagnosticTimingsDialog.vue

@@ -68,8 +68,8 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="title"
       class="text-default-text"
-      v-html="title"
     />
 
     <template slot="body">

package/dialog/ForceMachineRemoveDialog.vue

@@ -83,7 +83,7 @@ export default {
       class="pl-10 pr-10"
     >
       <span
-        v-html="t('promptForceRemove.removeWarning', { nameToMatch }, true)"
+        v-clean-html="t('promptForceRemove.removeWarning', { nameToMatch }, true)"
       />
       <div class="mt-10 mb-10">
         {{ t('promptForceRemove.confirmName') }}

package/dialog/GenericPrompt.vue

@@ -3,6 +3,7 @@ import AsyncButton from '@shell/components/AsyncButton';
 import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 import { exceptionToErrorsArray } from '@shell/utils/error';
+import { decodeHtml } from '@shell/utils/string';
 
 export default {
   components: {
@@ -26,28 +27,39 @@ export default {
     body: {
       type:    String,
       default: ''
-    }
+    },
+
+    /**
+     * Callback to identify response of the prompt
+     */
+    confirm: {
+      type:    Function,
+      default: () => { }
+    },
   },
   data() {
     return { errors: [] };
   },
 
   methods: {
+    decodeHtml,
     close() {
-      this.$emit('close');
+      this.confirm(false);
+      this.$emit('close', false);
     },
 
     async apply(buttonDone) {
       try {
         await this.applyAction(buttonDone);
-        this.close();
+        this.confirm(true);
+        this.$emit('close', true);
       } catch (err) {
         console.error(err); // eslint-disable-line
         this.errors = exceptionToErrorsArray(err);
         buttonDone(false);
       }
     }
-  }
+  },
 };
 </script>
 
@@ -58,16 +70,16 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="title"
       class="text-default-text"
-      v-html="title"
     />
 
     <template slot="body">
       <slot name="body">
         <div
+          v-clean-html="decodeHtml(body)"
           class="pl-10 pr-10"
           style="min-height: 50px; display: flex;"
-          v-html="body"
         />
       </slot>
     </template>

package/dialog/RotateEncryptionKeyDialog.vue

@@ -124,8 +124,8 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="t('promptRotateEncryptionKey.title')"
       class="text-default-text"
-      v-html="t('promptRotateEncryptionKey.title')"
     />
 
     <div

package/dialog/SaveAsRKETemplateDialog.vue

@@ -74,8 +74,8 @@ export default {
   >
     <h4
       slot="title"
+      v-clean-html="t('promptSaveAsRKETemplate.title', { cluster: cluster.displayName }, true)"
       class="text-default-text"
-      v-html="t('promptSaveAsRKETemplate.title', { cluster: cluster.displayName }, true)"
     />
 
     <div

package/dialog/ScaleMachineDownDialog.vue

@@ -116,7 +116,7 @@ export default {
           <span
             v-for="i in ignored"
             :key="i.name"
-            v-html="t('promptScaleMachineDown.retainedMachine2', { name: i.name }, true)"
+            v-clean-html="t('promptScaleMachineDown.retainedMachine2', { name: i.name }, true)"
           />
         </div>
       </div>

package/edit/auth/github.vue

@@ -187,9 +187,9 @@ export default {
           class="step-box"
         >
           <ul class="step-list">
-            <li v-html="t(`authConfig.${NAME}.form.prefix.1`, tArgs, true)" />
-            <li v-html="t(`authConfig.${NAME}.form.prefix.2`, tArgs, true)" />
-            <li v-html="t(`authConfig.${NAME}.form.prefix.3`, tArgs, true)" />
+            <li v-clean-html="t(`authConfig.${NAME}.form.prefix.1`, tArgs, true)" />
+            <li v-clean-html="t(`authConfig.${NAME}.form.prefix.2`, tArgs, true)" />
+            <li v-clean-html="t(`authConfig.${NAME}.form.prefix.3`, tArgs, true)" />
           </ul>
         </InfoBox>
         <InfoBox
@@ -200,7 +200,7 @@ export default {
             <li>
               {{ t(`authConfig.${NAME}.form.instruction`, tArgs, true) }}
               <ul class="mt-10">
-                <li><b>{{ t(`authConfig.${NAME}.form.app.label`) }}</b>: <span v-html="t(`authConfig.${NAME}.form.app.value`, tArgs, true)" /></li>
+                <li><b>{{ t(`authConfig.${NAME}.form.app.label`) }}</b>: <span v-clean-html="t(`authConfig.${NAME}.form.app.value`, tArgs, true)" /></li>
                 <li>
                   <b>{{ t(`authConfig.${NAME}.form.homepage.label`) }}</b>: {{ serverUrl }} <CopyToClipboard
                     label-as="tooltip"
@@ -209,7 +209,7 @@ export default {
                     action-color="bg-transparent"
                   />
                 </li>
-                <li><b>{{ t(`authConfig.${NAME}.form.description.label`) }}</b>: <span v-html="t(`authConfig.${NAME}.form.description.value`, tArgs, true)" /></li>
+                <li><b>{{ t(`authConfig.${NAME}.form.description.label`) }}</b>: <span v-clean-html="t(`authConfig.${NAME}.form.description.value`, tArgs, true)" /></li>
                 <li>
                   <b>{{ t(`authConfig.${NAME}.form.callback.label`) }}</b>: {{ serverUrl }} <CopyToClipboard
                     :text="serverUrl"
@@ -227,8 +227,8 @@ export default {
           class="mb-20"
         >
           <ul class="step-list">
-            <li v-html="t(`authConfig.${NAME}.form.suffix.1`, tArgs, true)" />
-            <li v-html="t(`authConfig.${NAME}.form.suffix.2`, tArgs, true)" />
+            <li v-clean-html="t(`authConfig.${NAME}.form.suffix.1`, tArgs, true)" />
+            <li v-clean-html="t(`authConfig.${NAME}.form.suffix.2`, tArgs, true)" />
           </ul>
         </InfoBox>
 
@@ -255,8 +255,8 @@ export default {
         >
           <div class="col span-12">
             <Banner
+              v-clean-html="t('authConfig.associatedWarning', tArgs, true)"
               color="info"
-              v-html="t('authConfig.associatedWarning', tArgs, true)"
             />
           </div>
         </div>

package/edit/auth/googleoauth.vue

@@ -141,7 +141,7 @@ export default {
           :step="1"
           class=" mt-20 mb-20"
         >
-          <h3 v-html="t('authConfig.googleoauth.steps.1.title', tArgs, true)" />
+          <h3 v-clean-html="t('authConfig.googleoauth.steps.1.title', tArgs, true)" />
           <ul class="mt-0 step-list">
             <li>{{ t('authConfig.googleoauth.steps.1.body.1', {}, true) }} </li>
             <li>
@@ -165,7 +165,7 @@ export default {
           class="mb-20"
         >
           <div class="row">
-            <h3 v-html="t('authConfig.googleoauth.steps.2.title', tArgs, true)" />
+            <h3 v-clean-html="t('authConfig.googleoauth.steps.2.title', tArgs, true)" />
           </div>
           <div class="row">
             <div class="col span-6">
@@ -211,11 +211,11 @@ export default {
           class="mb-20"
         >
           <div class="row">
-            <h3 v-html="t('authConfig.googleoauth.steps.3.title', tArgs, true)" />
+            <h3 v-clean-html="t('authConfig.googleoauth.steps.3.title', tArgs, true)" />
           </div>
           <div class="row">
             <div class="col span-6">
-              <div v-html="t('authConfig.googleoauth.steps.3.introduction', tArgs, true)" />
+              <div v-clean-html="t('authConfig.googleoauth.steps.3.introduction', tArgs, true)" />
               <ul class="mt-10 step-list">
                 <li>{{ t('authConfig.googleoauth.steps.3.body.1', {}, true) }} </li>
                 <li>{{ t('authConfig.googleoauth.steps.3.body.2', {}, true) }} </li>
@@ -248,8 +248,8 @@ export default {
         >
           <div class="col span-12 google">
             <Banner
+              v-clean-html="t('authConfig.associatedWarning', tArgs, true)"
               color="info"
-              v-html="t('authConfig.associatedWarning', tArgs, true)"
             />
           </div>
         </div>

package/edit/auth/ldap/index.vue

@@ -148,8 +148,8 @@ export default {
       >
         <div class="col span-12">
           <Banner
+            v-clean-html="t('authConfig.associatedWarning', tArgs, true)"
             color="info"
-            v-html="t('authConfig.associatedWarning', tArgs, true)"
           />
         </div>
       </div>

package/edit/auth/oidc.vue

@@ -277,8 +277,8 @@ export default {
       >
         <div class="col span-12">
           <Banner
+            v-clean-html="t('authConfig.associatedWarning', tArgs, true)"
             color="info"
-            v-html="t('authConfig.associatedWarning', tArgs, true)"
           />
         </div>
       </div>

package/edit/auth/saml.vue

@@ -257,8 +257,8 @@ export default {
       >
         <div class="col span-12">
           <Banner
+            v-clean-html="t('authConfig.associatedWarning', tArgs, true)"
             color="info"
-            v-html="t('authConfig.associatedWarning', tArgs, true)"
           />
         </div>
       </div>

package/edit/cis.cattle.io.clusterscan.vue

@@ -322,7 +322,7 @@ export default {
                 class="mt-0"
                 :color="hasAlertManager ? 'info' : 'warning'"
               >
-                <span v-html="t('cis.alertNeeded', {link: monitoringUrl}, true)" />
+                <span v-clean-html="t('cis.alertNeeded', {link: monitoringUrl}, true)" />
               </banner>
               <Checkbox
                 v-model="scanAlertRule.alertOnComplete"

package/edit/fleet.cattle.io.clustergroup.vue

@@ -27,7 +27,9 @@ export default {
   mixins: [CreateEditView],
 
   async fetch() {
-    this.allClusters = await this.$store.dispatch('management/findAll', { type: FLEET.CLUSTER });
+    if (this.$store.getters['management/schemaFor']( FLEET.CLUSTER )) {
+      this.allClusters = await this.$store.getters['management/all'](FLEET.CLUSTER);
+    }
     this.allWorkspaces = await this.$store.dispatch('management/findAll', { type: FLEET.WORKSPACE });
 
     if ( !this.value.spec?.selector ) {
@@ -146,15 +148,15 @@ export default {
     >
       <span
         v-if="matchingClusters.isAll"
-        v-html="t('fleet.clusterGroup.selector.matchesAll', matchingClusters)"
+        v-clean-html="t('fleet.clusterGroup.selector.matchesAll', matchingClusters)"
       />
       <span
         v-else-if="matchingClusters.isNone"
-        v-html="t('fleet.clusterGroup.selector.matchesNone', matchingClusters)"
+        v-clean-html="t('fleet.clusterGroup.selector.matchesNone', matchingClusters)"
       />
       <span
         v-else
-        v-html="t('fleet.clusterGroup.selector.matchesSome', matchingClusters)"
+        v-clean-html="t('fleet.clusterGroup.selector.matchesSome', matchingClusters)"
       />
     </Banner>
 

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

@@ -23,6 +23,7 @@ import { _CREATE } from '@shell/config/query-params';
 import { isHarvesterCluster } from '@shell/utils/cluster';
 import { CAPI, CATALOG } from '@shell/config/labels-annotations';
 import { SECRET_TYPES } from '@shell/config/secret';
+import { checkSchemasForFindAllHash } from '@shell/utils/auth';
 
 const _VERIFY = 'verify';
 const _SKIP = 'skip';
@@ -48,8 +49,20 @@ export default {
   mixins: [CreateEditView],
 
   async fetch() {
-    this.allClusters = await this.$store.dispatch('management/findAll', { type: FLEET.CLUSTER });
-    this.allClusterGroups = await this.$store.dispatch('management/findAll', { type: FLEET.CLUSTER_GROUP });
+    const hash = await checkSchemasForFindAllHash({
+      allClusters: {
+        inStoreType: 'management',
+        type:        FLEET.CLUSTER
+      },
+
+      allClusterGroups: {
+        inStoreType: 'management',
+        type:        FLEET.CLUSTER_GROUP
+      }
+    }, this.$store);
+
+    this.allClusters = hash.allClusters || [];
+    this.allClusterGroups = hash.allClusterGroups || [];
 
     let tls = _VERIFY;
 
@@ -412,7 +425,7 @@ export default {
       await secret.save();
 
       await this.$nextTick(() => {
-        this.updateAuth(secret.id, name);
+        this.updateAuth(secret.metadata.name, name);
       });
 
       return secret;

package/edit/helm.cattle.io.projecthelmchart.vue

@@ -48,6 +48,10 @@ export default {
   },
 
   data() {
+    if (!this.value.spec.values) {
+      this.$set(this.value.spec, 'values', {});
+    }
+
     return {
       systemNamespaces: null,
       namespaces:       [],
@@ -128,7 +132,7 @@ export default {
           :side-tabs="true"
         >
           <Questions
-            v-model="value"
+            v-model="value.spec.values"
             tabbed="multiple"
             :target-namespace="value.metadata.namespace"
             :source="selectedNamespaceQuestions"