@rancher/shell 0.3.4 → 0.3.5

package/creators/app/init

@@ -4,14 +4,14 @@ const path = require('path');
 const fs = require('fs-extra');
 
 const targets = {
-  dev:   './node_modules/.bin/nuxt dev',
-  nuxt:  './node_modules/.bin/nuxt',
-  build: './node_modules/.bin/nuxt build'
+  dev:   'NODE_ENV=dev ./node_modules/.bin/vue-cli-service serve',
+  build: './node_modules/.bin/vue-cli-service build',
+  clean: './node_modules/@rancher/shell/scripts/clean'
 };
 
 const files = [
   'tsconfig.json',
-  'nuxt.config.js',
+  'vue.config.js',
   '.eslintignore',
   '.eslintrc.js',
   'babel.config.js',
@@ -24,7 +24,7 @@ console.log('Creating Skeleton Application');
 const args = process.argv;
 let appFolder = path.resolve('.');
 
-if (args.length == 3) {
+if (args.length === 3) {
   const name = args[2];
   const folder = path.resolve('.');
 

package/creators/pkg/files/.github/workflows/build-extension.yml

@@ -0,0 +1,111 @@
+name: Build and Release Extension
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - main
+
+env:
+  ACTIONS_RUNNER_DEBUG: false
+  CI_COMMIT_MESSAGE: CI Build Artifacts
+
+defaults:
+  run:
+    shell: bash
+    working-directory: ./
+
+jobs:
+  build:
+    name: Build extension artifact
+    runs-on: ubuntu-latest
+    permissions: write-all
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Configure Git
+        run: |
+          git config user.name "$GITHUB_ACTOR"
+          git config user.email "$GITHUB_ACTOR@users.noreply.github.com"
+
+      - name: Setup Helm
+        uses: azure/setup-helm@v3
+        with:
+          version: v3.8.0
+
+      - name: Setup yq
+        uses: chrisdickinson/setup-yq@v1.0.1
+        with:
+          yq-version: v4.28.2
+
+      - name: Setup Nodejs and npm
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+
+      - name: Setup yarn
+        run: npm install -g yarn
+
+      - name: Setup Nodejs with yarn caching
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn
+
+      - name: Run build script
+        shell: bash
+        id: build_script
+        run: |
+          yarn publish-pkgs -s "${{ github.repository }}" -b main
+
+      - name: Upload charts artifact
+        if: github.ref == 'refs/heads/main' && github.event_name != 'pull_request'
+        uses: actions/upload-artifact@v3
+        with:
+          name: charts
+          path: tmp
+
+  release:
+    name: Release Build
+    if: github.ref == 'refs/heads/main' && github.event_name != 'pull_request'
+    needs: build
+    runs-on: ubuntu-latest
+    permissions: write-all
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+          ref: main
+
+      - name: Configure Git
+        run: |
+          git config user.name "$GITHUB_ACTOR"
+          git config user.email "$GITHUB_ACTOR@users.noreply.github.com"
+
+      - name: Download build artifact
+        uses: actions/download-artifact@v3
+        with:
+          name: charts
+
+      - name: Commit build
+        run: |
+          git add ./{assets,charts,extensions,index.yaml}
+          git commit -a -m "${{ env.CI_COMMIT_MESSAGE }}"
+          git push
+
+      - name: Run chart-releaser
+        uses: helm/chart-releaser-action@v1.4.1
+        with:
+          charts_dir: ./charts
+        env:
+          CR_TOKEN: '${{ secrets.GITHUB_TOKEN }}'
+          CR_SKIP_EXISTING: true

package/creators/pkg/init

@@ -16,12 +16,13 @@ const files = [
 ];
 
 const topLevelScripts = {
-  'build-pkg':  './node_modules/@rancher/shell/scripts/build-pkg.sh',
-  'serve-pkgs': './node_modules/@rancher/shell/scripts/serve-pkgs',
+  'build-pkg':    './node_modules/@rancher/shell/scripts/build-pkg.sh',
+  'serve-pkgs':   './node_modules/@rancher/shell/scripts/serve-pkgs',
+  'publish-pkgs': './node_modules/@rancher/shell/scripts/extension/publish',
 };
 
 const typeFolders = [
-  'i18n',
+  'l10n',
   'models',
   'edit',
   'list',
@@ -42,9 +43,21 @@ const folder = path.resolve('.');
 const pkgFolder = path.join(folder, 'pkg', name);
 
 let addTypeFolders = false;
+let addWorkflowFolder = false;
 
 if (args.length > 3) {
-  addTypeFolders = args[3] === '-t';
+  for (let i = 3; i < args.length; i++) {
+    switch (args[i]) {
+    case '-t':
+      addTypeFolders = true;
+      break;
+    case '-w':
+      addWorkflowFolder = true;
+      break;
+    default:
+      break;
+    }
+  }
 }
 
 const isNodeModulesShell = !fs.existsSync(path.join(folder, 'shell'));
@@ -93,6 +106,24 @@ if (addTypeFolders) {
   });
 }
 
+// Add workflow folder if needed
+if (addWorkflowFolder) {
+  const workflowDir = path.join(folder, '.github/workflows');
+
+  if (!fs.existsSync(workflowDir)) {
+    fs.mkdirSync(workflowDir, { recursive: true });
+  }
+
+  const workflowFile = path.join(workflowDir, 'build-extension.yml');
+
+  if (!fs.existsSync(workflowFile)) {
+    const src = path.join(__dirname, 'files/.github/workflows', 'build-extension.yml');
+
+    console.log(`  Adding file 'build-extension.yml' to root workflows`);
+    fs.copySync(src, workflowFile);
+  }
+}
+
 // Copy base files
 files.forEach((file) => {
   const src = path.join(__dirname, 'files', file);

package/creators/update/init

@@ -38,7 +38,7 @@ Object.keys(latestPackage._pkgs).forEach((key) => {
   appPackage.dependencies[key] = latestPackage._pkgs[key];
 });
 
-// Add in the weback resolution
+// Add in the webpack resolution
 appPackage.resolutions = appPackage.resolutions || {};
 appPackage.resolutions['**/webpack'] = '4';
 

package/detail/constraints.gatekeeper.sh.constraint.vue

@@ -1,38 +1,48 @@
 <script>
 import CreateEditView from '@shell/mixins/create-edit-view';
 import SortableTable from '@shell/components/SortableTable';
+import Banner from '@components/Banner/Banner.vue';
 import { CONSTRAINT_VIOLATION_RESOURCE_LINK, CONSTRAINT_VIOLATION_MESSAGE, CONSTRAINT_VIOLATION_TYPE } from '@shell/config/table-headers';
 
 export default {
-  components: { SortableTable },
+  components: { Banner, SortableTable },
   mixins:     [CreateEditView],
-  data(ctx) {
+  data() {
     return {
       headers: [
         CONSTRAINT_VIOLATION_TYPE,
         CONSTRAINT_VIOLATION_RESOURCE_LINK,
         CONSTRAINT_VIOLATION_MESSAGE
       ],
-      violations: this.value.violations
-        .map((violation, i) => ({ ...violation, id: i }))
+      violations: this.value.violations.map((violation, i) => ({ ...violation, id: i }))
     };
   }
 };
 </script>
 <template>
   <div>
-    <div
-      v-if="value.spec.enforcementAction"
-      class="row mt-40"
+    <div
+      v-if="value.spec.enforcementAction"
+      class="row mt-20"
     >
       <div class="col span-12">
-        <h3>Enforcement Action</h3>
+        <h3>
+          {{ t('gatekeeperConstraint.enforcement.action') }}
+        </h3>
         {{ value.spec.enforcementAction }}
       </div>
     </div>
-    <div class="row mt-40">
+    <div class="row mt-20">
       <div class="col span-12">
-        <h3>{{ t('gatekeeperConstraint.violations.title') }}</h3>
+        <h3 class="mb-20">
+          {{ t('gatekeeperConstraint.violations.title', { total: value.totalViolations }) }}
+        </h3>
+        <Banner
+          v-if="value.totalViolations !== value.violations.length"
+          color="info"
+        >
+          {{ t('gatekeeperConstraint.violations.notAll', { shown: value.violations.length }) }}
+        </Banner>
         <SortableTable
           :headers="headers"
           :rows="violations"

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

@@ -8,7 +8,7 @@ import { FLEET } from '@shell/config/types';
 import { isHarvesterCluster } from '@shell/utils/cluster';
 import FleetBundles from '@shell/components/fleet/FleetBundles.vue';
 import { resourceCounts } from '@shell/components/ResourceSummary.vue';
-import { allHash } from '~shell/utils/promise';
+import { checkSchemasForFindAllHash } from '@shell/utils/auth';
 
 export default {
   name: 'DetailGitRepo',
@@ -74,16 +74,23 @@ export default {
     },
   },
   async fetch() {
-    const { $store } = this;
-
-    const allDispatches = await allHash({
-      allBundles:    $store.dispatch('management/findAll', { type: FLEET.BUNDLE }),
-      allFleet:      $store.dispatch('management/findAll', { type: FLEET.CLUSTER }),
-      clusterGroups: $store.dispatch('management/findAll', { type: FLEET.CLUSTER_GROUP }),
-    });
-
-    this.allBundles = allDispatches.allBundles;
-    this.allFleet = allDispatches.allFleet;
+    const allDispatches = await checkSchemasForFindAllHash({
+      allBundles: {
+        inStoreType: 'management',
+        type:        FLEET.BUNDLE
+      },
+      allFleet: {
+        inStoreType: 'management',
+        type:        FLEET.CLUSTER
+      },
+      clusterGroups: {
+        inStoreType: 'management',
+        type:        FLEET.CLUSTER_GROUP
+      }
+    }, this.$store);
+
+    this.allBundles = allDispatches.allBundles || [];
+    this.allFleet = allDispatches.allFleet || [];
   },
 
 };
@@ -111,6 +118,7 @@ export default {
       :need-related="false"
     >
       <Tab
+        v-if="!!allBundles.length"
         label="Bundles"
         name="bundles"
         :weight="30"

package/detail/harvesterhci.io.management.cluster.vue

@@ -81,17 +81,17 @@ export default {
       class="p-10"
     >
       <h4
-        v-html="t('cluster.harvester.registration.step1', null, true)"
+        v-clean-html="t('cluster.harvester.registration.step1', null, true)"
       />
 
       <h4
+        v-clean-html="t('cluster.harvester.registration.step2', null, true)"
         class="mt-10"
-        v-html="t('cluster.harvester.registration.step2', null, true)"
       />
 
       <h4
+        v-clean-html="t('cluster.harvester.registration.step3', null, true)"
         class="mt-10"
-        v-html="t('cluster.harvester.registration.step3', null, true)"
       />
       <CopyCode class="m-10 p-10">
         {{ registrationURL }}

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') }}