feat: allow migrate mutliple VMs functionality and localization (#863)

* feat: enhance VM migration functionality and localization

Signed-off-by: Andy Lee <andy.lee@suse.com>

* refactor: add allVmsOnTargetNode method and update migration titles in localization

Signed-off-by: Andy Lee <andy.lee@suse.com>

* feat: enhance migration error handling and update localization for migration dialog

Signed-off-by: Andy Lee <andy.lee@suse.com>

---------

Signed-off-by: Andy Lee <andy.lee@suse.com>

pkg/harvester/dialog/HarvesterMigrationDialog.vue

@@ -1,15 +1,12 @@
 <script>
 import { mapGetters } from 'vuex';
-
 import { NODE } from '@shell/config/types';
 import { exceptionToErrorsArray } from '@shell/utils/error';
 import { HCI as HCI_ANNOTATIONS } from '@pkg/harvester/config/labels-annotations';
-
 import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 import AsyncButton from '@shell/components/AsyncButton';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
-import { HCI } from '../types';
 
 export default {
   emits: ['close'],
@@ -62,28 +59,46 @@ export default {
       return this.resources[0];
     },
 
-    vmi() {
+    anyCpuPinning() {
-      const inStore = this.$store.getters['currentProduct'].inStore;
+      return this.resources.some((r) => r.isCpuPinning);
-      const vmiResources = this.$store.getters[`${ inStore }/all`](HCI.VMI);
+    },
-      const resource = vmiResources.find((VMI) => VMI.id === this.actionResource?.id) || null;
 
-      return resource;
+    vmsByNode() {
+      const groups = {};
+
+      for (const r of this.resources) {
+        const node = r.nodeName || '';
+        const name = r.nameDisplay || r.name || r.id;
+
+        if (!groups[node]) {
+          groups[node] = [];
+        }
+        groups[node].push(name);
+      }
+
+      return Object.entries(groups).map(([node, vms]) => ({ node, vms })).sort((a, b) => a.node.localeCompare(b.node));
     },
 
     cpuPinningAlertMessage() {
       return this.t('harvester.virtualMachine.cpuPinning.migrationMessage');
     },
 
+    allVmsOnTargetNode() {
+      if (!this.nodeName) {
+        return false;
+      }
+
+      return this.resources.every((r) => r.nodeName === this.nodeName);
+    },
+
     nodeNameList() {
       const nodes = this.$store.getters['harvester/all'](NODE);
 
       return nodes.filter((n) => {
-        const isNotSelfNode = !!this.availableNodes.includes(n.id);
         const isNotWitnessNode = n.isEtcd !== 'true'; // do not allow to migrate to self node and witness node
-        const isCpuPinning = this.actionResource?.isCpuPinning;
+        const matchingCpuManagerConfig = !this.anyCpuPinning || n.isCPUManagerEnabled; // If cpu-pinning is enabled, filter-out non-enabled CPU manager nodes.
-        const matchingCpuManagerConfig = !isCpuPinning || n.isCPUManagerEnabled; // If cpu-pinning is enabled, filter-out non-enabled CPU manager nodes.
 
-        return isNotSelfNode && isNotWitnessNode && matchingCpuManagerConfig;
+        return isNotWitnessNode && matchingCpuManagerConfig;
       }).map((n) => {
         let label = n?.metadata?.name;
         const value = n?.metadata?.name;
@@ -126,7 +141,29 @@ export default {
       }
 
       try {
-        await this.actionResource.doAction('migrate', { nodeName: this.nodeName }, {}, false);
+        // Filter out VMs already running on the selected node
+        const toMigrate = this.resources.filter((r) => r.nodeName !== this.nodeName);
+
+        // await Promise.allSettled(toMigrate.map((r) => r.doAction('migrate', { nodeName: this.nodeName }, {}, false)));
+        // We want to show all migration errors if there are multiple VMs, so we use allSettled here and handle the results accordingly.
+        const results = await Promise.allSettled(toMigrate.map((r) => r.doAction('migrate', { nodeName: this.nodeName }, {}, false)));
+
+        const failedMigrations = results
+          .map((result, index) => ({ resource: toMigrate[index], result }))
+          .filter(({ result }) => result.status === 'rejected');
+
+        if (failedMigrations.length) {
+          this['errors'] = failedMigrations.flatMap(({ resource, result }) => {
+            const vmName = resource?.nameDisplay || resource?.name || resource?.metadata?.name || this.$store.getters['i18n/t']('generic.unknown');
+            const error = result.reason?.data || result.reason;
+            const messages = exceptionToErrorsArray(error);
+
+            return messages.map((message) => `${ vmName }: ${ message }`);
+          });
+          buttonDone(false);
+
+          return;
+        }
 
         buttonDone(true);
         this.close();
@@ -146,17 +183,35 @@ export default {
 <template>
   <Card :show-highlight-border="false">
     <template #title>
-      {{ t('harvester.modal.migration.title') }}
+      {{ t('harvester.modal.migration.vmMigrationTitle', { count: resources.length }) }}
     </template>
 
     <template #body>
       <Banner
-        v-if="actionResource?.isCpuPinning"
+        v-if="anyCpuPinning"
         color="warning"
         :label="cpuPinningAlertMessage"
       />
+      <p>
+        {{ t('harvester.modal.migration.selectedVMs') }}
+      </p>
+      <ul class="vm-list">
+        <li
+          v-for="group in vmsByNode"
+          :key="group.node"
+        >
+          {{ group.node || t('harvester.modal.migration.unknownNode') }}: {{ group.vms.join(', ') }}
+          <span
+            v-if="nodeName && group.node === nodeName"
+            class="already-on-target"
+          >
+            ({{ t('harvester.modal.migration.alreadyOnTarget') }})
+          </span>
+        </li>
+      </ul>
       <LabeledSelect
         v-model:value="nodeName"
+        class="mt-15"
         :label="t('harvester.modal.migration.fields.nodeName.label')"
         :placeholder="t('harvester.modal.migration.fields.nodeName.placeholder')"
         :options="nodeNameList"
@@ -183,7 +238,7 @@ export default {
 
         <AsyncButton
           mode="apply"
-          :disabled="!nodeName"
+          :disabled="!nodeName || allVmsOnTargetNode"
           @click="apply"
         />
       </div>
@@ -201,4 +256,16 @@ export default {
   justify-content: flex-end;
   width: 100%;
 }
+
+.already-on-target {
+  color: var(--warning);
+  font-style: italic;
+}
+
+.vm-list {
+  list-style: disc;
+  padding-left: 1.5em;
+  margin-bottom: 10px;
+  margin-top: 10px;
+}
 </style>

pkg/harvester/l10n/en-us.yaml

@@ -144,6 +144,10 @@ harvester:
     migration:
       failedMessage: Latest migration failed!
       title: Migration
+      vmMigrationTitle: '{count, plural, one {Migrating # VM} other {Migrating # VMs}}'
+      selectedVMs: "The following virtual machine(s) will be migrated to the target node"
+      unknownNode: (unknown node)
+      alreadyOnTarget: Already on Target
       fields:
         nodeName:
           label: Target Node
@@ -248,6 +252,7 @@ harvester:
     suspendSchedule: Suspend
     restoreExistingVM: Replace Existing
     migrate: Migrate
+    vmMigrate: Virtual Machine Migration
     cpuAndMemoryHotplug: Edit CPU and Memory
     abortMigration: Abort Migration
     storageMigration: Storage Migration
@@ -298,6 +303,7 @@ harvester:
     phase: Phase
     attachedVM: Attached Virtual Machine
     cpuManager: CPU Manager
+    routeConnectivityTooltip: Connectivity between the VM network and the management network, which the Harvester nodes are connected to.
     fingerprint: Fingerprint
     value: Value
     actions: Actions

pkg/harvester/list/harvesterhci.io.networkattachmentdefinition.vue

@@ -112,6 +112,7 @@ export default {
           value:         'connectivity',
           labelKey:      'tableHeaders.routeConnectivity',
           formatter:     'NetworkRouteConnectivity',
+          tooltip:       'harvester.tableHeaders.routeConnectivityTooltip',
           formatterOpts: { arbitrary: true },
           width:         130,
         },

pkg/harvester/models/kubevirt.io.virtualmachine.js

@@ -226,10 +226,12 @@ export default class VirtVm extends HarvesterResource {
         label:   this.t('harvester.action.ejectCDROM')
       },
       {
-        action:  'migrateVM',
+        action:     'migrateVM',
-        enabled: !!this.actions?.migrate,
+        enabled:    !!this.actions?.migrate,
-        icon:    'icon icon-copy',
+        icon:       'icon icon-copy',
-        label:   this.t('harvester.action.migrate')
+        label:      this.t('harvester.action.vmMigrate'),
+        bulkable:   true,
+        bulkAction: 'migrateVM'
       },
       {
         action:  'abortMigrationVM',

yarn.lock

@@ -3308,17 +3308,7 @@
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.8.tgz#958b91c991b1867ced318bedea0e215ee050726e"
   integrity sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==
 
-"@types/express-serve-static-core@*":
+"@types/express-serve-static-core@*", "@types/express-serve-static-core@^4.17.33":
-  version "5.1.1"
-  resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-5.1.1.tgz#1a77faffee9572d39124933259be2523837d7eaa"
-  integrity sha512-v4zIMr/cX7/d2BpAEX3KNKL/JrT1s43s96lLvvdTmza1oEvDudCqK9aF/djc/SWgy8Yh0h30TZx5VpzqFCxk5A==
-  dependencies:
-    "@types/node" "*"
-    "@types/qs" "*"
-    "@types/range-parser" "*"
-    "@types/send" "*"
-
-"@types/express-serve-static-core@^4.17.33":
   version "4.19.8"
   resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.19.8.tgz#99b960322a4d576b239a640ab52ef191989b036f"
   integrity sha512-02S5fmqeoKzVZCHPZid4b8JH2eM5HzQLZWN2FohQEy/0eXTq8VXZfSN6Pcr3F6N9R/vNrj7cpgbhjie6m/1tCA==
@@ -4073,16 +4063,11 @@
     "@vue/compiler-ssr" "3.5.29"
     "@vue/shared" "3.5.29"
 
-"@vue/shared@3.5.29":
+"@vue/shared@3.5.29", "@vue/shared@^3.5.18":
   version "3.5.29"
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.5.29.tgz#0fe0d7637b05599d56ca58d83a77c637a1774110"
   integrity sha512-w7SR0A5zyRByL9XUkCfdLs7t9XOHUyJ67qPGQjOou3p6GvBeBW+AVjUUmlxtZ4PIYaRvE+1LmK44O4uajlZwcg==
 
-"@vue/shared@^3.5.18":
-  version "3.5.32"
-  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.5.32.tgz#dd8ba0d709bf3f758c324a81c8897bad5e1540cf"
-  integrity sha512-ksNyrmRQzWJJ8n3cRDuSF7zNNontuJg1YHnmWRJd2AMu8Ij2bqwiiri2lH5rHtYPZjj4STkNcgcmiQqlOjiYGg==
-
 "@vue/test-utils@2.4.6":
   version "2.4.6"
   resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.4.6.tgz#7d534e70c4319d2a587d6a3b45a39e9695ade03c"
@@ -7163,9 +7148,9 @@ eslint-plugin-node@^11.1.0:
     semver "^6.1.0"
 
 eslint-plugin-promise@^7.1.0:
-  version "7.2.1"
+  version "7.3.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-7.2.1.tgz#a0652195700aea40b926dc3c74b38e373377bfb0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-7.3.0.tgz#7c61e117f5db8d7a300bd5143c15d1d828e4c124"
-  integrity sha512-SWKjd+EuvWkYaS+uN2csvj0KoP43YTu7+phKQ5v+xw6+A0gutVX2yqCeCkC3uLCJFiPfR2dD8Es5L7yUsmvEaA==
+  integrity sha512-6uGiOR0INuujr6PEQmeSSP7GbIMJ/ebEXXiEzb/nOj68LknH5Pxzb/AbZivmr6VE6TkTE8rTjRK9zhKpK6HsRA==
   dependencies:
     "@eslint-community/eslint-utils" "^4.4.0"
 
@@ -13853,9 +13838,9 @@ yaml@^1.10.0, yaml@^1.10.2, yaml@^1.7.2:
   integrity sha512-vIYeF1u3CjlhAFekPPAk2h/Kv4T3mAkMox5OymRiJQB0spDP10LHvt+K7G9Ny6NuuMAb25/6n1qyUjAcGNf/AA==
 
 yaml@^2.5.1:
-  version "2.8.3"
+  version "2.8.4"
-  resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.8.3.tgz#a0d6bd2efb3dd03c59370223701834e60409bd7d"
+  resolved "https://registry.yarnpkg.com/yaml/-/yaml-2.8.4.tgz#4b5f411dd25f9544914d8673d4da7f29248e5e2e"
-  integrity sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==
+  integrity sha512-ml/JPOj9fOQK8RNnWojA67GbZ0ApXAUlN2UQclwv2eVgTgn7O9gg9o7paZWKMp4g0H3nTLtS9LVzhkpOFIKzog==
 
 yargs-parser@^18.1.2:
   version "18.1.3"