feat: add migration plan duration time column (#1005) (#1006)

* feat: add migration plan duration time column



* feat: allow duration column to be sorted



---------


(cherry picked from commit 44297ada16)

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

.eslintignore

@@ -14,3 +14,4 @@ dist-pkg
 pkg/harvester/index.ts
 pkg/harvester/store/*
 scripts/pkgfile.js
+tmp

.github/actions/setup/action.yaml

@@ -4,7 +4,8 @@ description: Setup node and install dependencies
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - name: Setup Nodejs with yarn caching
+      uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
       with:
         node-version-file: '.nvmrc'
         cache: 'yarn'

.github/auto-assign-config.yaml

@@ -1,7 +0,0 @@
-addAssignees: author
-addReviewers: true
-numberOfReviewers: 0
-reviewers:
-- a110605
-- houhoucoop
-- NickChungSUSE

.github/mergify.yml

@@ -1,33 +1,14 @@
 pull_request_rules:
-- name: Automatically open backport PR to release-harvester-v1.5
-  conditions:
-    - base=main
-    - label="require backport 1.5"
-  actions:
-    backport:
-      branches:
-        - "release-harvester-v1.5"
-      assignees:
-        - "{{ author }}"
-      labels:
-        - "v1.5 backport PR"
+  - name: Ask to resolve conflict
+    conditions:
+      - conflict
+    actions:
+      comment:
+        message: This pull request is now in conflict. Could you fix it @{{author}}? 🙏
 
-- name: Automatically open backport PR to release-harvester-v1.0
-  conditions:
-    - base=main
-    - label="require backport 1.0"
-  actions:
-    backport:
-      branches:
-        - "release-harvester-v1.0"
-      assignees:
-        - "{{ author }}"
-      labels:
-        - "v1.0 backport PR"
-
-- name: Ask to resolve conflict
-  conditions:
-    - conflict
-  actions:
-    comment:
-      message: This pull request is now in conflict. Could you fix it @{{author}}? 🙏
+commands_restrictions:
+  backport:
+    conditions:
+      - or:
+        - sender-permission>=write
+        - sender=github-actions[bot]

.github/release.yml

@@ -0,0 +1,40 @@
+# .github/release.yml
+changelog:
+  categories:
+    - title: Features
+      labels:
+        - feat
+    - title: Bug Fixes
+      labels:
+        - fix
+    - title: Dependencies
+      labels:
+        - deps
+    - title: Performance
+      labels:
+        - perf
+    - title: Documentation
+      labels:
+        - docs
+    - title: Style
+      labels:
+        - style
+    - title: Build & Continuous Integration
+      labels:
+        - build
+        - ci
+    - title: Security
+      labels:
+        - security
+    - title: Tests
+      labels:
+        - test
+    - title: Refactoring
+      labels:
+        - refactor
+    - title: Chores
+      labels:
+        - chore
+    - title: Others
+      labels:
+        - other

.github/renovate.json

@@ -1,20 +1,30 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": ["config:recommended"],
+    "extends": [
+    "config:recommended",
+    ":semanticCommitTypeAll(deps)",
+    ":semanticCommitScopeDisabled"
+  ],
   "baseBranches": [
-    "master",
     "main",
-    "/^release-harvester-v\\d+\\.\\d+$/"
+    "release-harvester-v1.7",
+    "release-harvester-v1.8"
   ],
   "automergeMajor": false,
   "semanticCommits": "enabled",
-  "semanticCommitType": "chore",
-  "semanticCommitScope": "deps",
+  "semanticCommitType": "deps",
   "prHourlyLimit": 12,
+  "digest": {
+    "enabled": false
+  },
   "timezone": "Asia/Taipei",
   "schedule": ["after 10am on sunday"],
   "postUpdateOptions": ["yarnDedupeFewer"],
   "packageRules": [
+    {
+      "matchUpdateTypes": ["digest"],
+      "enabled": false
+    },
     {
       "matchUpdateTypes": ["major"],
       "enabled": false
@@ -31,14 +41,17 @@
     {
       "matchUpdateTypes": ["minor"],
       "groupName": "minor dependencies",
+      "minimumReleaseAge": "7 days",
       "labels": ["minor-update"],
       "reviewers": ["a110605", "houhoucoop"]
     },
     {
-      "matchUpdateTypes": ["patch", "digest"],
-      "automerge": true,
-      "groupName": "patch digest dependencies",
-      "labels": ["patch-update", "automerge"]
+      "matchUpdateTypes": ["patch"],
+      "automerge": false,
+      "minimumReleaseAge": "7 days",
+      "groupName": "patch dependencies",
+      "labels": ["patch-update"],
+      "reviewers": ["a110605", "houhoucoop"]
     }
   ]
 }

.github/workflows/add-pr-label-check.yaml

@@ -0,0 +1,39 @@
+name: "PR Management Add PR Label Collect Data"
+
+on:
+  pull_request:
+    types: [opened, reopened, edited]
+    branches:
+      - main
+      - 'release-harvester-v*'
+
+jobs:
+  collect:
+    if: github.event.pull_request.draft == false
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      actions: write
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+        with:
+          ref: ${{ github.base_ref }}
+
+      - name: Setup Nodejs and yarn install
+        uses: ./.github/actions/setup
+
+      - name: Extract PR label
+        run: |
+          PR_LABEL=$(node ./scripts/extract-release-label.mjs "${{ github.event.pull_request.title }}")
+          echo "PR_LABEL=$PR_LABEL"
+          {
+            echo "PR_NUMBER=${{ github.event.pull_request.number }}"
+            echo "PR_LABEL=$PR_LABEL"
+          } > pr-add-label-data.env
+
+      - name: Upload PR data artifact
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4
+        with:
+          name: pr-add-label-data
+          path: pr-add-label-data.env

.github/workflows/add-pr-label.yaml

@@ -0,0 +1,33 @@
+name: "PR Management Add PR Label"
+
+on:
+  workflow_run:
+    workflows:
+      - "PR Management Add PR Label Collect Data"
+    types: [completed]
+
+jobs:
+  auto-assign-pr-label:
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
+    permissions:
+      actions: read
+      pull-requests: write
+    steps:
+      - name: Download PR data artifact
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4
+        with:
+          name: pr-add-label-data
+          run-id: ${{ github.event.workflow_run.id }}
+          github-token: ${{ github.token }}
+
+      - name: Load PR data
+        run: |
+          cat pr-add-label-data.env >> $GITHUB_ENV
+
+      - name: Set PR label
+        env:
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          echo "PR_LABEL = $PR_LABEL"
+          gh pr edit "$PR_NUMBER" --repo "${{ github.repository }}" --add-label "$PR_LABEL"

.github/workflows/auto-assign-check.yaml

@@ -0,0 +1,28 @@
+name: "PR Management Auto Assign Collect Data"
+
+on:
+  pull_request:
+    types: [opened, ready_for_review]
+    branches:
+      - main
+      - 'release-harvester-v*'
+
+jobs:
+  collect:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      actions: write
+    steps:
+      - name: Save PR data to artifact
+        run: |
+          {
+            echo "PR_NUMBER=${{ github.event.pull_request.number }}"
+            echo "PR_AUTHOR=${{ github.event.pull_request.user.login }}"
+          } > pr-auto-assign-data.env
+
+      - name: Upload PR data artifact
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4
+        with:
+          name: pr-auto-assign-data
+          path: pr-auto-assign-data.env

.github/workflows/auto-assign-reviewer.yaml

@@ -1,16 +0,0 @@
-name: "[PR Management] Auto Assign Reviewer"
-
-on:
-  pull_request_target:
-    types: [opened, ready_for_review]
-
-permissions:
-  pull-requests: write
-
-jobs:
-  auto-assign:
-    runs-on: ubuntu-latest
-    steps:
-    - uses: rancher/gh-issue-mgr/auto-assign-action@main
-      with:
-        configuration-path: .github/auto-assign-config.yaml

.github/workflows/auto-assign.yaml

@@ -0,0 +1,35 @@
+name: "PR Management Auto Assign"
+
+on:
+  workflow_run:
+    workflows:
+      - "PR Management Auto Assign Collect Data"
+    types: [completed]
+
+jobs:
+  auto-assign:
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
+    env:
+      REVIEWERS: "a110605,houhoucoop"
+    permissions:
+      actions: read
+      pull-requests: write
+    steps:
+      - name: Download PR data artifact
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4
+        with:
+          name: pr-auto-assign-data
+          run-id: ${{ github.event.workflow_run.id }}
+          github-token: ${{ github.token }}
+
+      - name: Load PR data
+        run: |
+          cat pr-auto-assign-data.env >> $GITHUB_ENV
+
+      - name: Auto assign PR author
+        env:
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          echo "Assigning PR author: $PR_AUTHOR"
+          gh pr edit "$PR_NUMBER" --repo "${{ github.repository }}" --add-assignee "$PR_AUTHOR" --add-reviewer "$REVIEWERS"

.github/workflows/backport-label-check.yaml

@@ -0,0 +1,30 @@
+name: "PR Management Add Labels Collect Data"
+
+on:
+  pull_request:
+    types: [opened, reopened]
+    branches:
+      - main
+      - 'release-harvester-v*'
+
+jobs:
+  collect:
+    if: github.event.pull_request.draft == false
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      actions: write
+    steps:
+      - name: Save PR data to artifact
+        run: |
+          {
+            echo "PR_NUMBER=${{ github.event.pull_request.number }}"
+            echo "PR_BASE_REF=${{ github.event.pull_request.base.ref }}"
+            echo "PR_USER_LOGIN=${{ github.event.pull_request.user.login }}"
+          } > pr-backport-label-data.env
+
+      - name: Upload PR data artifact
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4
+        with:
+          name: pr-backport-label-data
+          path: pr-backport-label-data.env

.github/workflows/backport-label.yaml

@@ -0,0 +1,83 @@
+name: "PR Management Add Backport Labels"
+
+on:
+  workflow_run:
+    workflows:
+      - "PR Management Add Labels Collect Data"
+    types: [completed]
+
+jobs:
+  add-require-backport-label:
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
+    permissions:
+      actions: read
+      pull-requests: write
+    steps:
+      - name: Download PR data artifact
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4
+        with:
+          name: pr-backport-label-data
+          run-id: ${{ github.event.workflow_run.id }}
+          github-token: ${{ github.token }}
+
+      - name: Load PR data
+        run: |
+          cat pr-backport-label-data.env >> $GITHUB_ENV
+
+      - name: Add require-backport label (main branch PRs)
+        if: env.PR_BASE_REF == 'main'
+        env:
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          set -euo pipefail
+
+          repo="${{ github.repository }}"
+          pr_number="$PR_NUMBER"
+
+          release_branches=$(gh api "repos/${repo}/branches" --paginate --jq '.[].name' | grep -E '^release-harvester-v[0-9]+\.[0-9]+$' || true)
+
+          if [[ -z "$release_branches" ]]; then
+            echo "No release branches found, skipping."
+            exit 0
+          fi
+
+          latest_branch=$(echo "$release_branches" | sort -Vr | head -n1)
+          version="${latest_branch#release-harvester-v}"
+          release_tag="v${version}.0"
+
+          tags=$(gh api "repos/${repo}/releases" --paginate --jq '.[].tag_name')
+          if echo "$tags" | grep -Fxq "$release_tag"; then
+            echo "Release $release_tag already published, skipping."
+            exit 0
+          fi
+
+          label="require backport/v${version}"
+          pr_labels=$(gh pr view "$pr_number" --repo "$repo" --json labels --jq '.labels[].name' || echo "")
+
+          if echo "$pr_labels" | grep -Fxq "$label"; then
+            echo "Label '$label' already present, skipping."
+            exit 0
+          fi
+
+          echo "Adding label: $label"
+          gh pr edit "$pr_number" --repo "$repo" --add-label "$label"
+
+      - name: Add backport label (release branch PRs opened by Mergify)
+        if: startsWith(env.PR_BASE_REF, 'release-harvester-v')
+        env:
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          set -euo pipefail
+
+          IS_MERGIFY=$(echo "$PR_USER_LOGIN" | grep -iq 'mergify' && echo true || echo false)
+
+          if [[ "$IS_MERGIFY" != "true" ]]; then
+            echo "PR author is not Mergify, skipping."
+            exit 0
+          fi
+
+          version="${PR_BASE_REF#release-harvester-v}"
+          label="backport/v${version}"
+          echo "Adding label: $label"
+          gh pr edit "$PR_NUMBER" --repo "${{ github.repository }}" --add-label "$label"

.github/workflows/backport-request-check.yaml

@@ -0,0 +1,28 @@
+name: "PR Management Request Backport via Mergify Collect Data"
+
+on:
+  pull_request:
+    types: [closed]
+    branches: [main]
+
+jobs:
+  collect:
+    if: github.event.pull_request.merged == true
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      actions: write
+    steps:
+      - name: Save PR data to artifact
+        run: |
+          labels_json='${{ toJson(github.event.pull_request.labels.*.name) }}'
+          {
+            echo "PR_NUMBER=${{ github.event.pull_request.number }}"
+            echo "PR_LABELS=$(echo "$labels_json" | jq -r '[.[]] | join(",")')"
+          } > pr-backport-request-data.env
+
+      - name: Upload PR data artifact
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4
+        with:
+          name: pr-backport-request-data
+          path: pr-backport-request-data.env

.github/workflows/backport-request.yaml

@@ -0,0 +1,55 @@
+name: "PR Management Request Backport via Mergify"
+
+on:
+  workflow_run:
+    workflows:
+      - "PR Management Request Backport via Mergify Collect Data"
+    types: [completed]
+
+jobs:
+  comment-backport:
+    runs-on: ubuntu-latest
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
+    permissions:
+      actions: read
+      pull-requests: write
+    steps:
+      - name: Download PR data artifact
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4
+        with:
+          name: pr-backport-request-data
+          run-id: ${{ github.event.workflow_run.id }}
+          github-token: ${{ github.token }}
+
+      - name: Load PR data
+        run: |
+          cat pr-backport-request-data.env >> $GITHUB_ENV
+
+      - name: Post Mergify backport command
+        env:
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          set -euo pipefail
+
+          pr_number="$PR_NUMBER"
+          repo="${{ github.repository }}"
+
+          labels=$(echo "$PR_LABELS" | tr ',' '\n')
+
+          echo "Labels on PR: $labels"
+
+          matches=$(echo "$labels" | grep -oE '^require backport/v[0-9]+\.[0-9]+$' || true)
+
+          if [[ -z "$matches" ]]; then
+            echo "No back-port labels found — skipping."
+            exit 0
+          fi
+
+          branches=$(echo "$matches" \
+            | sed -E 's/^require backport\/v/release-harvester-v/' \
+            | sort -u | tr '\n' ' ')
+          branches=${branches%% }
+
+          cmd="@Mergifyio backport $branches"
+          echo "Posting Mergify command: $cmd"
+          gh pr comment "$pr_number" --repo "$repo" --body "$cmd"

.github/workflows/build-and-publish-catalog-on-release.yaml

@@ -11,18 +11,19 @@ defaults:
     working-directory: ./
 
 jobs:
-  lint:
+  check-version:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-depth: 1
+      - name: Checkout repository
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
 
-      - name: Run tests
-        uses: ./.github/actions/lint
+      - name: Check package version
+        env:
+          TAG_VERSION: ${{ github.event.release.tag_name }}
+        run: ./scripts/check-version.sh $TAG_VERSION
 
   build-and-push-extension-catalog:
-    needs: lint
+    needs: check-version
     uses: ./.github/workflows/build-extension-catalog.yml
     permissions:
       actions: write

.github/workflows/build-and-publish-standalone.yaml

@@ -25,12 +25,12 @@ jobs:
     name: Build & Upload Hosted
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3
         with:
           fetch-depth: 1
 
         # Note - Cannot use the setup action here as it uses a different yarn install arg
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
@@ -45,19 +45,20 @@ jobs:
         run: ./scripts/build-upload-gate
 
       - name: Get gcs auth
-        uses: rancher-eio/read-vault-secrets@main
+        uses: rancher-eio/read-vault-secrets@d266f55186f80a893839f6e15662e67388e443e6 # v3
         with:
           secrets: |
             secret/data/github/repo/${{ github.repository }}/google-auth/harvester/credentials token | GOOGLE_AUTH ;
 
       - name: Apply gcs auth
         # https://github.com/google-github-actions/auth
-        uses: 'google-github-actions/auth@v2'
+        uses: google-github-actions/auth@c200f3691d83b41bf9bbd8638997a462592937ed # v2
+        
         with:
           credentials_json: "${{ env.GOOGLE_AUTH }}"
 
       - name: Upload build
-        uses: 'google-github-actions/upload-cloud-storage@v2'
+        uses: google-github-actions/upload-cloud-storage@c0f6160ff80057923ff50e5e567695cea181ec23 # v2
         # https://github.com/google-github-actions/upload-cloud-storage
         with:
           path: ${{steps.build-hosted.outputs.BUILD_HOSTED_DIR}}
@@ -71,12 +72,12 @@ jobs:
     name: Build & Upload Embedded
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3
         with:
           fetch-depth: 1
 
         # Note - Cannot use the setup action here as it uses a different yarn install arg
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
@@ -89,19 +90,19 @@ jobs:
           DISABLED_EMBED_PKG: https://releases.rancher.com/harvester-ui/plugin/harvester-1.0.3.tar.gz
 
       - name: Get gcs auth
-        uses: rancher-eio/read-vault-secrets@main
+        uses: rancher-eio/read-vault-secrets@d266f55186f80a893839f6e15662e67388e443e6 # v3
         with:
           secrets: |
             secret/data/github/repo/${{ github.repository }}/google-auth/harvester/credentials token | GOOGLE_AUTH ;
 
       - name: Apply gcs auth
         # https://github.com/google-github-actions/auth
-        uses: 'google-github-actions/auth@v2'
+        uses: google-github-actions/auth@c200f3691d83b41bf9bbd8638997a462592937ed # v2
         with:
           credentials_json: "${{ env.GOOGLE_AUTH }}"
 
       - name: Upload tar
-        uses: 'google-github-actions/upload-cloud-storage@v2'
+        uses: google-github-actions/upload-cloud-storage@c0f6160ff80057923ff50e5e567695cea181ec23 # v2
         with:
           path: ${{steps.build-embedded.outputs.BUILD_EMBEDED_TGZ}}
           destination: releases.rancher.com/harvester-ui/dashboard
@@ -114,12 +115,12 @@ jobs:
     name: Build & Upload Plugin
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@f43a0e5ff2bd294095638e18286ca9a3d1956744 # v3
         with:
           fetch-depth: 1
 
         # Note - Cannot use the setup action here as it uses a different yarn install arg
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
         with:
           node-version-file: '.nvmrc'
           cache: 'yarn'
@@ -133,19 +134,19 @@ jobs:
         run: ./scripts/build-upload-gate
 
       - name: Get gcs auth
-        uses: rancher-eio/read-vault-secrets@main
+        uses: rancher-eio/read-vault-secrets@d266f55186f80a893839f6e15662e67388e443e6 # v3
         with:
           secrets: |
             secret/data/github/repo/${{ github.repository }}/google-auth/harvester/credentials token | GOOGLE_AUTH ;
 
       - name: Apply gcs auth
         # https://github.com/google-github-actions/auth
-        uses: 'google-github-actions/auth@v2'
+        uses: google-github-actions/auth@c200f3691d83b41bf9bbd8638997a462592937ed # v2
         with:
           credentials_json: "${{ env.GOOGLE_AUTH }}"
 
       - name: Upload plugin tar
-        uses: 'google-github-actions/upload-cloud-storage@v2'
+        uses: google-github-actions/upload-cloud-storage@c0f6160ff80057923ff50e5e567695cea181ec23 # v2
         with:
           path: dist-pkg/${{steps.ci-build-pkg.outputs.PKG_TARBALL}}
           destination: releases.rancher.com/harvester-ui/plugin
@@ -155,7 +156,7 @@ jobs:
           process_gcloudignore: false
 
       - name: Upload plugin directory
-        uses: 'google-github-actions/upload-cloud-storage@v2'
+        uses: google-github-actions/upload-cloud-storage@c0f6160ff80057923ff50e5e567695cea181ec23 # v2
         with:
           path: dist-pkg/${{steps.ci-build-pkg.outputs.PKG_NAME}}
           destination: releases.rancher.com/harvester-ui/plugin/${{steps.ci-build-pkg.outputs.PKG_NAME}}

.github/workflows/build-extension-catalog.yml

@@ -27,14 +27,14 @@ jobs:
       build-status: ${{ job.status }}
     steps:
       - name: Read Secrets
-        uses: rancher-eio/read-vault-secrets@main
+        uses: rancher-eio/read-vault-secrets@d266f55186f80a893839f6e15662e67388e443e6 # v3
         with:
           secrets: |
             secret/data/github/repo/${{ github.repository }}/dockerhub/rancher/credentials username | DOCKER_USERNAME ;
             secret/data/github/repo/${{ github.repository }}/dockerhub/rancher/credentials password | DOCKER_PASSWORD ;
       
       - name: Checkout repository (normal flow)
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
 
       - name: Enable Corepack
         run: corepack enable
@@ -45,26 +45,20 @@ jobs:
           git config user.email 'github-actions[bot]@users.noreply.github.com'
 
       - name: Login to Docker Hub
-        uses: docker/login-action@v3
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3
         with:
           username: ${{ env.DOCKER_USERNAME }}
           password: ${{ env.DOCKER_PASSWORD }}
 
       - name: Setup Helm
-        uses: azure/setup-helm@v3
+        uses: azure/setup-helm@5119fcb9089d432beecbf79bb2c7915207344b78 # v3
         with:
           version: v3.8.0
 
-      - name: Setup Nodejs with yarn caching
-        uses: actions/setup-node@v4
-        with:
-          node-version: '20'
-          cache: yarn
-
-      - name: Install dependencies
-        run: yarn
+      - name: Setup Nodejs with yarn install
+        uses: ./.github/actions/setup
 
       - name: Build and push UI image
         run: |
           publish="yarn publish-pkgs -cp -r ${{ inputs.registry_target }} -o ${{ inputs.registry_user }}"
-          $publish
+          $publish

.github/workflows/build-extension-on-merge.yml

@@ -13,7 +13,7 @@ jobs:
       target_branch: ${{ steps.get-version.outputs.target_branch }}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
 
       - name: Determine target branch
         id: get-version
@@ -44,7 +44,7 @@ jobs:
       version: ${{ steps.get_version.outputs.version }}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
 
       - name: Extract version from package.json
         id: get_version
@@ -62,7 +62,13 @@ jobs:
       contents: write
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+
+      - name: Setup Node from .nvmrc
+        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'yarn'
 
       - name: Setup environment
         run: |
@@ -70,7 +76,7 @@ jobs:
           yarn install --frozen-lockfile
 
       - name: Setup Helm
-        uses: azure/setup-helm@v3
+        uses: azure/setup-helm@5119fcb9089d432beecbf79bb2c7915207344b78 # v3
         with:
           version: v3.8.0
 
@@ -79,7 +85,7 @@ jobs:
           yarn publish-pkgs -s ${{ github.repository }} -b ${{ needs.setup-target-branch.outputs.target_branch }} -t harvester-${{ needs.extract-version.outputs.version }}
 
       - name: Upload charts artifact
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4
         with:
           name: charts
           path: tmp
@@ -94,7 +100,7 @@ jobs:
       contents: write
     steps:
       - name: Checkout release branch
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
         with:
           ref: '${{ github.ref_name }}'
 
@@ -105,7 +111,7 @@ jobs:
           echo "LAST_COMMIT=${LAST_COMMIT}" >> $GITHUB_ENV
 
       - name: Checkout target branch
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
         with:
           ref: '${{ needs.setup-target-branch.outputs.target_branch }}'
 
@@ -121,7 +127,7 @@ jobs:
           git config user.email 'github-actions[bot]@users.noreply.github.com'
 
       - name: Download build artifacts
-        uses: actions/download-artifact@v4
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4
         with:
           name: charts
 
@@ -132,7 +138,7 @@ jobs:
           git push origin ${{ needs.setup-target-branch.outputs.target_branch }}
 
       - name: Run Helm chart releaser
-        uses: helm/chart-releaser-action@v1.4.1
+        uses: helm/chart-releaser-action@cae68fefc6b5f367a0275617c9f83181ba54714f # v1.7.0
         with:
           charts_dir: ./charts
         env:

.github/workflows/build-extension-on-release.yml

@@ -17,37 +17,36 @@ jobs:
       release_tag: ${{ steps.determine_tag.outputs.release_tag }}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
 
       - name: Determine release tag
         id: determine_tag
         run: |
-          if [[ "${{ github.ref_name }}" =~ ^v([0-9]+\.[0-9]+\.[0-9]+)$ ]]; then
+          if [[ "${{ github.event.release.tag_name }}" =~ ^v([0-9]+\.[0-9]+\.[0-9]+)$ ]]; then
             RELEASE_TAG="harvester-${BASH_REMATCH[1]}"
             echo "${RELEASE_TAG}"
             echo "release_tag=${RELEASE_TAG}" >> $GITHUB_OUTPUT
           else
             echo "Error: invalid tag format." && exit 1
           fi
-  lint:
+  check-version:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-depth: 1
+      - name: Checkout repository
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+      - name: Check package version
+        env:
+          TAG_VERSION: ${{ github.event.release.tag_name }}
+        run: ./scripts/check-version.sh $TAG_VERSION
 
-      - name: Run tests
-        uses: ./.github/actions/lint
   build-extension-charts:
     needs:
       - setup-release-tag
-      - lint
-    uses: rancher/dashboard/.github/workflows/build-extension-charts.yml@master
+      - check-version
+    uses: rancher/dashboard/.github/workflows/build-extension-charts.yml@9bf23dff6650116673346447bcf0b088e0edb27f # creators-pkg-v3.0.12
     permissions:
-      actions: write
       contents: write
-      deployments: write
-      pages: write
+      pull-requests: write
     with:
       target_branch: gh-pages
       tagged_release: '${{ needs.setup-release-tag.outputs.release_tag }}'

.github/workflows/build-standalone-on-release.yaml

@@ -5,14 +5,20 @@ on:
       - v[1-9].*
 
 jobs:
-  build-validation:
-    name: Build Test
-    uses: ./.github/workflows/run-lint.yaml
+  check-version:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+      - name: Check package version
+        env:
+          TAG_VERSION: ${{github.ref_name}}
+        run: ./scripts/check-version.sh $TAG_VERSION
+
   build:
     name: Build and Upload Package
     uses: ./.github/workflows/build-and-publish-standalone.yaml
-    needs:
-      - build-validation
+    needs: check-version
     permissions:
       contents: read
       packages: write

.github/workflows/fossa.yml

@@ -0,0 +1,34 @@
+name: FOSSA Scanning
+
+on:
+  push:
+    branches: ["main", "release-harvester-v*"]
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  id-token: write
+
+jobs:
+  fossa-scanning:
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+    steps:
+    - name: Checkout
+      uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
+
+    # The FOSSA token is shared between all repos in Harvester's GH org. It can
+    # be used directly and there is no need to request specific access to EIO.
+    - name: Read FOSSA token
+      uses: rancher-eio/read-vault-secrets@d266f55186f80a893839f6e15662e67388e443e6 # v3
+      with:
+        secrets: |
+          secret/data/github/org/harvester/fossa/credentials token | FOSSA_API_KEY_PUSH_ONLY
+
+    - name: FOSSA scan
+      uses: fossas/fossa-action@ff70fe9fe17cbd2040648f1c45e8ec4e4884dcf3 # v1.9.0
+      with:
+        api-key: ${{ env.FOSSA_API_KEY_PUSH_ONLY }}
+        # Only runs the scan and do not provide/returns any results back to the
+        # pipeline.
+        run-tests: false

.github/workflows/run-lint.yaml

@@ -1,12 +1,13 @@
 name: Tests
 
 on:
-  workflow_call:  # This tells GH that the workflow is reusable 
+  workflow_call:  # This tells GH that the workflow is reusable
   push:
     branches:
       - main
       - 'release-*'
   pull_request:
+    types: [opened, reopened, edited, synchronize]
     branches:
       - main
       - 'release-*'
@@ -15,13 +16,18 @@ jobs:
   lint:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
         with:
           fetch-depth: 0  # Need full history for commit-lint
 
       - name: Run tests
         uses: ./.github/actions/lint
 
+      - name: Validate PR title lint
+        if: github.event_name == 'pull_request'
+        shell: bash
+        run: echo "${{ github.event.pull_request.title }}" | npx commitlint
+
       - name: Validate commit messages
         shell: bash
         run: |
@@ -35,8 +41,14 @@ jobs:
             FROM="$GITHUB_BASE_SHA"
             TO="$GITHUB_HEAD_SHA"
           elif [ -n "$GITHUB_BEFORE" ] && [ -n "$GITHUB_AFTER" ]; then
-            FROM="$GITHUB_BEFORE"
-            TO="$GITHUB_AFTER"
+            if [ "$GITHUB_BEFORE" = "0000000000000000000000000000000000000000" ]; then
+              # first push to HEAD
+              FROM=""
+              TO="$GITHUB_AFTER"
+            else
+              FROM="$GITHUB_BEFORE"
+              TO="$GITHUB_AFTER"
+            fi
           else
             echo "No valid commit range found, skipping commitlint."
             exit 0
@@ -44,7 +56,15 @@ jobs:
 
           echo "FROM=$FROM"
           echo "TO=$TO"
-          npx commitlint --from "$FROM" --to "$TO" --verbose
+
+          if [ -z "$FROM" ]; then
+            echo "Linting last commit  $TO"
+            npx commitlint --last --verbose
+
+          else
+            echo "Linting commits from $FROM to $TO"
+            npx commitlint --from "$FROM" --to "$TO" --verbose
+          fi
         env:
           GITHUB_EVENT_NAME: ${{ github.event_name }}
           GITHUB_BASE_SHA: ${{ github.event.pull_request.base.sha }}

.nvmrc

@@ -1 +1 @@
-20
+24

AGENTS.md

@@ -0,0 +1,261 @@
+> This `./AGENTS.md` file is generated by running `yarn agents:generate`.
+
+
+# Project Overview
+
+The Harvester UI Extension is a Rancher extension that provides the user interface for Harvester within the Rancher Dashboard.
+
+```
+Note: This extension is available starting from Rancher 2.10.0. Ensure your Rancher version is 2.10.0 or later to access Harvester integration.
+```
+
+# Personas
+
+## Software Developer
+
+You are an expert Senior Software Engineer specializing in Vue.js and TypeScript. You have deep knowledge of Kubernetes and the Rancher ecosystem.
+- **Focus**: Writing clean, maintainable, and performant code.
+- **Priorities**: Adhering to the project's code style, ensuring type safety, and following best practices for component design.
+
+
+# Agents
+
+## Boundaries
+
+- ✅ **Always:**
+  - Write to `.github`, `docs/`,  `pkg/harvester`, `scripts/`.
+  - Make commits in a new branch (for a PR).
+  - Run `yarn lint:fix` before commits.
+    - Use conventional commit format: 
+    ```
+    <type>:
+
+    <description>
+    ```
+  - Follow existing naming conventions (PascalCase for components, camelCase for functions).
+  - After changing a Vue, JS, or TS file, make sure it's automatically formatted with ESLint.
+  - After updating files in `docs/agents.md/`, run `yarn agents:generate` to update root `AGENTS.md`.   
+- ⚠️ **Ask first:**
+  - Adding dependencies
+  - Upgrading dependencies
+- 🚫 **Never:**
+  - Commit or log secrets, `.env`, `kubeconfig` or any API keys.
+  - Edit `node_modules/`.
+  - Commit directly to `main` (use PRs).
+  - Skip git hooks with `--no-verify` flag.
+
+## Tools
+
+### Prerequisites
+
+- **Node.js**: `>= 24.0.0` (see `.nvmrc` for the pinned version: `24`)
+- **Package manager**: `yarn` (v1 classic)
+
+### Common Commands
+
+| Command | Description |
+|---------|-------------|
+| `yarn install --frozen-lockfile` | Install dependencies (CI-safe, no lockfile changes) |
+| `RANCHER_ENV=harvester API=https://<harvester-ip> yarn dev` | Start development server at `https://127.0.0.1:8005` |
+| `yarn build-pkg harvester` | Build the Harvester extension package |
+| `yarn serve-pkgs` | Serve the locally built extension for testing |
+| `yarn lint` | Run ESLint (zero warnings allowed) |
+| `yarn lint:fix` | Run ESLint with auto-fix |
+| `yarn clean` | Clean build artifacts |
+| `yarn agents:generate` | Regenerate `AGENTS.md` from `docs/agents.md/` sources |
+
+### Development
+
+- **Start dev server**:
+  ```bash
+  RANCHER_ENV=harvester API=https://your-harvester-ip yarn dev
+  ```
+  - `API` should point to a running Harvester cluster (e.g., `https://x.x.x.x`).
+  - The dashboard will be available at `https://127.0.0.1:8005`.
+
+### Building
+
+- **Build extension package**:
+  ```bash
+  yarn build-pkg harvester
+  ```
+- **Serve locally built extension** (for integration testing with a Rancher instance):
+  ```bash
+  yarn serve-pkgs
+  ```
+
+### Linting
+
+- **Check** (must pass with zero warnings):
+  ```bash
+  yarn lint
+  ```
+- **Auto-fix**:
+  ```bash
+  yarn lint:fix
+  ```
+- ESLint covers `.js`, `.ts`, and `.vue` files.
+- Always run `yarn lint:fix` before committing.
+
+### Commit Conventions
+
+- Commits are validated by [commitlint](https://commitlint.js.org/) via a Husky `commit-msg` hook.
+- Follow [Conventional Commits](https://www.conventionalcommits.org/) format (configured in `commitlint.config.js`).
+
+### Agent Documentation
+
+- Source files live in `docs/agents.md/` (agents, contributors, personas subdirectories).
+- After editing any source file, regenerate the root `AGENTS.md`:
+  ```bash
+  yarn agents:generate
+  ```
+
+# Contributors Guide
+
+## Getting Started
+
+Please see the [Harvester UI Extension README](https://github.com/harvester/harvester-ui-extension).
+
+To get started, follow the `Development Setup` section.
+
+## Project Information
+
+- **Tech Stack:**
+  - `Vue.js`: Framework
+  - `Linting`: ESLint
+  - `CSS`: SCSS should be used
+  - `TypeScript`: Primary language for logic.
+- **Code Style and Standards:**
+  - `Language`: TypeScript is preferred for new code.
+  - `Vue.js`:
+    - Composition API components are preferred over Options API.
+    - Large pages with lots of code and styles should be avoided by breaking the page up into smaller Vue components.
+    - Place source tag above template above style.
+    - style tag should contain `lang='scss' scoped`.
+  - `Linting`: Follow the ESLint configuration in the root.
+
+- **File Structure:**
+  - `.github/`: CI/CD workflows and Renovate config.
+  - `docs/`: Documentation source for `AGENTS.md` generation.
+  - `scripts/`: Bash scripts for build, CI and doc generation.
+  - `pkg/harvester/`: Main extension source. Files are named after K8s resource types (e.g., `kubevirt.io.virtualmachine`, `harvesterhci.io.volume`).
+     - `index.ts`: Plugin entry point — registers the product and auto-imports models/detail/edit views.
+     - `types.ts`: `HCI` constant mapping 60+ K8s resource types to string identifiers.
+     - `components/`: Reusable Vue components (VNC/serial console, settings panels, upgrade banners, filters).
+     - `config/`: Constants — settings keys, table column definitions, feature flags, type mappings, doc links.
+     - `detail/`: Read-only detail views per resource type. Complex resources use subdirectories with tabs.
+     - `dialog/`: Modal dialogs for operations (VM clone/migrate/restart, backup/restore, device passthrough, etc.).
+     - `edit/`: Create/edit forms. Complex resources (e.g., VM) split into subcomponents (CpuMemory, Network, Volume, CloudConfig, etc.).
+     - `formatters/`: Table cell formatters — state badges, usage bars, resource references.
+     - `l10n/`: Localization (`en-us.yaml`).
+     - `list/`: List (table) views per resource type, mirroring `detail/` and `edit/` naming.
+     - `mixins/`: Shared Vue mixins — VM helpers (`harvester-vm/`) and disk helpers (`harvester-disk.js`).
+     - `models/`: Model classes extending `SteveModel` with computed properties and actions. Base class: `harvester.js`.
+     - `pages/`: Route-level pages — dashboard, support, console, members, brand, alertmanager.
+     - `promptRemove/`: Custom delete-confirmation dialogs (VM, backup).
+     - `routing/`: Vue Router config — all product routes (CRUD, console, support, upgrade, etc.).
+     - `store/`: Vuex modules — `harvester-common.js` for shared state; `harvester-store/` for VM/resource creation actions with Steve integration.
+     - `styles/`: Global SCSS files.
+     - `utils/`: Helpers — VM volume templates, CPU/memory calc, cron parsing, regex validators, feature flags.
+     - `validators/`: Form validation functions per resource type, pushing i18n error messages.
+  
+  
+
+## Harvester UI Extension Development Guide
+
+1. Backward Compatibility
+The Harvester UI Extension supports earlier cluster versions (e.g., UI Ext v1.8.0 works with clusters v1.7.0 and v1.6.0). It uses Feature Flags defined in pkg/config/feature-flags to ensure the UI matches the cluster's specific version.
+
+2. Implementation Steps for New Features
+To add a feature in a new release, follow these steps:
+
+    Register: Add a unique [Feature Name] to the corresponding release array in the configuration.
+
+    Check: Use the following getter to verify if the feature is enabled for the current version:
+
+    ```
+    computed: {
+      newFeatureEnabled() {
+        return this.$store.getters['harvester-common/getFeatureEnabled']('[Feature Name]');
+      },
+    },
+    ```
+    Render: Use the result of the check to conditionally render the UI components.
+
+
+## E2E Tests (Cypress)
+
+See https://github.com/harvester/harvester-ui-tests
+
+## Node Dependencies
+
+Dependencies are managed via `package.json` and `yarn`
+
+- To install dependencies use `yarn install`. This will fail if dependencies and versions listed in `package.json` are out of step with the `yarn.lock` file
+- To add a dependency use `yarn run add:no-lock ...` instead of `yarn add`
+- To upgrade a dependency use `yarn run upgrade:no-lock ...` instead of `yarn upgrade`
+
+
+Renovate automatically updates dependencies and opens upgrade PRs after 10:00 AM on Sundays (`Asia/Taipei`).
+For the Renovate config, see `.github/renovate.json`.
+
+
+## Milestone guidance
+
+- All issues must first be resolved in the `main` branch
+- If backports are needed they can be made via the backport bot
+  - pull requests
+    - comment `@Mergifyio backport <target branch>` e.g. `@Mergifyio backport release-harvester-v1.8`
+    - All backported pull requests must link to a backported issue
+
+
+## Creating a branch
+
+### To resolve an issue
+- Checkout the branch matching the milestone of the issue `git checkout ${targetMilestoneBranch}`. Replace `${targetMilestoneBranch}` with the target milestone of the issue. For example
+  - `main` for the latest unreleased minor version
+  - `release-harvester-v.X` for release minor versions
+    - `release-harvester-v1.6`
+    - `release-harvester-v1.7`
+    - `release-harvester-v1.8`
+- Ensure you have the latest of that branch `git pull --rebase`
+- Checkout the branch to commit the changes to `git checkout issue-${issueNumber}`. Replace `${issueNumber}` with the issue number.
+
+## Creating a commit
+
+- This project uses commit-lint with [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) to ensure consistent and meaningful commit messages.
+
+### Commit Message Format
+All commit messages must follow the conventional commit format:
+```
+<type>[optional scope]: <description>
+
+[optional body]
+
+[optional footer(s)]
+```
+
+### Supported Types
+- feat: New features
+- fix: Bug fixes
+- docs: Documentation changes
+- style: Code style changes (formatting, missing semicolons, etc.)
+- refactor: Code refactoring
+- perf: Performance improvements
+- test: Adding or updating tests
+- build: Build system or external dependencies
+- ci: CI/CD changes
+- chore: Other changes that don't modify src or test files
+- revert: Reverts a previous commit
+- wip: Work in progress
+- deps: Dependency updates
+- security: Security fixes
+
+## Creating a Pull Request
+
+- Pull requests must come from forks
+- Description should always have commit supported type prefix. E.g `fix: XXX`, `feat: OOO`
+- A Pull Request will only be merged once
+  - ALL CI gates have passed
+  - At least one harvester/harvester-ui-extension code owners reviews and approves the PR
+

CODEOWNERS

@@ -0,0 +1,2 @@
+@a110605
+@houhoucoop

README.md

@@ -5,9 +5,22 @@ The Harvester UI Extension is a Rancher extension that provides the user interfa
 > **Note:**
 > This extension is available starting from **Rancher 2.10.0**. Ensure your Rancher version is **2.10.0 or later** to access Harvester integration.
 
+## Table of Contents
+
+- [Installation](#installation)
+- [Development Setup](#development-setup)
+- [Commit Message Guidelines](#commit-message-guidelines)
+- [Branch Structure](#branch-structure)
+- [Testing Guidelines](#testing-guidelines)
+- [Release](#release)
+- [Contributing](#contributing)
+- [License](#license)
+
+
+
 ## Installation
 
-For detailed installation instructions, please refer to the [official Harvester documentation](https://docs.harvesterhci.io/v1.5/rancher/harvester-ui-extension#installation-on-rancher-210).
+For Harvester UI extension installation instructions, please refer to the page **Rancher Integration** -> **Harvester UI Extension** in [official Harvester documentation](https://docs.harvesterhci.io).
 
 
 ## Development Setup
@@ -157,13 +170,20 @@ To test the standalone UI, configure Harvester to load the UI from an external s
 2. Set **ui-source** to `External`
 3. Set **ui-index** to the desired URL
 
+
+## Release
+
+The Harvester UI Extension follows the [Harvester](https://github.com/harvester/harvester) release cycle. After RC1 is cut for a new Harvester version, we usually create and work from the corresponding release branch (for example, `release-harvester-v1.8`). The remaining RC builds and the final official release are published from that branch.
+
+After Harvester releases a new version, update the Harvester entry in rancher/ui-plugin-charts [manifest.json](https://github.com/rancher/ui-plugin-charts/blob/aafd215debbc6cb3100e7ba4b0a542c932397acd/manifest.json#L133-L151). This ensures air-gapped users can pull the new Harvester UI Extension image.
+
 ## Contributing
 
 If you want to contribute, start by reading this document, then visit our [Getting Started guide](https://extensions.rancher.io/extensions/next/extensions-getting-started) to learn how to develop and submit changes.
 
 ## License
 
-Copyright (c) 2014-2025 [SUSE, LLC.](https://www.suse.com/)
+Copyright (c) 2014-2026 [SUSE, LLC.](https://www.suse.com/)
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.

commitlint.config.js

@@ -22,14 +22,18 @@ module.exports = {
         'security', // Security fixes
       ]
     ],
+    // Allows the scope to be empty. [0] means the rule is disabled.
+    'scope-empty':            [0, 'always'],
+    // Allows any string for the scope.
+    'scope-case':             [2, 'always', 'kebab-case'],
     'type-case':              [2, 'always', 'lower-case'],
     'type-empty':             [2, 'never'],
-    'subject-case':           [2, 'always', 'lower-case'],
+    'subject-case':           [0, 'never'],
     'subject-empty':          [2, 'never'],
     'subject-full-stop':      [2, 'never', '.'],
-    'subject-max-length':     [2, 'always', 72],
+    'subject-max-length':     [0, 'never'],
     'body-leading-blank':     [2, 'always'],
-    'body-max-line-length':   [2, 'always', 100],
+    'body-max-line-length':   [0, 'always', 100],
     'footer-leading-blank':   [2, 'always'],
     'footer-max-line-length': [2, 'always', 100],
   },

docs/agents.md/README

@@ -0,0 +1,63 @@
+# Agents.md
+
+This folder contains files used to construct a single root `AGENTS.md`
+
+We do this because
+- The single commonality between almost all AI tools is that they look for a root `AGENTS.md`
+- Having the information in a single place for all AI tools is better than duplicating and maintaining the information in multiple files for each AI tool
+
+## Process
+1. Add files to or update files in `./docs/agents.md/agents`, `./docs/agents.md/personas`, `./docs/agents.md/contributors`.
+2. Each file must
+  - Start markdown headers at the `##` level
+  - End in a new line
+  - Order contents in AGENTS.md by giving an optional number prefix
+3. Run `yarn agents:generate`.
+   - Take the contents of `./docs/agents.md/template_agents.md`
+   - Insert the contents of the agents, personas and contributors files
+   - Output to `./AGENTS.md`
+4. Commit all changes, including root `./AGENTS.md` and any files that link to it
+
+## Guidance
+
+### Examples
+
+When referencing code or configuration it's good to include an example
+
+## Future Tasks
+- Add real world examples when referencing code
+- Create a GH workflow to monitor `agents.md` folder files in a PR, if changed run generate script and add new AGENTS.md to PR
+- Discuss
+  - Three multi AI tool related questions
+    - Questions
+      - how AI specific patterns, like co-pilot instructions, can be expressed in a way to be adopted by or reduce duplication with the root agents.md
+      - how AI tool specific metadata code can be included
+      - multiple agents vs personas approach works
+    - Proposal
+      - Generic information applicable to all AI tools is added to the root `agents.md`
+      - Agent, instruction or other AI specific files or patterns can be used in files specific to that AI tool. They must not contain duplicate information to the root `agents.md`
+      - The root `agents.md` continues to be AI tool agnostic
+  - How can folder specific agents be used
+    - Proposal
+      - `agents.md` are added to folders as long as most LLMs can make use of them and they do not duplicate information in the root `agents.md`
+
+## Test Prompts
+
+To validate LLMs are picking up information consider running the following prompts.
+
+### Information
+
+Can they provide correct information?
+
+- `what's this project about?`
+- `can you tell me the process for fixing a github issue in this repo?`
+- `what makes a good software developer?`
+- `what should never be done in this project?`
+- `what are the folders in this project for?`
+- `what are the env vars i could use when running e2e tests?`
+
+### Actions
+
+Can they use the information in their actions?
+
+Pending

docs/agents.md/agents/boundaries.md

@@ -0,0 +1,23 @@
+## Boundaries
+
+- ✅ **Always:**
+  - Write to `.github`, `docs/`,  `pkg/harvester`, `scripts/`.
+  - Make commits in a new branch (for a PR).
+  - Run `yarn lint:fix` before commits.
+    - Use conventional commit format: 
+    ```
+    <type>:
+
+    <description>
+    ```
+  - Follow existing naming conventions (PascalCase for components, camelCase for functions).
+  - After changing a Vue, JS, or TS file, make sure it's automatically formatted with ESLint.
+  - After updating files in `docs/agents.md/`, run `yarn agents:generate` to update root `AGENTS.md`.   
+- ⚠️ **Ask first:**
+  - Adding dependencies
+  - Upgrading dependencies
+- 🚫 **Never:**
+  - Commit or log secrets, `.env`, `kubeconfig` or any API keys.
+  - Edit `node_modules/`.
+  - Commit directly to `main` (use PRs).
+  - Skip git hooks with `--no-verify` flag.

docs/agents.md/agents/tools.md

@@ -0,0 +1,65 @@
+## Tools
+
+### Prerequisites
+
+- **Node.js**: `>= 24.0.0` (see `.nvmrc` for the pinned version: `24`)
+- **Package manager**: `yarn` (v1 classic)
+
+### Common Commands
+
+| Command | Description |
+|---------|-------------|
+| `yarn install --frozen-lockfile` | Install dependencies (CI-safe, no lockfile changes) |
+| `RANCHER_ENV=harvester API=https://<harvester-ip> yarn dev` | Start development server at `https://127.0.0.1:8005` |
+| `yarn build-pkg harvester` | Build the Harvester extension package |
+| `yarn serve-pkgs` | Serve the locally built extension for testing |
+| `yarn lint` | Run ESLint (zero warnings allowed) |
+| `yarn lint:fix` | Run ESLint with auto-fix |
+| `yarn clean` | Clean build artifacts |
+| `yarn agents:generate` | Regenerate `AGENTS.md` from `docs/agents.md/` sources |
+
+### Development
+
+- **Start dev server**:
+  ```bash
+  RANCHER_ENV=harvester API=https://your-harvester-ip yarn dev
+  ```
+  - `API` should point to a running Harvester cluster (e.g., `https://x.x.x.x`).
+  - The dashboard will be available at `https://127.0.0.1:8005`.
+
+### Building
+
+- **Build extension package**:
+  ```bash
+  yarn build-pkg harvester
+  ```
+- **Serve locally built extension** (for integration testing with a Rancher instance):
+  ```bash
+  yarn serve-pkgs
+  ```
+
+### Linting
+
+- **Check** (must pass with zero warnings):
+  ```bash
+  yarn lint
+  ```
+- **Auto-fix**:
+  ```bash
+  yarn lint:fix
+  ```
+- ESLint covers `.js`, `.ts`, and `.vue` files.
+- Always run `yarn lint:fix` before committing.
+
+### Commit Conventions
+
+- Commits are validated by [commitlint](https://commitlint.js.org/) via a Husky `commit-msg` hook.
+- Follow [Conventional Commits](https://www.conventionalcommits.org/) format (configured in `commitlint.config.js`).
+
+### Agent Documentation
+
+- Source files live in `docs/agents.md/` (agents, contributors, personas subdirectories).
+- After editing any source file, regenerate the root `AGENTS.md`:
+  ```bash
+  yarn agents:generate
+  ```

docs/agents.md/contributors/1_contributors.md

@@ -0,0 +1,70 @@
+## Getting Started
+
+Please see the [Harvester UI Extension README](https://github.com/harvester/harvester-ui-extension).
+
+To get started, follow the `Development Setup` section.
+
+## Project Information
+
+- **Tech Stack:**
+  - `Vue.js`: Framework
+  - `Linting`: ESLint
+  - `CSS`: SCSS should be used
+  - `TypeScript`: Primary language for logic.
+- **Code Style and Standards:**
+  - `Language`: TypeScript is preferred for new code.
+  - `Vue.js`:
+    - Composition API components are preferred over Options API.
+    - Large pages with lots of code and styles should be avoided by breaking the page up into smaller Vue components.
+    - Place source tag above template above style.
+    - style tag should contain `lang='scss' scoped`.
+  - `Linting`: Follow the ESLint configuration in the root.
+
+- **File Structure:**
+  - `.github/`: CI/CD workflows and Renovate config.
+  - `docs/`: Documentation source for `AGENTS.md` generation.
+  - `scripts/`: Bash scripts for build, CI and doc generation.
+  - `pkg/harvester/`: Main extension source. Files are named after K8s resource types (e.g., `kubevirt.io.virtualmachine`, `harvesterhci.io.volume`).
+     - `index.ts`: Plugin entry point — registers the product and auto-imports models/detail/edit views.
+     - `types.ts`: `HCI` constant mapping 60+ K8s resource types to string identifiers.
+     - `components/`: Reusable Vue components (VNC/serial console, settings panels, upgrade banners, filters).
+     - `config/`: Constants — settings keys, table column definitions, feature flags, type mappings, doc links.
+     - `detail/`: Read-only detail views per resource type. Complex resources use subdirectories with tabs.
+     - `dialog/`: Modal dialogs for operations (VM clone/migrate/restart, backup/restore, device passthrough, etc.).
+     - `edit/`: Create/edit forms. Complex resources (e.g., VM) split into subcomponents (CpuMemory, Network, Volume, CloudConfig, etc.).
+     - `formatters/`: Table cell formatters — state badges, usage bars, resource references.
+     - `l10n/`: Localization (`en-us.yaml`).
+     - `list/`: List (table) views per resource type, mirroring `detail/` and `edit/` naming.
+     - `mixins/`: Shared Vue mixins — VM helpers (`harvester-vm/`) and disk helpers (`harvester-disk.js`).
+     - `models/`: Model classes extending `SteveModel` with computed properties and actions. Base class: `harvester.js`.
+     - `pages/`: Route-level pages — dashboard, support, console, members, brand, alertmanager.
+     - `promptRemove/`: Custom delete-confirmation dialogs (VM, backup).
+     - `routing/`: Vue Router config — all product routes (CRUD, console, support, upgrade, etc.).
+     - `store/`: Vuex modules — `harvester-common.js` for shared state; `harvester-store/` for VM/resource creation actions with Steve integration.
+     - `styles/`: Global SCSS files.
+     - `utils/`: Helpers — VM volume templates, CPU/memory calc, cron parsing, regex validators, feature flags.
+     - `validators/`: Form validation functions per resource type, pushing i18n error messages.
+  
+  
+
+## Harvester UI Extension Development Guide
+
+1. Backward Compatibility
+The Harvester UI Extension supports earlier cluster versions (e.g., UI Ext v1.8.0 works with clusters v1.7.0 and v1.6.0). It uses Feature Flags defined in pkg/config/feature-flags to ensure the UI matches the cluster's specific version.
+
+2. Implementation Steps for New Features
+To add a feature in a new release, follow these steps:
+
+    Register: Add a unique [Feature Name] to the corresponding release array in the configuration.
+
+    Check: Use the following getter to verify if the feature is enabled for the current version:
+
+    ```
+    computed: {
+      newFeatureEnabled() {
+        return this.$store.getters['harvester-common/getFeatureEnabled']('[Feature Name]');
+      },
+    },
+    ```
+    Render: Use the result of the check to conditionally render the UI components.
+

docs/agents.md/contributors/2_e2e-tests.md

@@ -0,0 +1,3 @@
+## E2E Tests (Cypress)
+
+See https://github.com/harvester/harvester-ui-tests

docs/agents.md/contributors/node-dependencies.md

@@ -0,0 +1,12 @@
+## Node Dependencies
+
+Dependencies are managed via `package.json` and `yarn`
+
+- To install dependencies use `yarn install`. This will fail if dependencies and versions listed in `package.json` are out of step with the `yarn.lock` file
+- To add a dependency use `yarn run add:no-lock ...` instead of `yarn add`
+- To upgrade a dependency use `yarn run upgrade:no-lock ...` instead of `yarn upgrade`
+
+
+Renovate automatically updates dependencies and opens upgrade PRs after 10:00 AM on Sundays (`Asia/Taipei`).
+For the Renovate config, see `.github/renovate.json`.
+

docs/agents.md/contributors/resolving_gh_issues.md

@@ -0,0 +1,58 @@
+## Milestone guidance
+
+- All issues must first be resolved in the `main` branch
+- If backports are needed they can be made via the backport bot
+  - pull requests
+    - comment `@Mergifyio backport <target branch>` e.g. `@Mergifyio backport release-harvester-v1.8`
+    - All backported pull requests must link to a backported issue
+
+
+## Creating a branch
+
+### To resolve an issue
+- Checkout the branch matching the milestone of the issue `git checkout ${targetMilestoneBranch}`. Replace `${targetMilestoneBranch}` with the target milestone of the issue. For example
+  - `main` for the latest unreleased minor version
+  - `release-harvester-v.X` for release minor versions
+    - `release-harvester-v1.6`
+    - `release-harvester-v1.7`
+    - `release-harvester-v1.8`
+- Ensure you have the latest of that branch `git pull --rebase`
+- Checkout the branch to commit the changes to `git checkout issue-${issueNumber}`. Replace `${issueNumber}` with the issue number.
+
+## Creating a commit
+
+- This project uses commit-lint with [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/) to ensure consistent and meaningful commit messages.
+
+### Commit Message Format
+All commit messages must follow the conventional commit format:
+```
+<type>[optional scope]: <description>
+
+[optional body]
+
+[optional footer(s)]
+```
+
+### Supported Types
+- feat: New features
+- fix: Bug fixes
+- docs: Documentation changes
+- style: Code style changes (formatting, missing semicolons, etc.)
+- refactor: Code refactoring
+- perf: Performance improvements
+- test: Adding or updating tests
+- build: Build system or external dependencies
+- ci: CI/CD changes
+- chore: Other changes that don't modify src or test files
+- revert: Reverts a previous commit
+- wip: Work in progress
+- deps: Dependency updates
+- security: Security fixes
+
+## Creating a Pull Request
+
+- Pull requests must come from forks
+- Description should always have commit supported type prefix. E.g `fix: XXX`, `feat: OOO`
+- A Pull Request will only be merged once
+  - ALL CI gates have passed
+  - At least one harvester/harvester-ui-extension code owners reviews and approves the PR

docs/agents.md/personas/software_developer.md

@@ -0,0 +1,5 @@
+## Software Developer
+
+You are an expert Senior Software Engineer specializing in Vue.js and TypeScript. You have deep knowledge of Kubernetes and the Rancher ecosystem.
+- **Focus**: Writing clean, maintainable, and performant code.
+- **Priorities**: Adhering to the project's code style, ensuring type safety, and following best practices for component design.

docs/agents.md/template_agents.md

@@ -0,0 +1,22 @@
+> This `./AGENTS.md` file is generated by running `yarn agents:generate`.
+
+
+# Project Overview
+
+The Harvester UI Extension is a Rancher extension that provides the user interface for Harvester within the Rancher Dashboard.
+
+```
+Note: This extension is available starting from Rancher 2.10.0. Ensure your Rancher version is 2.10.0 or later to access Harvester integration.
+```
+
+# Personas
+
+`<personas>`
+
+# Agents
+
+`<agents>`
+
+# Contributors Guide
+
+`<contributors>`

package.json

@@ -1,36 +1,41 @@
 {
   "name": "harvester-ui-extension",
-  "version": "1.6.0-dev",
+  "version": "1.9.0-rc2",
   "private": false,
   "engines": {
-    "node": ">=20.0.0"
+    "node": ">=24.0.0"
   },
   "dependencies": {
-    "@babel/plugin-transform-class-static-block": "7.26.0",
-    "@rancher/shell": "3.0.5-rc.3",
+    "@babel/plugin-transform-class-static-block": "7.29.7",
+    "@rancher/shell": "3.0.12-rc.3",
+    "@vue-flow/background": "^1.3.0",
+    "@vue-flow/controls": "^1.1.1",
+    "@vue-flow/core": "^1.33.5",
+    "@vue-flow/minimap": "^1.4.0",
     "cache-loader": "^4.1.0",
     "color": "4.2.3",
     "ip": "2.0.1",
     "node-polyfill-webpack-plugin": "^3.0.0",
+    "elkjs": "^0.11.0",
     "vue-draggable-next": "^2.2.1",
     "yaml": "^2.5.1"
   },
   "resolutions": {
-    "@types/node": "~20.10.0",
-    "cronstrue": "2.50.0",
+    "@types/node": "25.9.4",
+    "cronstrue": "2.59.0",
     "d3-color": "3.1.0",
     "ejs": "3.1.10",
-    "follow-redirects": "1.15.6",
+    "follow-redirects": "1.16.0",
     "glob": "7.2.3",
     "glob-parent": "6.0.2",
     "json5": "2.2.3",
-    "@types/lodash": "4.17.5",
+    "@types/lodash": "4.17.24",
     "merge": "2.1.1",
-    "node-forge": "1.3.1",
+    "node-forge": "1.4.0",
     "nth-check": "2.1.1",
-    "qs": "6.11.1",
-    "roarr": "7.0.4",
-    "semver": "7.5.4",
+    "qs": "6.15.3",
+    "roarr": "7.21.6",
+    "semver": "7.8.5",
     "@vue/cli-service/html-webpack-plugin": "^5.0.0"
   },
   "scripts": {
@@ -38,14 +43,17 @@
     "build": "./node_modules/.bin/vue-cli-service build",
     "clean": "./node_modules/@rancher/shell/scripts/clean",
     "lint": "./node_modules/.bin/eslint --max-warnings 0 --ext .js,.ts,.vue .",
+    "lint:fix": "./node_modules/.bin/eslint --fix --max-warnings 0 --ext .js,.ts,.vue .",
     "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",
     "parse-tag-name": "./node_modules/@rancher/shell/scripts/extension/parse-tag-name",
     "commitlint": "commitlint --edit",
-    "prepare": "husky"
+    "prepare": "husky",
+    "agents:generate": "./scripts/generate-agent-and-persona-mds.sh"
   },
   "devDependencies": {
+    "@commitlint/load": "^19.8.1",
     "@commitlint/cli": "^19.8.1",
     "@commitlint/config-conventional": "^19.8.1",
     "eslint-plugin-node": "^11.1.0",

pkg/harvester/README.md

@@ -0,0 +1,177 @@
+# harvester-ui-extension
+
+The Harvester UI Extension is a Rancher extension that provides the user interface for [Harvester](https://harvesterhci.io) within the [Rancher Dashboard](https://github.com/rancher/dashboard).
+
+> **Note:**
+> This extension is available starting from **Rancher 2.10.0**. Ensure your Rancher version is **2.10.0 or later** to access Harvester integration.
+
+## Installation
+
+For Harvester UI extension installation instructions, please refer to the page **Rancher Integration** -> **Harvester UI Extension** in [official Harvester documentation](https://docs.harvesterhci.io).
+
+## Development Setup
+
+Ensure **Node.js v20 or later** is installed for development and debugging.
+
+### Standalone Mode
+
+Run the extension standalone with hot reload at `https://localhost:8005`.
+
+```bash
+# Install dependencies
+yarn install
+
+# Start the development server
+RANCHER_ENV=harvester API=https://your-harvester-ip yarn dev
+
+# Example with specific server version
+RANCHER_ENV=harvester VUE_APP_SERVER_VERSION=v1.5.0 API=https://192.168.1.123 yarn dev
+```
+
+You may also define environment variables in a `.env` file:
+
+```env
+RANCHER_ENV=harvester
+VUE_APP_SERVER_VERSION=v1.5.0
+API=https://192.168.1.123
+```
+
+### Rancher Integration Mode
+
+To run as a Rancher extension, follow the [Rancher UI Extension Guide](https://extensions.rancher.io/extensions/next/extensions-getting-started#running-the-app).
+
+```bash
+API=https://your-rancher-ip yarn dev
+```
+
+## Commit Message Guidelines
+
+This project uses [commit-lint](https://commitlint.js.org/) with [Conventional Commits](https://www.conventionalcommits.org/) to ensure consistent and meaningful commit messages.
+
+### Commit Message Format
+
+All commit messages must follow the conventional commit format:
+
+```
+<type>[optional scope]: <description>
+
+[optional body]
+
+[optional footer(s)]
+```
+
+### Supported Types
+
+- **feat**: New features
+- **fix**: Bug fixes
+- **docs**: Documentation changes
+- **style**: Code style changes (formatting, missing semicolons, etc.)
+- **refactor**: Code refactoring
+- **perf**: Performance improvements
+- **test**: Adding or updating tests
+- **build**: Build system or external dependencies
+- **ci**: CI/CD changes
+- **chore**: Other changes that don't modify src or test files
+- **revert**: Reverts a previous commit
+- **wip**: Work in progress
+- **deps**: Dependency updates
+- **security**: Security fixes
+
+### Examples
+
+```bash
+# Feature
+git commit -m "feat: add new virtual machine creation wizard"
+
+# Bug fix
+git commit -m "fix: resolve memory leak in VM console"
+
+# Documentation
+git commit -m "docs: update installation instructions"
+
+# Breaking change
+git commit -m "feat!: change API endpoint structure
+
+BREAKING CHANGE: The /api/v1/vms endpoint has been replaced with /api/v2/vms"
+```
+
+### Git Hooks
+
+The project uses [Husky](https://typicode.github.io/husky/) to automatically validate commit messages and run linting before commits:
+
+- **pre-commit**: Runs ESLint to ensure code quality
+- **commit-msg**: Validates commit message format using commit-lint
+
+These hooks are automatically installed when you run `yarn install`.
+
+### Manual Validation
+
+You can manually validate commit messages:
+
+```bash
+# Validate the last commit
+yarn commitlint
+
+# Validate a specific commit
+npx commitlint --from <commit-hash>
+
+# Validate a range of commits
+npx commitlint --from <start-hash> --to <end-hash>
+```
+
+## Branch Structure
+
+- **`main`** – Main development branch
+- **`release-harvester-vX.Y`** – Stable release branches per version series
+- **`vX.Y-head`** – Testing branches for ongoing changes to extension builds in each release series
+
+> **Note:**
+> The `vX.Y-head` branches are auto-generated and kept in sync with release branches. Use these for testing the latest changes in each version series.
+
+## Testing Guidelines
+
+### UI Extension Testing
+
+To validate changes in a release series, switch to the appropriate `vX.Y-head` branch. For main branch testing, use `main-head`.
+
+- Examples:
+  - Test `1.0.x` series → `v1.0-head`
+  - Test `1.5.x` series → `v1.5-head`
+
+**Steps:**
+1. Navigate to **Rancher UI** → **Local** → **App** → **Repositories**
+2. Refresh the Harvester repository using the target `vX.Y-head` branch
+3. Go to the **Extensions** page and install the desired version
+
+### Standalone Mode Testing
+
+To test the standalone UI, configure Harvester to load the UI from an external source.
+
+- Examples of `ui-index`:
+  - Main branch → `https://releases.rancher.com/harvester-ui/dashboard/latest/index.html`
+  - Release series `1.5.x` → `https://releases.rancher.com/harvester-ui/dashboard/release-harvester-v1.5/index.html`
+
+**Steps:**
+1. Go to **Harvester UI** → **Advanced** → **Settings** → **UI**
+2. Set **ui-source** to `External`
+3. Set **ui-index** to the desired URL
+
+## Contributing
+
+If you want to contribute, start by reading this document, then visit our [Getting Started guide](https://extensions.rancher.io/extensions/next/extensions-getting-started) to learn how to develop and submit changes.
+
+## License
+
+Copyright (c) 2014-2026 [SUSE, LLC.](https://www.suse.com/)
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+[http://www.apache.org/licenses/LICENSE-2.0](http://www.apache.org/licenses/LICENSE-2.0)
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

pkg/harvester/components/HarvesterNodeSelector.vue

@@ -0,0 +1,186 @@
+<script>
+import { Banner } from '@components/Banner';
+import MatchExpressions from '@shell/components/form/MatchExpressions';
+import ResourceTable from '@shell/components/ResourceTable';
+import { _EDIT } from '@shell/config/query-params';
+import { convert, simplify, matching as selectorMatching } from '@shell/utils/selector';
+import throttle from 'lodash/throttle';
+import { NODE } from '@shell/config/types';
+import { NAME, AGE } from '@shell/config/table-headers';
+
+export default {
+  name: 'HarvesterNodeSelector',
+
+  components: {
+    Banner,
+    MatchExpressions,
+    ResourceTable,
+  },
+
+  props: {
+    mode: {
+      type:    String,
+      default: _EDIT,
+    },
+    value: {
+      type:     Object,
+      required: true,
+    },
+  },
+
+  async fetch() {
+    this.updateMatchingResources();
+  },
+
+  data() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    return {
+      matchingResources: {
+        matched: 0,
+        matches: [],
+        none:    true,
+        sample:  null,
+        total:   0,
+      },
+      tableHeaders: [
+        NAME,
+        {
+          name:      'host-ip',
+          labelKey:  'tableHeaders.hostIp',
+          search:    ['internalIp'],
+          value:     'internalIp',
+          sort:      ['internalIp'],
+          align:     'center',
+        },
+        {
+          name:          'cpuManager',
+          labelKey:      'harvester.tableHeaders.cpuManager',
+          value:         'id',
+          formatter:     'HarvesterCPUPinning',
+          width:         150,
+          align:         'center',
+        },
+        {
+          name:      'diskState',
+          labelKey:  'tableHeaders.diskState',
+          value:     'diskState',
+          formatter: 'HarvesterDiskState',
+          width:     130,
+        },
+        AGE,
+      ],
+      inStore,
+    };
+  },
+
+  watch: {
+    value: {
+      handler:   'updateMatchingResources',
+      deep:      true,
+    },
+    allResourcesInScope() {
+      this.updateMatchingResources();
+    },
+  },
+
+  computed: {
+    schema() {
+      return this.$store.getters[`${ this.inStore }/schemaFor`](NODE);
+    },
+
+    selectorExpressions: {
+      get() {
+        return convert(
+          this.value.matchLabels || {},
+          this.value.matchExpressions || []
+        );
+      },
+      set(selectorExpressions) {
+        const { matchLabels, matchExpressions } = simplify(selectorExpressions);
+
+        this.value['matchLabels'] = matchLabels;
+        this.value['matchExpressions'] = matchExpressions;
+        this.updateMatchingResources();
+      },
+    },
+
+    allNodes() {
+      return this.$store.getters[`${ this.inStore }/all`](NODE) || [];
+    },
+
+    allResourcesInScope() {
+      return this.allNodes.length;
+    },
+  },
+
+  methods: {
+    updateMatchingResources: throttle(function() {
+      const expressions = this.selectorExpressions;
+      const allNodes = this.allNodes;
+
+      // Empty expressions with no key = no match
+      const hasValidExpression = expressions.length > 0 && expressions.every((e) => !!e.key);
+
+      if (!hasValidExpression) {
+        this.matchingResources = {
+          matched: 0,
+          matches: [],
+          none:    true,
+          sample:  null,
+          total:   allNodes.length,
+        };
+
+        return;
+      }
+
+      const matches = selectorMatching(allNodes, expressions, 'metadata.labels');
+
+      this.matchingResources = {
+        matched: matches.length,
+        matches,
+        none:    matches.length === 0,
+        sample:  matches[0]?.nameDisplay || null,
+        total:   allNodes.length,
+      };
+    }, 100, { trailing: true })
+  },
+};
+</script>
+
+<template>
+  <div>
+    <div class="row">
+      <div class="col span-12">
+        <MatchExpressions
+          v-model:value="selectorExpressions"
+          :mode="mode"
+          :show-remove="false"
+          :type="'node'"
+          :target-resources="allResourcesInScope"
+        />
+      </div>
+    </div>
+    <div class="row">
+      <div class="col span-12">
+        <Banner :color="(matchingResources.none ? 'warning' : 'success')">
+          <span v-clean-html="t('generic.selectors.matchingResources.matchesSome', matchingResources)" />
+        </Banner>
+      </div>
+    </div>
+    <div class="row">
+      <div class="col span-12">
+        <ResourceTable
+          :rows="matchingResources.matches"
+          :headers="tableHeaders"
+          key-field="id"
+          :table-actions="false"
+          :row-actions="false"
+          :schema="schema"
+          :groupable="false"
+          :search="false"
+        />
+      </div>
+    </div>
+  </div>
+</template>

pkg/harvester/components/HarvesterUpgradeProgressBarList.vue

@@ -1,6 +1,8 @@
 <script>
 import Collapse from '@shell/components/Collapse';
 import PercentageBar from '@shell/components/PercentageBar';
+import { HCI } from '../types';
+import { HCI as HCI_ANNOTATIONS } from '@pkg/harvester/config/labels-annotations';
 
 export default {
   name:       'HarvesterUpgradeProgressList',
@@ -25,13 +27,45 @@ export default {
     }
   },
 
+  async fetch() {
+    await this.$store.dispatch('harvester/findAll', { type: HCI.UPGRADE });
+  },
+
   data() {
     return { open: true };
   },
 
+  computed: {
+    showResumeButton() {
+      return this.title === 'Upgrading Node';
+    },
+    latestUpgradeCR() {
+      return this.$store.getters['harvester/all'](HCI.UPGRADE).find( (U) => U.isLatestUpgrade);
+    },
+    resumeUpgradePausedNodeEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('resumeUpgradePausedNode');
+    },
+  },
   methods: {
     handleSwitch() {
       this.open = !this.open;
+    },
+    async resumeNodeUpgrade(nodeName) {
+      if (!this.latestUpgradeCR || !nodeName) return;
+
+      try {
+        const upgradePauseMapString = this.latestUpgradeCR.metadata.annotations[HCI_ANNOTATIONS.NODE_UPGRADE_PAUSE_MAP] || '{}';
+        const upgradePauseMap = JSON.parse(upgradePauseMapString);
+
+        // update the upgrade CR annotation harvesterhci.io/node-upgrade-pause-map to unpause the node upgrade process
+        upgradePauseMap[`${ nodeName }`] = 'unpause';
+        this.latestUpgradeCR.setAnnotation(HCI_ANNOTATIONS.NODE_UPGRADE_PAUSE_MAP, JSON.stringify(upgradePauseMap));
+        await this.latestUpgradeCR.save();
+      } catch (e) {
+        console.error(`unable to update harvester upgrade CR annotations: ${ this.latestUpgradeCR.id }.`, e); // eslint-disable-line no-console
+
+        return false;
+      }
     }
   }
 };
@@ -63,12 +97,28 @@ export default {
               v-for="(item, i) in list"
               :key="i"
             >
-              <p>
-                {{ item.name }} <span
-                  class="status"
-                  :class="{ [item.state]: true }"
-                >{{ item.state }}</span>
-              </p>
+              <div class="upgrade-node-header">
+                <div class="upgrade-node-title">
+                  <p>
+                    {{ item.name }}
+                  </p>
+                  <span
+                    class="status"
+                    :class="{ [item.state]: true }"
+                  >
+                    {{ item.state }}
+                  </span>
+                </div>
+                <button
+                  v-if="showResumeButton && resumeUpgradePausedNodeEnabled && item.state === 'Node-upgrade paused'"
+                  type="button"
+                  class="btn bg-info btn-sm"
+                  data-testid="add-item"
+                  @click="resumeNodeUpgrade(item.name)"
+                >
+                  {{ t('action.resume') }}
+                </button>
+              </div>
               <PercentageBar
                 :model-value="item.percent"
                 preferred-direction="MORE"
@@ -102,10 +152,21 @@ export default {
     }
   }
   .custom-content {
-    margin-bottom: 14px;
-    p {
+    .upgrade-node-title {
+      flex: 1 0 80%;
+      margin-right: 10px;
+      display: flex;
+      justify-content: space-between;
+    }
+    .upgrade-node-header {
+      display:flex;
+      justify-content: space-between;
+      align-items: center;
       margin-bottom: 4px;
     }
+
+    margin-bottom: 14px;
+
     .status {
       float: right;
     }
@@ -117,6 +178,8 @@ export default {
     }
     .warning {
       color: var(--error);
+      margin-bottom: 8px;
+      margin-top: 4px;
     }
   }
 }

pkg/harvester/components/MappingsCell.vue

@@ -0,0 +1,59 @@
+<script setup>
+defineProps({
+  networkEntries: {
+    type:    Array,
+    default: () => [],
+  },
+  storageEntries: {
+    type:    Array,
+    default: () => [],
+  },
+});
+</script>
+
+<template>
+  <div class="mappings-cell">
+    <div
+      v-for="(entry, idx) in networkEntries"
+      :key="'net-' + idx"
+      class="mapping-entry"
+    >
+      <i
+        class="icon icon-network"
+        aria-hidden="true"
+      />
+      <span>{{ entry }}</span>
+    </div>
+    <div
+      v-for="(entry, idx) in storageEntries"
+      :key="'stor-' + idx"
+      class="mapping-entry"
+    >
+      <i
+        class="icon icon-datastore"
+        aria-hidden="true"
+      />
+      <span>{{ entry }}</span>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .mappings-cell {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .mapping-entry {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 13px;
+    color: var(--muted);
+
+    .icon {
+      font-size: 16px;
+    }
+  }
+</style>

pkg/harvester/components/Members.vue

@@ -122,7 +122,7 @@ export default {
       return this.$store.getters['currentCluster'].isLocal;
     },
     canEditClusterMembers() {
-      return this.normanClusterRTBSchema?.collectionMethods.find((x) => x.toLowerCase() === 'post');
+      return this.schema?.collectionMethods.find((x) => x.toLowerCase() === 'post');
     },
   },
 };

pkg/harvester/components/SettingList.vue

@@ -3,13 +3,14 @@ import { mapGetters } from 'vuex';
 import ActionMenu from '@shell/components/ActionMenuShell';
 import { Banner } from '@components/Banner';
 import AsyncButton from '@shell/components/AsyncButton';
-import { HCI_ALLOWED_SETTINGS, HCI_SETTING } from '../config/settings';
+import { HCI_ALLOWED_SETTINGS, HCI_SINGLE_CLUSTER_ALLOWED_SETTING, HCI_SETTING } from '../config/settings';
+import { DOC } from '../config/doc-links';
+import { docLink } from '../utils/feature-flags';
 
 const CATEGORY = {
   ui: [
     'branding',
     'ui-source',
-    'ui-plugin-index',
     'ui-index',
   ]
 };
@@ -96,8 +97,12 @@ export default {
           return true;
         }
 
-        const description = this.t(setting.description, {}, true)?.toLowerCase() || '';
+        let description = this.t(setting.description, this.getDocLinkParams(setting) || {}, true)?.toLowerCase() || '';
 
+        // remove <a> tags from description
+        if (description.includes('<a')) {
+          description = description.replace(/<a[^>]*>(.*?)<\/a>/g, '$1');
+        }
         // filter by description
         if (description.includes(searchQuery)) {
           return true;
@@ -193,6 +198,19 @@ export default {
         }
         buttonDone(false);
       }
+    },
+
+    getDocLinkParams(setting) {
+      const settingConfig = HCI_ALLOWED_SETTINGS[setting.id] || HCI_SINGLE_CLUSTER_ALLOWED_SETTING[setting.id];
+
+      if (settingConfig?.docPath) {
+        const version = this.$store.getters['harvester-common/getServerVersion']();
+        const url = docLink(DOC[settingConfig.docPath], version);
+
+        return { url };
+      }
+
+      return {};
     }
   },
 };
@@ -223,7 +241,7 @@ export default {
               Experimental
             </span>
           </h1>
-          <h2 v-clean-html="t(setting.description, {}, true)">
+          <h2 v-clean-html="t(setting.description, getDocLinkParams(setting) || {}, true)">
           </h2>
         </div>
         <div

pkg/harvester/components/VMConsoleBar.vue

@@ -58,11 +58,14 @@ export default {
 
       const url = `https://${ host }${ prefix }/${ PRODUCT_NAME }/c/${ params.cluster }/console/${ uid }/${ type }`;
 
-      window.open(
-        url,
-        '_blank',
-        `toolbars=0,width=${ screen.width - 200 },height=${ screen.height - 200 },left=0,top=0,noreferrer`
-      );
+      // Defer so v-select can finish closing the dropdown before the popup steals focus
+      this.$nextTick(() => {
+        window.open(
+          url,
+          '_blank',
+          `toolbars=0,width=${ screen.width - 200 },height=${ screen.height - 200 },left=0,top=0,noreferrer`
+        );
+      });
     },
 
     isEmpty(o) {

pkg/harvester/components/novnc/NovncConsoleWrapper.vue

@@ -257,8 +257,12 @@ export default {
       });
     },
 
+    reconnect() {
+      this.$refs.novncConsole.reconnect();
+    },
+
     softReboot() {
-      this.vmResource.softrebootVM();
+      this.vmResource.doSoftReboot();
     },
 
     showKeysModal() {
@@ -306,6 +310,13 @@ export default {
           {{ t("harvester.action.softreboot") }}
         </button>
 
+        <button
+          class="btn btn-sm bg-primary"
+          @click="reconnect"
+        >
+          {{ t("harvester.action.reconnect") }}
+        </button>
+
         <v-dropdown
           v-if="!hideCustomKeysBar"
           ref="customKeyPopover"
@@ -372,3 +383,15 @@ export default {
     background: rgb(40, 40, 40);
   }
 </style>
+
+<style lang="scss">
+  .vm-console .v-popper__arrow-container {
+    display: none;
+  }
+  .vm-console .v-popper__popper{
+    margin-top: 8px;
+  }
+  .vm-console .v-popper__inner{
+    overflow-y: visible;
+  }
+</style>

pkg/harvester/components/settings/cluster-pod-security-standard.vue

@@ -0,0 +1,196 @@
+<script>
+import { RadioGroup } from '@components/Form/Radio';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { NAMESPACE } from '@shell/config/types';
+import CreateEditView from '@shell/mixins/create-edit-view';
+
+export default {
+  name: 'HarvesterClusterPodSecurityStandard',
+
+  components: {
+    RadioGroup,
+    LabeledSelect,
+  },
+
+  mixins: [CreateEditView],
+
+  props: {
+    value: {
+      type:    Object,
+      default: () => ({}),
+    },
+  },
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    await this.$store.dispatch(`${ inStore }/findAll`, { type: NAMESPACE });
+  },
+
+  data() {
+    let enabled = false;
+    let whitelistedNamespaces = [];
+    let privilegedNamespaces = [];
+    let restrictedNamespaces = [];
+
+    try {
+      const parsed = JSON.parse(this.value.value || this.value.default || '{}');
+
+      enabled = !!parsed.enabled;
+      whitelistedNamespaces = parsed.whitelistedNamespacesList ? parsed.whitelistedNamespacesList.split(',') : [];
+      privilegedNamespaces = parsed.privilegedNamespacesList ? parsed.privilegedNamespacesList.split(',') : [];
+      restrictedNamespaces = parsed.restrictedNamespacesList ? parsed.restrictedNamespacesList.split(',') : [];
+    } catch (e) {
+      enabled = false;
+      whitelistedNamespaces = [];
+      privilegedNamespaces = [];
+      restrictedNamespaces = [];
+    }
+
+    return {
+      enabled,
+      whitelistedNamespaces,
+      privilegedNamespaces,
+      restrictedNamespaces,
+    };
+  },
+
+  computed: {
+    enabledOptions() {
+      return [
+        { label: this.t('generic.enabled'), value: true },
+        { label: this.t('generic.disabled'), value: false },
+      ];
+    },
+
+    allNamespaces() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+
+      return this.$store.getters[`${ inStore }/all`](NAMESPACE).filter((ns) => !ns.isSystem).map((ns) => ns.id);
+    },
+
+    whitelistedOptions() {
+      const excluded = new Set([...this.privilegedNamespaces, ...this.restrictedNamespaces]);
+
+      return this.allNamespaces.filter((ns) => !excluded.has(ns));
+    },
+
+    privilegedOptions() {
+      const excluded = new Set([...this.whitelistedNamespaces, ...this.restrictedNamespaces]);
+
+      return this.allNamespaces.filter((ns) => !excluded.has(ns));
+    },
+
+    restrictedOptions() {
+      const excluded = new Set([...this.whitelistedNamespaces, ...this.privilegedNamespaces]);
+
+      return this.allNamespaces.filter((ns) => !excluded.has(ns));
+    },
+  },
+
+  methods: {
+    useDefault() {
+      try {
+        const parsed = JSON.parse(this.value.default || '{}');
+
+        this.enabled = !!parsed.enabled;
+        this.whitelistedNamespaces = parsed.whitelistedNamespacesList ? parsed.whitelistedNamespacesList.split(',') : [];
+        this.privilegedNamespaces = parsed.privilegedNamespacesList ? parsed.privilegedNamespacesList.split(',') : [];
+        this.restrictedNamespaces = parsed.restrictedNamespacesList ? parsed.restrictedNamespacesList.split(',') : [];
+      } catch (e) {
+        this.enabled = false;
+        this.whitelistedNamespaces = [];
+        this.privilegedNamespaces = [];
+        this.restrictedNamespaces = [];
+      }
+      this.save();
+    },
+
+    onUpdateEnabled() {
+      if (!this.enabled) {
+        this.whitelistedNamespaces = [];
+        this.privilegedNamespaces = [];
+        this.restrictedNamespaces = [];
+      }
+      this.save();
+    },
+
+    updateWhitelisted(selected) {
+      this.whitelistedNamespaces = selected;
+      this.save();
+    },
+
+    updatePrivileged(selected) {
+      this.privilegedNamespaces = selected;
+      this.save();
+    },
+
+    updateRestricted(selected) {
+      this.restrictedNamespaces = selected;
+      this.save();
+    },
+
+    save() {
+      this.value.value = JSON.stringify({
+        enabled:                   this.enabled,
+        whitelistedNamespacesList: this.whitelistedNamespaces.join(','),
+        privilegedNamespacesList:  this.privilegedNamespaces.join(','),
+        restrictedNamespacesList:  this.restrictedNamespaces.join(','),
+      });
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <div class="row mb-20">
+      <div class="col span-6">
+        <RadioGroup
+          v-model:value="enabled"
+          name="enabled"
+          :options="enabledOptions"
+          @update:value="onUpdateEnabled"
+        />
+      </div>
+    </div>
+    <template v-if="enabled">
+      <div class="row mb-20">
+        <div class="col span-12">
+          <LabeledSelect
+            v-model:value="whitelistedNamespaces"
+            :label="t('harvester.setting.clusterPodSecurityStandard.whitelistedNamespaces.label')"
+            :options="whitelistedOptions"
+            :multiple="true"
+            :mode="mode"
+            @update:value="updateWhitelisted"
+          />
+        </div>
+      </div>
+      <div class="row mb-20">
+        <div class="col span-12">
+          <LabeledSelect
+            v-model:value="privilegedNamespaces"
+            :label="t('harvester.setting.clusterPodSecurityStandard.privilegedNamespaces.label')"
+            :options="privilegedOptions"
+            :multiple="true"
+            :mode="mode"
+            @update:value="updatePrivileged"
+          />
+        </div>
+      </div>
+      <div class="row mb-20">
+        <div class="col span-12">
+          <LabeledSelect
+            v-model:value="restrictedNamespaces"
+            :label="t('harvester.setting.clusterPodSecurityStandard.restrictedNamespaces.label')"
+            :options="restrictedOptions"
+            :multiple="true"
+            :mode="mode"
+            @update:value="updateRestricted"
+          />
+        </div>
+      </div>
+    </template>
+  </div>
+</template>

pkg/harvester/components/settings/cluster-registration-url.vue

@@ -0,0 +1,123 @@
+<script>
+import MessageLink from '@shell/components/MessageLink';
+import CreateEditView from '@shell/mixins/create-edit-view';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { HCI_SETTING } from '../../config/settings';
+import { Checkbox } from '@components/Form/Checkbox';
+import { Banner } from '@components/Banner';
+
+export default {
+  name: 'HarvesterEditClusterRegistrationURL',
+
+  components: {
+    LabeledInput, MessageLink, Checkbox, Banner
+  },
+
+  mixins: [CreateEditView],
+
+  data() {
+    let parseDefaultValue = {};
+
+    try {
+      parseDefaultValue = JSON.parse(this.value.value);
+    } catch (error) {
+      parseDefaultValue.url = this.value.value;
+      parseDefaultValue.insecureSkipTLSVerify = true;
+    }
+
+    return {
+      parseDefaultValue,
+      errors: []
+    };
+  },
+
+  computed: {
+    toCA() {
+      return `${ HCI_SETTING.ADDITIONAL_CA }?mode=edit`;
+    },
+    clusterRegistrationTLSVerifyEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('clusterRegistrationTLSVerify');
+    },
+    registrationURL: {
+      get() {
+        return this.clusterRegistrationTLSVerifyEnabled ? this.parseDefaultValue.url : this.parseDefaultValue;
+      },
+
+      set(value) {
+        if (this.clusterRegistrationTLSVerifyEnabled) {
+          this.parseDefaultValue.url = value;
+        } else {
+          this.parseDefaultValue = value;
+        }
+      }
+    }
+  },
+
+  methods: {
+    getDefaultValue() {
+      if (this.clusterRegistrationTLSVerifyEnabled) {
+        return { url: '', insecureSkipTLSVerify: false };
+      } else {
+        return '';
+      }
+    },
+
+    updateUrl() {
+      this.update();
+    },
+
+    update() {
+      if (this.clusterRegistrationTLSVerifyEnabled) {
+        this.value['value'] = JSON.stringify(this.parseDefaultValue);
+      } else {
+        this.value['value'] = this.parseDefaultValue;
+      }
+    },
+
+    useDefault() {
+      this.parseDefaultValue = this.getDefaultValue();
+    },
+
+    updateInsecureSkipTLSVerify(newValue) {
+      const { url = '' } = this.parseDefaultValue;
+
+      this.parseDefaultValue = { url, insecureSkipTLSVerify: newValue };
+      this.update();
+    },
+  }
+};
+</script>
+
+<template>
+  <div
+    class="row"
+  >
+    <div class="col span-12">
+      <Banner color="info">
+        <MessageLink
+          :to="toCA"
+          target="_blank"
+          prefix-label="harvester.setting.clusterRegistrationUrl.tip.prefix"
+          middle-label="harvester.setting.clusterRegistrationUrl.tip.middle"
+          suffix-label="harvester.setting.clusterRegistrationUrl.tip.suffix"
+        />
+      </Banner>
+      <LabeledInput
+        v-model:value="registrationURL"
+        class="mb-20"
+        :mode="mode"
+        :label="t('harvester.setting.clusterRegistrationUrl.url')"
+        @update:value="updateUrl"
+      />
+      <div v-if="clusterRegistrationTLSVerifyEnabled">
+        <Checkbox
+          v-model:value="parseDefaultValue.insecureSkipTLSVerify"
+          class="check mb-5"
+          type="checkbox"
+          :label="t('harvester.setting.clusterRegistrationUrl.insecureSkipTLSVerify')"
+          @update:value="updateInsecureSkipTLSVerify"
+        />
+      </div>
+    </div>
+  </div>
+</template>

pkg/harvester/components/settings/csi-online-expand-validation.vue

@@ -0,0 +1,294 @@
+<script>
+import { _EDIT } from '@shell/config/query-params';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import InfoBox from '@shell/components/InfoBox';
+import { Banner } from '@components/Banner';
+import { allHash } from '@shell/utils/promise';
+import { CSI_DRIVER } from '../../types';
+import { LONGHORN_DRIVER } from '@shell/config/types';
+
+export default {
+  name: 'CSIOnlineExpandValidation',
+
+  components: {
+    Banner,
+    InfoBox,
+    LabeledSelect,
+  },
+
+  props: {
+    mode: {
+      type:    String,
+      default: _EDIT,
+    },
+    value: {
+      type:    Object,
+      default: () => ({}),
+    },
+    registerBeforeHook: {
+      type:     Function,
+      required: true,
+    },
+  },
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    try {
+      await allHash({ csiDrivers: this.$store.dispatch(`${ inStore }/findAll`, { type: CSI_DRIVER }) });
+      this.fetchError = null;
+    } catch (error) {
+      console.error('Failed to fetch CSI drivers:', error); // eslint-disable-line no-console
+      this.fetchError = this.t(
+        'harvester.setting.csiOnlineExpandValidation.failedToLoadDrivers',
+        { error: error.message || error },
+        true
+      );
+    }
+  },
+
+  data() {
+    return {
+      configArr:  [],
+      parseError: null,
+      fetchError: null,
+    };
+  },
+
+  created() {
+    const initValue = this.value.value || this.value.default || '{}';
+
+    this.configArr = this.parseValue(initValue);
+    this.registerBeforeHook?.(this.willSave, 'willSave');
+  },
+
+  computed: {
+    allErrors() {
+      const errors = [];
+
+      if (this.fetchError) {
+        errors.push(this.fetchError);
+      }
+      if (this.parseError) {
+        errors.push(this.parseError);
+      }
+
+      return errors;
+    },
+
+    csiDrivers() {
+      if (this.fetchError) return [];
+
+      const inStore = this.$store.getters['currentProduct'].inStore;
+
+      return this.$store.getters[`${ inStore }/all`](CSI_DRIVER) || [];
+    },
+
+    provisioners() {
+      const usedKeys = this.configArr.map(({ key }) => key);
+
+      return this.csiDrivers
+        .filter(({ name }) => !usedKeys.includes(name))
+        .map(({ name }) => name);
+    },
+
+    provisionerValue() {
+      return [
+        { label: 'True', value: true },
+        { label: 'False', value: false },
+      ];
+    },
+
+    disableAdd() {
+      return this.parseError || this.fetchError || this.configArr.length >= this.csiDrivers.length;
+    },
+
+    disableConfigEditing() {
+      return this.parseError || this.fetchError;
+    }
+  },
+
+  watch: {
+    'value.value'(newVal, oldVal) {
+      if (newVal !== oldVal) {
+        this.configArr = this.parseValue(newVal || '{}');
+      }
+    }
+  },
+
+  methods: {
+    _convertToBoolean(value) {
+      if (typeof value === 'boolean') return value;
+
+      if (typeof value === 'string') {
+        const lowerCaseValue = value.toLowerCase();
+
+        if (lowerCaseValue === 'true') return true;
+        if (lowerCaseValue === 'false') return false;
+      }
+
+      return false; // default to false for any other string or non-boolean type
+    },
+    parseValue(raw) {
+      try {
+        const json = JSON.parse(raw);
+
+        this.parseError = null;
+
+        return Object.entries(json).map(([key, value]) => ({
+          key,
+          value: this._convertToBoolean(value),
+        }));
+      } catch (e) {
+        console.error('[CSIOnlineExpandValidation] JSON Parsing Error:', raw, e); // eslint-disable-line no-console
+        this.parseError = this.t(
+          'harvester.setting.csiOnlineExpandValidation.invalidJsonFormat',
+          { error: e.message },
+          true
+        );
+
+        return [];
+      }
+    },
+
+    stringifyConfig() {
+      const obj = {};
+
+      this.configArr.forEach(({ key, value }) => {
+        obj[key] = value;
+      });
+
+      return this.configArr.length ? JSON.stringify(obj) : '';
+    },
+
+    update() {
+      this.value.value = this.stringifyConfig();
+    },
+
+    willSave() {
+      const errors = [];
+
+      this.configArr.forEach(({ key }) => {
+        if (!key) {
+          errors.push(
+            this.t('validation.required', { key: this.t('harvester.setting.csiOnlineExpandValidation.provisioner') }, true)
+          );
+        }
+      });
+
+      this.value.value = this.stringifyConfig();
+
+      return errors.length ? Promise.reject(errors) : Promise.resolve();
+    },
+
+    useDefault() {
+      this.configArr = this.parseValue(this.value.default || '{}');
+      this.update();
+    },
+
+    disableEdit(driverKey) {
+      return this.fetchError || driverKey === LONGHORN_DRIVER;
+    },
+
+    add() {
+      if (this.disableConfigEditing) return;
+
+      this.configArr.push({ key: '', value: true });
+    },
+
+    remove(index) {
+      if (this.disableConfigEditing) return;
+
+      this.configArr.splice(index, 1);
+      this.update();
+    },
+
+    onValueChange(idx, newVal) {
+      if (this.disableConfigEditing) return;
+
+      const val = newVal === 'true' ? true : newVal === 'false' ? false : newVal;
+
+      this.configArr[idx].value = val;
+      this.update();
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <Banner
+      v-for="(errorMsg, index) in allErrors"
+      :key="index"
+      color="error"
+    >
+      {{ errorMsg }}
+    </Banner>
+    <InfoBox
+      v-for="(driver, idx) in configArr"
+      :key="idx"
+      class="box"
+    >
+      <button
+        class="role-link btn btn-sm remove"
+        type="button"
+        :disabled="disableEdit(driver.key)"
+        @click="remove(idx)"
+      >
+        <i class="icon icon-x" />
+      </button>
+
+      <div class="row">
+        <div class="col span-4">
+          <LabeledSelect
+            v-model:value="driver.key"
+            label-key="harvester.setting.csiOnlineExpandValidation.provisioner"
+            required
+            searchable
+            :mode="mode"
+            :disabled="disableEdit(driver.key)"
+            :options="provisioners"
+            @update:value="update"
+            @keydown.native.enter.prevent
+          />
+        </div>
+
+        <div class="col span-4">
+          <LabeledSelect
+            v-model:value="driver.value"
+            :value="driver.value.toString()"
+            label-key="harvester.setting.csiOnlineExpandValidation.value"
+            required
+            searchable
+            :mode="mode"
+            :disabled="disableEdit(driver.key)"
+            :options="provisionerValue"
+            @update:value="val => onValueChange(idx, val)"
+            @keydown.native.enter.prevent
+          />
+        </div>
+      </div>
+    </InfoBox>
+
+    <button
+      class="btn btn-sm role-primary"
+      :disabled="disableAdd"
+      @click="add"
+    >
+      {{ t('generic.add') }}
+    </button>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.box {
+  position: relative;
+  padding-top: 40px;
+}
+.remove {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  padding: 0;
+}
+</style>

pkg/harvester/components/settings/instance-manager-resources.vue

@@ -0,0 +1,104 @@
+<script>
+import UnitInput from '@shell/components/form/UnitInput';
+import { Banner } from '@components/Banner';
+
+export default {
+  name: 'HarvesterInstanceManagerResources',
+
+  components: {
+    UnitInput,
+    Banner,
+  },
+
+  props: {
+    value: {
+      type:    Object,
+      default: () => ({
+        value:   '',
+        default: '{}'
+      })
+    },
+  },
+
+  data() {
+    const resources = this.parseJSON(this.value?.value) || this.parseJSON(this.value?.default) || {};
+
+    return {
+      resources,
+      parseError: null,
+    };
+  },
+
+  methods: {
+    parseJSON(string) {
+      try {
+        return JSON.parse(string);
+      } catch (e) {
+        this.parseError = this.t('harvester.setting.instanceManagerResources.parseError', { error: e.message });
+
+        return null;
+      }
+    },
+
+    update() {
+      if (!this.value) return;
+
+      const cpu = { ...this.resources?.cpu };
+
+      if (cpu.v1 !== null && cpu.v1 !== undefined) cpu.v1 = String(cpu.v1);
+      if (cpu.v2 !== null && cpu.v2 !== undefined) cpu.v2 = String(cpu.v2);
+
+      this.value.value = JSON.stringify({ ...this.resources, cpu });
+    },
+
+    useDefault() {
+      if (this.value?.default) {
+        this.resources = this.parseJSON(this.value.default) || {};
+        this.update();
+      }
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <Banner
+      v-if="parseError"
+      color="error"
+    >
+      {{ parseError }}
+    </Banner>
+
+    <div class="row">
+      <div class="col span-12">
+        <UnitInput
+          v-model:value="resources.cpu.v1"
+          :label="t('harvester.setting.instanceManagerResources.v1')"
+          suffix="%"
+          :delay="0"
+          type="number"
+          min="0"
+          max="100"
+          required
+          :mode="mode"
+          class="mb-20"
+          @update:value="update"
+        />
+        <UnitInput
+          v-model:value="resources.cpu.v2"
+          :label="t('harvester.setting.instanceManagerResources.v2')"
+          suffix="%"
+          :delay="0"
+          type="number"
+          min="0"
+          max="100"
+          required
+          :mode="mode"
+          class="mb-20"
+          @update:value="update"
+        />
+      </div>
+    </div>
+  </div>
+</template>

pkg/harvester/components/settings/kubevirt-migration.vue

@@ -0,0 +1,154 @@
+<script>
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { RadioGroup } from '@components/Form/Radio';
+import UnitInput from '@shell/components/form/UnitInput';
+import { MEBIBYTE } from '../../utils/unit';
+import { Banner } from '@components/Banner';
+
+export default {
+  name: 'KubevirtMigration',
+
+  components: {
+    LabeledInput,
+    UnitInput,
+    RadioGroup,
+    Banner
+  },
+
+  props: {
+    registerBeforeHook: {
+      type:     Function,
+      required: true
+    },
+    value: {
+      type:    Object,
+      default: () => ({
+        value:   '',
+        default: '{}'
+      })
+    },
+  },
+
+  data() {
+    const migration = this.parseJSON(this.value?.value) || this.parseJSON(this.value?.default) || {};
+
+    return {
+      MEBIBYTE,
+      migration,
+      parseError: null,
+    };
+  },
+
+  created() {
+    this.registerBeforeHook?.(this.willSave, 'willSave');
+  },
+
+  methods: {
+    parseJSON(string) {
+      try {
+        return JSON.parse(string);
+      } catch (e) {
+        this.parseError = this.t('kubevirtMigration.parseError', { error: e.message });
+        // eslint-disable-next-line no-console
+        console.error('Failed to parse JSON:', e.message);
+
+        return null;
+      }
+    },
+
+    updateValue() {
+      if (this.value) {
+        this.value.value = JSON.stringify(this.migration);
+      }
+    },
+
+    useDefault() {
+      if (this.value?.default) {
+        const defaultMigration = this.parseJSON(this.value.default) || {};
+
+        this.migration = defaultMigration;
+        this.updateValue();
+      }
+    },
+
+    async willSave() {
+      this.updateValue();
+
+      return Promise.resolve();
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <Banner
+      v-if="parseError"
+      color="error"
+    >
+      {{ parseError }}
+    </Banner>
+
+    <div class="migration-field">
+      <LabeledInput
+        v-model:value.number="migration.parallelMigrationsPerCluster"
+        :label="t('harvester.setting.kubevirtMigration.parallelMigrationsPerCluster')"
+        type="number"
+        min="1"
+      />
+      <LabeledInput
+        v-model:value.number="migration.parallelOutboundMigrationsPerNode"
+        :label="t('harvester.setting.kubevirtMigration.parallelOutboundMigrationsPerNode')"
+        type="number"
+        min="1"
+      />
+      <UnitInput
+        v-model:value="migration.bandwidthPerMigration"
+        min="0"
+        :label="t('harvester.setting.kubevirtMigration.bandwidthPerMigration')"
+        :mode="mode"
+        :suffix="MEBIBYTE"
+        :tooltip="t('harvester.setting.kubevirtMigration.bandwidthPerMigrationTooltip', _, true)"
+      />
+      <UnitInput
+        v-model:value="migration.completionTimeoutPerGiB"
+        :label="t('harvester.setting.kubevirtMigration.completionTimeoutPerGiB')"
+        :mode="mode"
+        :suffix="migration.completionTimeoutPerGiB === 1 ? 'Second' : 'Seconds'"
+        min="10"
+      />
+      <UnitInput
+        v-model:value="migration.progressTimeout"
+        :label="t('harvester.setting.kubevirtMigration.progressTimeout')"
+        :mode="mode"
+        :suffix="migration.progressTimeout === 1 ? 'Second' : 'Seconds'"
+        min="10"
+      />
+      <div
+        v-for="field in ['allowAutoConverge','allowPostCopy','unsafeMigrationOverride','allowWorkloadDisruption','disableTLS','matchSELinuxLevelOnMigration']"
+        :key="field"
+      >
+        <label
+          class="mb-5"
+          :for="field"
+        >{{ t(`harvester.setting.kubevirtMigration.${field}`) }}</label>
+        <RadioGroup
+          :id="field"
+          v-model:value="migration[field]"
+          :options="[
+            { label: t('advancedSettings.edit.trueOption'), value: true },
+            { label: t('advancedSettings.edit.falseOption'), value: false },
+          ]"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.migration-field {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+</style>

pkg/harvester/components/settings/rancher-cluster.vue

@@ -0,0 +1,222 @@
+<script>
+import CreateEditView from '@shell/mixins/create-edit-view';
+import { RadioGroup } from '@components/Form/Radio';
+import { SECRET } from '@shell/config/types';
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import FileSelector, { createOnSelected } from '@shell/components/form/FileSelector';
+import YamlEditor from '@shell/components/YamlEditor';
+
+export default {
+  name: 'HarvesterRancherCluster',
+
+  components: {
+    RadioGroup,
+    FileSelector,
+    YamlEditor
+  },
+
+  mixins: [CreateEditView],
+
+  props: {
+    value: {
+      type:    Object,
+      default: () => ({}),
+    },
+    registerBeforeHook: {
+      type:     Function,
+      required: false,
+      default:  () => {},
+    },
+  },
+
+  data() {
+    let parseDefaultValue = {};
+
+    try {
+      const data = this.value.value || this.value.default || '{}';
+      const parsed = JSON.parse(data);
+
+      parseDefaultValue = {
+        kubeConfig:                                  '',
+        removeUpstreamClusterWhenNamespaceIsDeleted: parsed.removeUpstreamClusterWhenNamespaceIsDeleted || false
+      };
+    } catch (error) {
+      parseDefaultValue = {
+        kubeConfig:                                  '',
+        removeUpstreamClusterWhenNamespaceIsDeleted: false
+      };
+    }
+
+    return {
+      parseDefaultValue,
+      errors:           [],
+      existingSecret:   null,
+    };
+  },
+
+  async created() {
+    await this.checkExistingSecret();
+    if (this.registerBeforeHook) {
+      this.registerBeforeHook(this.willSave, 'willSave');
+    }
+  },
+
+  methods: {
+    onKeySelected: createOnSelected('parseDefaultValue.kubeConfig'),
+
+    update() {
+      if (this.parseDefaultValue.removeUpstreamClusterWhenNamespaceIsDeleted) {
+        this.value['value'] = JSON.stringify({ removeUpstreamClusterWhenNamespaceIsDeleted: true });
+      } else {
+        this.value['value'] = this.value.default || '{}';
+      }
+    },
+
+    async checkExistingSecret() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+
+      await this.$store.dispatch(`${ inStore }/findAll`, { type: SECRET });
+      const secrets = this.$store.getters[`${ inStore }/all`](SECRET) || [];
+
+      this.existingSecret = secrets.find((secret) => secret.metadata.name === 'rancher-cluster-config' &&
+        secret.metadata.namespace === 'harvester-system'
+      );
+
+      // If the secret exists and has data, populate the kubeConfig
+      if (this.existingSecret?.data?.kubeConfig) {
+        const decodedContent = atob(this.existingSecret.data.kubeConfig);
+
+        this.parseDefaultValue.kubeConfig = decodedContent;
+        this.$nextTick(() => {
+          this.update();
+        });
+      }
+    },
+
+    async createOrUpdateRancherKubeConfigSecret() {
+      this.errors = [];
+      // Check if kubeConfig is provided
+      if (!this.parseDefaultValue.kubeConfig) {
+        this.errors.push(this.t('validation.required', { key: this.t('harvester.setting.rancherCluster.kubeConfig') }, true));
+
+        return Promise.reject(this.errors);
+      }
+
+      try {
+        let secret;
+
+        if (this.existingSecret) {
+          secret = this.existingSecret;
+          secret.setData('kubeConfig', this.parseDefaultValue.kubeConfig);
+        } else {
+          const inStore = this.$store.getters['currentProduct'].inStore;
+
+          secret = await this.$store.dispatch(`${ inStore }/create`, {
+            apiVersion: 'v1',
+            kind:       'Secret',
+            metadata:   {
+              name:      'rancher-cluster-config',
+              namespace: 'harvester-system'
+            },
+            type: 'secret',
+            data: { kubeConfig: btoa(this.parseDefaultValue.kubeConfig) }
+          });
+        }
+        await secret.save();
+
+        return Promise.resolve();
+      } catch (err) {
+        this.errors = exceptionToErrorsArray(err);
+
+        return Promise.reject(this.errors);
+      }
+    },
+
+    async deleteRancherKubeConfigSecret() {
+      if (this.existingSecret) {
+        this.existingSecret.remove();
+      }
+    },
+
+    async willSave() {
+      // Only create or update secret if enabled
+      if (this.parseDefaultValue.removeUpstreamClusterWhenNamespaceIsDeleted) {
+        await this.createOrUpdateRancherKubeConfigSecret();
+      } else {
+        await this.deleteRancherKubeConfigSecret();
+      }
+
+      return Promise.resolve();
+    },
+
+    useDefault() {
+      this.parseDefaultValue = {
+        kubeConfig:                                  '',
+        removeUpstreamClusterWhenNamespaceIsDeleted: false
+      };
+    }
+  },
+
+  watch: {
+    'parseDefaultValue.removeUpstreamClusterWhenNamespaceIsDeleted'(val, oldVal) {
+      if (val && !oldVal && this.existingSecret?.data?.kubeConfig) {
+        // Populate kubeConfig with the existing secret value
+        this.parseDefaultValue.kubeConfig = atob(this.existingSecret.data.kubeConfig);
+      }
+    },
+    'parseDefaultValue.kubeConfig'(val) {
+      this.$refs.yaml?.updateValue(val);
+    }
+  }
+};
+</script>
+
+<template>
+  <div>
+    <div class="row mt-20">
+      <div class="col span-12">
+        <RadioGroup
+          v-model:value="parseDefaultValue.removeUpstreamClusterWhenNamespaceIsDeleted"
+          :label="t('harvester.setting.rancherCluster.removeUpstreamClusterWhenNamespaceIsDeleted')"
+          name="removeUpstreamClusterWhenNamespaceIsDeleted"
+          :options="[true, false]"
+          :labels="[t('generic.enabled'), t('generic.disabled')]"
+          @update:value="update"
+        />
+      </div>
+    </div>
+    <div
+      v-if="parseDefaultValue.removeUpstreamClusterWhenNamespaceIsDeleted"
+      class="row mt-20"
+    >
+      <div class="col span-12">
+        <FileSelector
+          class="btn btn-sm bg-primary mb-10"
+          :label="t('generic.readFromFile')"
+          @selected="onKeySelected"
+        />
+        <YamlEditor
+          ref="yaml"
+          v-model:value="parseDefaultValue.kubeConfig"
+          class="yaml-editor"
+          :editor-mode="mode === 'view' ? 'VIEW_CODE' : 'EDIT_CODE'"
+          @update:value="update"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+$yaml-height: 540px;
+
+:deep() .yaml-editor{
+  flex: 1;
+  min-height: $yaml-height;
+  & .code-mirror .CodeMirror {
+    position: initial;
+    height: auto;
+    min-height: $yaml-height;
+  }
+}
+</style>

pkg/harvester/components/settings/rwx-network.vue

@@ -0,0 +1,371 @@
+<script>
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect.vue';
+import { RadioGroup } from '@components/Form/Radio';
+import ArrayList from '@shell/components/form/ArrayList';
+import { isValidCIDR } from '@shell/utils/validators/cidr';
+import { _EDIT } from '@shell/config/query-params';
+import { Banner } from '@components/Banner';
+import { allHash } from '@shell/utils/promise';
+import { HCI } from '../../types';
+import { NETWORK_TYPE } from '../../config/types';
+
+const { L2VLAN, UNTAGGED } = NETWORK_TYPE;
+const SHARE_STORAGE_NETWORK = 'share-storage-network';
+const NETWORK = 'network';
+
+const DEFAULT_DEDICATED_NETWORK = {
+  vlan:           '',
+  clusterNetwork: '',
+  range:          '',
+  exclude:        [],
+};
+
+export default {
+  name: 'RwxNetworkSetting',
+
+  components: {
+    RadioGroup,
+    Banner,
+    ArrayList,
+    LabeledInput,
+    LabeledSelect,
+  },
+
+  props: {
+    registerBeforeHook: {
+      type:     Function,
+      required: true,
+    },
+
+    mode: {
+      type:    String,
+      default: _EDIT,
+    },
+
+    value: {
+      type:    Object,
+      default: () => {
+        return {};
+      },
+    },
+  },
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    await allHash({
+      clusterNetworks: this.$store.dispatch(`${ inStore }/findAll`, { type: HCI.CLUSTER_NETWORK }),
+      vlanStatus:      this.$store.dispatch(`${ inStore }/findAll`, { type: HCI.VLAN_STATUS }),
+    });
+  },
+
+  data() {
+    let enabled = false; // enabled / disabled options
+    let shareStorageNetwork = false; // shareStorageNetwork / dedicatedRwxNetwork options
+    let dedicatedNetwork = { ...DEFAULT_DEDICATED_NETWORK };
+    let networkType = L2VLAN;
+    let exclude = [];
+
+    try {
+      const parsedValue = JSON.parse(this.value.value || this.value.default || '{}');
+      const parsedNetwork = parsedValue?.[NETWORK] || parsedValue || {};
+
+      if (parsedValue && typeof parsedValue === 'object') {
+        shareStorageNetwork = !!parsedValue[SHARE_STORAGE_NETWORK];
+        networkType = 'vlan' in parsedNetwork ? L2VLAN : UNTAGGED;
+        dedicatedNetwork = {
+          vlan:           parsedNetwork.vlan || '',
+          clusterNetwork: parsedNetwork.clusterNetwork || '',
+          range:          parsedNetwork.range || '',
+        };
+        exclude = parsedNetwork?.exclude?.toString().split(',') || [];
+        enabled = shareStorageNetwork || !!(parsedNetwork.vlan || parsedNetwork.clusterNetwork || parsedNetwork.range);
+      }
+    } catch (error) {
+      enabled = false;
+      shareStorageNetwork = false;
+      dedicatedNetwork = { ...DEFAULT_DEDICATED_NETWORK };
+    }
+
+    return {
+      enabled,
+      shareStorageNetwork,
+      dedicatedNetwork,
+      networkType,
+      exclude,
+      defaultAddValue: '',
+    };
+  },
+
+  created() {
+    if (this.registerBeforeHook) {
+      this.registerBeforeHook(this.willSave, 'willSave');
+    }
+  },
+
+  computed: {
+    showDedicatedNetworkConfig() {
+      return this.enabled && !this.shareStorageNetwork;
+    },
+
+    showVlan() {
+      return this.networkType === L2VLAN;
+    },
+
+    networkTypes() {
+      return [L2VLAN, UNTAGGED];
+    },
+
+    clusterNetworkOptions() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+      const clusterNetworks = this.$store.getters[`${ inStore }/all`](HCI.CLUSTER_NETWORK) || [];
+      const clusterNetworksOptions = this.networkType === UNTAGGED ? clusterNetworks.filter((network) => network.id !== 'mgmt') : clusterNetworks;
+
+      return clusterNetworksOptions.map((network) => {
+        const disabled = !network.isReadyForStorageNetwork;
+
+        return {
+          label: disabled ? `${ network.id } (${ this.t('generic.notReady') })` : network.id,
+          value: network.id,
+          disabled,
+        };
+      });
+    },
+  },
+
+  methods: {
+    onUpdateEnabled() {
+      if (!this.enabled) {
+        this.shareStorageNetwork = false;
+        this.dedicatedNetwork = { ...DEFAULT_DEDICATED_NETWORK };
+      }
+
+      this.update();
+    },
+
+    onUpdateNetworkType() {
+      if (this.shareStorageNetwork) {
+        this.dedicatedNetwork = { ...DEFAULT_DEDICATED_NETWORK };
+      }
+
+      this.update();
+    },
+
+    onUpdateDedicatedType(neu) {
+      this.dedicatedNetwork.clusterNetwork = '';
+
+      if (neu === L2VLAN) {
+        this.dedicatedNetwork.vlan = '';
+      } else {
+        delete this.dedicatedNetwork.vlan;
+      }
+
+      this.update();
+    },
+
+    inputVlan(neu) {
+      if (neu === '') {
+        this.dedicatedNetwork.vlan = '';
+        this.update();
+
+        return;
+      }
+
+      const newValue = Number(neu);
+
+      if (newValue > 4094) {
+        this.dedicatedNetwork.vlan = 4094;
+      } else if (newValue < 1) {
+        this.dedicatedNetwork.vlan = 1;
+      } else {
+        this.dedicatedNetwork.vlan = newValue;
+      }
+
+      this.update();
+    },
+
+    useDefault() {
+      this.enabled = false;
+      this.shareStorageNetwork = false;
+      this.dedicatedNetwork = { ...DEFAULT_DEDICATED_NETWORK };
+      this.update();
+    },
+
+    update() {
+      const value = { [SHARE_STORAGE_NETWORK]: false };
+
+      if (this.enabled && this.shareStorageNetwork) {
+        value[SHARE_STORAGE_NETWORK] = true;
+      }
+
+      if (this.showDedicatedNetworkConfig) {
+        value[NETWORK] = {};
+
+        if (this.showVlan) {
+          value[NETWORK].vlan = this.dedicatedNetwork.vlan;
+        }
+
+        value[NETWORK].clusterNetwork = this.dedicatedNetwork.clusterNetwork;
+        value[NETWORK].range = this.dedicatedNetwork.range;
+
+        const excludeList = this.exclude.filter((ip) => ip);
+
+        if (Array.isArray(excludeList) && excludeList.length > 0) {
+          value[NETWORK].exclude = excludeList;
+        }
+      }
+
+      this.value.value = JSON.stringify(value);
+    },
+
+    willSave() {
+      this.update();
+
+      if (!this.showDedicatedNetworkConfig) {
+        return Promise.resolve();
+      }
+
+      const errors = [];
+
+      if (this.showVlan && !this.dedicatedNetwork.vlan) {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.storageNetwork.vlan') }, true));
+      }
+
+      if (!this.dedicatedNetwork.clusterNetwork) {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.storageNetwork.clusterNetwork') }, true));
+      }
+
+      if (!this.dedicatedNetwork.range) {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.storageNetwork.range.label') }, true));
+      } else if (!isValidCIDR(this.dedicatedNetwork.range)) {
+        errors.push(this.t('harvester.setting.storageNetwork.range.invalid', null, true));
+      }
+
+      if (this.exclude) {
+        const hasInvalidCIDR = this.exclude.find((cidr) => {
+          return cidr && !isValidCIDR(cidr);
+        });
+
+        if (hasInvalidCIDR) {
+          errors.push(this.t('harvester.setting.storageNetwork.exclude.invalid', null, true));
+        }
+      }
+
+      if (errors.length > 0) {
+        return Promise.reject(errors);
+      }
+
+      return Promise.resolve();
+    },
+  },
+};
+</script>
+
+<template>
+  <div :class="mode">
+    <Banner color="warning">
+      <t
+        k="harvester.setting.rwxNetwork.warning"
+        :raw="true"
+      />
+    </Banner>
+    <RadioGroup
+      v-model:value="enabled"
+      class="mb-20"
+      name="rwx-network-enable"
+      :options="[true,false]"
+      :labels="[t('generic.enabled'), t('generic.disabled')]"
+      @update:value="onUpdateEnabled"
+    />
+
+    <RadioGroup
+      v-if="enabled"
+      v-model:value="shareStorageNetwork"
+      class="mb-20"
+      name="rwx-network-type"
+      :options="[true,false]"
+      :labels="[t('harvester.setting.rwxNetwork.shareStorageNetwork'), t('harvester.setting.rwxNetwork.dedicatedRwxNetwork')]"
+      @update:value="onUpdateNetworkType"
+    />
+    <Banner
+      v-if="shareStorageNetwork"
+      class="mb-20"
+      color="warning"
+    >
+      <t
+        k="harvester.setting.rwxNetwork.shareStorageNetworkWarning"
+        :raw="true"
+      />
+    </Banner>
+    <template v-if="showDedicatedNetworkConfig">
+      <LabeledSelect
+        v-model:value="networkType"
+        class="mb-20"
+        :options="networkTypes"
+        :mode="mode"
+        :label="t('harvester.fields.type')"
+        required
+        @update:value="onUpdateDedicatedType"
+      />
+
+      <LabeledInput
+        v-if="showVlan"
+        v-model:value.number="dedicatedNetwork.vlan"
+        type="number"
+        class="mb-20"
+        :mode="mode"
+        required
+        placeholder="e.g. 1 - 4094"
+        label-key="harvester.setting.storageNetwork.vlan"
+        @update:value="inputVlan"
+      />
+
+      <LabeledSelect
+        v-model:value="dedicatedNetwork.clusterNetwork"
+        label-key="harvester.setting.storageNetwork.clusterNetwork"
+        class="mb-20"
+        required
+        :options="clusterNetworkOptions"
+        @update:value="update"
+      />
+
+      <LabeledInput
+        v-model:value="dedicatedNetwork.range"
+        class="mb-5"
+        :mode="mode"
+        required
+        :placeholder="t('harvester.setting.storageNetwork.range.placeholder')"
+        label-key="harvester.setting.storageNetwork.range.label"
+        @update:value="update"
+      />
+
+      <ArrayList
+        v-model:value="exclude"
+        :show-header="true"
+        :default-add-value="defaultAddValue"
+        :mode="mode"
+        :add-label="t('harvester.setting.storageNetwork.exclude.addIp')"
+        class="mt-20"
+        @update:value="update"
+      >
+        <template #column-headers>
+          <div class="box mb-10">
+            <div class="key">
+              {{ t('harvester.setting.storageNetwork.exclude.label') }}
+            </div>
+          </div>
+        </template>
+        <template #columns="scope">
+          <div class="key">
+            <input
+              v-model="scope.row.value"
+              :placeholder="t('harvester.setting.storageNetwork.exclude.placeholder')"
+              @update:value="update"
+            />
+          </div>
+        </template>
+      </ArrayList>
+    </template>
+  </div>
+</template>

pkg/harvester/components/settings/storage-network.vue

@@ -64,6 +64,9 @@ export default {
 
     try {
       parsedDefaultValue = JSON.parse(this.value.value);
+      if (typeof parsedDefaultValue.exclusiveVlan !== 'boolean') {
+        parsedDefaultValue.exclusiveVlan = false;
+      }
       networkType = 'vlan' in parsedDefaultValue ? L2VLAN : UNTAGGED; // backend doesn't provide networkType, so we check if vlan is provided instead
       openVlan = true;
     } catch (error) {
@@ -72,7 +75,8 @@ export default {
         vlan:           '',
         clusterNetwork: '',
         range:          '',
-        exclude:        []
+        exclude:        [],
+        exclusiveVlan:  false
       };
     }
     const exclude = parsedDefaultValue?.exclude?.toString().split(',') || [];
@@ -94,6 +98,10 @@ export default {
   },
 
   computed: {
+    showExclusiveVlan() {
+      return this.networkType === L2VLAN &&
+        Number(this.parsedDefaultValue.vlan) !== 1;
+    },
     showVlan() {
       return this.networkType === L2VLAN;
     },
@@ -132,6 +140,18 @@ export default {
         };
       });
     },
+    exclusiveVlanOptions() {
+      return [
+        {
+          label: this.t('generic.enabled'),
+          value: true
+        },
+        {
+          label: this.t('generic.disabled'),
+          value: false
+        }
+      ];
+    },
   },
 
   watch: {
@@ -174,7 +194,8 @@ export default {
         vlan:           '',
         clusterNetwork: '',
         range:          '',
-        exclude:        []
+        exclude:        [],
+        exclusiveVlan:  false
       };
     },
 
@@ -280,7 +301,15 @@ export default {
         label-key="harvester.setting.storageNetwork.vlan"
         @update:value="inputVlan"
       />
-
+      <LabeledSelect
+        v-if="showExclusiveVlan"
+        v-model:value="parsedDefaultValue.exclusiveVlan"
+        class="mb-20"
+        :options="exclusiveVlanOptions"
+        :mode="mode"
+        label-key="harvester.setting.storageNetwork.exclusiveVlan"
+        @update:value="update"
+      />
       <LabeledSelect
         v-model:value="parsedDefaultValue.clusterNetwork"
         label-key="harvester.setting.storageNetwork.clusterNetwork"

pkg/harvester/components/settings/support-bundle-namespaces.vue

@@ -3,6 +3,9 @@ import { NAMESPACE } from '@shell/config/types';
 import CreateEditView from '@shell/mixins/create-edit-view';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
+const SELECT_ALL = 'select_all';
+const UNSELECT_ALL = 'unselect_all';
+
 export default {
   name: 'HarvesterBundleNamespaces',
 
@@ -11,47 +14,92 @@ export default {
   mixins: [CreateEditView],
 
   async fetch() {
+    this.loading = true;
+
     await this.$store.dispatch('harvester/findAll', { type: NAMESPACE });
+
+    if (this.customSupportBundleFeatureEnabled) {
+      try {
+        const url = this.$store.getters['harvester-common/getHarvesterClusterUrl']('v1/harvester/namespaces?link=supportbundle');
+        const response = await this.$store.dispatch('harvester/request', { url });
+
+        this.defaultNamespaces = response.data || [];
+      } catch (error) {
+        this.defaultNamespaces = [];
+      }
+    } else {
+      this.defaultNamespaces = [];
+    }
+
+    this.loading = false;
   },
 
   data() {
-    let namespaces = [];
     const namespacesStr = this.value?.value || this.value?.default || '';
+    const namespaces = namespacesStr ? namespacesStr.split(',') : [];
 
-    if (namespacesStr) {
-      namespaces = namespacesStr.split(',');
-    }
-
-    return { namespaces };
+    return {
+      namespaces,
+      defaultNamespaces: [],
+      loading:           true
+    };
   },
 
   computed: {
+    customSupportBundleFeatureEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('customSupportBundle');
+    },
+
+    allNamespaces() {
+      return this.$store.getters['harvester/all'](NAMESPACE).map((ns) => ns.id);
+    },
+
+    filteredNamespaces() {
+      if (!this.customSupportBundleFeatureEnabled) {
+        return this.allNamespaces;
+      }
+
+      const defaultIds = this.defaultNamespaces.map((ns) => ns.id);
+
+      return this.allNamespaces.filter((ns) => !defaultIds.includes(ns));
+    },
+
     namespaceOptions() {
-      return this.$store.getters['harvester/all'](NAMESPACE).map((N) => {
-        return {
-          label: N.id,
-          value: N.id
-        };
-      });
+      const mappedNamespaces = this.filteredNamespaces.map((ns) => ({ label: ns, value: ns }));
+
+      if (!this.customSupportBundleFeatureEnabled) {
+        return mappedNamespaces;
+      }
+
+      const allSelected =
+        this.namespaces.length === this.filteredNamespaces.length &&
+        this.filteredNamespaces.every((ns) => this.namespaces.includes(ns));
+
+      const controlOption = allSelected ? { label: this.t('harvester.modal.bundle.namespaces.unselectAll'), value: UNSELECT_ALL } : { label: this.t('harvester.modal.bundle.namespaces.selectAll'), value: SELECT_ALL };
+
+      return [controlOption, ...mappedNamespaces];
     }
   },
 
   methods: {
-    update() {
-      const namespaceStr = this.namespaces.join(',');
+    update(selected) {
+      if (selected.includes(SELECT_ALL)) {
+        this.namespaces = [...this.filteredNamespaces];
+      } else if (selected.includes(UNSELECT_ALL)) {
+        this.namespaces = [];
+      } else {
+        this.namespaces = selected.filter((val) => val !== SELECT_ALL && val !== UNSELECT_ALL);
+      }
 
-      this.value['value'] = namespaceStr;
+      this.value.value = this.namespaces.join(',');
     }
   },
 
   watch: {
-    'value.value': {
-      handler(neu) {
-        if (neu === this.value.default || !neu) {
-          this.namespaces = [];
-        }
-      },
-      deep: true
+    'value.value'(newVal) {
+      const raw = newVal || this.value.default || '';
+
+      this.namespaces = raw ? raw.split(',') : [];
     }
   }
 };
@@ -62,6 +110,7 @@ export default {
     <div class="col span-12">
       <LabeledSelect
         v-model:value="namespaces"
+        :loading="loading"
         :multiple="true"
         label-key="nameNsDescription.namespace.label"
         :mode="mode"

pkg/harvester/components/settings/upgrade-config.vue

@@ -0,0 +1,224 @@
+<script>
+import CreateEditView from '@shell/mixins/create-edit-view';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { RadioGroup } from '@components/Form/Radio';
+import { mapGetters } from 'vuex';
+import { allHash } from '@shell/utils/promise';
+import { NODE } from '@shell/config/types';
+
+export default {
+  name: 'HarvesterUpgradeConfig',
+
+  components: {
+    LabeledInput,
+    LabeledSelect,
+    RadioGroup
+  },
+  mixins: [CreateEditView],
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+    const hash = { nodes: this.$store.dispatch(`${ inStore }/findAll`, { type: NODE }) };
+
+    await allHash(hash);
+  },
+
+  data() {
+    let parseDefaultValue = {};
+
+    try {
+      parseDefaultValue = this.value.value ? JSON.parse(this.value.value) : JSON.parse(this.value.default);
+    } catch (error) {
+      parseDefaultValue = JSON.parse(this.value.default);
+    }
+    parseDefaultValue = this.normalizeValue(parseDefaultValue);
+
+    return {
+      parseDefaultValue,
+      errors: []
+    };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+    strategyOptions() {
+      return [
+        { value: 'sequential', label: 'sequential' },
+        { value: 'skip', label: 'skip' },
+        { value: 'parallel', label: 'parallel' }
+      ];
+    },
+    nodeUpgradeOptions() {
+      return [
+        { value: 'auto', label: 'auto' },
+        { value: 'manual', label: 'manual' }
+      ];
+    },
+    nodesOptions() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+      const nodes = this.$store.getters[`${ inStore }/all`](NODE);
+
+      return nodes.map((node) => ({ value: node.id, label: node.name }));
+    },
+    showPauseNodes() {
+      return this.parseDefaultValue.nodeUpgradeOption?.strategy?.mode === 'manual';
+    },
+    resumeUpgradePausedNodeEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('resumeUpgradePausedNode');
+    },
+  },
+
+  created() {
+    this.update();
+  },
+
+  methods: {
+    normalizeValue(obj) {
+      // handle nodeUpgradeOption.strategy
+      if (obj?.nodeUpgradeOption?.strategy?.mode === 'auto') {
+        delete obj.nodeUpgradeOption.strategy.pauseNodes;
+      }
+
+      if (obj?.nodeUpgradeOption?.strategy?.mode === 'manual') {
+        if (!Array.isArray(obj.nodeUpgradeOption.strategy.pauseNodes)) {
+          obj.nodeUpgradeOption.strategy.pauseNodes = this.nodesOptions.map((node) => node.value);
+        }
+      }
+
+      // handle imagePreloadOption.strategy
+      if (!obj.imagePreloadOption) {
+        obj.imagePreloadOption = { strategy: { type: 'sequential' } };
+      }
+      if (!obj.imagePreloadOption.strategy) {
+        obj.imagePreloadOption.strategy = { type: 'sequential' };
+      }
+      if (!obj.imagePreloadOption.strategy.type) {
+        obj.imagePreloadOption.strategy.type = 'sequential';
+      }
+      // Only set concurrency if type is 'parallel'
+      if (obj.imagePreloadOption.strategy.type === 'parallel') {
+        if (typeof obj.imagePreloadOption.strategy.concurrency !== 'number') {
+          obj.imagePreloadOption.strategy.concurrency = 0;
+        }
+      } else {
+        delete obj.imagePreloadOption.strategy.concurrency;
+      }
+      if (typeof obj.restoreVM !== 'boolean') {
+        obj.restoreVM = false;
+      }
+
+      return obj;
+    },
+    update() {
+      try {
+        // Clone to avoid mutating the form state
+        const valueToSave = JSON.parse(JSON.stringify(this.parseDefaultValue));
+
+        if (valueToSave.imagePreloadOption && valueToSave.imagePreloadOption.strategy) {
+          if (valueToSave.imagePreloadOption.strategy.type !== 'parallel') {
+            delete valueToSave.imagePreloadOption.strategy.concurrency;
+          }
+        }
+
+        this.value['value'] = JSON.stringify(valueToSave, null, 2);
+        this.errors = [];
+      } catch (e) {
+        this.errors = ['Invalid JSON'];
+      }
+    }
+  },
+
+  watch: {
+    value: {
+      handler(neu) {
+        let parseDefaultValue;
+
+        try {
+          parseDefaultValue = JSON.parse(neu.value);
+        } catch (err) {
+          parseDefaultValue = JSON.parse(this.value.default);
+        }
+        parseDefaultValue = this.normalizeValue(parseDefaultValue);
+        this['parseDefaultValue'] = parseDefaultValue;
+        this.update();
+      },
+      deep: true
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <div
+      class="row"
+      @input="update"
+    >
+      <div class="col span-12">
+        <label class="mb-5"><b>{{ t('harvester.setting.upgrade.imagePreloadStrategy') }}</b></label>
+        <LabeledSelect
+          v-model:value="parseDefaultValue.imagePreloadOption.strategy.type"
+          class="mb-20"
+          :mode="mode"
+          :label="t('harvester.setting.upgrade.strategyType')"
+          :options="strategyOptions"
+          @update:value="update"
+        />
+        <LabeledInput
+          v-if="parseDefaultValue.imagePreloadOption.strategy.type === 'parallel'"
+          v-model:value.number="parseDefaultValue.imagePreloadOption.strategy.concurrency"
+          class="mb-20"
+          :mode="mode"
+          :label="t('harvester.setting.upgrade.concurrency')"
+          min="0"
+          type="number"
+        />
+        <label class="mb-5"><b>{{ t('harvester.setting.upgrade.restoreVM') }}</b></label>
+        <RadioGroup
+          v-model:value="parseDefaultValue.restoreVM"
+          class="mb-20"
+          name="restoreVM"
+          :options="[true, false]"
+          :labels="[t('generic.enabled'), t('generic.disabled')]"
+          @update:value="update"
+        />
+        <div v-if="resumeUpgradePausedNodeEnabled">
+          <label class="mb-5"><b>{{ t('harvester.setting.upgrade.nodeUpgradeOption') }}</b></label>
+          <LabeledSelect
+            v-model:value="parseDefaultValue.nodeUpgradeOption.strategy.mode"
+            class="mb-20 label-select"
+            :mode="mode"
+            :label="t('harvester.setting.upgrade.strategy')"
+            :options="nodeUpgradeOptions"
+            @update:value="update"
+          />
+          <LabeledSelect
+            v-if="showPauseNodes"
+            v-model:value="parseDefaultValue.nodeUpgradeOption.strategy.pauseNodes"
+            class="mb-20 label-select"
+            :clearable="true"
+            :multiple="true"
+            :mode="mode"
+            :label="t('harvester.setting.upgrade.pauseNodes')"
+            :options="nodesOptions"
+            @update:value="update"
+          />
+        </div>
+        <div
+          v-if="errors.length"
+          class="error"
+        >
+          {{ errors[0] }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.error {
+  color: #d9534f;
+  margin-top: 5px;
+}
+</style>

pkg/harvester/components/settings/vm-force-reset-policy.vue

@@ -69,6 +69,15 @@ export default {
         :mode="mode"
         label-key="harvester.setting.vmForceDeletionPolicy.period"
       />
+
+      <LabeledInput
+        v-if="parseDefaultValue.enable"
+        v-model:value.number="parseDefaultValue.vmMigrationTimeout"
+        class="mb-20"
+        type="number"
+        :mode="mode"
+        label-key="harvester.setting.vmForceDeletionPolicy.vmMigrationTimeout"
+      />
     </div>
   </div>
 </template>

pkg/harvester/components/settings/vm-migration-network.vue

@@ -0,0 +1,270 @@
+<script>
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect.vue';
+import { RadioGroup } from '@components/Form/Radio';
+import { Banner } from '@components/Banner';
+import ArrayList from '@shell/components/form/ArrayList';
+import { allHash } from '@shell/utils/promise';
+import { isValidCIDR } from '@shell/utils/validators/cidr';
+import { NODE } from '@shell/config/types';
+import { _EDIT } from '@shell/config/query-params';
+import { HCI } from '../../types';
+
+const DEFAULT_NETWORK = {
+  clusterNetwork: '',
+  vlan:           '',
+  range:          '',
+  exclude:        [],
+};
+
+export default {
+  name: 'VMMigrationNetwork',
+
+  components: {
+    LabeledInput,
+    LabeledSelect,
+    RadioGroup,
+    Banner,
+    ArrayList,
+  },
+
+  props: {
+    registerBeforeHook: {
+      type:     Function,
+      required: true,
+    },
+    mode: {
+      type:    String,
+      default: _EDIT,
+    },
+    value: {
+      type:    Object,
+      default: () => ({ value: '' }),
+    },
+  },
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    try {
+      await allHash({
+        clusterNetworks: this.$store.dispatch(`${ inStore }/findAll`, { type: HCI.CLUSTER_NETWORK }),
+        vlanStatus:      this.$store.dispatch(`${ inStore }/findAll`, { type: HCI.VLAN_STATUS }),
+        nodes:           this.$store.dispatch(`${ inStore }/findAll`, { type: NODE }),
+      });
+
+      this.fetchError = null;
+    } catch (e) {
+      console.error('Failed to fetch network data:', e); // eslint-disable-line no-console
+      this.fetchError = this.t('harvester.setting.vmMigrationNetwork.fetchError', { error: e.message || e }, true);
+    }
+  },
+
+  data() {
+    const { parsed, enabled, parseError } = this.parseInitialValue();
+
+    return {
+      enabled,
+      network:    { ...DEFAULT_NETWORK, ...parsed },
+      fetchError: null,
+      parseError,
+    };
+  },
+
+  created() {
+    this.registerBeforeHook?.(this.willSave, 'willSave');
+  },
+
+  computed: {
+    allErrors() {
+      return [this.fetchError, this.parseError].filter(Boolean);
+    },
+
+    clusterNetworkOptions() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+      const networks = this.$store.getters[`${ inStore }/all`](HCI.CLUSTER_NETWORK) || [];
+
+      return networks.map((net) => ({
+        label:    net.isReadyForStorageNetwork ? net.id : `${ net.id } (${ this.t('generic.notReady') })`,
+        value:    net.id,
+        disabled: !net.isReadyForStorageNetwork,
+      }));
+    },
+
+    disableEdit() {
+      return !!(this.fetchError || this.parseError);
+    },
+  },
+
+  methods: {
+    parseInitialValue() {
+      let parsed = {};
+      let enabled = false;
+      let parseError = null;
+
+      try {
+        if (typeof this.value.value === 'string' && this.value.value.trim()) {
+          parsed = JSON.parse(this.value.value);
+          enabled = true;
+        }
+      } catch (e) {
+        console.error('[VMMigrationNetwork] Failed to parse value:', e); // eslint-disable-line no-console
+        parseError = this.t('harvester.setting.vmMigrationNetwork.parseError', { error: e.message }, true);
+      }
+
+      if (!Array.isArray(parsed.exclude)) {
+        parsed.exclude = [];
+      }
+
+      return {
+        parsed, enabled, parseError
+      };
+    },
+
+    clearErrors() {
+      this.fetchError = null;
+      this.parseError = null;
+    },
+
+    inputVlan(val) {
+      this.network.vlan = val ? Math.min(4094, Math.max(1, Number(val))) : '';
+      this.update();
+    },
+
+    useDefault() {
+      this.network = { ...DEFAULT_NETWORK };
+      this.value.value = '';
+      this.enabled = false;
+      this.clearErrors();
+    },
+
+    update() {
+      try {
+        this.value.value = this.enabled ? JSON.stringify({
+          ...this.network,
+          exclude: (this.network.exclude || []).filter((e) => !!e?.trim()),
+        }) : '';
+      } catch (e) {
+        console.error('Failed to stringify network config:', e); // eslint-disable-line no-console
+        this.value.value = '';
+      }
+    },
+
+    validateInputs() {
+      const errors = [];
+
+      if (!this.network.clusterNetwork) {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.vmMigrationNetwork.clusterNetwork') }, true));
+      }
+
+      if (!this.network.range) {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.vmMigrationNetwork.range.label') }, true));
+      } else if (!isValidCIDR(this.network.range)) {
+        errors.push(this.t('harvester.setting.vmMigrationNetwork.range.invalid', null, true));
+      }
+
+      if (this.network.vlan === '') {
+        errors.push(this.t('validation.required', { key: this.t('harvester.setting.vmMigrationNetwork.vlan') }, true));
+      } else {
+        const vlan = Number(this.network.vlan);
+
+        if (isNaN(vlan) || vlan < 1 || vlan > 4094) {
+          errors.push(this.t('validation.between', {
+            key: this.t('harvester.setting.vmMigrationNetwork.vlan'),
+            min: 1,
+            max: 4094,
+          }, true));
+        }
+      }
+
+      for (const cidr of this.network.exclude || []) {
+        if (cidr && !isValidCIDR(cidr)) {
+          errors.push(this.t('harvester.setting.storageNetwork.exclude.invalid', { value: cidr }, true));
+        }
+      }
+
+      return errors;
+    },
+
+    async willSave() {
+      if (!this.enabled) {
+        this.useDefault();
+
+        return Promise.resolve();
+      }
+
+      this.update();
+
+      const errors = this.validateInputs();
+
+      return errors.length ? Promise.reject(errors) : Promise.resolve();
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <Banner
+      v-for="(errorMsg, index) in allErrors"
+      :key="index"
+      color="error"
+    >
+      {{ errorMsg }}
+    </Banner>
+    <RadioGroup
+      v-model:value="enabled"
+      class="mb-20"
+      name="enableMigrationNetwork"
+      :options="[true, false]"
+      :labels="[t('generic.enabled'), t('generic.disabled')]"
+      @update:value="update"
+    />
+    <template v-if="enabled">
+      <LabeledSelect
+        v-model:value="network.clusterNetwork"
+        required
+        label-key="harvester.setting.vmMigrationNetwork.clusterNetwork"
+        class="mb-20"
+        :mode="mode"
+        :options="clusterNetworkOptions"
+        :disabled="disableEdit"
+        @update:value="update"
+      />
+      <LabeledInput
+        v-model:value.number="network.vlan"
+        required
+        type="number"
+        class="mb-20"
+        :min="1"
+        :max="4094"
+        :mode="mode"
+        placeholder="e.g. 1 - 4094"
+        label-key="harvester.setting.vmMigrationNetwork.vlan"
+        :disabled="disableEdit"
+        @update:value="inputVlan"
+      />
+      <LabeledInput
+        v-model:value="network.range"
+        required
+        class="mb-5"
+        :mode="mode"
+        :placeholder="t('harvester.setting.vmMigrationNetwork.range.placeholder')"
+        label-key="harvester.setting.vmMigrationNetwork.range.label"
+        :disabled="disableEdit"
+        @update:value="update"
+      />
+      <ArrayList
+        v-model:value="network.exclude"
+        :show-header="true"
+        :default-add-value="''"
+        :mode="mode"
+        :add-disabled="disableEdit"
+        :add-label="t('harvester.setting.vmMigrationNetwork.exclude.addButton')"
+        :value-label="t('harvester.setting.vmMigrationNetwork.exclude.label')"
+        :value-placeholder="t('harvester.setting.storageNetwork.exclude.placeholder')"
+        @update:value="update"
+      />
+    </template>
+  </div>
+</template>

pkg/harvester/components/vm-migration/ConfigureMappingsStep.vue

@@ -0,0 +1,561 @@
+<script setup>
+import { ref, computed, watch, toRefs } from 'vue';
+import { useStore } from 'vuex';
+import Loading from '@shell/components/Loading';
+import { Banner } from '@components/Banner';
+import { STORAGE_CLASS, NETWORK_ATTACHMENT } from '@shell/config/types';
+import { useI18n } from '@shell/composables/useI18n';
+import { randomStr } from '@shell/utils/string';
+import { HCI } from '../../types';
+import { FORKLIFT_NAMESPACE } from '../../config/harvester-map';
+import { buildNetworkMapEntries, buildStorageMapEntries } from '../../utils/forklift';
+import { isInternalStorageClass } from '../../utils/storage-class';
+import MappingColumn from './MappingColumn.vue';
+
+const props = defineProps({
+  providerName:       { type: String, default: '' },
+  provider:           { type: Object, default: null },
+  selectedVms:        { type: Array, default: () => [] },
+  stepData:           { type: Object, required: true },
+  useAllProviderData: { type: Boolean, default: false },
+  existingNetworkMap: { type: Object, default: null },
+  existingStorageMap: { type: Object, default: null },
+});
+
+const emit = defineEmits(['ready']);
+
+const store = useStore();
+const { t } = useI18n(store);
+
+const vms = ref([]);
+const harvesterNetworks = ref([]);
+const storageClasses = ref([]);
+const allNetworkMaps = ref([]);
+const allStorageMaps = ref([]);
+const errors = ref([]);
+const loading = ref(true);
+
+const { networkEntries, storageEntries } = toRefs(props.stepData);
+
+const NAMESPACE = FORKLIFT_NAMESPACE;
+
+const harvesterNetworkOptions = computed(() => {
+  const options = [
+    { label: t('harvester.addons.vmMigration.configureMappings.networkMapping.options.podNetworking'), value: 'pod' },
+    { label: t('harvester.addons.vmMigration.configureMappings.networkMapping.options.ignored'), value: 'ignored' },
+  ];
+
+  harvesterNetworks.value.forEach((net) => {
+    const ns = net.metadata?.namespace || '';
+    const name = net.metadata?.name || net.id;
+    const fullName = ns ? `${ ns }/${ name }` : name;
+
+    options.push({ label: fullName, value: fullName });
+  });
+
+  return options;
+});
+
+const storageClassOptions = computed(() => {
+  const options = storageClasses.value.filter((s) => !s.parameters?.backingImage).map((sc) => {
+    const value = sc.name;
+    let label = sc.isDefault ? `${ value } (${ t('generic.default') })` : value;
+    let disabled = false;
+
+    if (isInternalStorageClass(value)) {
+      label += ` (${ t('harvester.storage.internal.label') })`;
+      disabled = true;
+    }
+
+    return {
+      label,
+      value,
+      disabled,
+    };
+  });
+
+  if (!options.find((o) => o.value === 'harvester-longhorn')) {
+    options.unshift({ label: 'harvester-longhorn', value: 'harvester-longhorn' });
+  }
+
+  return options;
+});
+
+const applyNetworkMapTargets = (mapSpec) => {
+  if (!mapSpec) {
+    return;
+  }
+
+  networkEntries.value.forEach((entry) => {
+    const match = mapSpec.find(
+      (m) => m.source?.id === entry.id || m.source?.name === entry.name
+    );
+
+    if (match?.destination) {
+      const dest = match.destination;
+
+      if (dest.type === 'pod') {
+        entry.target = 'pod';
+      } else if (dest.type === 'ignored') {
+        entry.target = 'ignored';
+      } else if (dest.type === 'multus' && dest.name) {
+        entry.target = dest.namespace ? `${ dest.namespace }/${ dest.name }` : dest.name;
+      }
+    }
+  });
+};
+
+const applyStorageMapTargets = (mapSpec) => {
+  if (!mapSpec) {
+    return;
+  }
+
+  storageEntries.value.forEach((entry) => {
+    const match = mapSpec.find(
+      (m) => m.source?.id === entry.id || m.source?.name === entry.name
+    );
+
+    if (match?.destination?.storageClass) {
+      entry.target = match.destination.storageClass;
+    }
+  });
+};
+
+const applyDefaultNetworkMap = () => {
+  const defaultMap = allNetworkMaps.value.find(
+    (nm) => nm.metadata.name === `${ props.providerName }-network-map-default`
+  );
+
+  applyNetworkMapTargets(defaultMap?.spec?.map);
+};
+
+const applyDefaultStorageMap = () => {
+  const defaultMap = allStorageMaps.value.find(
+    (sm) => sm.metadata.name === `${ props.providerName }-storage-map-default`
+  );
+
+  applyStorageMapTargets(defaultMap?.spec?.map);
+};
+
+const allNetworksMapped = computed(() => networkEntries.value.length > 0 && networkEntries.value.every((e) => !!e.target));
+const allStorageMapped = computed(() => storageEntries.value.length > 0 && storageEntries.value.every((e) => !!e.target));
+
+const canSave = computed(() => {
+  if (props.useAllProviderData) {
+    return true;
+  }
+
+  return networkEntries.value.length > 0 && storageEntries.value.length > 0 &&
+    allNetworksMapped.value && allStorageMapped.value;
+});
+
+watch(canSave, (val) => {
+  emit('ready', val);
+});
+
+// After restore, check if ready
+if (canSave.value) {
+  emit('ready', true);
+}
+
+const buildNetworkEntries = () => {
+  const networkMap = {};
+
+  vms.value.forEach((vm) => {
+    const vmName = vm.name || vm.id;
+
+    if (vm.networks && vm.networks.length > 0) {
+      vm.networks.forEach((net) => {
+        const netKey = net.id || net.name || 'default';
+
+        if (!networkMap[netKey]) {
+          networkMap[netKey] = {
+            name:   net.name || t('harvester.addons.vmMigration.generic.unknown'),
+            id:     net.id || '',
+            vlanId: net.vlanId || '',
+            target: '',
+            usedBy: [],
+            _key:   `net-${ netKey }`,
+          };
+        }
+
+        if (!networkMap[netKey].usedBy.includes(vmName)) {
+          networkMap[netKey].usedBy.push(vmName);
+        }
+      });
+    }
+  });
+
+  networkEntries.value = Object.values(networkMap);
+};
+
+const buildStorageEntries = () => {
+  const datastoreMap = {};
+
+  vms.value.forEach((vm) => {
+    const vmName = vm.name || vm.id;
+
+    if (vm.disks && vm.disks.length > 0) {
+      vm.disks.forEach((disk) => {
+        const ds = disk.datastore;
+
+        if (ds && ds.id) {
+          if (!datastoreMap[ds.id]) {
+            datastoreMap[ds.id] = {
+              name:     ds.name || t('harvester.addons.vmMigration.generic.unknown'),
+              id:       ds.id,
+              type:     ds.type || '',
+              capacity: 0,
+              target:   '',
+              usedBy:   [],
+              _key:     `stor-${ ds.id }`,
+            };
+          }
+
+          datastoreMap[ds.id].capacity += disk.capacity || 0;
+
+          if (!datastoreMap[ds.id].usedBy.includes(vmName)) {
+            datastoreMap[ds.id].usedBy.push(vmName);
+          }
+        }
+      });
+    }
+  });
+
+  storageEntries.value = Object.values(datastoreMap);
+};
+
+const buildNetworkEntriesFromProvider = (networksData) => {
+  networkEntries.value = (Array.isArray(networksData) ? networksData : []).map((net) => ({
+    name:   net.name || net.id,
+    id:     net.id || '',
+    vlanId: net.vlanId || '',
+    target: '',
+    usedBy: [],
+    _key:   `net-${ net.id || net.name }`,
+  }));
+};
+
+const buildStorageEntriesFromProvider = (datastoresData) => {
+  storageEntries.value = (Array.isArray(datastoresData) ? datastoresData : []).map((ds) => ({
+    name:     ds.name || ds.id,
+    id:       ds.id || '',
+    type:     ds.type || '',
+    capacity: ds.capacity || 0,
+    target:   '',
+    usedBy:   [],
+    _key:     `stor-${ ds.id || ds.name }`,
+  }));
+};
+
+const formatStorageDetail = (entry) => {
+  const parts = [];
+
+  if (entry.type) {
+    parts.push(entry.type);
+  }
+
+  if (entry.capacity) {
+    const gb = entry.capacity / (1024 * 1024 * 1024);
+
+    if (gb >= 1024) {
+      parts.push(t('harvester.addons.vmMigration.generic.memoryTb', { value: (gb / 1024).toFixed(1) }));
+    } else {
+      parts.push(t('harvester.addons.vmMigration.generic.memoryGb', { value: Math.round(gb) }));
+    }
+  }
+
+  return parts.join(' • ');
+};
+
+const buildNetworkMapSpec = (providerRef) => ({
+  map:      buildNetworkMapEntries(networkEntries.value, NAMESPACE),
+  provider: providerRef,
+});
+
+const buildStorageMapSpec = (providerRef) => ({
+  map:      buildStorageMapEntries(storageEntries.value),
+  provider: providerRef,
+});
+
+const saveAndReturn = async() => {
+  const inStore = store.getters['currentProduct'].inStore;
+
+  const providerRef = {
+    source: {
+      apiVersion: 'forklift.konveyor.io/v1beta1',
+      kind:       'Provider',
+      name:       props.providerName,
+      namespace:  NAMESPACE,
+    },
+    destination: {
+      apiVersion: 'forklift.konveyor.io/v1beta1',
+      kind:       'Provider',
+      name:       'host',
+      namespace:  NAMESPACE,
+    },
+  };
+
+  // Update existing maps in place (edit mode)
+  if (props.existingNetworkMap && props.existingStorageMap) {
+    props.existingNetworkMap.spec = buildNetworkMapSpec(providerRef);
+    await props.existingNetworkMap.save();
+
+    props.existingStorageMap.spec = buildStorageMapSpec(providerRef);
+    await props.existingStorageMap.save();
+
+    return {
+      networkMapName: props.existingNetworkMap.metadata.name,
+      storageMapName: props.existingStorageMap.metadata.name,
+    };
+  }
+
+  const providerOwnerRef = props.provider ? [{
+    apiVersion:         'forklift.konveyor.io/v1beta1',
+    kind:               'Provider',
+    name:               props.provider.metadata.name,
+    uid:                props.provider.metadata.uid,
+    blockOwnerDeletion: true,
+  }] : [];
+
+  const networkMap = await store.dispatch(`${ inStore }/create`, {
+    type:     HCI.FORKLIFT_NETWORK_MAP,
+    metadata: {
+      name:            `${ props.providerName }-network-map-${ props.useAllProviderData ? 'default' : randomStr(5).toLowerCase() }`,
+      namespace:       NAMESPACE,
+      ownerReferences: providerOwnerRef,
+    },
+    spec: buildNetworkMapSpec(providerRef),
+  });
+
+  await networkMap.save();
+
+  const storageMap = await store.dispatch(`${ inStore }/create`, {
+    type:     HCI.FORKLIFT_STORAGE_MAP,
+    metadata: {
+      name:            `${ props.providerName }-storage-map-${ props.useAllProviderData ? 'default' : randomStr(5).toLowerCase() }`,
+      namespace:       NAMESPACE,
+      ownerReferences: providerOwnerRef,
+    },
+    spec: buildStorageMapSpec(providerRef),
+  });
+
+  await storageMap.save();
+
+  return { networkMapName: networkMap.metadata.name, storageMapName: storageMap.metadata.name };
+};
+
+defineExpose({ saveMappings: saveAndReturn });
+
+const init = async() => {
+  const inStore = store.getters['currentProduct'].inStore;
+
+  try {
+    harvesterNetworks.value = await store.dispatch(`${ inStore }/findAll`, { type: NETWORK_ATTACHMENT });
+  } catch (e) {
+    harvesterNetworks.value = [];
+  }
+
+  try {
+    storageClasses.value = await store.dispatch(`${ inStore }/findAll`, { type: STORAGE_CLASS });
+  } catch (e) {
+    storageClasses.value = [];
+  }
+
+  try {
+    allNetworkMaps.value = await store.dispatch(`${ inStore }/findAll`, { type: HCI.FORKLIFT_NETWORK_MAP });
+  } catch (e) {
+    allNetworkMaps.value = [];
+  }
+
+  try {
+    allStorageMaps.value = await store.dispatch(`${ inStore }/findAll`, { type: HCI.FORKLIFT_STORAGE_MAP });
+  } catch (e) {
+    allStorageMaps.value = [];
+  }
+
+  if (networkEntries.value.length === 0 || storageEntries.value.length === 0) {
+    try {
+      const providerUid = props.provider?.metadata?.uid;
+      const providerType = props.provider?.spec?.type || 'vsphere';
+      const baseUrl = store.getters['harvester-common/getHarvesterClusterUrl'](
+        `v1/harvester/providers/${ providerType }/${ providerUid }`
+      );
+
+      const [networksData, datastoresData] = await Promise.all([
+        store.dispatch(`${ inStore }/request`, { url: `${ baseUrl }/networks` }).catch(() => []),
+        store.dispatch(`${ inStore }/request`, { url: `${ baseUrl }/datastores?detail=1` }).catch(() => []),
+      ]);
+
+      if (props.useAllProviderData) {
+        if (networkEntries.value.length === 0) {
+          buildNetworkEntriesFromProvider(networksData);
+        }
+        if (storageEntries.value.length === 0) {
+          buildStorageEntriesFromProvider(datastoresData);
+        }
+      } else {
+        vms.value = props.selectedVms;
+
+        const networkNameMap = (Array.isArray(networksData) ? networksData : []).reduce((map, n) => {
+          map[n.id] = n.name;
+
+          return map;
+        }, {});
+        const datastoreInfoMap = (Array.isArray(datastoresData) ? datastoresData : []).reduce((map, d) => {
+          map[d.id] = { name: d.name, type: d.type || '' };
+
+          return map;
+        }, {});
+
+        vms.value = vms.value.map((vm) => {
+          const resolved = { ...vm };
+
+          if (resolved.networks) {
+            resolved.networks = resolved.networks.map((n) => ({
+              ...n,
+              name: n.name || networkNameMap[n.id] || n.id,
+            }));
+          }
+
+          if (resolved.disks) {
+            resolved.disks = resolved.disks.map((d) => {
+              const dsInfo = d.datastore ? datastoreInfoMap[d.datastore.id] : null;
+
+              return {
+                ...d,
+                datastore: d.datastore ? {
+                  ...d.datastore,
+                  name: d.datastore.name || dsInfo?.name || d.datastore.id,
+                  type: dsInfo?.type || '',
+                } : d.datastore,
+              };
+            });
+          }
+
+          return resolved;
+        });
+
+        if (networkEntries.value.length === 0) {
+          buildNetworkEntries();
+        }
+        if (storageEntries.value.length === 0) {
+          buildStorageEntries();
+        }
+      }
+    } catch (e) {
+      errors.value = [e?.message || t('harvester.addons.vmMigration.errors.failedResolveDetails')];
+    }
+  }
+
+  const hasExistingNetworkTargets = networkEntries.value.some((e) => !!e.target);
+  const hasExistingStorageTargets = storageEntries.value.some((e) => !!e.target);
+
+  if (!hasExistingNetworkTargets) {
+    if (props.existingNetworkMap?.spec?.map) {
+      applyNetworkMapTargets(props.existingNetworkMap.spec.map);
+    } else {
+      applyDefaultNetworkMap();
+    }
+  }
+
+  if (!hasExistingStorageTargets) {
+    if (props.existingStorageMap?.spec?.map) {
+      applyStorageMapTargets(props.existingStorageMap.spec.map);
+    } else {
+      applyDefaultStorageMap();
+    }
+  }
+
+  loading.value = false;
+};
+
+init();
+</script>
+
+<template>
+  <Loading v-if="loading" />
+  <div
+    v-else
+    class="configure-mappings"
+  >
+    <Banner
+      v-for="(err, i) in errors"
+      :key="i"
+      color="error"
+      :label="err"
+    />
+    <p class="text-deemphasized line-height-20">
+      {{ t('harvester.addons.vmMigration.configureMappings.description') }}
+    </p>
+    <div class="mappings-columns">
+      <MappingColumn
+        :title="t('harvester.addons.vmMigration.configureMappings.networkMapping.title')"
+        :description="t('harvester.addons.vmMigration.configureMappings.networkMapping.description')"
+        :entries="networkEntries"
+        :options="harvesterNetworkOptions"
+        :placeholder="t('harvester.addons.vmMigration.configureMappings.networkMapping.placeholder')"
+        :show-used-by="!useAllProviderData"
+        :clearable="useAllProviderData"
+      >
+        <template #source-detail="{ entry }">
+          <span class="source-detail text-deemphasized">{{ t('harvester.addons.vmMigration.generic.vlan', { id: entry.vlanId || '0' }) }}</span>
+        </template>
+      </MappingColumn>
+
+      <MappingColumn
+        :title="t('harvester.addons.vmMigration.configureMappings.storageMapping.title')"
+        :description="t('harvester.addons.vmMigration.configureMappings.storageMapping.description')"
+        :entries="storageEntries"
+        :options="storageClassOptions"
+        :placeholder="t('harvester.addons.vmMigration.configureMappings.storageMapping.placeholder')"
+        :show-used-by="!useAllProviderData"
+        :clearable="useAllProviderData"
+      >
+        <template #source-detail="{ entry }">
+          <span
+            v-if="entry.type || entry.capacity"
+            class="source-detail text-deemphasized"
+          >{{ formatStorageDetail(entry) }}</span>
+        </template>
+      </MappingColumn>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .mappings-columns {
+    display: flex;
+    flex-direction: column;
+    gap: 32px;
+
+    @media only screen and (min-width: map-get($breakpoints, '--viewport-7')) {
+      display: grid;
+      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+    }
+
+    @media only screen and (min-width: map-get($breakpoints, '--viewport-9')) {
+      gap: 48px;
+    }
+
+    @media only screen and (min-width: map-get($breakpoints, '--viewport-12')) {
+      gap: 64px;
+    }
+  }
+
+  .configure-mappings {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+
+    .line-height-20 {
+      line-height: 20px;
+    }
+  }
+
+  .source-detail {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+</style>

pkg/harvester/components/vm-migration/ConfigureProviderStep.vue

@@ -0,0 +1,539 @@
+<script setup>
+import { ref, computed, watch, toRefs } from 'vue';
+import { useStore } from 'vuex';
+
+import { LabeledInput } from '@components/Form/LabeledInput';
+import { Checkbox } from '@components/Form/Checkbox';
+import { Banner } from '@components/Banner';
+import Loading from '@shell/components/Loading';
+import AsyncButton from '@shell/components/AsyncButton';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { SECRET } from '@shell/config/types';
+import { randomStr } from '@shell/utils/string';
+import { useI18n } from '@shell/composables/useI18n';
+import { HCI } from '../../types';
+import { FORKLIFT_NAMESPACE } from '../../config/harvester-map';
+import { decodeSecretValue } from '../../utils/forklift';
+
+const CREATE_NEW = '__create_new__';
+
+const props = defineProps({
+  stepData:   { type: Object, required: true },
+  createOnly: { type: Boolean, default: false },
+  editMode:   { type: Boolean, default: false },
+});
+
+const emit = defineEmits(['complete', 'ready', 'form-valid', 'testing']);
+
+const store = useStore();
+const { t } = useI18n(store);
+
+const allProviders = ref([]);
+const allSecrets = ref([]);
+const errors = ref([]);
+const testBtnRef = ref(null);
+const loading = ref(true);
+const testing = ref(false);
+
+const {
+  selectedProvider,
+  providerName,
+  url,
+  username,
+  password,
+  skipTlsVerify,
+  testPassed,
+  testResult,
+  testError,
+  createdProvider,
+  createdSecret,
+} = toRefs(props.stepData);
+
+const isExistingProvider = computed(() => selectedProvider.value !== CREATE_NEW);
+const isFormValid = computed(() => !!providerName.value && !!url.value && !!username.value && !!password.value);
+
+const providerOptions = computed(() => {
+  const options = [
+    { label: t('harvester.addons.vmMigration.configureProvider.createNew'), value: CREATE_NEW }
+  ];
+
+  allProviders.value.forEach((p) => {
+    if (!p.spec?.url) {
+      return;
+    }
+
+    const secretRef = p.spec?.secret;
+
+    if (secretRef) {
+      const secret = allSecrets.value.find(
+        (s) => s.metadata.name === secretRef.name && s.metadata.namespace === secretRef.namespace
+      );
+
+      if (!secret?.data?.user || !secret?.data?.password) {
+        return;
+      }
+    } else {
+      return;
+    }
+
+    options.push({
+      label: p.metadata.name,
+      value: p.metadata.name,
+    });
+  });
+
+  return options;
+});
+
+// When the provider selection changes, populate or clear the fields
+watch(selectedProvider, (val) => {
+  testPassed.value = false;
+  testResult.value = null;
+  testError.value = null;
+
+  if (val === CREATE_NEW) {
+    providerName.value = '';
+    url.value = '';
+    username.value = '';
+    password.value = '';
+    skipTlsVerify.value = false;
+    createdProvider.value = null;
+    createdSecret.value = null;
+  } else {
+    const provider = allProviders.value.find(
+      (p) => p.metadata.name === val && p.metadata.namespace === FORKLIFT_NAMESPACE
+    );
+
+    if (provider) {
+      providerName.value = provider.metadata.name;
+      url.value = provider.spec?.url || '';
+
+      const secretRef = provider.spec?.secret;
+
+      if (secretRef) {
+        const secret = allSecrets.value.find(
+          (s) => s.metadata.name === secretRef.name && s.metadata.namespace === secretRef.namespace
+        );
+
+        if (secret?.data) {
+          username.value = decodeSecretValue(secret.data.user);
+          password.value = decodeSecretValue(secret.data.password);
+          skipTlsVerify.value = decodeSecretValue(secret.data.insecureSkipVerify) === 'true';
+        }
+      }
+
+      createdProvider.value = provider;
+    }
+  }
+});
+
+// Reset test state when any field changes (only for create new)
+watch([providerName, url, username, password], () => {
+  if (!isExistingProvider.value) {
+    testPassed.value = false;
+    testResult.value = null;
+  }
+});
+
+// Emit ready/complete when testPassed changes
+watch(testPassed, (val) => {
+  emit('ready', val);
+  if (val) {
+    emit('complete', { providerName: providerName.value, provider: createdProvider.value });
+  }
+}, { immediate: true });
+
+// Emit form-valid when form validity changes
+watch(isFormValid, (val) => {
+  emit('form-valid', val);
+}, { immediate: true });
+
+watch(testing, (val) => {
+  emit('testing', val);
+}, { immediate: true });
+
+const pollProviderReady = async(name) => {
+  const inStore = store.getters['currentProduct'].inStore;
+  const namespace = FORKLIFT_NAMESPACE;
+  const maxAttempts = 15;
+  let attempts = 0;
+
+  while (attempts < maxAttempts) {
+    await new Promise((resolve) => setTimeout(resolve, 2000));
+    attempts++;
+
+    const refreshed = await store.dispatch(`${ inStore }/find`, {
+      type: HCI.FORKLIFT_PROVIDER,
+      id:   `${ namespace }/${ name }`,
+      opt:  { force: true }
+    });
+
+    const conditions = refreshed?.status?.conditions || [];
+    const connectionCondition = conditions.find((c) => c.type === 'ConnectionTestSucceeded');
+    const readyCondition = conditions.find((c) => c.type === 'Ready');
+
+    if (connectionCondition) {
+      if (connectionCondition.status === 'True') {
+        return { connected: true };
+      }
+
+      return { connected: false, errorMsg: connectionCondition.message || t('harvester.addons.vmMigration.errors.connectionFailed') };
+    }
+
+    if (readyCondition) {
+      if (readyCondition.status === 'True') {
+        return { connected: true };
+      } else if (readyCondition.status === 'False') {
+        return { connected: false, errorMsg: readyCondition.message || t('harvester.addons.vmMigration.errors.providerNotReady') };
+      }
+    }
+  }
+
+  return { connected: false, errorMsg: '' };
+};
+
+const handlePollResult = ({ connected, errorMsg }, buttonCb) => {
+  if (connected) {
+    testPassed.value = true;
+    testResult.value = t('harvester.addons.vmMigration.configureProvider.testSuccess');
+    testing.value = false;
+    buttonCb(true);
+  } else {
+    testError.value = errorMsg || t('harvester.addons.vmMigration.configureProvider.testTimeout');
+    testing.value = false;
+    buttonCb(false);
+  }
+};
+
+const cleanupCreatedResources = async() => {
+  if (createdProvider.value) {
+    try {
+      await createdProvider.value.remove();
+    } catch (e) {}
+    createdProvider.value = null;
+    createdSecret.value = null;
+  } else if (createdSecret.value) {
+    try {
+      await createdSecret.value.remove();
+    } catch (e) {}
+    createdSecret.value = null;
+  }
+};
+
+const testConnection = async(buttonCb) => {
+  testResult.value = null;
+  testError.value = null;
+  testing.value = true;
+
+  if (!providerName.value || !url.value || !username.value || !password.value) {
+    testError.value = t('harvester.addons.vmMigration.configureProvider.testMissingFields');
+    testing.value = false;
+    buttonCb(false);
+
+    return;
+  }
+
+  const inStore = store.getters['currentProduct'].inStore;
+
+  // Edit mode: update existing provider URL + secret, then poll
+  if (props.editMode && createdProvider.value) {
+    try {
+      createdProvider.value.spec.url = url.value;
+      await createdProvider.value.save();
+
+      const secretRef = createdProvider.value.spec?.secret;
+
+      if (secretRef && createdSecret.value) {
+        createdSecret.value.data = {
+          user:               btoa(username.value),
+          password:           btoa(password.value),
+          insecureSkipVerify: btoa(String(skipTlsVerify.value)),
+          url:                btoa(url.value),
+        };
+        await createdSecret.value.save();
+      }
+
+      handlePollResult(await pollProviderReady(providerName.value), buttonCb);
+    } catch (err) {
+      testError.value = err.message || t('harvester.addons.vmMigration.configureProvider.testFailed');
+      testing.value = false;
+      buttonCb(false);
+    }
+
+    return;
+  }
+
+  // For existing providers, just poll for Ready/ConnectionTestSucceeded status
+  if (isExistingProvider.value) {
+    try {
+      handlePollResult(await pollProviderReady(providerName.value), buttonCb);
+    } catch (err) {
+      testError.value = err.message || t('harvester.addons.vmMigration.configureProvider.testFailed');
+      testing.value = false;
+      buttonCb(false);
+    }
+
+    return;
+  }
+
+  // For new providers, create provider + secret then poll
+  try {
+    await cleanupCreatedResources();
+
+    const namespace = FORKLIFT_NAMESPACE;
+    const secretName = `${ providerName.value }-creds-${ randomStr(4).toLowerCase() }`;
+
+    const provider = await store.dispatch(`${ inStore }/create`, {
+      type:     HCI.FORKLIFT_PROVIDER,
+      metadata: {
+        name: providerName.value,
+        namespace,
+      },
+      spec: {
+        type:   'vsphere',
+        url:    url.value,
+        secret: {
+          name: secretName,
+          namespace,
+        },
+      }
+    });
+
+    await provider.save();
+    createdProvider.value = provider;
+
+    const newSecret = await store.dispatch(`${ inStore }/create`, {
+      type:     SECRET,
+      metadata: {
+        name:            secretName,
+        namespace,
+        labels:          { 'ui.forklift/created-for-resource-type': 'forklift.konveyor.io.provider' },
+        ownerReferences: [
+          {
+            apiVersion:         'forklift.konveyor.io/v1beta1',
+            kind:               'Provider',
+            name:               provider.metadata.name,
+            uid:                provider.metadata.uid,
+            blockOwnerDeletion: true,
+          },
+        ],
+      }
+    });
+
+    newSecret['_type'] = 'Opaque';
+    newSecret['data'] = {
+      user:               btoa(username.value),
+      password:           btoa(password.value),
+      insecureSkipVerify: btoa(String(skipTlsVerify.value)),
+      url:                btoa(url.value),
+    };
+
+    await newSecret.save();
+    createdSecret.value = newSecret;
+
+    const result = await pollProviderReady(providerName.value);
+
+    if (!result.connected) {
+      await cleanupCreatedResources();
+    }
+
+    handlePollResult(result, buttonCb);
+  } catch (err) {
+    await cleanupCreatedResources();
+    testError.value = err.message || t('harvester.addons.vmMigration.configureProvider.testFailed');
+    testing.value = false;
+    buttonCb(false);
+  }
+};
+
+const init = async() => {
+  const inStore = store.getters['currentProduct'].inStore;
+
+  try {
+    allProviders.value = await store.dispatch(`${ inStore }/findAll`, { type: HCI.FORKLIFT_PROVIDER });
+
+    allSecrets.value = await store.dispatch(`${ inStore }/findAll`, {
+      type: SECRET,
+      opt:  { labelSelector: `ui.forklift/created-for-resource-type=${ HCI.FORKLIFT_PROVIDER }` }
+    });
+  } catch (e) {
+    errors.value = [e?.message || t('harvester.addons.vmMigration.errors.failedLoadProviders')];
+  }
+
+  loading.value = false;
+};
+
+init();
+
+const clickTestButton = () => {
+  testBtnRef.value?.$el?.click();
+};
+
+defineExpose({ testConnection, clickTestButton });
+</script>
+
+<template>
+  <Loading v-if="loading" />
+  <div
+    v-else
+    class="configure-provider-step"
+  >
+    <p class="text-deemphasized line-height-20">
+      {{ t('harvester.addons.vmMigration.configureProvider.description') }}
+    </p>
+
+    <div class="configure-provider-step-content">
+      <h3 class="table-title m-0">
+        <b>{{ t('harvester.addons.vmMigration.configureProvider.connectionDetails') }}</b>
+      </h3>
+
+      <Banner
+        class="requirements-banner m-0"
+        color="info"
+      >
+        <div class="requirements-banner-content">
+          <span class="requirements-banner-title">{{ t('harvester.addons.vmMigration.configureProvider.requirementsTitle') }}</span>
+          <br>
+          <span>{{ t('harvester.addons.vmMigration.configureProvider.requirementsText') }}</span>
+        </div>
+      </Banner>
+
+      <div class="configure-provider-step-form">
+        <div v-if="!createOnly && !editMode">
+          <LabeledSelect
+            v-model:value="selectedProvider"
+            required
+            :label="t('harvester.addons.vmMigration.configureProvider.providerSelect')"
+            :options="providerOptions"
+            :reduce="(opt) => opt.value"
+          />
+        </div>
+
+        <div
+          v-if="!isExistingProvider || editMode"
+        >
+          <LabeledInput
+            v-model:value="providerName"
+            :label="t('harvester.addons.vmMigration.configureProvider.name')"
+            :disabled="editMode"
+            required
+          />
+        </div>
+
+        <div>
+          <LabeledInput
+            v-model:value="url"
+            :label="t('harvester.addons.vmMigration.configureProvider.urlLabel')"
+            :placeholder="t('harvester.addons.vmMigration.configureProvider.urlPlaceholder')"
+            :disabled="isExistingProvider && !editMode"
+            required
+          />
+          <p class="text-deemphasized mt-5">
+            {{ t('harvester.addons.vmMigration.configureProvider.urlHint') }}
+          </p>
+        </div>
+
+        <div class="row">
+          <div class="col span-6">
+            <LabeledInput
+              v-model:value="username"
+              :label="t('harvester.addons.vmMigration.fields.username')"
+              :disabled="isExistingProvider && !editMode"
+              required
+            />
+          </div>
+          <div class="col span-6">
+            <LabeledInput
+              v-model:value="password"
+              type="password"
+              :label="t('harvester.addons.vmMigration.fields.password')"
+              :disabled="isExistingProvider && !editMode"
+              required
+            />
+          </div>
+        </div>
+
+        <div>
+          <Checkbox
+            v-model:value="skipTlsVerify"
+            :label="t('harvester.addons.vmMigration.configureProvider.skipSsl')"
+            :disabled="isExistingProvider && !editMode"
+          />
+          <p class="text-deemphasized ml-20">
+            {{ t('harvester.addons.vmMigration.configureProvider.skipSslHint') }}
+          </p>
+        </div>
+        <div>
+          <AsyncButton
+            ref="testBtnRef"
+            mode="test"
+            :disabled="!isFormValid"
+            :action-label="t('harvester.addons.vmMigration.configureProvider.testConnection.action')"
+            :waiting-label="t('harvester.addons.vmMigration.configureProvider.testConnection.waiting')"
+            :success-label="t('harvester.addons.vmMigration.configureProvider.testConnection.success')"
+            :error-label="t('harvester.addons.vmMigration.configureProvider.testConnection.error')"
+            :action-color="'role-secondary'"
+            :waiting-color="'role-disabled'"
+            @click="testConnection"
+          />
+        </div>
+
+        <Banner
+          v-if="testResult"
+          color="success"
+        >
+          {{ testResult }}
+        </Banner>
+        <Banner
+          v-if="testError"
+          color="error"
+        >
+          {{ testError }}
+        </Banner>
+        <Banner
+          v-for="(err, i) in errors"
+          :key="i"
+          color="error"
+        >
+          {{ err }}
+        </Banner>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .requirements-banner {
+    font-weight: 400;
+
+    .requirements-banner-title {
+      font-weight: 600;
+    }
+  }
+
+  .configure-provider-step {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+
+    .line-height-20 {
+      line-height: 20px;
+    }
+
+    .configure-provider-step-content {
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+
+      .configure-provider-step-form {
+        display: flex;
+        flex-direction: column;
+        gap: 20px;
+      }
+    }
+
+    :deep(.checkbox-label) {
+      color: var(--body-text);
+    }
+  }
+</style>

pkg/harvester/components/vm-migration/MappingColumn.vue

@@ -0,0 +1,184 @@
+<script setup>
+import { computed } from 'vue';
+import { useStore } from 'vuex';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { RcItemCard } from '@components/RcItemCard';
+import { useI18n } from '@shell/composables/useI18n';
+
+const store = useStore();
+const { t } = useI18n(store);
+
+const props = defineProps({
+  title:       { type: String, required: true },
+  description: { type: String, default: '' },
+  entries:     { type: Array, default: () => [] },
+  options:     { type: Array, default: () => [] },
+  placeholder: { type: String, default: '' },
+  showUsedBy:  { type: Boolean, default: false },
+  clearable:   { type: Boolean, default: false },
+});
+
+const selectOptions = computed(() => {
+  if (!props.clearable) {
+    return props.options;
+  }
+
+  return [
+    {
+      label: t('harvester.addons.vmMigration.configureMappings.removeMap'),
+      value: null,
+      kind:  'highlighted',
+    },
+    {
+      label:    'divider',
+      disabled: true,
+      kind:     'divider',
+    },
+    {
+      label:    `${ props.placeholder }:`,
+      disabled: true,
+      kind:     'title',
+    },
+    ...props.options,
+  ];
+});
+</script>
+
+<template>
+  <div class="mapping-column">
+    <div>
+      <h3 class="mapping-section-title">
+        {{ title }}
+      </h3>
+      <p
+        v-if="description"
+        class="text-deemphasized line-height-20"
+      >
+        {{ description }}
+      </p>
+    </div>
+
+    <RcItemCard
+      v-for="entry in entries"
+      :id="entry._key"
+      :key="entry._key"
+      :variant="'small'"
+      :header="{}"
+      class="bg-light-gray"
+    >
+      <template #item-card-content>
+        <div class="card-content-column">
+          <div class="card-content-row">
+            <div class="mapping-source">
+              <span class="source-name">{{ entry.name }}</span>
+              <slot
+                name="source-detail"
+                :entry="entry"
+              />
+            </div>
+            <div :class="['mapping-arrow', entry.target ? 'text-success' : 'text-deemphasized']">
+              <i
+                class="icon icon-right-arrow-alt"
+                aria-hidden="true"
+              />
+            </div>
+            <div class="mapping-target">
+              <LabeledSelect
+                v-model:value="entry.target"
+                :options="selectOptions"
+                :placeholder="placeholder+'...'"
+                :searchable="true"
+              />
+            </div>
+          </div>
+          <div v-if="showUsedBy && entry.usedBy && entry.usedBy.length">
+            <span class="used-by">
+              {{ t('harvester.addons.vmMigration.generic.usedBy') }} <b>{{ entry.usedBy.join(', ') }}</b>
+            </span>
+          </div>
+        </div>
+      </template>
+    </RcItemCard>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .mapping-column {
+    display: flex;
+    gap: 12px;
+    flex-direction: column;
+
+    :deep(.item-card-header) {
+      display: none;
+    }
+  }
+
+  .mapping-section-title {
+    font-weight: 600;
+    margin: 0 0 5px 0;
+    line-height: 28px;
+  }
+
+  .card-content-row {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    width: 100%;
+  }
+
+  .card-content-column {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    width: 100%;
+  }
+
+  .mapping-source {
+    display: flex;
+    flex-direction: column;
+    flex: 2;
+    min-width: 100px;
+    font-size: 14px;
+    line-height: 20px;
+
+    .source-name {
+      font-weight: 600;
+      font-size: 14px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .source-detail {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .used-by {
+      margin-top: 4px;
+      font-size: 14px;
+      line-height: 24px;
+    }
+  }
+
+  .mapping-arrow {
+    font-size: 22px;
+    flex-shrink: 0;
+  }
+
+  .mapping-target {
+    flex: 3;
+    min-width: 0;
+    overflow: hidden;
+  }
+
+  .line-height-20 {
+    line-height: 20px;
+  }
+
+  .bg-light-gray {
+    background-color: var(--category-active) !important;
+    border: 0;
+  }
+</style>

pkg/harvester/components/vm-migration/ReviewMigrationStep.vue

@@ -0,0 +1,439 @@
+<script setup>
+import { ref, computed, watch } from 'vue';
+import { useStore } from 'vuex';
+import Loading from '@shell/components/Loading';
+import { Banner } from '@components/Banner';
+import { RcItemCard } from '@components/RcItemCard';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import MappingsCell from '../MappingsCell';
+import { useI18n } from '@shell/composables/useI18n';
+import { HCI } from '../../types';
+import { FORKLIFT_NAMESPACE } from '../../config/harvester-map';
+import {
+  FORKLIFT_API_VERSION, buildNetworkMapEntries, buildStorageMapEntries, bytesToGB, mbToGB
+} from '../../utils/forklift';
+
+const props = defineProps({
+  providerName:   { type: String, default: '' },
+  provider:       { type: Object, default: null },
+  selectedVms:    { type: Array, default: () => [] },
+  mappingEntries:  { type: Object, default: null },
+  stepData:        { type: Object, required: true },
+});
+
+const emit = defineEmits(['ready']);
+
+const store = useStore();
+const { t } = useI18n(store);
+
+const vms = ref([]);
+const networkMappings = ref([]);
+const storageMappings = ref([]);
+const planName = ref('');
+const errors = ref([]);
+const loading = ref(true);
+
+// Restore persisted state
+planName.value = props.stepData.planName;
+
+const NAMESPACE = FORKLIFT_NAMESPACE;
+const TARGET_NAMESPACE = 'default';
+
+watch(planName, (val) => {
+  props.stepData.planName = val;
+  emit('ready', !!val);
+}, { immediate: true });
+
+const totalVCpu = computed(() => vms.value.reduce((sum, vm) => sum + (vm.cpuCount || vm.numCPU || 0), 0));
+
+const totalMemoryGB = computed(() => {
+  const totalMB = vms.value.reduce((sum, vm) => sum + (vm.memoryMB || vm.memory || 0), 0);
+
+  return mbToGB(totalMB);
+});
+
+const totalStorageGB = computed(() => {
+  let totalBytes = 0;
+
+  vms.value.forEach((vm) => {
+    if (vm.disks && vm.disks.length > 0) {
+      totalBytes += vm.disks.reduce((sum, d) => sum + (d.capacity || 0), 0);
+    }
+  });
+
+  return bytesToGB(totalBytes);
+});
+
+const vmCards = computed(() => {
+  return vms.value.map((vm) => {
+    const cpus = vm.cpuCount || vm.numCPU || 0;
+    const memMB = vm.memoryMB || vm.memory || 0;
+    const memGB = memMB ? t('harvester.addons.vmMigration.generic.memoryGb', { value: mbToGB(memMB) }) : '-';
+
+    let totalDiskBytes = 0;
+
+    if (vm.disks && vm.disks.length > 0) {
+      totalDiskBytes = vm.disks.reduce((sum, d) => sum + (d.capacity || 0), 0);
+    }
+
+    const diskDisplay = totalDiskBytes ? t('harvester.addons.vmMigration.generic.memoryGb', { value: bytesToGB(totalDiskBytes) }) : '-';
+    const os = vm.guestName || vm.guestOS || vm.os || '-';
+
+    const vmNetworkMappings = networkMappings.value.filter((m) => m.usedBy && m.usedBy.includes(vm.name || vm.id));
+    const vmStorageMappings = storageMappings.value.filter((m) => m.usedBy && m.usedBy.includes(vm.name || vm.id));
+
+    return {
+      id:              vm.id,
+      name:            vm.name || vm.id,
+      os,
+      cpus,
+      memGB,
+      diskDisplay,
+      networkMappings: vmNetworkMappings,
+      storageMappings: vmStorageMappings,
+    };
+  });
+});
+
+const startMigrationAction = async() => {
+  const inStore = store.getters['currentProduct'].inStore;
+
+  const providerRef = {
+    source: {
+      apiVersion: FORKLIFT_API_VERSION,
+      kind:       'Provider',
+      name:       props.providerName,
+      namespace:  NAMESPACE,
+    },
+    destination: {
+      apiVersion: FORKLIFT_API_VERSION,
+      kind:       'Provider',
+      name:       'host',
+      namespace:  NAMESPACE,
+    },
+  };
+
+  const networkMapName = `${ planName.value }-network-map`;
+  const storageMapName = `${ planName.value }-storage-map`;
+
+  const networkMap = await store.dispatch(`${ inStore }/create`, {
+    type:     HCI.FORKLIFT_NETWORK_MAP,
+    metadata: { name: networkMapName, namespace: NAMESPACE },
+    spec:     { map: buildNetworkMapEntries(props.mappingEntries?.networkEntries || [], NAMESPACE), provider: providerRef },
+  });
+
+  await networkMap.save();
+
+  const storageMap = await store.dispatch(`${ inStore }/create`, {
+    type:     HCI.FORKLIFT_STORAGE_MAP,
+    metadata: { name: storageMapName, namespace: NAMESPACE },
+    spec:     { map: buildStorageMapEntries(props.mappingEntries?.storageEntries || []), provider: providerRef },
+  });
+
+  await storageMap.save();
+
+  const plan = await store.dispatch(`${ inStore }/create`, {
+    type:     HCI.FORKLIFT_PLAN,
+    metadata: { name: planName.value, namespace: NAMESPACE },
+    spec:     {
+      provider: providerRef,
+      map:      {
+        network: {
+          apiVersion: FORKLIFT_API_VERSION,
+          kind:       'NetworkMap',
+          name:       networkMapName,
+          namespace:  NAMESPACE,
+        },
+        storage: {
+          apiVersion: FORKLIFT_API_VERSION,
+          kind:       'StorageMap',
+          name:       storageMapName,
+          namespace:  NAMESPACE,
+        },
+      },
+      targetNamespace: TARGET_NAMESPACE,
+      vms:             vms.value.map((vm) => ({ id: vm.id, name: vm.name || vm.id })),
+      warm:            false,
+    },
+  });
+
+  await plan.save();
+
+  const planOwnerRef = {
+    apiVersion:         FORKLIFT_API_VERSION,
+    kind:               'Plan',
+    name:               plan.metadata.name,
+    uid:                plan.metadata.uid,
+    blockOwnerDeletion: true,
+  };
+
+  networkMap.metadata.ownerReferences = [planOwnerRef];
+  await networkMap.save();
+  storageMap.metadata.ownerReferences = [planOwnerRef];
+  await storageMap.save();
+
+  // Kick off the first migration through the model so the Migration payload
+  // lives in a single place (also reused by the dashboard start/restart action).
+  await plan.startMigration();
+};
+
+const init = () => {
+  vms.value = props.selectedVms;
+
+  if (props.mappingEntries) {
+    networkMappings.value = (props.mappingEntries.networkEntries || []).map((entry) => ({
+      source: entry.name || entry.id,
+      target: entry.target || '',
+      usedBy: entry.usedBy || [],
+    }));
+
+    storageMappings.value = (props.mappingEntries.storageEntries || []).map((entry) => ({
+      source: entry.name || entry.id,
+      target: entry.target || '',
+      usedBy: entry.usedBy || [],
+    }));
+  }
+
+  loading.value = false;
+};
+
+init();
+
+defineExpose({ startMigration: startMigrationAction });
+</script>
+
+<template>
+  <Loading v-if="loading" />
+  <div
+    v-else
+    class="review-migration"
+  >
+    <div
+      class="review-migration-content"
+    >
+      <!-- Migration Details Summary -->
+      <div class="migration-details">
+        <h3 class="section-title m-0">
+          {{ t('harvester.addons.vmMigration.reviewMigration.migrationDetails') }}
+        </h3>
+        <div class="span-9">
+          <LabeledInput
+            v-model:value="planName"
+            :label="t('harvester.addons.vmMigration.reviewMigration.planName')"
+            :placeholder="t('harvester.addons.vmMigration.reviewMigration.planNamePlaceholder')"
+            required
+          />
+        </div>
+        <div class="details-grid span-9">
+          <div class="detail-column">
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.totalVms') }}</span>
+              <span class="detail-value detail-value-large">{{ vms.length }}</span>
+            </div>
+          </div>
+          <div class="detail-column">
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.source') }}</span>
+            </div>
+            <div class="detail-item">
+              <span class="detail-value">{{ providerName }}</span>
+            </div>
+          </div>
+          <div class="detail-column">
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.targetNamespace') }}</span>
+            </div>
+            <div class="detail-item">
+              <span class="detail-value">{{ TARGET_NAMESPACE }}</span>
+            </div>
+          </div>
+          <div class="detail-column">
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.vcpu') }}</span>
+              <span class="detail-value">{{ totalVCpu }}</span>
+            </div>
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.memory') }}</span>
+              <span class="detail-value">{{ t('harvester.addons.vmMigration.generic.memoryGb', { value: totalMemoryGB }) }}</span>
+            </div>
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.storage') }}</span>
+              <span class="detail-value">{{ t('harvester.addons.vmMigration.generic.memoryGb', { value: totalStorageGB }) }}</span>
+            </div>
+          </div>
+          <div class="detail-column grid-column-2">
+            <div class="detail-item">
+              <span class="detail-label">{{ t('harvester.addons.vmMigration.reviewMigration.migrationMode') }}</span>
+            </div>
+            <div class="detail-item">
+              <span class="detail-value">
+                {{ t('harvester.addons.vmMigration.reviewMigration.coldMigration') }}
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Virtual Machines -->
+      <div class="vm-section">
+        <h3 class="section-title m-0">
+          {{ t('harvester.addons.vmMigration.reviewMigration.virtualMachines') }} ({{ vms.length }})
+        </h3>
+
+        <div class="vm-cards-grid">
+          <RcItemCard
+            v-for="vm in vmCards"
+            :id="vm.id"
+            :key="vm.id"
+            :variant="'small'"
+            :header="{ title: { text: vm.name } }"
+          >
+            <template #item-card-content>
+              <div class="vm-card-content">
+                <div class="vm-card-specs">
+                  <span class="vm-os text-deemphasized">{{ vm.os }}</span>
+                  <span class="vm-resources">
+                    <i
+                      class="icon icon-disk"
+                      aria-hidden="true"
+                    />
+                    {{ t('harvester.addons.vmMigration.generic.vCpu', { count: vm.cpus }) }} &bull; {{ vm.memGB }} &bull; {{ vm.diskDisplay }}
+                  </span>
+                </div>
+                <MappingsCell
+                  :network-entries="vm.networkMappings.map(m => `${m.source} → ${m.target}`)"
+                  :storage-entries="vm.storageMappings.map(m => `${m.source} → ${m.target}`)"
+                />
+              </div>
+            </template>
+          </RcItemCard>
+        </div>
+      </div>
+
+      <!-- Cold Migration Warning -->
+      <Banner
+        color="warning"
+        class="m-0"
+      >
+        <div>
+          <span class="banner-title">{{ t('harvester.addons.vmMigration.reviewMigration.warningTitle') }}</span><br>
+          {{ t('harvester.addons.vmMigration.reviewMigration.warningMessage') }}
+        </div>
+      </Banner>
+
+      <!-- Error banner -->
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        color="error"
+        :label="err"
+      />
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .review-migration {
+    gap: 36px;
+  }
+
+  .review-migration-content {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+  }
+
+  .section-title {
+    font-weight: 600;
+  }
+
+  .details-grid {
+    display: grid;
+    grid-template-columns: minmax(230px, 1fr) 1fr 1fr;
+    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
+    gap: 12px clamp(64px, 8vw, 128px);
+    line-height: 20px;
+  }
+
+  .detail-column {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+
+    &.grid-column-2 {
+        grid-column: span 2;
+    }
+  }
+
+  .detail-item {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+
+    .detail-label {
+      font-size: 14px;
+      color: var(--muted);
+    }
+
+    .detail-value {
+      font-weight: 600;
+      font-size: 14px;
+
+      &.detail-value-large {
+        font-size: 24px;
+      }
+    }
+  }
+
+  .vm-cards-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
+    gap: 16px;
+  }
+
+  .vm-card-content {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+    line-height: 20px;
+  }
+
+  .vm-card-specs {
+    display: flex;
+    flex-direction: row;
+    gap: 16px;
+    align-items: center;
+
+    .vm-os {
+      font-size: 14px;
+    }
+
+    .vm-resources {
+      font-size: 14px;
+      color: var(--muted);
+      display: inline-flex;
+      align-items: center;
+      gap: 8px;
+    }
+  }
+
+  .banner-title {
+    font-weight: 600;
+  }
+
+  .migration-details {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  header {
+    margin: 0;
+  }
+
+  .vm-section {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+  }
+</style>

pkg/harvester/components/vm-migration/SelectVmsStep.vue

@@ -0,0 +1,583 @@
+<script setup>
+import {
+  ref, computed, watch, nextTick, onBeforeUnmount, toRefs
+} from 'vue';
+import { useStore } from 'vuex';
+import Loading from '@shell/components/Loading';
+import SortableTable from '@shell/components/SortableTable';
+import { Banner } from '@components/Banner';
+import { BadgeState } from '@components/BadgeState';
+import { useI18n } from '@shell/composables/useI18n';
+import { bytesToGB, mbToGB } from '../../utils/forklift';
+
+const props = defineProps({
+  providerName: { type: String, default: '' },
+  provider:     { type: Object, default: null },
+  stepData:     { type: Object, required: true },
+});
+
+const emit = defineEmits(['complete', 'loading']);
+
+const store = useStore();
+const { t } = useI18n(store);
+
+const { discoveredVMs, selectedVMIds, tableRows } = toRefs(props.stepData);
+
+const selectedVMs = ref([]);
+const loading = ref(true);
+const networkMap = ref({});
+const datastoreMap = ref({});
+const sortableTableRef = ref(null);
+const allVMsSelected = ref(false);
+const errors = ref([]);
+let skipNextSelectionEvent = false;
+
+const lastFetchedAt = ref(null);
+const now = ref(Date.now());
+
+const formatElapsed = (ms) => {
+  const totalMinutes = Math.floor(ms / 60000);
+  const hours = Math.floor(totalMinutes / 60);
+  const minutes = totalMinutes % 60;
+
+  if (hours > 0 && minutes > 0) {
+    return t('harvester.addons.vmMigration.generic.elapsed.hoursAndMinutes', { hours, minutes });
+  }
+
+  if (hours > 0) {
+    return t('harvester.addons.vmMigration.generic.elapsed.hours', { hours });
+  }
+
+  return t('harvester.addons.vmMigration.generic.elapsed.minutes', { minutes: Math.max(1, minutes) });
+};
+
+const lastSyncedTime = computed(() => {
+  if (!lastFetchedAt.value) {
+    return '';
+  }
+
+  return formatElapsed(now.value - lastFetchedAt.value);
+});
+
+const nowTimer = setInterval(() => {
+  now.value = Date.now();
+}, 30000);
+
+onBeforeUnmount(() => {
+  clearInterval(nowTimer);
+});
+
+// Restore selection state from stepData
+if (selectedVMIds.value.size > 0) {
+  selectedVMs.value = discoveredVMs.value.filter((vm) => selectedVMIds.value.has(vm.id));
+  allVMsSelected.value = selectedVMIds.value.size === discoveredVMs.value.length;
+}
+
+const vmCount = computed(() => discoveredVMs.value.length);
+const selectedCount = computed(() => selectedVMs.value.length);
+
+const showSelectAllBanner = computed(() => {
+  if (allVMsSelected.value) {
+    return true;
+  }
+
+  const pagedRows = sortableTableRef.value?.pagedRows || [];
+
+  if (pagedRows.length === 0) {
+    return false;
+  }
+
+  const allPageSelected = pagedRows.every((row) => selectedVMIds.value.has(row._original?.id));
+
+  return allPageSelected && tableRows.value.length > pagedRows.length;
+});
+
+const theadElement = computed(() => sortableTableRef.value?.$el?.querySelector('thead'));
+
+const headers = [
+  {
+    name:     'vmName',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.vmName',
+    value:    'vmName',
+    sort:     ['vmName'],
+    subLabel: t('harvester.addons.vmMigration.generic.identifier'),
+  },
+  {
+    name:     'os',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.os',
+    value:    'os',
+    sort:     ['os'],
+    width:    180,
+  },
+  {
+    name:     'resources',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.resources',
+    value:    'resources',
+    sort:     false,
+    width:    140,
+  },
+  {
+    name:     'powerState',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.powerState',
+    value:    'powerState',
+    sort:     ['powerState'],
+    width:    130,
+  },
+  {
+    name:     'network',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.network',
+    value:    'network',
+    sort:     ['network'],
+    subLabel: t('harvester.addons.vmMigration.generic.identifier'),
+    width:    200,
+  },
+  {
+    name:     'datastore',
+    labelKey: 'harvester.addons.vmMigration.selectVms.columns.datastore',
+    value:    'datastore',
+    sort:     ['datastore'],
+    subLabel: t('harvester.addons.vmMigration.generic.identifier'),
+    width:    200,
+  },
+];
+
+const buildTableRows = () => {
+  return discoveredVMs.value.map((vm) => {
+    const cpus = vm.cpuCount || vm.numCPU || '-';
+    const memMB = vm.memoryMB || vm.memory || 0;
+    const memGB = memMB ? t('harvester.addons.vmMigration.generic.memoryGb', { value: mbToGB(memMB) }) : '-';
+
+    let totalDiskBytes = 0;
+
+    if (vm.disks && vm.disks.length > 0) {
+      totalDiskBytes = vm.disks.reduce((sum, d) => sum + (d.capacity || 0), 0);
+    }
+
+    const diskDisplay = totalDiskBytes ? t('harvester.addons.vmMigration.generic.memoryGb', { value: bytesToGB(totalDiskBytes) }) : '-';
+    const rawPowerState = vm.powerState || vm.status?.phase || '-';
+    const powerState = rawPowerState.replace(/([a-z])([A-Z])/g, '$1 $2').replace(/^./, (c) => c.toUpperCase());
+
+    let networks = [];
+
+    if (vm.networks && vm.networks.length > 0) {
+      networks = vm.networks.map((n) => ({
+        name:   n.name || networkMap.value[n.id] || n.id || n,
+        id:     n.id || '',
+        vlanId: n.vlanId || '',
+      }));
+    }
+
+    const datastores = [];
+
+    if (vm.disks && vm.disks.length > 0) {
+      const seen = new Set();
+
+      vm.disks.forEach((d) => {
+        const dsId = d.datastore?.id || d.datastore?.name;
+
+        if (dsId && !seen.has(dsId)) {
+          seen.add(dsId);
+          datastores.push({
+            name:     d.datastore?.name || datastoreMap.value[dsId] || dsId,
+            id:       d.datastore?.id || '',
+            type:     d.datastore?.type || '',
+            capacity: d.capacity || 0,
+          });
+        }
+      });
+    }
+
+    return {
+      _original:        vm,
+      _key:             vm.id || vm.vmId || vm.metadata?.name,
+      vmName:           vm.name || vm.metadata?.name || '-',
+      vmId:             vm.id || vm.vmId || vm.metadata?.name || '-',
+      os:               vm.guestName || vm.guestOS || vm.os || '-',
+      resourcesDisplay: t('harvester.addons.vmMigration.generic.vCpu', { count: cpus }),
+      resourcesSub:     `${ memGB } • ${ diskDisplay }`,
+      powerState,
+      powerStateClass:  powerState.toLowerCase().includes('on') || powerState.toLowerCase().includes('running') ? 'power-on' : 'power-off',
+      networks,
+      network:          networks.map((n) => n.name).join(', ') || '-',
+      datastores,
+      datastore:        datastores.map((d) => d.name).join(', ') || '-',
+    };
+  });
+};
+
+const onSelect = (rows) => {
+  if (skipNextSelectionEvent) {
+    return;
+  }
+
+  const currentPageRows = sortableTableRef.value?.pagedRows || [];
+  const selectedKeys = new Set(rows.map((r) => r._key));
+
+  currentPageRows.forEach((row) => {
+    const vmId = row._original?.id;
+
+    if (selectedKeys.has(row._key)) {
+      selectedVMIds.value.add(vmId);
+    } else {
+      selectedVMIds.value.delete(vmId);
+    }
+  });
+
+  allVMsSelected.value = selectedVMIds.value.size === discoveredVMs.value.length;
+  selectedVMs.value = discoveredVMs.value.filter((vm) => selectedVMIds.value.has(vm.id));
+
+  emit('complete', { selectedVMs: selectedVMs.value });
+};
+
+const clearSelection = () => {
+  allVMsSelected.value = false;
+  selectedVMIds.value = new Set();
+  selectedVMs.value = [];
+
+  nextTick(() => {
+    const table = sortableTableRef.value;
+
+    if (table) {
+      table.clearSelection();
+    }
+  });
+};
+
+const selectAllVMs = () => {
+  allVMsSelected.value = true;
+  selectedVMIds.value = new Set(discoveredVMs.value.map((vm) => vm.id));
+  selectedVMs.value = discoveredVMs.value.slice();
+};
+
+watch(
+  () => sortableTableRef.value?.page,
+  () => {
+    skipNextSelectionEvent = true;
+
+    nextTick(() => {
+      const table = sortableTableRef.value;
+
+      if (!table) {
+        return;
+      }
+
+      const rowsToReselect = (table.pagedRows || []).filter((row) => selectedVMIds.value.has(row._original?.id));
+
+      if (rowsToReselect.length > 0) {
+        table.update(rowsToReselect, []);
+      }
+
+      skipNextSelectionEvent = false;
+    });
+  }
+);
+
+const refreshing = ref(false);
+
+const isLoading = computed(() => loading.value || refreshing.value);
+
+watch(isLoading, (val) => {
+  emit('loading', val);
+}, { immediate: true });
+
+const fetchVMs = async() => {
+  if (!props.provider) {
+    return;
+  }
+
+  const inStore = store.getters['currentProduct'].inStore;
+  const providerUid = props.provider.metadata.uid;
+  const providerType = props.provider.spec?.type || 'vsphere';
+  const baseUrl = store.getters['harvester-common/getHarvesterClusterUrl'](
+    `v1/harvester/providers/${ providerType }/${ providerUid }`
+  );
+
+  const [vmsResp, networksResp, datastoresResp] = await Promise.all([
+    store.dispatch(`${ inStore }/request`, { url: `${ baseUrl }/vms` }),
+    store.dispatch(`${ inStore }/request`, { url: `${ baseUrl }/networks` }).catch(() => []),
+    store.dispatch(`${ inStore }/request`, { url: `${ baseUrl }/datastores` }).catch(() => []),
+  ]);
+
+  if (Array.isArray(vmsResp)) {
+    discoveredVMs.value = vmsResp;
+  } else if (vmsResp?.data && Array.isArray(vmsResp.data)) {
+    discoveredVMs.value = vmsResp.data;
+  }
+
+  const networks = Array.isArray(networksResp) ? networksResp : (networksResp?.data || []);
+  const datastores = Array.isArray(datastoresResp) ? datastoresResp : (datastoresResp?.data || []);
+
+  networkMap.value = networks.reduce((map, n) => {
+    map[n.id] = n.name;
+
+    return map;
+  }, {});
+  datastoreMap.value = datastores.reduce((map, d) => {
+    map[d.id] = d.name;
+
+    return map;
+  }, {});
+
+  lastFetchedAt.value = Date.now();
+  tableRows.value = buildTableRows();
+};
+
+const refreshVMs = async() => {
+  refreshing.value = true;
+  skipNextSelectionEvent = true;
+
+  const previousSelectedIds = new Set(selectedVMIds.value);
+
+  try {
+    errors.value = [];
+    await fetchVMs();
+  } catch (e) {
+    discoveredVMs.value = [];
+    tableRows.value = [];
+    errors.value = [e?.message || t('harvester.addons.vmMigration.errors.failedRefreshVms')];
+  }
+
+  selectedVMIds.value = new Set(
+    discoveredVMs.value
+      .filter((vm) => previousSelectedIds.has(vm.id))
+      .map((vm) => vm.id)
+  );
+  selectedVMs.value = discoveredVMs.value.filter((vm) => selectedVMIds.value.has(vm.id));
+  allVMsSelected.value = selectedVMIds.value.size > 0 && selectedVMIds.value.size === discoveredVMs.value.length;
+
+  props.stepData.discoveredVMs = discoveredVMs.value;
+  props.stepData.selectedVMIds = selectedVMIds.value;
+  props.stepData.tableRows = tableRows.value;
+  emit('complete', { selectedVMs: selectedVMs.value });
+  refreshing.value = false;
+
+  await nextTick();
+
+  const table = sortableTableRef.value;
+
+  if (table) {
+    const rowsToReselect = (table.pagedRows || []).filter((row) => selectedVMIds.value.has(row._original?.id));
+
+    if (rowsToReselect.length > 0) {
+      table.update(rowsToReselect, []);
+    }
+  }
+
+  skipNextSelectionEvent = false;
+};
+
+const init = async() => {
+  if (discoveredVMs.value.length > 0) {
+    if (!lastFetchedAt.value) {
+      lastFetchedAt.value = Date.now();
+    }
+    tableRows.value = buildTableRows();
+    loading.value = false;
+
+    return;
+  }
+
+  try {
+    await fetchVMs();
+  } catch (e) {
+    discoveredVMs.value = [];
+    errors.value = [e?.message || t('harvester.addons.vmMigration.errors.failedLoadVms')];
+  }
+
+  loading.value = false;
+};
+
+// Emit initial complete if VMs are already selected (restored from stepData)
+if (selectedVMs.value.length > 0) {
+  emit('complete', { selectedVMs: selectedVMs.value });
+}
+
+init();
+</script>
+
+<template>
+  <Loading v-if="loading || refreshing" />
+  <div
+    v-else
+    class="select-vms-step"
+  >
+    <Banner
+      v-for="(err, i) in errors"
+      :key="i"
+      color="error"
+      :label="err"
+    />
+    <p class="text-deemphasized line-height-20">
+      {{ t('harvester.addons.vmMigration.selectVms.discovered', { count: vmCount }) }}
+      <router-link
+        v-if="provider"
+        class="provider-link"
+        :to="provider._detailLocation"
+      >
+        {{ providerName }}
+      </router-link>
+      <br>
+      <span
+        v-if="lastSyncedTime"
+      >
+        {{ t('harvester.addons.vmMigration.selectVms.lastSynced', { time: lastSyncedTime }) }}
+        <a
+          role="button"
+          class="text-bold"
+          :class="{ disabled: refreshing }"
+          @click.prevent="refreshVMs"
+        >
+          {{ t('harvester.addons.vmMigration.selectVms.refreshNow') }}
+        </a>
+      </span>
+    </p>
+    <!-- Discovered VMs table -->
+    <SortableTable
+      ref="sortableTableRef"
+      :rows="tableRows"
+      :headers="headers"
+      :search="true"
+      :table-actions="true"
+      :row-actions="false"
+      :groupable="false"
+      :paging="true"
+      :rows-per-page="20"
+      key-field="_key"
+      @selection="onSelect"
+    >
+      <template #header-left>
+        <div class="vm-table-title">
+          <h3 class="m-0">
+            {{ t('harvester.addons.vmMigration.selectVms.availableVms') }}
+          </h3>
+          <span class="text-deemphasized">{{ selectedCount }} {{ t('harvester.addons.vmMigration.selectVms.selected') }}</span>
+        </div>
+      </template>
+      <template #cell:vmName="{ row }">
+        <div class="vm-name-cell">
+          <span class="vm-name">{{ row.vmName }}</span>
+          <span class="vm-id text-deemphasized">{{ row.vmId }}</span>
+        </div>
+      </template>
+      <template #cell:resources="{ row }">
+        <span>{{ row.resourcesDisplay }}</span><br>
+        <span class="text-deemphasized">{{ row.resourcesSub }}</span>
+      </template>
+      <template #cell:powerState="{ row }">
+        <BadgeState
+          :label="row.powerState"
+          :color="row.powerStateClass === 'power-on' ? 'bg-warning' : 'bg-darker'"
+        />
+      </template>
+      <template #cell:network="{ row }">
+        <div>
+          <div
+            v-for="(net, i) in row.networks"
+            :key="i"
+            :class="{ 'mt-4': i > 0 }"
+          >
+            <span>{{ net.name }}</span><br>
+            <span class="text-deemphasized">{{ net.id }}</span>
+          </div>
+        </div>
+      </template>
+      <template #cell:datastore="{ row }">
+        <div>
+          <div
+            v-for="(ds, i) in row.datastores"
+            :key="i"
+            :class="{ 'mt-4': i > 0 }"
+          >
+            <span>{{ ds.name }}</span><br>
+            <span class="text-deemphasized">{{ ds.id }}</span>
+          </div>
+        </div>
+      </template>
+    </SortableTable>
+
+    <Teleport
+      v-if="showSelectAllBanner && theadElement"
+      :to="theadElement"
+    >
+      <tr class="select-all-banner-row">
+        <td
+          :colspan="headers.length + 1"
+          class="select-all-banner-cell"
+        >
+          <template v-if="allVMsSelected">
+            <span>{{ t('harvester.addons.vmMigration.selectVms.selectAllBanner.allSelected') }}</span>
+            <a
+              role="button"
+              @click.prevent="clearSelection"
+            >
+              {{ t('harvester.addons.vmMigration.selectVms.selectAllBanner.clearSelection') }}
+            </a>
+          </template>
+          <template v-else>
+            <span>{{ t('harvester.addons.vmMigration.selectVms.selectAllBanner.pageOnly') }}</span>
+            <a
+              role="button"
+              @click.prevent="selectAllVMs"
+            >
+              {{ t('harvester.addons.vmMigration.selectVms.selectAllBanner.selectAll', { count: vmCount }) }}
+            </a>
+          </template>
+        </td>
+      </tr>
+    </Teleport>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+  .vm-table-title {
+    .text-deemphasized {
+      font-size: 13px;
+    }
+  }
+
+  .vm-name-cell {
+    display: flex;
+    flex-direction: column;
+    font-size: 14px;
+
+    .vm-name {
+      line-height: 20px;
+    }
+
+    .vm-id {
+      line-height: 20px;
+    }
+  }
+
+  .select-vms-step {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+
+    .line-height-20 {
+      line-height: 20px;
+    }
+  }
+
+  :deep(.select-all-banner-row) {
+    .select-all-banner-cell {
+      text-align: center;
+      padding: 8px 16px;
+      background-color: var(--sortable-table-header-bg);
+      border-bottom: 1px solid var(--border);
+      font-size: 13px;
+
+      a {
+        color: var(--primary);
+        cursor: pointer;
+        font-weight: 600;
+        margin-left: 5px;
+
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+</style>

pkg/harvester/config/doc-links.js

@@ -1,8 +1,13 @@
 // suffix of doc link, see utils/feature-flags.js how to get complete doc link
 export const DOC = {
-  CONSOLE_URL:             `/host/#remote-console`,
-  RANCHER_INTEGRATION_URL: `/rancher/rancher-integration`,
-  STORAGE_NETWORK_EXAMPLE: `/advanced/storagenetwork#configuration-example`,
-  KSMTUNED_MODE:           `/host/#ksmtuned-mode`,
-  UPGRADE_URL:             `/upgrade/index`
+  CONSOLE_URL:                `/host/#remote-console`,
+  RANCHER_INTEGRATION_URL:    `/rancher/rancher-integration`,
+  KSMTUNED_MODE:              `/host/#ksmtuned-mode`,
+  UPGRADE_URL:                `/upgrade/index`,
+  UPGRADE_CONFIG_URL:         `/advanced/index#upgrade-config`,
+  STORAGE_NETWORK_EXAMPLE:    `/advanced/storagenetwork#configuration-example`,
+  SUPPORT_BUNDLE_NAMESPACES:  `/advanced/index/#support-bundle-namespaces`,
+  VPC_CONFIGURATION_EXAMPLES: `/networking/kubeovn-vpc#vpc-peering-configuration-examples`,
+  NETWORK_POLICY:             `/networking/kubeovn-vm-isolation/#network-policies`,
+  TRANSPARENT_HUGEPAGES:      `https://docs.kernel.org/admin-guide/mm/transhuge.html`,
 };

pkg/harvester/config/feature-flags.js

@@ -21,6 +21,7 @@ const FEATURE_FLAGS = {
     'vmSnapshotQuota',
     'longhornV2LVMSupport',
     'improveMaintenanceMode',
+    'upgradeConfigSetting'
   ],
   'v1.4.1': [],
   'v1.4.2': [
@@ -38,8 +39,44 @@ const FEATURE_FLAGS = {
   ],
   'v1.5.1': [],
   'v1.6.0': [
-    'vmMachineTypes'
-  ]
+    'customSupportBundle',
+    'csiOnlineExpandValidation',
+    'vmNetworkMigration',
+    'kubeovnVpcSubnet',
+    'rancherClusterSetting',
+    'cpuMemoryHotplug',
+    'cdiSettings',
+    'vmCloneRunStrategy',
+  ],
+  'v1.6.1': [],
+  'v1.7.0': [
+    'vmMachineTypeAuto',
+    'lhV2VolExpansion',
+    'l2VlanTrunkMode',
+    'kubevirtMigration',
+    'hotplugNic',
+    'resumeUpgradePausedNode',
+  ],
+  'v1.7.1': [],
+  'v1.8.0': [
+    'hotplugCdRom',
+    'supportBundleFileNameSetting',
+    'clusterRegistrationTLSVerify',
+    'vGPUAsPCIDevice',
+    'instanceManagerResourcesSetting',
+    'rwxNetworkSetting',
+    'createPVCWithDataVolume',
+    'clusterPodSecurityStandardSetting',
+  ],
+  'v1.8.1': [],
+  'v1.9.0': [
+    'supportFilesystem',
+    'disableResourcePooling',
+    'expandOnlineEncryptedVolume',
+    'longhornV2HugepageSettings',
+    'staticIPForVM',
+    'fsFreezeDeadline',
+  ],
 };
 
 const generateFeatureFlags = () => {

pkg/harvester/config/harvester-cluster.js

@@ -10,6 +10,7 @@ import {
   LOGGING,
   STORAGE_CLASS,
   SECRET,
+  NETWORK_POLICY
 } from '@shell/config/types';
 import { HCI, VOLUME_SNAPSHOT } from '../types';
 import {
@@ -34,12 +35,40 @@ import {
   SNAPSHOT_TARGET_VOLUME,
   IMAGE_VIRTUAL_SIZE,
   IMAGE_STORAGE_CLASS,
-  HARVESTER_DESCRIPTION
+  HARVESTER_DESCRIPTION,
+  VM_IMPORT_SOURCE_VM,
+  VM_IMPORT_SOURCE_CLUSTER,
+  VM_IMPORT_STATUS,
+  VM_IMPORT_SOURCE_V_DC,
+  VM_IMPORT_SOURCE_V_ENDPOINT,
+  VM_IMPORT_SOURCE_V_STATUS,
+  VM_IMPORT_SOURCE_O_REGION,
+  VM_IMPORT_SOURCE_O_ENDPOINT,
+  VM_IMPORT_SOURCE_O_STATUS,
+  VM_IMPORT_SOURCE_OVA_URL,
+  VM_IMPORT_SOURCE_OVA_STATUS,
+  FORKLIFT_PROVIDER_TYPE,
+  FORKLIFT_PROVIDER_URL,
+  FORKLIFT_MAP_SOURCE_PROVIDER,
+  FORKLIFT_MAP_DEST_PROVIDER,
+  FORKLIFT_PLAN_TARGET_NS,
+  FORKLIFT_PLAN_VM_COUNT,
+  FORKLIFT_MIGRATION_PLAN,
 } from './table-headers';
+import { ADD_ONS } from './harvester-map';
+import { registerAddonSideNav } from '../utils/dynamic-nav';
 
 const TEMPLATE = HCI.VM_VERSION;
 const MONITORING_GROUP = 'Monitoring & Logging::Monitoring';
 const LOGGING_GROUP = 'Monitoring & Logging::Logging';
+const OVERLAY_NETWORKS_GROUP = 'Overlay Networks';
+const UNDERLAY_NETWORKS_GROUP = 'Underlay Networks';
+const NAT_INTERNET_GROUP = `${ OVERLAY_NETWORKS_GROUP }::NAT & Internet`;
+const GATEWAYS_GROUP = `${ NAT_INTERNET_GROUP }::Gateways`;
+const EXTERNAL_IPS_GROUP = `${ NAT_INTERNET_GROUP }::External IPs`;
+const RULES_GROUP = `${ NAT_INTERNET_GROUP }::Rules`;
+const SOURCE_RULES_GROUP = `${ RULES_GROUP }::Source Rules`;
+const DESTINATION_RULES_GROUP = `${ RULES_GROUP }::Destination Rules`;
 
 export const PRODUCT_NAME = 'harvester';
 
@@ -67,7 +96,6 @@ export function init($plugin, store) {
     configureType,
     virtualType,
     weightGroup,
-    weightType,
   } = $plugin.DSL(store, PRODUCT_NAME);
 
   const isSingleVirtualCluster = process.env.rancherEnv === PRODUCT_NAME;
@@ -154,7 +182,7 @@ export function init($plugin, store) {
     group:      'Root',
     name:       HCI.HOST,
     namespaced: true,
-    weight:     399,
+    weight:     499,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.HOST }
@@ -186,7 +214,7 @@ export function init($plugin, store) {
     group:      'root',
     name:       HCI.VM,
     namespaced: true,
-    weight:     299,
+    weight:     498,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.VM }
@@ -194,6 +222,146 @@ export function init($plugin, store) {
     exact: false
   });
 
+  // ===========================================================================
+  // VM Import Controller UI Flow
+  // ===========================================================================
+  // Define group (Hidden by default)
+  weightGroup('vmimport', 0, false);
+
+  // VirtualMachineImport
+  headers(HCI.VMIMPORT, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    VM_IMPORT_SOURCE_VM,
+    VM_IMPORT_SOURCE_CLUSTER,
+    VM_IMPORT_STATUS,
+    AGE
+  ]);
+  configureType(HCI.VMIMPORT, {
+    resource:       HCI.VMIMPORT,
+    resourceDetail: HCI.VMIMPORT,
+    resourceEdit:   HCI.VMIMPORT,
+    location:       {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT }
+    }
+  });
+  virtualType({ // needed to avoid 404 on refresh when combined with registerAddonSideNav()
+    name:       HCI.VMIMPORT,
+    labelKey:   'harvester.addons.vmImport.labels.vmimport',
+    group:      'vmimport',
+    namespaced: true,
+    ifHaveType: HCI.VMIMPORT,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT }
+    }
+  });
+
+  // Source: VMware
+  headers(HCI.VMIMPORT_SOURCE_V, [
+    STATE,
+    NAME_COL,
+    VM_IMPORT_SOURCE_V_ENDPOINT,
+    VM_IMPORT_SOURCE_V_DC,
+    VM_IMPORT_SOURCE_V_STATUS,
+    AGE
+  ]);
+  configureType(HCI.VMIMPORT_SOURCE_V, {
+    resource:       HCI.VMIMPORT_SOURCE_V,
+    resourceDetail: HCI.VMIMPORT_SOURCE_V,
+    resourceEdit:   HCI.VMIMPORT_SOURCE_V,
+    location:       {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_V }
+    }
+  });
+  virtualType({ // needed to avoid 404 on refresh when combined with registerAddonSideNav()
+    name:       HCI.VMIMPORT_SOURCE_V,
+    labelKey:   'harvester.addons.vmImport.labels.vmimportSourceVMWare',
+    group:      'vmimport',
+    namespaced: true,
+    ifHaveType: HCI.VMIMPORT_SOURCE_V,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_V }
+    }
+  });
+
+  // Source: OpenStack
+  headers(HCI.VMIMPORT_SOURCE_O, [
+    STATE,
+    NAME_COL,
+    VM_IMPORT_SOURCE_O_ENDPOINT,
+    VM_IMPORT_SOURCE_O_REGION,
+    VM_IMPORT_SOURCE_O_STATUS,
+    AGE
+  ]);
+  configureType(HCI.VMIMPORT_SOURCE_O, {
+    resource:       HCI.VMIMPORT_SOURCE_O,
+    resourceDetail: HCI.VMIMPORT_SOURCE_O,
+    resourceEdit:   HCI.VMIMPORT_SOURCE_O,
+    location:       {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_O }
+    }
+  });
+  virtualType({ // needed to avoid 404 on refresh when combined with registerAddonSideNav()
+    name:       HCI.VMIMPORT_SOURCE_O,
+    labelKey:   'harvester.addons.vmImport.labels.vmimportSourceOpenStack',
+    group:      'vmimport',
+    namespaced: true,
+    ifHaveType: HCI.VMIMPORT_SOURCE_O,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_O }
+    }
+  });
+
+  // Source: OVA
+  headers(HCI.VMIMPORT_SOURCE_OVA, [
+    STATE,
+    NAME_COL,
+    VM_IMPORT_SOURCE_OVA_URL,
+    VM_IMPORT_SOURCE_OVA_STATUS,
+    AGE
+  ]);
+  configureType(HCI.VMIMPORT_SOURCE_OVA, {
+    resource:       HCI.VMIMPORT_SOURCE_OVA,
+    resourceDetail: HCI.VMIMPORT_SOURCE_OVA,
+    resourceEdit:   HCI.VMIMPORT_SOURCE_OVA,
+    location:       {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_OVA }
+    }
+  });
+  virtualType({ // needed to avoid 404 on refresh when combined with registerAddonSideNav()
+    name:       HCI.VMIMPORT_SOURCE_OVA,
+    labelKey:   'harvester.addons.vmImport.labels.vmimportSourceOVA',
+    group:      'vmimport',
+    namespaced: true,
+    ifHaveType: HCI.VMIMPORT_SOURCE_OVA,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VMIMPORT_SOURCE_OVA }
+    }
+  });
+
+  // Enable SideNav based on Addon Status
+  registerAddonSideNav(store, PRODUCT_NAME, {
+    addonName:    ADD_ONS.VM_IMPORT_CONTROLLER,
+    resourceType: HCI.ADD_ONS,
+    navGroup:     'vmimport',
+    types:        [
+      HCI.VMIMPORT_SOURCE_V,
+      HCI.VMIMPORT_SOURCE_O,
+      HCI.VMIMPORT_SOURCE_OVA,
+      HCI.VMIMPORT
+    ]
+  });
+  // ===========================================================================
+
   basicType([HCI.VOLUME]);
   configureType(HCI.VOLUME, {
     location: {
@@ -211,7 +379,7 @@ export function init($plugin, store) {
     ifHaveType: PVC,
     name:       HCI.VOLUME,
     namespaced: true,
-    weight:     199,
+    weight:     497,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.VOLUME }
@@ -237,7 +405,7 @@ export function init($plugin, store) {
     group:      'root',
     name:       HCI.IMAGE,
     namespaced: true,
-    weight:     198,
+    weight:     496,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.IMAGE }
@@ -252,7 +420,7 @@ export function init($plugin, store) {
     group:      'root',
     namespaced: true,
     name:       'projects-namespaces',
-    weight:     98,
+    weight:     495,
     route:      { name: `${ PRODUCT_NAME }-c-cluster-projectsnamespaces` },
     exact:      true,
   });
@@ -264,7 +432,7 @@ export function init($plugin, store) {
       labelKey:   'harvester.namespace.label',
       name:       NAMESPACE,
       namespaced: true,
-      weight:     89,
+      weight:     495,
       route:      {
         name:   `${ PRODUCT_NAME }-c-cluster-resource`,
         params: { resource: NAMESPACE }
@@ -335,6 +503,7 @@ export function init($plugin, store) {
   });
 
   virtualType({
+    ifHaveType: LOGGING.CLUSTER_FLOW,
     labelKey:   'harvester.logging.clusterFlow.label',
     name:       HCI.CLUSTER_FLOW,
     namespaced: true,
@@ -358,6 +527,7 @@ export function init($plugin, store) {
   });
 
   virtualType({
+    ifHaveType: LOGGING.CLUSTER_OUTPUT,
     labelKey:   'harvester.logging.clusterOutput.label',
     name:       HCI.CLUSTER_OUTPUT,
     namespaced: true,
@@ -381,6 +551,7 @@ export function init($plugin, store) {
   });
 
   virtualType({
+    ifHaveType: LOGGING.FLOW,
     labelKey:   'harvester.logging.flow.label',
     name:       HCI.FLOW,
     namespaced: true,
@@ -404,6 +575,7 @@ export function init($plugin, store) {
   });
 
   virtualType({
+    ifHaveType: LOGGING.OUTPUT,
     labelKey:   'harvester.logging.output.label',
     name:       HCI.OUTPUT,
     namespaced: true,
@@ -424,12 +596,53 @@ export function init($plugin, store) {
     [
       HCI.CLUSTER_NETWORK,
       HCI.NETWORK_ATTACHMENT,
+      HCI.HOST_NETWORK_CONFIG,
       HCI.LB,
       HCI.IP_POOL,
     ],
     'networks'
   );
 
+  basicType(
+    [HCI.VPC],
+    OVERLAY_NETWORKS_GROUP
+  );
+
+  basicType(
+    [NETWORK_POLICY],
+    OVERLAY_NETWORKS_GROUP
+  );
+
+  basicType(
+    [HCI.VPC_NAT_GATEWAY],
+    GATEWAYS_GROUP
+  );
+
+  basicType(
+    [HCI.IPTABLES_EIP],
+    EXTERNAL_IPS_GROUP
+  );
+
+  basicType(
+    [HCI.IPTABLES_SNAT_RULE],
+    SOURCE_RULES_GROUP
+  );
+
+  basicType(
+    [HCI.IPTABLES_DNAT_RULE],
+    DESTINATION_RULES_GROUP
+  );
+
+  basicType(
+    [HCI.PROVIDER_NETWORK],
+    UNDERLAY_NETWORKS_GROUP
+  );
+
+  basicType(
+    [HCI.VLAN],
+    UNDERLAY_NETWORKS_GROUP
+  );
+
   basicType(
     [
       HCI.SCHEDULE_VM_BACKUP,
@@ -440,9 +653,12 @@ export function init($plugin, store) {
     'backupAndSnapshot'
   );
 
-  weightGroup('networks', 300, true);
-  weightType(NAMESPACE, 299, true);
-  weightGroup('backupAndSnapshot', 289, true);
+  weightGroup('networks', 494, true);
+  weightGroup('Overlay Networks', 493, true);
+  weightGroup('NAT & Internet', 492, true);
+  weightGroup('Rules', 491, true);
+  weightGroup('Underlay Networks', 490, true);
+  weightGroup('backupAndSnapshot', 489, true);
 
   basicType(
     [
@@ -454,6 +670,7 @@ export function init($plugin, store) {
       HCI.PCI_DEVICE,
       HCI.SR_IOVGPU_DEVICE,
       HCI.VGPU_DEVICE,
+      HCI.MIG_CONFIGURATION,
       HCI.USB_DEVICE,
       HCI.ADD_ONS,
       HCI.SECRET,
@@ -520,7 +737,7 @@ export function init($plugin, store) {
     name:       HCI.CLUSTER_NETWORK,
     ifHaveType: HCI.CLUSTER_NETWORK,
     namespaced: false,
-    weight:     189,
+    weight:     484,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.CLUSTER_NETWORK }
@@ -535,14 +752,14 @@ export function init($plugin, store) {
     },
     resource:       NETWORK_ATTACHMENT,
     resourceDetail: HCI.NETWORK_ATTACHMENT,
-    resourceEdit:   HCI.NETWORK_ATTACHMENT
+    resourceEdit:   HCI.NETWORK_ATTACHMENT,
   });
 
   virtualType({
     labelKey:   'harvester.network.label',
     name:       HCI.NETWORK_ATTACHMENT,
     namespaced: true,
-    weight:     188,
+    weight:     485,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.NETWORK_ATTACHMENT }
@@ -550,6 +767,143 @@ export function init($plugin, store) {
     exact: false
   });
 
+  configureType(HCI.VPC, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.vpc.label',
+    name:       HCI.VPC,
+    namespaced: true,
+    weight:     195,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VPC }
+    },
+    exact:      false,
+    ifHaveType: HCI.VPC,
+  });
+
+  configureType(HCI.VPC_NAT_GATEWAY, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.natGateway.label',
+    name:       HCI.VPC_NAT_GATEWAY,
+    namespaced: false,
+    weight:     193,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VPC_NAT_GATEWAY }
+    },
+    exact:      false,
+    ifHaveType: HCI.VPC_NAT_GATEWAY,
+  });
+
+  configureType(HCI.IPTABLES_EIP, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.externalIP.label',
+    name:       HCI.IPTABLES_EIP,
+    namespaced: false,
+    weight:     192,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.IPTABLES_EIP }
+    },
+    exact:      false,
+    ifHaveType: HCI.IPTABLES_EIP,
+  });
+
+  configureType(HCI.IPTABLES_SNAT_RULE, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.snat.label',
+    name:       HCI.IPTABLES_SNAT_RULE,
+    namespaced: false,
+    weight:     191,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.IPTABLES_SNAT_RULE }
+    },
+    exact:      false,
+    ifHaveType: HCI.IPTABLES_SNAT_RULE,
+  });
+
+  configureType(HCI.IPTABLES_DNAT_RULE, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.dnat.label',
+    name:       HCI.IPTABLES_DNAT_RULE,
+    namespaced: false,
+    weight:     190,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.IPTABLES_DNAT_RULE }
+    },
+    exact:      false,
+    ifHaveType: HCI.IPTABLES_DNAT_RULE,
+  });
+
+  configureType(NETWORK_POLICY, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.networkPolicy.label',
+    name:       NETWORK_POLICY,
+    namespaced: true,
+    weight:     194,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: NETWORK_POLICY }
+    },
+    exact:      false,
+    ifHaveType: NETWORK_POLICY,
+  });
+
+  configureType(HCI.PROVIDER_NETWORK, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  virtualType({
+    labelKey:   'harvester.providerNetwork.label',
+    name:       HCI.PROVIDER_NETWORK,
+    namespaced: false,
+    weight:     189,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.PROVIDER_NETWORK }
+    },
+    exact:      false,
+    ifHaveType: HCI.PROVIDER_NETWORK,
+  });
+
+  configureType(HCI.VLAN, { hiddenNamespaceGroupButton: true, canYaml: false });
+
+  headers(HCI.VLAN, [
+    STATE,
+    NAME_COL,
+    {
+      name:  'id',
+      label: 'ID',
+      value: 'spec.id',
+      sort:  'spec.id'
+    },
+    {
+      name:     'provider',
+      labelKey: 'harvester.subnet.provider.label',
+      value:    'spec.provider',
+      sort:     'spec.provider'
+    }
+  ]);
+
+  virtualType({
+    labelKey:   'harvester.vlanNetwork.label',
+    name:       HCI.VLAN,
+    namespaced: false,
+    weight:     188,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.VLAN }
+    },
+    exact:      false,
+    ifHaveType: HCI.VLAN,
+  });
+
   configureType(HCI.SNAPSHOT, {
     isCreatable: false,
     location:    {
@@ -816,6 +1170,26 @@ export function init($plugin, store) {
     ]
   });
 
+  virtualType({
+    labelKey:   'harvester.migconfiguration.label',
+    group:      'advanced',
+    weight:     12,
+    name:       HCI.MIG_CONFIGURATION,
+    namespaced: false,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.MIG_CONFIGURATION }
+    },
+    exact:      false,
+    ifHaveType: HCI.MIG_CONFIGURATION,
+  });
+
+  configureType(HCI.MIG_CONFIGURATION, {
+    isCreatable:                false,
+    hiddenNamespaceGroupButton: true,
+    canYaml:                    false,
+  });
+
   virtualType({
     labelKey:   'harvester.usb.label',
     group:      'advanced',
@@ -884,7 +1258,7 @@ export function init($plugin, store) {
     labelKey:   'harvester.loadBalancer.label',
     name:       HCI.LB,
     namespaced: true,
-    weight:     185,
+    weight:     483,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.LB }
@@ -923,7 +1297,7 @@ export function init($plugin, store) {
     labelKey:   'harvester.ipPool.label',
     name:       HCI.IP_POOL,
     namespaced: false,
-    weight:     184,
+    weight:     482,
     route:      {
       name:   `${ PRODUCT_NAME }-c-cluster-resource`,
       params: { resource: HCI.IP_POOL }
@@ -932,4 +1306,207 @@ export function init($plugin, store) {
     ifHaveType: HCI.IP_POOL,
   });
   headers(HCI.IP_POOL, IP_POOL_HEADERS);
+
+  configureType(HCI.HOST_NETWORK_CONFIG, {
+    location: {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.HOST_NETWORK_CONFIG }
+    },
+    canYaml: false,
+  });
+  virtualType({
+    labelKey:   'harvester.hostNetworkConfig.label',
+    name:       HCI.HOST_NETWORK_CONFIG,
+    namespaced: false,
+    weight:     481,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.HOST_NETWORK_CONFIG }
+    },
+    exact:      false,
+    ifHaveType: HCI.HOST_NETWORK_CONFIG,
+  });
+  // ===========================================================================
+  // Forklift Addon UI Flow
+  // ===========================================================================
+  weightGroup('vmMigration', 0, false);
+
+  // Provider
+  headers(HCI.FORKLIFT_PROVIDER, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    FORKLIFT_PROVIDER_TYPE,
+    FORKLIFT_PROVIDER_URL,
+    AGE
+  ]);
+  configureType(HCI.FORKLIFT_PROVIDER, {
+    resource:  HCI.FORKLIFT_PROVIDER,
+    location:  {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_PROVIDER }
+    }
+  });
+  virtualType({
+    name:       HCI.FORKLIFT_PROVIDER,
+    labelKey:   'harvester.addons.vmMigration.labels.provider',
+    group:      'vmMigration',
+    namespaced: true,
+    weight:     100,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_PROVIDER }
+    }
+  });
+
+  // NetworkMap
+  headers(HCI.FORKLIFT_NETWORK_MAP, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    FORKLIFT_MAP_SOURCE_PROVIDER,
+    FORKLIFT_MAP_DEST_PROVIDER,
+    AGE
+  ]);
+  configureType(HCI.FORKLIFT_NETWORK_MAP, {
+    resource:  HCI.FORKLIFT_NETWORK_MAP,
+    location:  {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_NETWORK_MAP }
+    }
+  });
+  virtualType({
+    name:       HCI.FORKLIFT_NETWORK_MAP,
+    labelKey:   'harvester.addons.vmMigration.labels.networkMap',
+    group:      'vmMigration::Configurations',
+    namespaced: true,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_NETWORK_MAP }
+    }
+  });
+
+  // StorageMap
+  headers(HCI.FORKLIFT_STORAGE_MAP, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    FORKLIFT_MAP_SOURCE_PROVIDER,
+    FORKLIFT_MAP_DEST_PROVIDER,
+    AGE
+  ]);
+  configureType(HCI.FORKLIFT_STORAGE_MAP, {
+    resource:  HCI.FORKLIFT_STORAGE_MAP,
+    location:  {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_STORAGE_MAP }
+    }
+  });
+  virtualType({
+    name:       HCI.FORKLIFT_STORAGE_MAP,
+    labelKey:   'harvester.addons.vmMigration.labels.storageMap',
+    group:      'vmMigration::Configurations',
+    namespaced: true,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_STORAGE_MAP }
+    }
+  });
+
+  // Plan
+  headers(HCI.FORKLIFT_PLAN, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    FORKLIFT_MAP_SOURCE_PROVIDER,
+    FORKLIFT_PLAN_TARGET_NS,
+    FORKLIFT_PLAN_VM_COUNT,
+    AGE
+  ]);
+  configureType(HCI.FORKLIFT_PLAN, {
+    resource:  HCI.FORKLIFT_PLAN,
+    location:  {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_PLAN }
+    }
+  });
+  virtualType({
+    name:       HCI.FORKLIFT_PLAN,
+    labelKey:   'harvester.addons.vmMigration.labels.plan',
+    group:      'vmMigration::Configurations',
+    namespaced: true,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_PLAN }
+    }
+  });
+
+  // Migration
+  headers(HCI.FORKLIFT_MIGRATION, [
+    STATE,
+    NAME_COL,
+    NAMESPACE_COL,
+    FORKLIFT_MIGRATION_PLAN,
+    AGE
+  ]);
+  configureType(HCI.FORKLIFT_MIGRATION, {
+    resource:  HCI.FORKLIFT_MIGRATION,
+    location:  {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_MIGRATION }
+    }
+  });
+  virtualType({
+    name:       HCI.FORKLIFT_MIGRATION,
+    labelKey:   'harvester.addons.vmMigration.labels.migration',
+    group:      'vmMigration::Configurations',
+    namespaced: true,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-resource`,
+      params: { resource: HCI.FORKLIFT_MIGRATION }
+    }
+  });
+  configureType('forklift-create', { subTypes: [HCI.FORKLIFT_PLAN] });
+  virtualType({
+    name:       'forklift-create',
+    labelKey:   'harvester.addons.vmMigration.labels.dashboard',
+    group:      'vmMigration',
+    namespaced: true,
+    weight:     200,
+    route:      {
+      name:   `${ PRODUCT_NAME }-c-cluster-vm-migration`,
+      params: {}
+    }
+  });
+
+  // Enable SideNav based on Forklift Addon Status
+  // The dashboard entry ('forklift-create') is a schema-less virtual type, so it
+  // is registered with requireSchema:false to still be gated by the addon status.
+  registerAddonSideNav(store, PRODUCT_NAME, {
+    addonName:     ADD_ONS.FORKLIFT_OPERATOR,
+    resourceType:  HCI.ADD_ONS,
+    navGroup:      'vmMigration',
+    requireSchema: false,
+    types:         ['forklift-create']
+  });
+  registerAddonSideNav(store, PRODUCT_NAME, {
+    addonName:    ADD_ONS.FORKLIFT_OPERATOR,
+    resourceType: HCI.ADD_ONS,
+    navGroup:     'vmMigration',
+    types:        [
+      HCI.FORKLIFT_PROVIDER,
+    ]
+  });
+  registerAddonSideNav(store, PRODUCT_NAME, {
+    addonName:    ADD_ONS.FORKLIFT_OPERATOR,
+    resourceType: HCI.ADD_ONS,
+    navGroup:     'vmMigration::Configurations',
+    types:        [
+      HCI.FORKLIFT_NETWORK_MAP,
+      HCI.FORKLIFT_STORAGE_MAP,
+      HCI.FORKLIFT_PLAN,
+      HCI.FORKLIFT_MIGRATION,
+    ]
+  });
+  // ===========================================================================
 }

pkg/harvester/config/harvester-map.js

@@ -1,3 +1,5 @@
+import { HCI } from '../types';
+
 // TODO: delete this not used variable
 export const MemoryUnit = [{
   label: 'Mi',
@@ -37,6 +39,12 @@ export const VOLUME_TYPE = [{
   value: 'cd-rom'
 }];
 
+export const VOLUME_HOTPLUG_ACTION = {
+  INSERT_CDROM_IMAGE: 'INSERT_CDROM_IMAGE',
+  EJECT_CDROM_IMAGE:  'EJECT_CDROM_IMAGE',
+  DETACH_DISK:        'DETACH_DISK'
+};
+
 export const ACCESS_CREDENTIALS = {
   RESET_PWD:  'userPassword',
   INJECT_SSH: 'sshPublicKey'
@@ -70,6 +78,8 @@ export const ADD_ONS = {
   RANCHER_MONITORING:               'rancher-monitoring',
   VM_IMPORT_CONTROLLER:             'vm-import-controller',
   LVM_DRIVER:                       'lvm.driver.harvesterhci.io',
+  KUBEOVN_OPERATOR:                 'kubeovn-operator',
+  FORKLIFT_OPERATOR:                'forklift-operator',
 };
 
 export const CSI_SECRETS = {
@@ -79,4 +89,20 @@ export const CSI_SECRETS = {
   CSI_NODE_PUBLISH_SECRET_NAMESPACE: 'csi.storage.k8s.io/node-publish-secret-namespace',
   CSI_NODE_STAGE_SECRET_NAME:        'csi.storage.k8s.io/node-stage-secret-name',
   CSI_NODE_STAGE_SECRET_NAMESPACE:   'csi.storage.k8s.io/node-stage-secret-namespace',
+  CSI_NODE_EXPAND_SECRET_NAME:       'csi.storage.k8s.io/node-expand-secret-name',
+  CSI_NODE_EXPAND_SECRET_NAMESPACE:  'csi.storage.k8s.io/node-expand-secret-namespace'
+};
+
+export const FORKLIFT_API_VERSION = 'forklift.konveyor.io/v1beta1';
+export const FORKLIFT_NAMESPACE = 'forklift';
+
+// Some harvester CRD type is not equal to model file name, define the mapping here
+export const HARVESTER_CRD_MAP = {
+  node:                                     HCI.HOST,
+  configmap:                                HCI.CLOUD_TEMPLATE,
+  persistentvolumeclaim:                    HCI.VOLUME,
+  'snapshot.storage.k8s.io.volumesnapshot': HCI.SNAPSHOT,
+  // specific groupable table detail page
+  'network.harvesterhci.io.vlanconfig':     HCI.CLUSTER_NETWORK,
+  'kubeovn.io.subnet':                      HCI.VPC
 };

pkg/harvester/config/labels-annotations.js

@@ -16,9 +16,11 @@ export const HCI = {
   CREATOR:                          'harvesterhci.io/creator',
   OS:                               'harvesterhci.io/os',
   GOLDEN_IMAGE:                     'harvesterhci.io/goldenImage',
+  CLUSTER_NETWORK:                  'network.harvesterhci.io/clusternetwork',
   NETWORK_TYPE:                     'network.harvesterhci.io/type',
   VM_NAME:                          'harvesterhci.io/vmName',
   VM_NAME_PREFIX:                   'harvesterhci.io/vmNamePrefix',
+  VM_DISPLAY_NAME:                  'harvesterhci.io/vmDisplayName',
   VM_RESERVED_MEMORY:               'harvesterhci.io/reservedMemory',
   MAINTENANCE_STATUS:               'harvesterhci.io/maintain-status',
   HOST_CUSTOM_NAME:                 'harvesterhci.io/host-custom-name',
@@ -28,6 +30,7 @@ export const HCI = {
   NODE_ROLE_CONTROL_PLANE:          'node-role.kubernetes.io/control-plane',
   NODE_ROLE_ETCD:                   'node-role.harvesterhci.io/witness',
   PROMOTE_STATUS:                   'harvesterhci.io/promote-status',
+  CLONE_BACKEND_STORAGE_STATUS:     'harvesterhci.io/clone-backend-storage-status',
   MIGRATION_STATE:                  'harvesterhci.io/migrationState',
   VOLUME_CLAIM_TEMPLATE:            'harvesterhci.io/volumeClaimTemplates',
   IMAGE_NAME:                       'harvesterhci.io/image-name',
@@ -50,6 +53,7 @@ export const HCI = {
   STORAGE_CLASS:                    'harvesterhci.io/storageClassName',
   STORAGE_NETWORK:                  'storage-network.settings.harvesterhci.io',
   ADDON_EXPERIMENTAL:               'addon.harvesterhci.io/experimental',
+  ADDON_DISPLAYNAME:                'addon.harvesterhci.io/displayName',
   VOLUME_ERROR:                     'longhorn.io/volume-scheduling-error',
   VOLUME_FOR_VM:                    'harvesterhci.io/volumeForVirtualMachine',
   KVM_AMD_CPU:                      'cpu-feature.node.kubevirt.io/svm',
@@ -69,5 +73,17 @@ export const HCI = {
   DISABLE_LONGHORN_V2_ENGINE:       'node.longhorn.io/disable-v2-data-engine',
   K8S_ARCH:                         'kubernetes.io/arch',
   IMAGE_DISPLAY_NAME:               'harvesterhci.io/imageDisplayName',
-  CUSTOM_IP:                        'harvesterhci.io/custom-ip'
+  CUSTOM_IP:                        'harvesterhci.io/custom-ip',
+  IMPORTED_IMAGE:                   'migration.harvesterhci.io/imported',
+  VM_CPU_MEMORY_HOTPLUG:            'harvesterhci.io/enableCPUAndMemoryHotplug',
+  FILESYSTEM_OVERHEAD:              'cdi.harvesterhci.io/filesystemOverhead',
+  CLONE_STRATEGY:                   'cdi.harvesterhci.io/storageProfileCloneStrategy',
+  VOLUME_MODE_ACCESS_MODES:         'cdi.harvesterhci.io/storageProfileVolumeModeAccessModes',
+  VOLUME_SNAPSHOT_CLASS:            'cdi.harvesterhci.io/storageProfileVolumeSnapshotClass',
+  MAC_ADDRESS:                      'harvesterhci.io/mac-address',
+  STATIC_IP:                        'static-ip.harvesterhci.io',
+  NODE_UPGRADE_PAUSE_MAP:           'harvesterhci.io/node-upgrade-pause-map',
+  CDI_POPULATOR_KIND:               'cdi.kubevirt.io/storage.populator.kind',
+  CNI_NETWORKS:                     'k8s.v1.cni.cncf.io/networks',
+  WINDOWS_SYSPREP:                  'harvesterhci.io/windows-sysprep',
 };

pkg/harvester/config/query-params.js

@@ -1 +1,2 @@
 export const CLUSTER_NETWORK = 'clusterNetwork';
+export const VPC = 'vpc';

pkg/harvester/config/settings.ts

@@ -1,39 +1,50 @@
 export const HCI_SETTING = {
-  BACKUP_TARGET:                          'backup-target',
-  CONTAINERD_REGISTRY:                    'containerd-registry',
-  LOG_LEVEL:                              'log-level',
-  SERVER_VERSION:                         'server-version',
-  UI_INDEX:                               'ui-index',
-  UI_PLUGIN_INDEX:                        'ui-plugin-index',
-  UPGRADE_CHECKER_ENABLED:                'upgrade-checker-enabled',
-  UPGRADE_CHECKER_URL:                    'upgrade-checker-url',
-  VLAN:                                   'vlan',
-  UI_SOURCE:                              'ui-source',
-  UI_PL:                                  'ui-pl',
-  HTTP_PROXY:                             'http-proxy',
-  ADDITIONAL_CA:                          'additional-ca',
-  OVERCOMMIT_CONFIG:                      'overcommit-config',
-  CLUSTER_REGISTRATION_URL:               'cluster-registration-url',
-  DEFAULT_STORAGE_CLASS:                  'default-storage-class',
-  SUPPORT_BUNDLE_TIMEOUT:                 'support-bundle-timeout',
-  SUPPORT_BUNDLE_EXPIRATION:              'support-bundle-expiration',
-  SUPPORT_BUNDLE_IMAGE:                   'support-bundle-image',
-  SUPPORT_BUNDLE_NODE_COLLECTION_TIMEOUT: 'support-bundle-node-collection-timeout',
-  STORAGE_NETWORK:                        'storage-network',
-  VM_FORCE_RESET_POLICY:                  'vm-force-reset-policy',
-  SSL_CERTIFICATES:                       'ssl-certificates',
-  SSL_PARAMETERS:                         'ssl-parameters',
-  SUPPORT_BUNDLE_NAMESPACES:              'support-bundle-namespaces',
-  AUTO_DISK_PROVISION_PATHS:              'auto-disk-provision-paths',
-  RELEASE_DOWNLOAD_URL:                   'release-download-url',
-  CCM_CSI_VERSION:                        'harvester-csi-ccm-versions',
-  CSI_DRIVER_CONFIG:                      'csi-driver-config',
-  VM_TERMINATION_PERIOD:                  'default-vm-termination-grace-period-seconds',
-  NTP_SERVERS:                            'ntp-servers',
-  AUTO_ROTATE_RKE2_CERTS:                 'auto-rotate-rke2-certs',
-  KUBECONFIG_DEFAULT_TOKEN_TTL_MINUTES:   'kubeconfig-default-token-ttl-minutes',
-  LONGHORN_V2_DATA_ENGINE_ENABLED:        'longhorn-v2-data-engine-enabled',
-  ADDITIONAL_GUEST_MEMORY_OVERHEAD_RATIO: 'additional-guest-memory-overhead-ratio',
+  BACKUP_TARGET:                            'backup-target',
+  CONTAINERD_REGISTRY:                      'containerd-registry',
+  LOG_LEVEL:                                'log-level',
+  SERVER_VERSION:                           'server-version',
+  UI_INDEX:                                 'ui-index',
+  UPGRADE_CHECKER_ENABLED:                  'upgrade-checker-enabled',
+  UPGRADE_CHECKER_URL:                      'upgrade-checker-url',
+  VLAN:                                     'vlan',
+  UI_SOURCE:                                'ui-source',
+  UI_PL:                                    'ui-pl',
+  HTTP_PROXY:                               'http-proxy',
+  ADDITIONAL_CA:                            'additional-ca',
+  OVERCOMMIT_CONFIG:                        'overcommit-config',
+  CLUSTER_REGISTRATION_URL:                 'cluster-registration-url',
+  DEFAULT_STORAGE_CLASS:                    'default-storage-class',
+  SUPPORT_BUNDLE_TIMEOUT:                   'support-bundle-timeout',
+  SUPPORT_BUNDLE_EXPIRATION:                'support-bundle-expiration',
+  SUPPORT_BUNDLE_FILE_NAME:                 'support-bundle-file-name',
+  SUPPORT_BUNDLE_IMAGE:                     'support-bundle-image',
+  SUPPORT_BUNDLE_NODE_COLLECTION_TIMEOUT:   'support-bundle-node-collection-timeout',
+  STORAGE_NETWORK:                          'storage-network',
+  RWX_NETWORK:                              'rwx-network',
+  VM_FORCE_RESET_POLICY:                    'vm-force-reset-policy',
+  SSL_CERTIFICATES:                         'ssl-certificates',
+  SSL_PARAMETERS:                           'ssl-parameters',
+  SUPPORT_BUNDLE_NAMESPACES:                'support-bundle-namespaces',
+  AUTO_DISK_PROVISION_PATHS:                'auto-disk-provision-paths',
+  RELEASE_DOWNLOAD_URL:                     'release-download-url',
+  CCM_CSI_VERSION:                          'harvester-csi-ccm-versions',
+  CSI_DRIVER_CONFIG:                        'csi-driver-config',
+  CSI_ONLINE_EXPAND_VALIDATION:             'csi-online-expand-validation',
+  VM_TERMINATION_PERIOD:                    'default-vm-termination-grace-period-seconds',
+  NTP_SERVERS:                              'ntp-servers',
+  AUTO_ROTATE_RKE2_CERTS:                   'auto-rotate-rke2-certs',
+  KUBECONFIG_DEFAULT_TOKEN_TTL_MINUTES:     'kubeconfig-default-token-ttl-minutes',
+  LONGHORN_V2_DATA_ENGINE_ENABLED:          'longhorn-v2-data-engine-enabled',
+  LONGHORN_V2_DATA_ENGINE_HUGEPAGE_ENABLED: 'longhorn-v2-data-engine-hugepage-enabled',
+  LONGHORN_V2_DATA_ENGINE_MEMORY_SIZE:      'longhorn-v2-data-engine-memory-size',
+  ADDITIONAL_GUEST_MEMORY_OVERHEAD_RATIO:   'additional-guest-memory-overhead-ratio',
+  UPGRADE_CONFIG:                           'upgrade-config',
+  VM_MIGRATION_NETWORK:                     'vm-migration-network',
+  RANCHER_CLUSTER:                          'rancher-cluster',
+  MAX_HOTPLUG_RATIO:                        'max-hotplug-ratio',
+  KUBEVIRT_MIGRATION:                       'kubevirt-migration',
+  INSTANCE_MANAGER_RESOURCES:               'instance-manager-resources',
+  CLUSTER_POD_SECURITY_STANDARD:            'cluster-pod-security-standard'
 };
 
 export const HCI_ALLOWED_SETTINGS = {
@@ -52,22 +63,31 @@ export const HCI_ALLOWED_SETTINGS = {
     from:        'import',
     featureFlag: 'autoRotateRke2CertsSetting'
   },
-  [HCI_SETTING.CSI_DRIVER_CONFIG]:       { kind: 'json', from: 'import' },
-  [HCI_SETTING.SERVER_VERSION]:          { readOnly: true },
-  [HCI_SETTING.UPGRADE_CHECKER_ENABLED]: { kind: 'boolean' },
-  [HCI_SETTING.UPGRADE_CHECKER_URL]:     { kind: 'url' },
-  [HCI_SETTING.HTTP_PROXY]:              { kind: 'json', from: 'import' },
-  [HCI_SETTING.ADDITIONAL_CA]:           {
+  [HCI_SETTING.CSI_DRIVER_CONFIG]:            { kind: 'json', from: 'import' },
+  [HCI_SETTING.CSI_ONLINE_EXPAND_VALIDATION]: {
+    kind: 'json', from: 'import', featureFlag: 'csiOnlineExpandValidation'
+  },
+  [HCI_SETTING.SERVER_VERSION]:               { readOnly: true },
+  [HCI_SETTING.UPGRADE_CHECKER_ENABLED]:      { kind: 'boolean' },
+  [HCI_SETTING.UPGRADE_CHECKER_URL]:          { kind: 'url' },
+  [HCI_SETTING.HTTP_PROXY]:                   { kind: 'json', from: 'import' },
+  [HCI_SETTING.ADDITIONAL_CA]:                {
     kind: 'multiline', canReset: true, from: 'import'
   },
   [HCI_SETTING.OVERCOMMIT_CONFIG]:                      { kind: 'json', from: 'import' },
   [HCI_SETTING.SUPPORT_BUNDLE_TIMEOUT]:                 { kind: 'number' },
   [HCI_SETTING.SUPPORT_BUNDLE_EXPIRATION]:              { kind: 'number' },
+  [HCI_SETTING.SUPPORT_BUNDLE_FILE_NAME]:               {
+    kind: 'string', canReset: true, featureFlag: 'supportBundleFileNameSetting'
+  },
   [HCI_SETTING.SUPPORT_BUNDLE_NODE_COLLECTION_TIMEOUT]: { kind: 'number', featureFlag: 'supportBundleNodeCollectionTimeoutSetting' },
   [HCI_SETTING.SUPPORT_BUNDLE_IMAGE]:                   { kind: 'json', from: 'import' },
   [HCI_SETTING.STORAGE_NETWORK]:                        {
     kind: 'custom', from: 'import', canReset: true
   },
+  [HCI_SETTING.RWX_NETWORK]:                            {
+    kind: 'json', from: 'import', canReset: true, featureFlag: 'rwxNetworkSetting'
+  },
   [HCI_SETTING.VM_FORCE_RESET_POLICY]:                  { kind: 'json', from: 'import' },
   [HCI_SETTING.SSL_CERTIFICATES]:                       { kind: 'json', from: 'import' },
   [HCI_SETTING.SSL_PARAMETERS]:                         {
@@ -76,7 +96,6 @@ export const HCI_ALLOWED_SETTINGS = {
   [HCI_SETTING.SUPPORT_BUNDLE_NAMESPACES]: { from: 'import', canReset: true },
   [HCI_SETTING.AUTO_DISK_PROVISION_PATHS]: { canReset: true },
   [HCI_SETTING.RELEASE_DOWNLOAD_URL]:      { kind: 'url' },
-  [HCI_SETTING.UI_PLUGIN_INDEX]:           { kind: 'url' },
   [HCI_SETTING.CONTAINERD_REGISTRY]:       {
     kind: 'json', from: 'import', canReset: true
   },
@@ -95,12 +114,43 @@ export const HCI_ALLOWED_SETTINGS = {
     experimental: true,
     featureFlag:  'longhornV2LVMSupport'
   },
+  [HCI_SETTING.LONGHORN_V2_DATA_ENGINE_HUGEPAGE_ENABLED]: {
+    kind:         'boolean',
+    featureFlag:  'longhornV2HugepageSettings'
+  },
+  [HCI_SETTING.LONGHORN_V2_DATA_ENGINE_MEMORY_SIZE]: {
+    kind:         'number',
+    featureFlag:  'longhornV2HugepageSettings'
+  },
   [HCI_SETTING.ADDITIONAL_GUEST_MEMORY_OVERHEAD_RATIO]: { kind: 'string', from: 'import' },
+  [HCI_SETTING.UPGRADE_CONFIG]:                         {
+    kind:         'json',
+    from:         'import',
+    featureFlag: 'upgradeConfigSetting',
+    docPath:      'UPGRADE_CONFIG_URL'
+  },
+  [HCI_SETTING.RANCHER_CLUSTER]:                        {
+    kind: 'custom', from: 'import', canReset: true, featureFlag: 'rancherClusterSetting'
+  },
+  [HCI_SETTING.MAX_HOTPLUG_RATIO]:    { kind: 'number', featureFlag: 'cpuMemoryHotplug' },
+  [HCI_SETTING.VM_MIGRATION_NETWORK]:  {
+    kind: 'json', from: 'import', canReset: true, featureFlag: 'vmNetworkMigration',
+  },
+  [HCI_SETTING.KUBEVIRT_MIGRATION]: {
+    kind: 'json', from: 'import', canReset: true, featureFlag: 'kubevirtMigration',
+  },
+  [HCI_SETTING.INSTANCE_MANAGER_RESOURCES]: {
+    kind: 'json', from: 'import', featureFlag: 'instanceManagerResourcesSetting'
+  },
+  [HCI_SETTING.CLUSTER_POD_SECURITY_STANDARD]: {
+    kind: 'json', from: 'import', canReset: true, featureFlag: 'clusterPodSecurityStandardSetting'
+  }
 };
 
 export const HCI_SINGLE_CLUSTER_ALLOWED_SETTING = {
   [HCI_SETTING.CLUSTER_REGISTRATION_URL]: {
-    kind:     'url',
+    kind:     'custom',
+    from:     'import',
     canReset: true,
   },
   [HCI_SETTING.UI_PL]: {

pkg/harvester/config/table-headers.js

@@ -104,3 +104,196 @@ export const HARVESTER_DESCRIPTION = {
   ...DESCRIPTION,
   width: 150,
 };
+
+// The CIDR_BLOCK column in VPC list page
+export const CIDR_BLOCK = {
+  name:     'cidrBlock',
+  labelKey: 'harvester.subnet.cidrBlock.label',
+  sort:     'cidrBlock',
+  value:    'spec.cidrBlock',
+  align:    'left',
+};
+
+// The Protocol column in VPC list page
+export const PROTOCOL = {
+  name:     'protocol',
+  labelKey: 'harvester.subnet.protocol.label',
+  sort:     'protocol',
+  value:    'spec.protocol',
+  align:    'left',
+};
+
+// The Provider column in VPC list page
+export const PROVIDER = {
+  name:     'provider',
+  labelKey: 'harvester.subnet.provider.label',
+  sort:     'provider',
+  value:    'spec.provider',
+  align:    'left',
+};
+
+// Source VM column in migration.harvesterhci.io.virtualmachineimport list page
+export const VM_IMPORT_SOURCE_VM = {
+  name:     'sourceVm',
+  labelKey: 'harvester.tableHeaders.vmImportSourceVm',
+  value:    'spec.virtualMachineName',
+  sort:     'spec.virtualMachineName',
+  align:    'left',
+};
+
+// Source Cluster column in migration.harvesterhci.io.virtualmachineimport list page
+export const VM_IMPORT_SOURCE_CLUSTER = {
+  name:     'sourceCluster',
+  labelKey: 'harvester.tableHeaders.vmImportSourceCluster',
+  value:    'spec.sourceCluster.name',
+  sort:     'spec.sourceCluster.name',
+  align:    'left',
+};
+
+// Import Status column in migration.harvesterhci.io.virtualmachineimport list page
+export const VM_IMPORT_STATUS = {
+  name:     'importStatus',
+  labelKey: 'harvester.tableHeaders.vmImportStatus',
+  value:    'status.importStatus',
+  sort:     'status.importStatus',
+  align:    'left',
+};
+
+// Datacenter column in migration.harvesterhci.io.vmwaresource list page
+export const VM_IMPORT_SOURCE_V_DC = {
+  name:     'datacenter',
+  labelKey: 'harvester.tableHeaders.vmImportSourceVDatacenter',
+  value:    'spec.dc',
+  sort:     'spec.dc',
+  align:    'left',
+};
+
+// Endpoint column in migration.harvesterhci.io.vmwaresource list page
+export const VM_IMPORT_SOURCE_V_ENDPOINT = {
+  name:     'endpoint',
+  labelKey: 'harvester.tableHeaders.vmImportSourceVEndpoint',
+  value:    'spec.endpoint',
+  sort:     'spec.endpoint',
+  align:    'left',
+};
+
+// Cluster Status column in migration.harvesterhci.io.vmwaresource list page
+export const VM_IMPORT_SOURCE_V_STATUS = {
+  name:     'clusterStatus',
+  labelKey: 'harvester.tableHeaders.vmImportSourceVClusterStatus',
+  value:    'status.status',
+  sort:     'status.status',
+  align:    'left',
+};
+
+// Region column in migration.harvesterhci.io.openstacksource list page
+export const VM_IMPORT_SOURCE_O_REGION = {
+  name:     'region',
+  labelKey: 'harvester.tableHeaders.vmImportSourceORegion',
+  value:    'spec.region',
+  sort:     'spec.region',
+  align:    'left',
+};
+
+// Endpoint column in migration.harvesterhci.io.openstacksource list page
+export const VM_IMPORT_SOURCE_O_ENDPOINT = {
+  name:     'endpoint',
+  labelKey: 'harvester.tableHeaders.vmImportSourceOEndpoint',
+  value:    'spec.endpoint',
+  sort:     'spec.endpoint',
+  align:    'left',
+};
+
+// Cluster Status column in migration.harvesterhci.io.openstacksource list page
+export const VM_IMPORT_SOURCE_O_STATUS = {
+  name:     'clusterStatus',
+  labelKey: 'harvester.tableHeaders.vmImportSourceOClusterStatus',
+  value:    'status.status',
+  sort:     'status.status',
+  align:    'left',
+};
+
+// URL column in migration.harvesterhci.io.ovasource list page
+export const VM_IMPORT_SOURCE_OVA_URL = {
+  name:     'url',
+  labelKey: 'harvester.tableHeaders.vmImportSourceOVAUrl',
+  value:    'spec.url',
+  sort:     'spec.url',
+  align:    'left',
+};
+
+// Status column in migration.harvesterhci.io.ovasource list page
+export const VM_IMPORT_SOURCE_OVA_STATUS = {
+  name:     'status',
+  labelKey: 'harvester.tableHeaders.vmImportSourceOVAStatus',
+  value:    'status.status',
+  sort:     'status.status',
+  align:    'left',
+};
+
+// ========================================
+// Forklift table headers
+// ========================================
+
+// Provider type column in forklift.konveyor.io.provider list page
+export const FORKLIFT_PROVIDER_TYPE = {
+  name:     'providerType',
+  labelKey: 'harvester.tableHeaders.vmMigrationProviderType',
+  value:    'spec.type',
+  sort:     'spec.type',
+  align:    'left',
+};
+
+// Provider URL column in forklift.konveyor.io.provider list page
+export const FORKLIFT_PROVIDER_URL = {
+  name:     'providerUrl',
+  labelKey: 'harvester.tableHeaders.vmMigrationProviderUrl',
+  value:    'spec.url',
+  sort:     'spec.url',
+  align:    'left',
+};
+
+// Source provider column in forklift network/storage map list page
+export const FORKLIFT_MAP_SOURCE_PROVIDER = {
+  name:     'sourceProvider',
+  labelKey: 'harvester.tableHeaders.vmMigrationMapSourceProvider',
+  value:    'spec.provider.source.name',
+  sort:     'spec.provider.source.name',
+  align:    'left',
+};
+
+// Destination provider column in forklift network/storage map list page
+export const FORKLIFT_MAP_DEST_PROVIDER = {
+  name:     'destProvider',
+  labelKey: 'harvester.tableHeaders.vmMigrationMapDestProvider',
+  value:    'spec.provider.destination.name',
+  sort:     'spec.provider.destination.name',
+  align:    'left',
+};
+
+// Target namespace column in forklift.konveyor.io.plan list page
+export const FORKLIFT_PLAN_TARGET_NS = {
+  name:     'targetNamespace',
+  labelKey: 'harvester.tableHeaders.vmMigrationPlanTargetNs',
+  value:    'spec.targetNamespace',
+  sort:     'spec.targetNamespace',
+  align:    'left',
+};
+
+// VM count column in forklift.konveyor.io.plan list page
+export const FORKLIFT_PLAN_VM_COUNT = {
+  name:     'vmCount',
+  labelKey: 'harvester.tableHeaders.vmMigrationPlanVmCount',
+  value:    'spec.vms.length',
+  sort:     'spec.vms.length',
+  align:    'left',
+};
+
+// Plan reference column in forklift.konveyor.io.migration list page
+export const FORKLIFT_MIGRATION_PLAN = {
+  name:     'plan',
+  labelKey: 'harvester.tableHeaders.vmMigrationMigrationPlan',
+  value:    'spec.plan.name',
+  sort:     'spec.plan.name',
+  align:    'left',
+};

pkg/harvester/config/types.js

@@ -4,11 +4,51 @@ export const BACKUP_TYPE = {
 };
 
 export const NETWORK_TYPE = {
-  L2VLAN:   'L2VlanNetwork',
-  UNTAGGED: 'UntaggedNetwork'
+  L2VLAN:       'L2VlanNetwork',
+  UNTAGGED:     'UntaggedNetwork',
+  OVERLAY:      'OverlayNetwork',
+  L2TRUNK_VLAN: 'L2VlanTrunkNetwork',
 };
 
 export const VOLUME_MODE = {
   BLOCK:       'Block',
   FILE_SYSTEM: 'Filesystem'
 };
+
+export const NETWORK_PROTOCOL = {
+  IPv4: 'IPv4',
+  IPv6: 'IPv6',
+};
+
+export const INTERNAL_STORAGE_CLASS = {
+  VMSTATE_PERSISTENCE: 'vmstate-persistence',
+  LONGHORN_STATIC:     'longhorn-static',
+};
+
+export const L2VLAN_MODE = {
+  ACCESS: 'access',
+  TRUNK:  'trunk',
+};
+
+export const VMIMPORT_SOURCE_PROVIDER = {
+  VMWARE:    'vmware',
+  OPENSTACK: 'openstack',
+  OVA:       'ova',
+};
+
+export const VMIMPORT_SOURCE_KINDS = {
+  VMWARE:    'VmwareSource',
+  OPENSTACK: 'OpenstackSource',
+  OVA:       'OvaSource',
+};
+
+export const CDI_POPULATOR_KIND = {
+  VOLUME_IMPORT_SOURCE: 'VolumeImportSource',
+  VOLUME_CLONE_SOURCE:  'VolumeCloneSource',
+};
+
+export const FILESYSTEM_SOURCE_TYPE = {
+  CONFIGMAP:      'configmap',
+  SECRET:         'secret',
+  SERVICEACCOUNT: 'serviceaccount',
+};

pkg/harvester/detail/devices.harvesterhci.io.migconfiguration.vue

@@ -0,0 +1,124 @@
+<script>
+import CreateEditView from '@shell/mixins/create-edit-view';
+import ResourceTabs from '@shell/components/form/ResourceTabs';
+import Tab from '@shell/components/Tabbed/Tab';
+import SortableTable from '@shell/components/SortableTable';
+
+export default {
+
+  components: {
+    ResourceTabs,
+    Tab,
+    SortableTable,
+  },
+
+  mixins: [CreateEditView],
+
+  props: {
+    value: {
+      type:    Object,
+      default: () => {
+        return {};
+      }
+    }
+  },
+
+  computed: {
+    headers() {
+      return [
+        {
+          name:        'profileName',
+          labelKey:    'harvester.migconfiguration.tableHeaders.profileName',
+          value:       'name',
+          width:       75,
+          sort:        'name',
+          dashIfEmpty: true,
+        },
+        {
+          name:        'vGPUID',
+          labelKey:    'harvester.migconfiguration.tableHeaders.vGPUID',
+          value:       'vGPUID',
+          width:       75,
+          sort:        'vGPUID',
+          dashIfEmpty: true,
+        },
+        {
+          name:        'available',
+          labelKey:    'harvester.migconfiguration.tableHeaders.available',
+          value:       'available',
+          width:       75,
+          sort:        'available',
+          align:       'center',
+          dashIfEmpty: true,
+        },
+        {
+          name:        'requested',
+          labelKey:    'harvester.migconfiguration.tableHeaders.requested',
+          value:       'requested',
+          width:       75,
+          sort:        'requested',
+          align:       'center',
+          dashIfEmpty: true,
+        },
+        {
+          name:        'total',
+          labelKey:    'harvester.migconfiguration.tableHeaders.total',
+          value:       'total',
+          width:       75,
+          sort:        'total',
+          align:       'center',
+          dashIfEmpty: true,
+        },
+      ];
+    },
+
+    rows() {
+      let out = (this.value?.status?.profileStatus || []).map((profile) => {
+        const {
+          id, name, total, available
+        } = profile;
+
+        return {
+          id,
+          name,
+          total,
+          available,
+          vGPUID: profile.vGPUID?.join(', ') || '',
+        };
+      });
+
+      out = out.map((row) => {
+        const requested = this.value?.spec?.profileSpec.find((p) => p.id === row.id)?.requested || 0;
+
+        return { ...row, requested };
+      });
+
+      return out;
+    },
+  },
+};
+</script>
+
+<template>
+  <ResourceTabs
+    :value="value"
+    :need-events="false"
+    :need-related="false"
+    :mode="mode"
+  >
+    <Tab
+      name="Profile Status"
+      :label="t('harvester.migconfiguration.profileStatus')"
+    >
+      <SortableTable
+        :headers="headers"
+        :rows="rows"
+        key-field="condition"
+        default-sort-by="condition"
+        :table-actions="false"
+        :row-actions="false"
+        :search="false"
+      />
+    </Tab>
+  </ResourceTabs>
+</template>

pkg/harvester/detail/harvesterhci.io.host/HarvesterHugepages.vue

@@ -0,0 +1,119 @@
+<script>
+import LabelValue from '@shell/components/LabelValue';
+import { HCI } from '../../types';
+import { DOC } from '../../config/doc-links';
+
+export default {
+  name:       'HarvesterHugepages',
+  components: { LabelValue },
+
+  props: {
+    node: {
+      type:     Object,
+      required: true,
+    },
+  },
+
+  computed: {
+    docsTransparentHugepagesLink() {
+      return DOC.TRANSPARENT_HUGEPAGES;
+    },
+  },
+
+  async fetch() {
+    const inStore = this.$store.getters['currentProduct'].inStore;
+
+    const hash = await this.$store.dispatch(`${ inStore }/findAll`, { type: HCI.HUGEPAGES });
+
+    this.hugepages = hash.find((node) => {
+      return node.id === this.node.id;
+    }) || {};
+  },
+
+  data() {
+    return { hugepages: {} };
+  },
+};
+</script>
+
+<template>
+  <div>
+    <template v-if="hugepages.status">
+      <h2>{{ t('harvester.host.hugepages.meminfo') }}</h2>
+
+      <div class="row mb-20">
+        <div class="col span-6">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.anon')"
+            :value="hugepages.status.meminfo.anonHugePages"
+          />
+        </div>
+        <div class="col span-6">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.size')"
+            :value="hugepages.status.meminfo.hugepageSize"
+          />
+        </div>
+      </div>
+
+      <div class="row mb-20">
+        <div class="col span-3">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.total')"
+            :value="hugepages.status.meminfo.hugePagesTotal"
+          />
+        </div>
+        <div class="col span-3">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.free')"
+            :value="hugepages.status.meminfo.hugePagesFree"
+          />
+        </div>
+        <div class="col span-3">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.rsvd')"
+            :value="hugepages.status.meminfo.hugePagesRsvd"
+          />
+        </div>
+        <div class="col span-3">
+          <LabelValue
+            :name="t('harvester.host.hugepages.status.surp')"
+            :value="hugepages.status.meminfo.hugePagesSurp"
+          />
+        </div>
+      </div>
+
+      <div>
+        <hr class="divider" />
+        <h3>
+          <t
+            k="harvester.host.hugepages.transparent.title"
+            :raw="true"
+            :url="docsTransparentHugepagesLink"
+          />
+        </h3>
+
+        <div class="row mb-20">
+          <div class="col span-4">
+            <LabelValue
+              :name="t('harvester.host.hugepages.transparent.enabled')"
+              :value="hugepages.spec.transparent.enabled"
+            />
+          </div>
+          <div class="col span-4">
+            <LabelValue
+              :name="t('harvester.host.hugepages.transparent.shmemEnabled')"
+              :value="hugepages.spec.transparent.shmemEnabled"
+            />
+          </div>
+          <div class="col span-4">
+            <LabelValue
+              :name="t('harvester.host.hugepages.transparent.defrag')"
+              :value="hugepages.spec.transparent.defrag"
+            />
+          </div>
+        </div>
+      </div>
+    </template>
+  </div>
+</template>

pkg/harvester/detail/harvesterhci.io.host/VirtualMachineInstance.vue

@@ -27,15 +27,11 @@ export default {
     await allHash({
       vms:               this.$store.dispatch('harvester/findAll', { type: HCI.VM }),
       vmis:              this.$store.dispatch('harvester/findAll', { type: HCI.VMI }),
-      allClusterNetwork: this.$store.dispatch('harvester/findAll', { type: HCI.CLUSTER_NETWORK }),
+      vmims:             this.$store.dispatch('harvester/findAll', { type: HCI.VMIM }),
     });
   },
 
   computed: {
-    allClusterNetwork() {
-      return this.$store.getters['harvester/all'](HCI.CLUSTER_NETWORK);
-    },
-
     rows() {
       const vms = this.$store.getters['harvester/all'](HCI.VM);
 
@@ -47,20 +43,26 @@ export default {
         STATE,
         NAME,
         {
-          name:     'vmCPU',
-          labelKey: 'tableHeaders.cpu',
-          search:   false,
-          sort:     ['spec.template.spec.domain.cpu.cores'],
-          value:    'spec.template.spec.domain.cpu.cores',
-          width:    120
+          name:        'CPU',
+          label:       'CPU',
+          sort:        ['displayCPU'],
+          value:       'displayCPU',
+          align:       'center',
+          dashIfEmpty: true,
         },
         {
-          name:     'vmRAM',
-          labelKey: 'glance.memory',
-          search:   false,
-          sort:     ['memorySort'],
-          value:    'spec.template.spec.domain.resources.limits.memory',
-          width:    120
+          name:          'Memory',
+          value:         'displayMemory',
+          sort:          ['memorySort'],
+          align:         'center',
+          labelKey:      'tableHeaders.memory',
+          formatter:     'Si',
+          formatterOpts: {
+            opts: {
+              increment: 1024, addSuffix: true, maxExponent: 3, minExponent: 3, suffix: 'i',
+            },
+            needParseSi: true
+          },
         },
         {
           name:      'ip',
@@ -102,7 +104,6 @@ export default {
             <HarvesterVmState
               class="vmstate"
               :row="scope.row"
-              :all-cluster-network="allClusterNetwork"
             />
           </div>
         </template>

pkg/harvester/detail/harvesterhci.io.host/index.vue

@@ -27,6 +27,7 @@ import Instance from './VirtualMachineInstance';
 import Disk from './HarvesterHostDisk';
 import VlanStatus from './VlanStatus';
 import HarvesterKsmtuned from './HarvesterKsmtuned.vue';
+import HarvesterHugepages from './HarvesterHugepages.vue';
 import HarvesterSeeder from './HarvesterSeeder';
 
 const LONGHORN_SYSTEM = 'longhorn-system';
@@ -46,6 +47,7 @@ export default {
     VlanStatus,
     LabelValue,
     HarvesterKsmtuned,
+    HarvesterHugepages,
     Loading,
     SortableTable,
     HarvesterSeeder,
@@ -209,6 +211,12 @@ export default {
       return !!this.$store.getters[`${ inStore }/schemaFor`](HCI.KSTUNED);
     },
 
+    hasHugepagesSchema() {
+      const inStore = this.$store.getters['currentProduct'].inStore;
+
+      return !!this.$store.getters[`${ inStore }/schemaFor`](HCI.HUGEPAGES);
+    },
+
     hasBlockDevicesSchema() {
       return !!this.$store.getters['harvester/schemaFor'](HCI.BLOCK_DEVICE);
     },
@@ -468,6 +476,16 @@ export default {
         />
       </Tab>
 
+      <Tab
+        v-if="hasHugepagesSchema"
+        name="hugepages"
+        :weight="0"
+        :show-header="false"
+        :label="t('harvester.host.tabs.hugepages')"
+      >
+        <HarvesterHugepages :node="value" />
+      </Tab>
+
       <Tab
         v-if="seederEnabled"
         name="seeder"

pkg/harvester/detail/harvesterhci.io.schedulevmbackup/index.vue

@@ -75,7 +75,7 @@ export default {
       <div class="row">
         <div class="col span-6 mb-20">
           <LabelValue
-            :name="t('harvester.schedule.cron')"
+            :name="t('harvester.schedule.cron.label')"
             :value="cronExpression"
           />
         </div>

pkg/harvester/detail/harvesterhci.io.virtualmachinebackup/index.vue

@@ -172,6 +172,9 @@ export default {
             :cpu="cpu"
             :mode="mode"
             :memory="memory"
+            :max-cpu="maxCpu"
+            :max-memory="maxMemory"
+            :enable-hot-plug="cpuMemoryHotplugEnabled"
           />
         </div>
         <div class="row">

pkg/harvester/detail/harvesterhci.io.vmsnapshot/index.vue

@@ -172,6 +172,9 @@ export default {
           :cpu="cpu"
           :mode="mode"
           :memory="memory"
+          :max-cpu="maxCpu"
+          :max-memory="maxMemory"
+          :enable-hot-plug="cpuMemoryHotplugEnabled"
         />
 
         <div class="row mb-10">

pkg/harvester/detail/kubevirt.io.virtualmachine/VirtualMachineTabs/VirtualMachineBasics.vue

@@ -5,6 +5,7 @@ import CreateEditView from '@shell/mixins/create-edit-view';
 import HarvesterIpAddress from '../../../formatters/HarvesterIpAddress';
 import VMConsoleBar from '../../../components/VMConsoleBar';
 import { HCI } from '../../../types';
+import { getVmCPUMemoryValues } from '../../../utils/cpuMemory';
 
 const UNDEFINED = 'n/a';
 
@@ -91,9 +92,9 @@ export default {
     },
 
     flavor() {
-      const domain = this.value?.spec?.template?.spec?.domain;
+      const { cpu, memory } = getVmCPUMemoryValues(this.value);
 
-      return `${ domain.cpu?.cores } vCPU , ${ domain.resources?.limits?.memory } ${ this.t('harvester.virtualMachine.input.memory') }`;
+      return `${ cpu } vCPU , ${ memory } ${ this.t('harvester.virtualMachine.input.memory') }`;
     },
 
     kernelRelease() {

pkg/harvester/detail/kubevirt.io.virtualmachine/index.vue

@@ -139,10 +139,18 @@ export default {
       const inStore = this.$store.getters['currentProduct'].inStore;
       const vmimList = this.$store.getters[`${ inStore }/all`](HCI.VMIM) || [];
 
-      const migrationUid = this.vmi?.status?.migrationState?.migrationUid;
-      const vmim = vmimList.find((VMIM) => VMIM?.metadata?.uid === migrationUid);
+      const vmiName = this.vmi?.name || '';
 
-      return vmim;
+      // filter the corresponding vmims by vmim.spec.vmiName and find the latest one by creationTimestamp
+      const vmim = vmimList.filter((VMIM) => VMIM?.spec?.vmiName === vmiName).sort((a, b) => {
+        if (a?.metadata?.creationTimestamp > b?.metadata?.creationTimestamp) {
+          return -1;
+        }
+
+        return 1;
+      });
+
+      return vmim.length > 0 && vmim[0] ? vmim[0] : null;
     },
 
     migrationEvents() {
@@ -205,6 +213,7 @@ export default {
         const diskRows = this.getDiskRows(neu);
 
         this['diskRows'] = diskRows;
+        this['networkRows'] = this.getNetworkRows(neu, { fromTemplate: false, init: false });
       },
       deep: true
     }
@@ -257,6 +266,7 @@ export default {
         <Network
           v-model:value="networkRows"
           mode="view"
+          :vm="value"
         />
       </Tab>
 

pkg/harvester/dialog/CloneVmDialog.vue

@@ -1,12 +1,13 @@
 <script>
 import { exceptionToErrorsArray } from '@shell/utils/error';
 import { mapGetters } from 'vuex';
-
+import { runStrategies as runStrategyOptions } from '../config/harvester-map';
 import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 import { Checkbox } from '@components/Form/Checkbox';
 import AsyncButton from '@shell/components/AsyncButton';
 import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
   name: 'CloneVMModal',
@@ -14,7 +15,7 @@ export default {
   emits: ['close'],
 
   components: {
-    AsyncButton, Banner, Checkbox, Card, LabeledInput
+    AsyncButton, Banner, Checkbox, Card, LabeledInput, LabeledSelect
   },
 
   props: {
@@ -26,9 +27,11 @@ export default {
 
   data() {
     return {
-      name:      '',
-      cloneData: true,
-      errors:    []
+      name:        '',
+      cloneData:   true,
+      errors:      [],
+      runStrategy: runStrategyOptions[1],
+      runStrategyOptions
     };
   },
 
@@ -38,6 +41,9 @@ export default {
     actionResource() {
       return this.resources[0];
     },
+    vmCloneRunStrategyEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('vmCloneRunStrategy');
+    },
   },
 
   methods: {
@@ -58,7 +64,8 @@ export default {
 
       // deep clone
       try {
-        const res = await this.actionResource.doAction('clone', { targetVm: this.name }, {}, false);
+        const payload = this.vmCloneRunStrategyEnabled ? { targetVm: this.name, runStrategy: this.runStrategy } : { targetVm: this.name };
+        const res = await this.actionResource.doAction('clone', payload, {}, false);
 
         if (res._status === 200 || res._status === 204) {
           this.$store.dispatch('growl/success', {
@@ -106,6 +113,13 @@ export default {
         :label="t('harvester.modal.cloneVM.name')"
         required
       />
+      <LabeledSelect
+        v-if="vmCloneRunStrategyEnabled"
+        v-model:value="runStrategy"
+        label-key="harvester.virtualMachine.runStrategy"
+        :options="runStrategyOptions"
+        :mode="mode"
+      />
       <Banner
         v-for="(err, i) in errors"
         :key="i"

pkg/harvester/dialog/ConfirmExecutionDialog.vue

@@ -98,9 +98,9 @@ export default {
   methods: {
     escapeHtml,
 
-    close() {
+    close(data) {
       this.errors = [];
-      this.$emit('close');
+      this.$emit('close', data);
     },
 
     async apply(buttonDone) {
@@ -109,7 +109,7 @@ export default {
           await resource.doActionGrowl(this.modalData.action, {});
         }
         buttonDone(true);
-        this.close();
+        this.close({ performCallback: true, clearTableSelection: true });
       } catch (e) {
         this.errors = exceptionToErrorsArray(e);
         buttonDone(false);

pkg/harvester/dialog/ConfirmRelatedToRemoveDialog.vue

@@ -32,7 +32,7 @@ export default {
     resources: {
       type:     Array,
       required: true
-    }
+    },
   },
 
   data() {
@@ -43,7 +43,7 @@ export default {
     ...mapState('action-menu', ['modalData']),
 
     title() {
-      return this.modalData.title || 'dialog.promptRemove.title';
+      return this.modalData?.title || 'dialog.promptRemove.title';
     },
 
     formattedType() {
@@ -51,7 +51,7 @@ export default {
     },
 
     warningMessage() {
-      if (this.modalData.warningMessage) return this.modalData.warningMessage;
+      if (this.modalData?.warningMessage) return this.modalData.warningMessage;
 
       const isPlural = this.type.endsWith('s');
       const thisOrThese = isPlural ? 'these' : 'this';
@@ -145,6 +145,7 @@ export default {
       try {
         for (const resource of this.resources) {
           await resource.remove();
+          if (this.modalData?.extraActionAfterRemove) await this.modalData.extraActionAfterRemove();
         }
         buttonDone(true);
         this.close();

pkg/harvester/dialog/DeepCloneVmDialog.vue

@@ -1,149 +0,0 @@
-<script>
-import { exceptionToErrorsArray } from '@shell/utils/error';
-import { mapGetters } from 'vuex';
-
-import { Card } from '@components/Card';
-import { Banner } from '@components/Banner';
-import { Checkbox } from '@components/Form/Checkbox';
-import AsyncButton from '@shell/components/AsyncButton';
-import { LabeledInput } from '@components/Form/LabeledInput';
-
-export default {
-  name: 'CloneVMModal',
-
-  emits: ['close'],
-
-  components: {
-    AsyncButton, Banner, Checkbox, Card, LabeledInput
-  },
-
-  props: {
-    resources: {
-      type:     Array,
-      required: true
-    }
-  },
-
-  data() {
-    return {
-      name:      '',
-      cloneData: true,
-      errors:    []
-    };
-  },
-
-  computed: {
-    ...mapGetters({ t: 'i18n/t' }),
-
-    actionResource() {
-      return this.resources[0];
-    },
-  },
-
-  methods: {
-    close() {
-      this.name = '';
-      this.$emit('close');
-    },
-
-    async create(buttonCb) {
-      // shadow clone
-      if (!this.cloneData) {
-        this.resources[0].goToClone();
-        buttonCb(false);
-        this.close();
-
-        return;
-      }
-
-      // deep clone
-      try {
-        const res = await this.actionResource.doAction('clone', { targetVm: this.name }, {}, false);
-
-        if (res._status === 200 || res._status === 204) {
-          this.$store.dispatch('growl/success', {
-            title:   this.t('harvester.notification.title.succeed'),
-            message: this.t('harvester.modal.cloneVM.message.success', { name: this.name })
-          }, { root: true });
-
-          this.close();
-          buttonCb(true);
-        } else {
-          const error = [res?.data] || exceptionToErrorsArray(res);
-
-          this['errors'] = error;
-          buttonCb(false);
-        }
-      } catch (err) {
-        const error = err?.data || err;
-        const message = exceptionToErrorsArray(error);
-
-        this['errors'] = message;
-        buttonCb(false);
-      }
-    }
-  },
-};
-</script>
-
-<template>
-  <Card :show-highlight-border="false">
-    <template #title>
-      {{ t('harvester.modal.cloneVM.title') }}
-    </template>
-
-    <template #body>
-      <Checkbox
-        v-model:value="cloneData"
-        class="mb-10"
-        label-key="harvester.modal.cloneVM.type"
-      />
-
-      <LabeledInput
-        v-show="cloneData"
-        v-model:value="name"
-        class="mb-20"
-        :label="t('harvester.modal.cloneVM.name')"
-        required
-      />
-      <Banner
-        v-for="(err, i) in errors"
-        :key="i"
-        :label="err"
-        color="error"
-      />
-    </template>
-
-    <template #actions>
-      <div class="actions">
-        <div class="buttons">
-          <button
-            class="btn role-secondary mr-10"
-            @click="close"
-          >
-            {{ t('generic.cancel') }}
-          </button>
-
-          <AsyncButton
-            mode="create"
-            :action-label="cloneData ? t('harvester.modal.cloneVM.action.create') : t('harvester.modal.cloneVM.action.clone')"
-            :disabled="cloneData && !name"
-            @click="create"
-          />
-        </div>
-      </div>
-    </template>
-  </Card>
-</template>
-
-<style lang="scss" scoped>
-.actions {
-  width: 100%;
-}
-
-.buttons {
-  display: flex;
-  justify-content: flex-end;
-  width: 100%;
-}
-</style>

pkg/harvester/dialog/EnablePciPassthrough.vue

@@ -1,9 +1,12 @@
 <script>
 import { mapGetters } from 'vuex';
+import { Banner } from '@components/Banner';
 import { Card } from '@components/Card';
+import { Checkbox } from '@components/Form/Checkbox';
 import AsyncButton from '@shell/components/AsyncButton';
 import { escapeHtml } from '@shell/utils/string';
 import { HCI } from '../types';
+import { getHarvesterUserName } from '../utils/auth';
 
 export default {
   name: 'HarvesterEnablePciPassthrough',
@@ -12,7 +15,9 @@ export default {
 
   components: {
     AsyncButton,
+    Banner,
     Card,
+    Checkbox,
   },
 
   props: {
@@ -23,10 +28,16 @@ export default {
   },
 
   data() {
-    return {};
+    return { disableResourcePooling: false };
   },
 
-  computed: { ...mapGetters({ t: 'i18n/t' }) },
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    disableResourcePoolingEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('disableResourcePooling');
+    },
+  },
 
   methods: {
     close() {
@@ -34,16 +45,7 @@ export default {
     },
 
     async save(buttonCb) {
-      // isSingleProduct == this is a standalone Harvester cluster
-      const isSingleProduct = this.$store.getters['isSingleProduct'];
-      let userName = 'admin';
-
-      // if this is imported Harvester, there may be users other than 'admin
-      if (!isSingleProduct) {
-        const user = this.$store.getters['auth/v3User'];
-
-        userName = user?.username || user?.id;
-      }
+      const userName = getHarvesterUserName(this.$store.getters);
 
       for (let i = 0; i < this.resources.length; i++) {
         const actionResource = this.resources[i];
@@ -60,9 +62,10 @@ export default {
             }]
           },
           spec: {
-            address:  actionResource.status.address,
-            nodeName: actionResource.status.nodeName,
-            userName
+            address:                actionResource.status.address,
+            nodeName:               actionResource.status.nodeName,
+            userName,
+            disableResourcePooling: this.disableResourcePooling,
           }
         } );
 
@@ -93,7 +96,19 @@ export default {
     </template>
 
     <template #body>
-      {{ t('harvester.pci.enablePassthroughWarning') }}
+      <p class="mb-20">
+        {{ t('harvester.pci.enablePassthroughWarning') }}
+      </p>
+      <template v-if="disableResourcePoolingEnabled">
+        <Checkbox
+          v-model:value="disableResourcePooling"
+          label-key="harvester.pci.disableResourcePooling"
+        />
+        <Banner
+          color="info"
+          :label="t('harvester.pci.disableResourcePoolingDescription')"
+        />
+      </template>
     </template>
 
     <template #actions>

pkg/harvester/dialog/EnableUSBPassthrough.vue

@@ -4,6 +4,7 @@ import { Card } from '@components/Card';
 import AsyncButton from '@shell/components/AsyncButton';
 import { escapeHtml } from '@shell/utils/string';
 import { HCI } from '../types';
+import { getHarvesterUserName } from '../utils/auth';
 
 export default {
   name: 'HarvesterEnableUSBPassthrough',
@@ -34,16 +35,7 @@ export default {
     },
 
     async save(buttonCb) {
-      // isSingleProduct == this is a standalone Harvester cluster
-      const isSingleProduct = this.$store.getters['isSingleProduct'];
-      let userName = 'admin';
-
-      // if this is imported Harvester, there may be users other than 'admin
-      if (!isSingleProduct) {
-        const user = this.$store.getters['auth/v3User'];
-
-        userName = user?.username || user?.id;
-      }
+      const userName = getHarvesterUserName(this.$store.getters);
 
       for (let i = 0; i < this.resources.length; i++) {
         const actionResource = this.resources[i];

pkg/harvester/dialog/HarvesterAddHotplugNic.vue

@@ -0,0 +1,212 @@
+<script>
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { mapGetters } from 'vuex';
+import { NETWORK_ATTACHMENT } from '@shell/config/types';
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import AsyncButton from '@shell/components/AsyncButton';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { HCI as HCI_ANNOTATIONS } from '@pkg/harvester/config/labels-annotations';
+import { NETWORK_TYPE } from '../config/types';
+
+export default {
+  name: 'AddHotplugNic',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton,
+    Card,
+    LabeledInput,
+    LabeledSelect,
+    Banner
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  async fetch() {
+    try {
+      this.allVMNetworks = await this.$store.dispatch('harvester/findAll', { type: NETWORK_ATTACHMENT });
+    } catch (err) {
+      this.errors = exceptionToErrorsArray(err);
+      this.allVMNetworks = [];
+    }
+  },
+
+  data() {
+    return {
+      interfaceName: '',
+      networkName:   '',
+      macAddress:    '',
+      allVMNetworks: [],
+      errors:        [],
+    };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    actionResource() {
+      return this.resources?.[0];
+    },
+
+    isFormValid() {
+      return this.interfaceName !== '' && this.networkName !== '';
+    },
+
+    vmNetworksOption() {
+      return this.allVMNetworks
+        .filter((network) => {
+          const labels = network.metadata?.labels || {};
+          const type = labels[HCI_ANNOTATIONS.NETWORK_TYPE];
+
+          const isValidType = [
+            NETWORK_TYPE.L2VLAN,
+            NETWORK_TYPE.UNTAGGED,
+            NETWORK_TYPE.L2TRUNK_VLAN,
+          ].includes(type);
+
+          return isValidType && !network.isSystem;
+        })
+        .map((network) => {
+          const label = network.isNotReady ? `${ network.id } (${ this.t('generic.notReady') })` : network.id;
+
+          return ({
+            label,
+            value:    network.id || '',
+            disabled: network.isNotReady,
+          });
+        });
+    }
+  },
+
+  methods: {
+    close() {
+      this.interfaceName = '';
+      this.networkName = '';
+      this.macAddress = '';
+      this.errors = [];
+      this.$emit('close');
+    },
+
+    async save(buttonCb) {
+      if (!this.actionResource) {
+        buttonCb(false);
+
+        return;
+      }
+
+      const payload = {
+        interfaceName: this.interfaceName,
+        networkName:   this.networkName
+      };
+
+      if (this.macAddress) {
+        payload.macAddress = this.macAddress;
+      }
+
+      try {
+        const res = await this.actionResource.doAction('addNic', payload);
+
+        if ([200, 204].includes(res?._status)) {
+          this.$store.dispatch('growl/success', {
+            title:   this.t('generic.notification.title.succeed'),
+            message: this.t('harvester.modal.hotplugNic.success', {
+              interfaceName: this.interfaceName,
+              vm:            this.actionResource.nameDisplay
+            })
+          }, { root: true });
+
+          this.close();
+          buttonCb(true);
+        } else {
+          this.errors = exceptionToErrorsArray(res);
+          buttonCb(false);
+        }
+      } catch (err) {
+        this.errors = exceptionToErrorsArray(err);
+        buttonCb(false);
+      }
+    }
+  }
+};
+</script>
+
+<template>
+  <Card
+    ref="modal"
+    name="modal"
+    :show-highlight-border="false"
+  >
+    <template #title>
+      <h4
+        v-clean-html="t('harvester.modal.hotplugNic.title')"
+        class="text-default-text"
+      />
+    </template>
+
+    <template #body>
+      <LabeledInput
+        v-model:value="interfaceName"
+        :label="t('generic.name')"
+        required
+      />
+      <LabeledSelect
+        v-model:value="networkName"
+        class="mt-20"
+        :label="t('harvester.modal.hotplugNic.vmNetwork')"
+        :options="vmNetworksOption"
+        required
+      />
+      <LabeledInput
+        v-model:value="macAddress"
+        class="mt-20"
+        label-key="harvester.modal.hotplugNic.macAddress"
+        :tooltip="t('harvester.modal.hotplugNic.macAddressTooltip', _, true)"
+      />
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        :label="err"
+        color="error"
+      />
+    </template>
+
+    <template #actions>
+      <div class="actions">
+        <div class="buttons">
+          <button
+            type="button"
+            class="btn role-secondary mr-10"
+            @click="close"
+          >
+            {{ t('generic.cancel') }}
+          </button>
+
+          <AsyncButton
+            mode="apply"
+            :disabled="!isFormValid"
+            @click="save"
+          />
+        </div>
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.actions {
+  width: 100%;
+}
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

pkg/harvester/dialog/HarvesterAddHotplugVolumeModal.vue

@@ -11,7 +11,7 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
-  name: 'HotplugModal',
+  name: 'HotplugVolumeModal',
 
   emits: ['close'],
 
@@ -62,7 +62,7 @@ export default {
               return false;
             }
 
-            return !pvc.attachVM;
+            return true;
           })
           .map((pvc) => {
             return {
@@ -90,7 +90,7 @@ export default {
           if (res._status === 200 || res._status === 204) {
             this.$store.dispatch('growl/success', {
               title:   this.t('generic.notification.title.succeed'),
-              message: this.t('harvester.modal.hotplug.success', { diskName: this.diskName, vm: this.actionResource.nameDisplay })
+              message: this.t('harvester.modal.hotplugVolume.success', { diskName: this.diskName, vm: this.actionResource.nameDisplay })
             }, { root: true });
 
             this.close();
@@ -122,7 +122,7 @@ export default {
   >
     <template #title>
       <h4
-        v-clean-html="t('harvester.modal.hotplug.title')"
+        v-clean-html="t('harvester.modal.hotplugVolume.title')"
         class="text-default-text"
       />
     </template>

pkg/harvester/dialog/HarvesterBackupModal.vue

@@ -5,6 +5,8 @@ import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 import AsyncButton from '@shell/components/AsyncButton';
 import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { DEFAULT_FS_FREEZE_DEADLINE, getFsFreezeDeadlineOptions } from '../utils/backup';
 
 export default {
   name: 'HarvesterBackupModal',
@@ -15,6 +17,7 @@ export default {
     AsyncButton,
     Card,
     LabeledInput,
+    LabeledSelect,
     Banner
   },
 
@@ -27,8 +30,9 @@ export default {
 
   data() {
     return {
-      backUpName: '',
-      errors:     []
+      backUpName:       '',
+      errors:           [],
+      fsFreezeDeadline: DEFAULT_FS_FREEZE_DEADLINE
     };
   },
 
@@ -37,12 +41,22 @@ export default {
 
     actionResource() {
       return this.resources[0];
+    },
+
+    fsFreezeDeadlineEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('fsFreezeDeadline');
+    },
+
+    fsFreezeDeadlineOptions() {
+      return getFsFreezeDeadlineOptions(this.t);
     }
   },
 
   methods: {
     close() {
       this.backUpName = '';
+      this.fsFreezeDeadline = DEFAULT_FS_FREEZE_DEADLINE;
+      this.errors = [];
       this.$emit('close');
     },
 
@@ -51,7 +65,7 @@ export default {
         try {
           const res = await this.actionResource.doAction(
             'backup',
-            { name: this.backUpName },
+            { name: this.backUpName, fsFreezeDeadline: this.fsFreezeDeadline },
             {},
             false
           );
@@ -100,9 +114,18 @@ export default {
     <template #body>
       <LabeledInput
         v-model:value="backUpName"
+        class="mt-20"
         :label="t('generic.name')"
         required
       />
+      <LabeledSelect
+        v-if="fsFreezeDeadlineEnabled"
+        v-model:value="fsFreezeDeadline"
+        class="mt-20"
+        :options="fsFreezeDeadlineOptions"
+        :label="t('harvester.modal.backup.fileSystemFreezeDeadline.label')"
+        required
+      />
       <Banner
         v-for="(err, i) in errors"
         :key="i"

pkg/harvester/dialog/HarvesterCPUMemoryHotPlugDialog.vue

@@ -0,0 +1,185 @@
+<script>
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { mapGetters } from 'vuex';
+import { getVmCPUMemoryValues } from '../utils/cpuMemory';
+import UnitInput from '@shell/components/form/UnitInput';
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import AsyncButton from '@shell/components/AsyncButton';
+import { GIBIBYTE } from '../utils/unit';
+
+export default {
+  name: 'CPUMemoryHotplugModal',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton, Card, Banner, UnitInput
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  data() {
+    const { cpu, memory } = getVmCPUMemoryValues(this.resources[0] || {});
+
+    return {
+      cpu,
+      memory,
+      errors: [],
+      GIBIBYTE
+    };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    actionResource() {
+      return this.resources[0] || {};
+    },
+    maxResourcesMessage() {
+      const { maxCpu, maxMemory } = getVmCPUMemoryValues(this.actionResource);
+
+      if (maxCpu && maxMemory) {
+        return this.t('harvester.modal.cpuMemoryHotplug.maxResourcesMessage', { maxCpu, maxMemory });
+      }
+
+      return '';
+    }
+  },
+
+  methods: {
+    close() {
+      this.cpu = '';
+      this.memory = '';
+      this.$emit('close');
+    },
+
+    change() {
+      if (parseInt(this.memory, 10) < 1 ) {
+        this.memory = '1Gi';
+      }
+      if (this.cpu < 1) {
+        this.cpu = 1;
+      }
+    },
+
+    async save(buttonCb) {
+      if (this.actionResource) {
+        try {
+          const res = await this.actionResource.doAction('cpuAndMemoryHotplug', { sockets: this.cpu, memory: this.memory });
+
+          if (res._status === 200 || res._status === 204) {
+            this.$store.dispatch('growl/success', {
+              title:   this.t('generic.notification.title.succeed'),
+              message: this.t('harvester.modal.cpuMemoryHotplug.success', { vm: this.actionResource.nameDisplay })
+            }, { root: true });
+
+            this.close();
+            buttonCb(true);
+          } else {
+            const error = [res?.data] || exceptionToErrorsArray(res);
+
+            this['errors'] = error;
+            buttonCb(false);
+          }
+        } catch (err) {
+          const error = err?.data || err;
+          const message = exceptionToErrorsArray(error);
+
+          this['errors'] = message;
+          buttonCb(false);
+        }
+      }
+    },
+  }
+};
+</script>
+
+<template>
+  <Card
+    ref="modal"
+    name="modal"
+    :show-highlight-border="false"
+  >
+    <template #title>
+      <h4
+        v-clean-html="t('harvester.modal.cpuMemoryHotplug.title')"
+        class="text-default-text"
+      />
+    </template>
+
+    <template #body>
+      <Banner
+        v-if="maxResourcesMessage"
+        :label="maxResourcesMessage"
+        color="info"
+      />
+      <UnitInput
+        v-model:value="cpu"
+        :label="t('harvester.virtualMachine.input.cpu')"
+        :delay="0"
+        required
+        suffix="C"
+        class="mb-20"
+        :mode="mode"
+        :min="1"
+        @update:value="change"
+      />
+      <UnitInput
+        v-model:value="memory"
+        :label="t('harvester.virtualMachine.input.memory')"
+        :mode="mode"
+        :input-exponent="3"
+        :delay="0"
+        :min="1"
+        :increment="1024"
+        :output-modifier="true"
+        :disabled="disabled"
+        :suffix="GIBIBYTE"
+        class="mb-20"
+        @update:value="change"
+      />
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        :label="err"
+        color="error"
+      />
+    </template>
+
+    <template #actions>
+      <div class="actions">
+        <div class="buttons">
+          <button
+            type="button"
+            class="btn role-secondary mr-10"
+            @click="close"
+          >
+            {{ t('generic.cancel') }}
+          </button>
+          <AsyncButton
+            mode="apply"
+            @click="save"
+          />
+        </div>
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.actions {
+  width: 100%;
+}
+
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

pkg/harvester/dialog/HarvesterDataMigrationDialog.vue

@@ -0,0 +1,183 @@
+<script>
+import { mapGetters } from 'vuex';
+
+import { STORAGE_CLASS } from '@shell/config/types';
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { sortBy } from '@shell/utils/sort';
+import { isInternalStorageClass } from '../utils/storage-class';
+
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import AsyncButton from '@shell/components/AsyncButton';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+
+export default {
+  name: 'HarvesterDataMigrationDialog',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton, Banner, Card, LabeledInput, LabeledSelect
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  async fetch() {
+    this.storageClasses = await this.$store.dispatch('harvester/findAll', { type: STORAGE_CLASS });
+  },
+
+  data() {
+    return {
+      targetVolumeName:       '',
+      targetStorageClassName: '',
+      errors:                 [],
+      storageClasses:         [],
+    };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    actionResource() {
+      return this.resources[0];
+    },
+
+    storageClassOptions() {
+      return sortBy(
+        this.storageClasses
+          .filter((sc) => !isInternalStorageClass(sc.metadata?.name))
+          .map((sc) => ({
+            label: sc.metadata?.name,
+            value: sc.metadata?.name
+          })),
+        'label'
+      );
+    },
+
+    disableSave() {
+      return !this.targetVolumeName || !this.targetStorageClassName;
+    },
+  },
+
+  methods: {
+    close() {
+      this.targetVolumeName = '';
+      this.targetStorageClassName = '';
+      this.errors = [];
+      this.$emit('close');
+    },
+
+    async apply(buttonDone) {
+      if (!this.actionResource) {
+        buttonDone(false);
+
+        return;
+      }
+
+      if (!this.targetVolumeName) {
+        const name = this.t('harvester.modal.dataMigration.fields.targetVolumeName.label');
+
+        this['errors'] = [this.t('validation.required', { key: name })];
+        buttonDone(false);
+
+        return;
+      }
+
+      if (!this.targetStorageClassName) {
+        const name = this.t('harvester.modal.dataMigration.fields.targetStorageClassName.label');
+
+        this['errors'] = [this.t('validation.required', { key: name })];
+        buttonDone(false);
+
+        return;
+      }
+
+      try {
+        await this.actionResource.doAction('dataMigration', {
+          targetVolumeName:       this.targetVolumeName,
+          targetStorageClassName: this.targetStorageClassName
+        }, {}, false);
+
+        buttonDone(true);
+        this.close();
+      } catch (err) {
+        const error = err?.data || err;
+
+        this['errors'] = exceptionToErrorsArray(error);
+        buttonDone(false);
+      }
+    },
+  }
+};
+</script>
+
+<template>
+  <Card :show-highlight-border="false">
+    <template #title>
+      {{ t('harvester.modal.dataMigration.title') }}
+    </template>
+
+    <template #body>
+      <LabeledInput
+        v-model:value="targetVolumeName"
+        :label="t('harvester.modal.dataMigration.fields.targetVolumeName.label')"
+        :placeholder="t('harvester.modal.dataMigration.fields.targetVolumeName.placeholder')"
+        class="mb-20"
+        required
+      />
+
+      <LabeledSelect
+        v-model:value="targetStorageClassName"
+        :label="t('harvester.modal.dataMigration.fields.targetStorageClassName.label')"
+        :placeholder="t('harvester.modal.dataMigration.fields.targetStorageClassName.placeholder')"
+        :options="storageClassOptions"
+        required
+      />
+
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        color="error"
+        :label="err"
+      />
+    </template>
+
+    <template
+      #actions
+      class="actions"
+    >
+      <div class="buttons">
+        <button
+          class="btn role-secondary mr-10"
+          @click="close"
+        >
+          {{ t('generic.cancel') }}
+        </button>
+
+        <AsyncButton
+          mode="apply"
+          :disabled="disableSave"
+          @click="apply"
+        />
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.actions {
+  width: 100%;
+}
+
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

pkg/harvester/dialog/HarvesterEnableNvidiaDriverToolkit.vue

@@ -0,0 +1,154 @@
+<script>
+import merge from 'lodash/merge';
+import jsyaml from 'js-yaml';
+import { mapGetters } from 'vuex';
+import { Card } from '@components/Card';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import AsyncButton from '@shell/components/AsyncButton';
+import { escapeHtml } from '@shell/utils/string';
+
+const DEFAULT_VALUE = { image: { repository: 'rancher/harvester-nvidia-driver-toolkit' } };
+
+export default {
+  name: 'HarvesterEnableNvidiaDriverToolkit',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton,
+    Card,
+    LabeledInput,
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  data() {
+    const addon = this.resources[0];
+    let valuesContentJson;
+
+    try {
+      valuesContentJson = merge({}, DEFAULT_VALUE, jsyaml.load(addon.spec.valuesContent));
+    } catch (e) {
+      valuesContentJson = { ...DEFAULT_VALUE };
+    }
+
+    return { valuesContentJson };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    buttonDisabled() {
+      const { image, driverLocation } = this.valuesContentJson;
+
+      return !(image?.repository || '').trim() || !(image?.tag || '').trim() || !(driverLocation || '').trim();
+    }
+  },
+
+  methods: {
+    close() {
+      this.$emit('close');
+    },
+
+    async enable(buttonCb) {
+      const addon = this.resources[0];
+
+      try {
+        addon.spec.valuesContent = jsyaml.dump(this.valuesContentJson);
+        addon.spec.enabled = true;
+        await addon.save();
+        buttonCb(true);
+        this.close();
+      } catch (err) {
+        addon.spec.enabled = false;
+        this.$store.dispatch('growl/fromError', {
+          title: this.t('generic.notification.title.error', { name: escapeHtml(addon.metadata.name) }),
+          err,
+        }, { root: true });
+        buttonCb(false);
+      }
+    }
+  }
+};
+</script>
+
+<template>
+  <Card :show-highlight-border="false">
+    <template #title>
+      <h4
+        v-clean-html="t('harvester.addons.nvidiaDriverToolkit.enable.title')"
+        class="text-default-text"
+      />
+    </template>
+
+    <template #body>
+      <div class="body">
+        <div class="row mb-15">
+          <div class="col span-6">
+            <LabeledInput
+              v-model:value="valuesContentJson.image.repository"
+              :required="true"
+              :label="t('harvester.addons.nvidiaDriverToolkit.image.repository')"
+            />
+          </div>
+          <div class="col span-6">
+            <LabeledInput
+              v-model:value="valuesContentJson.image.tag"
+              :required="true"
+              :label="t('harvester.addons.nvidiaDriverToolkit.image.tag')"
+            />
+          </div>
+        </div>
+        <div class="row mb-15">
+          <div class="col span-12">
+            <LabeledInput
+              v-model:value="valuesContentJson.driverLocation"
+              :required="true"
+              :label="t('harvester.addons.nvidiaDriverToolkit.driver.location')"
+            />
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <template #actions>
+      <div class="buttons actions">
+        <button
+          class="btn role-secondary mr-10"
+          @click="close"
+        >
+          {{ t('generic.cancel') }}
+        </button>
+
+        <AsyncButton
+          mode="enable"
+          :disabled="buttonDisabled"
+          @click="enable"
+        />
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.body {
+  display: flex;
+  flex-direction: column;
+  min-width: 400px;
+}
+
+.actions {
+  width: 100%;
+}
+
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

pkg/harvester/dialog/HarvesterExportImageDialog.vue

@@ -10,6 +10,7 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { NAMESPACE, STORAGE_CLASS } from '@shell/config/types';
 import { allHash } from '@shell/utils/promise';
+import { isInternalStorageClass } from '../utils/storage-class';
 
 export default {
   name: 'HarvesterExportImageDialog',
@@ -105,11 +106,17 @@ export default {
       }
 
       const options = storages.filter((s) => !s.parameters?.backingImage).map((s) => {
-        const label = s.isDefault ? `${ s.name } (${ this.t('generic.default') })` : s.name;
+        let label = s.isDefault ? `${ s.name } (${ this.t('generic.default') })` : s.name;
+        const isInternal = isInternalStorageClass(s.metadata?.name);
+
+        if (isInternal) {
+          label += ` (${ this.t('harvester.storage.internal.label') })`;
+        }
 
         return {
           label,
-          value: s.name,
+          value:    s.name,
+          disabled: isInternal,
         };
       }) || [];
 

pkg/harvester/dialog/HarvesterHotUnplug.vue

@@ -1,13 +1,16 @@
 <script>
 import { mapState, mapGetters } from 'vuex';
-
 import { exceptionToErrorsArray } from '@shell/utils/error';
 import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 import AsyncButton from '@shell/components/AsyncButton';
 
+const VOLUME = 'volume';
+const NETWORK = 'network';
+const CDROM = 'cdrom';
+
 export default {
-  name: 'HarvesterHotUnplugModal',
+  name: 'HarvesterHotUnplug',
 
   emits: ['close'],
 
@@ -35,8 +38,43 @@ export default {
     actionResource() {
       return this.resources[0];
     },
-    diskName() {
-      return this.modalData.diskName;
+
+    name() {
+      return this.modalData.name;
+    },
+
+    isVolume() {
+      return this.modalData.type === VOLUME;
+    },
+
+    titleKey() {
+      const keys = {
+        [VOLUME]:  'harvester.virtualMachine.hotUnplug.detachVolume.title',
+        [CDROM]:   'harvester.virtualMachine.hotUnplug.ejectCdRomVolume.title',
+        [NETWORK]: 'harvester.virtualMachine.hotUnplug.detachNIC.title',
+      };
+
+      return keys[this.modalData.type];
+    },
+
+    actionLabelKey() {
+      const keys = {
+        [VOLUME]:  'harvester.virtualMachine.hotUnplug.detachVolume.actionLabels',
+        [CDROM]:   'harvester.virtualMachine.hotUnplug.ejectCdRomVolume.actionLabels',
+        [NETWORK]: 'harvester.virtualMachine.hotUnplug.detachNIC.actionLabels',
+      };
+
+      return keys[this.modalData.type];
+    },
+
+    successMessageKey() {
+      const keys = {
+        [VOLUME]:  'harvester.virtualMachine.hotUnplug.detachVolume.success',
+        [CDROM]:   'harvester.virtualMachine.hotUnplug.ejectCdRomVolume.success',
+        [NETWORK]: 'harvester.virtualMachine.hotUnplug.detachNIC.success',
+      };
+
+      return keys[this.modalData.type];
     }
   },
 
@@ -47,14 +85,22 @@ export default {
 
     async save(buttonCb) {
       try {
-        const res = await this.actionResource.doAction('removeVolume', { diskName: this.diskName });
+        let res;
+
+        if (this.modalData.type === VOLUME) {
+          res = await this.actionResource.doAction('removeVolume', { diskName: this.name });
+        } else if (this.modalData.type === NETWORK) {
+          res = await this.actionResource.doAction('removeNic', { interfaceName: this.name });
+        } else {
+          res = await this.actionResource.doAction('ejectCdRomVolume', { deviceName: this.name });
+        }
 
         if (res._status === 200 || res._status === 204) {
           this.$store.dispatch(
             'growl/success',
             {
               title:   this.t('generic.notification.title.succeed'),
-              message: this.t('harvester.modal.hotunplug.success', { name: this.diskName })
+              message: this.t(this.successMessageKey, { name: this.name })
             },
             { root: true }
           );
@@ -64,14 +110,14 @@ export default {
         } else {
           const error = [res?.data] || exceptionToErrorsArray(res);
 
-          this['errors'] = error;
+          this.errors = error;
           buttonCb(false);
         }
       } catch (err) {
         const error = err?.data || err;
         const message = exceptionToErrorsArray(error);
 
-        this['errors'] = message;
+        this.errors = message;
         buttonCb(false);
       }
     }
@@ -87,7 +133,7 @@ export default {
   >
     <template #title>
       <h4
-        v-clean-html="t('harvester.virtualMachine.unplug.title', { name: diskName })"
+        v-clean-html="t(titleKey, { name })"
         class="text-default-text"
       />
       <Banner
@@ -111,9 +157,9 @@ export default {
 
           <AsyncButton
             mode="apply"
-            :action-label="t('harvester.virtualMachine.unplug.actionLabel')"
-            :waiting-label="t('harvester.virtualMachine.unplug.actionLabel')"
-            :success-label="t('harvester.virtualMachine.unplug.actionLabel')"
+            :action-label="t(actionLabelKey)"
+            :waiting-label="t(actionLabelKey)"
+            :success-label="t(actionLabelKey)"
             @click="save"
           />
         </div>
@@ -132,4 +178,8 @@ export default {
   justify-content: flex-end;
   width: 100%;
 }
+
+::v-deep(.card-title) {
+  display: block;
+}
 </style>

pkg/harvester/dialog/HarvesterInsertCdRomVolume.vue

@@ -0,0 +1,198 @@
+<script>
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { mapState, mapGetters } from 'vuex';
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import AsyncButton from '@shell/components/AsyncButton';
+import { LabeledInput } from '@components/Form/LabeledInput';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import { HCI as HCI_ANNOTATIONS } from '@pkg/harvester/config/labels-annotations';
+import { HCI } from '../types';
+
+export default {
+  name: 'HarvesterInsertCdRomVolume',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton,
+    Card,
+    LabeledInput,
+    LabeledSelect,
+    Banner
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  async fetch() {
+    try {
+      this.images = await this.$store.dispatch('harvester/findAll', { type: HCI.IMAGE });
+    } catch (err) {
+      this.errors = exceptionToErrorsArray(err);
+      this.images = [];
+    }
+  },
+
+  data() {
+    return {
+      imageName: '',
+      images:    [],
+      errors:    [],
+    };
+  },
+
+  computed: {
+    ...mapState('action-menu', ['modalData']),
+    ...mapGetters({ t: 'i18n/t' }),
+
+    actionResource() {
+      return this.resources?.[0];
+    },
+
+    isFormValid() {
+      return this.imageName !== '';
+    },
+
+    deviceName() {
+      return this.modalData.name;
+    },
+
+    imagesOption() {
+      return this.images
+        .filter((image) => {
+          const labels = image.metadata?.labels || {};
+          const type = labels[HCI_ANNOTATIONS.IMAGE_SUFFIX];
+
+          return type === 'iso';
+        })
+        .map((image) => {
+          return ({
+            label:    this.imageOptionLabel(image),
+            value:    image.id,
+            disabled: image.isImportedImage
+          });
+        });
+    }
+  },
+
+  methods: {
+    close() {
+      this.imageName = '';
+      this.errors = [];
+      this.$emit('close');
+    },
+
+    imageOptionLabel(image) {
+      return `${ image.metadata.namespace }/${ image.spec.displayName }`;
+    },
+
+    async save(buttonCb) {
+      if (!this.actionResource) {
+        buttonCb(false);
+
+        return;
+      }
+
+      const payload = {
+        deviceName: this.deviceName,
+        imageName:  this.imageName
+      };
+
+      try {
+        const res = await this.actionResource.doAction('insertCdRomVolume', payload);
+
+        if ([200, 204].includes(res?._status)) {
+          this.$store.dispatch('growl/success', {
+            title:   this.t('generic.notification.title.succeed'),
+            message: this.t('harvester.modal.insertCdRomVolume.success', {
+              deviceName: this.deviceName,
+              imageName:  this.imageName,
+            })
+          }, { root: true });
+
+          this.close();
+          buttonCb(true);
+        } else {
+          this.errors = exceptionToErrorsArray(res);
+          buttonCb(false);
+        }
+      } catch (err) {
+        this.errors = exceptionToErrorsArray(err);
+        buttonCb(false);
+      }
+    }
+  }
+};
+</script>
+
+<template>
+  <Card
+    ref="modal"
+    name="modal"
+    :show-highlight-border="false"
+  >
+    <template #title>
+      <h4
+        v-clean-html="t('harvester.modal.insertCdRomVolume.title')"
+        class="text-default-text"
+      />
+    </template>
+
+    <template #body>
+      <LabeledInput
+        v-model:value="deviceName"
+        :label="t('generic.name')"
+        disabled
+      />
+      <LabeledSelect
+        v-model:value="imageName"
+        class="mt-20"
+        :label="t('harvester.modal.insertCdRomVolume.image')"
+        :options="imagesOption"
+        required
+      />
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        :label="err"
+        color="error"
+      />
+    </template>
+
+    <template #actions>
+      <div class="actions">
+        <div class="buttons">
+          <button
+            type="button"
+            class="btn role-secondary mr-10"
+            @click="close"
+          >
+            {{ t('generic.cancel') }}
+          </button>
+
+          <AsyncButton
+            mode="apply"
+            :disabled="!isFormValid"
+            @click="save"
+          />
+        </div>
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.actions {
+  width: 100%;
+}
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

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() {
-      const inStore = this.$store.getters['currentProduct'].inStore;
-      const vmiResources = this.$store.getters[`${ inStore }/all`](HCI.VMI);
-      const resource = vmiResources.find((VMI) => VMI.id === this.actionResource?.id) || null;
+    anyCpuPinning() {
+      return this.resources.some((r) => r.isCpuPinning);
+    },
 
-      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 = !isCpuPinning || n.isCPUManagerEnabled; // If cpu-pinning is enabled, filter-out non-enabled CPU manager nodes.
+        const matchingCpuManagerConfig = !this.anyCpuPinning || 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;
@@ -102,10 +117,10 @@ export default {
   },
 
   methods: {
-    close() {
+    close(data) {
       this.nodeName = '';
       this.errors = [];
-      this.$emit('close');
+      this.$emit('close', data);
     },
 
     async apply(buttonDone) {
@@ -126,10 +141,32 @@ 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();
+        this.close({ performCallback: true, clearTableSelection: true });
       } catch (err) {
         const error = err?.data || err;
         const message = exceptionToErrorsArray(error);
@@ -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/dialog/HarvesterStorageMigrationDialog.vue

@@ -0,0 +1,239 @@
+<script>
+import { mapGetters } from 'vuex';
+
+import { PVC } from '@shell/config/types';
+import { exceptionToErrorsArray } from '@shell/utils/error';
+import { sortBy } from '@shell/utils/sort';
+import { HCI } from '../types';
+import { parseVolumeClaimTemplates } from '@pkg/harvester/utils/vm';
+
+import { Card } from '@components/Card';
+import { Banner } from '@components/Banner';
+import AsyncButton from '@shell/components/AsyncButton';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+
+export default {
+  name: 'HarvesterStorageMigrationDialog',
+
+  emits: ['close'],
+
+  components: {
+    AsyncButton, Banner, Card, LabeledSelect
+  },
+
+  props: {
+    resources: {
+      type:     Array,
+      required: true
+    }
+  },
+
+  async fetch() {
+    this.allPVCs = await this.$store.dispatch('harvester/findAll', { type: PVC });
+  },
+
+  data() {
+    return {
+      sourceVolume: '',
+      targetVolume: '',
+      errors:       [],
+      allPVCs:      [],
+    };
+  },
+
+  computed: {
+    ...mapGetters({ t: 'i18n/t' }),
+
+    actionResource() {
+      return this.resources[0];
+    },
+
+    sourceVolumeOptions() {
+      const volumes = this.actionResource.spec?.template?.spec?.volumes || [];
+
+      return sortBy(
+        volumes
+          .map((v) => v.persistentVolumeClaim?.claimName)
+          .filter((name) => !!name)
+          .map((name) => ({
+            label: name,
+            value: name
+          })),
+        'label'
+      );
+    },
+
+    namespacePVCs() {
+      return this.allPVCs.filter((pvc) => pvc.metadata.namespace === this.actionResource.metadata.namespace);
+    },
+
+    vmUsedVolumeNames() {
+      const allVMs = this.$store.getters['harvester/all'](HCI.VM) || [];
+      const names = new Set();
+
+      allVMs.forEach((vm) => {
+        // Collect volume names from spec.template.spec.volumes (both PVC and DataVolume references)
+        const volumes = vm.spec?.template?.spec?.volumes || [];
+
+        volumes.forEach((v) => {
+          const name = v.persistentVolumeClaim?.claimName || v.dataVolume?.name;
+
+          if (name) {
+            names.add(`${ vm.metadata.namespace }/${ name }`);
+          }
+        });
+
+        // Collect volume names from volumeClaimTemplates annotation
+        const templates = parseVolumeClaimTemplates(vm);
+
+        templates.forEach((t) => {
+          if (t.metadata?.name) {
+            names.add(`${ vm.metadata.namespace }/${ t.metadata.name }`);
+          }
+        });
+      });
+
+      return names;
+    },
+
+    targetVolumeOptions() {
+      return sortBy(
+        this.namespacePVCs
+          .filter((pvc) => {
+            // Exclude volumes used by any VM (via spec.volumes or volumeClaimTemplates)
+            if (this.vmUsedVolumeNames.has(`${ pvc.metadata.namespace }/${ pvc.metadata.name }`)) {
+              return false;
+            }
+
+            return true;
+          })
+          .map((pvc) => ({
+            label: pvc.metadata.name,
+            value: pvc.metadata.name
+          })),
+        'label'
+      );
+    },
+
+    disableSave() {
+      return !this.sourceVolume || !this.targetVolume;
+    },
+  },
+
+  methods: {
+    close() {
+      this.sourceVolume = '';
+      this.targetVolume = '';
+      this.errors = [];
+      this.$emit('close');
+    },
+
+    async apply(buttonDone) {
+      if (!this.actionResource) {
+        buttonDone(false);
+
+        return;
+      }
+
+      if (!this.sourceVolume) {
+        const name = this.t('harvester.modal.storageMigration.fields.sourceVolume.label');
+
+        this['errors'] = [this.t('validation.required', { key: name })];
+        buttonDone(false);
+
+        return;
+      }
+
+      if (!this.targetVolume) {
+        const name = this.t('harvester.modal.storageMigration.fields.targetVolume.label');
+
+        this['errors'] = [this.t('validation.required', { key: name })];
+        buttonDone(false);
+
+        return;
+      }
+
+      try {
+        await this.actionResource.doAction('storageMigration', {
+          sourceVolume: this.sourceVolume,
+          targetVolume: this.targetVolume
+        }, {}, false);
+
+        buttonDone(true);
+        this.close();
+      } catch (err) {
+        const error = err?.data || err;
+
+        this['errors'] = exceptionToErrorsArray(error);
+        buttonDone(false);
+      }
+    },
+  }
+};
+</script>
+
+<template>
+  <Card :show-highlight-border="false">
+    <template #title>
+      {{ t('harvester.modal.storageMigration.title') }}
+    </template>
+
+    <template #body>
+      <LabeledSelect
+        v-model:value="sourceVolume"
+        :label="t('harvester.modal.storageMigration.fields.sourceVolume.label')"
+        :placeholder="t('harvester.modal.storageMigration.fields.sourceVolume.placeholder')"
+        :options="sourceVolumeOptions"
+        class="mb-20"
+        required
+      />
+
+      <LabeledSelect
+        v-model:value="targetVolume"
+        :label="t('harvester.modal.storageMigration.fields.targetVolume.label')"
+        :placeholder="t('harvester.modal.storageMigration.fields.targetVolume.placeholder')"
+        :options="targetVolumeOptions"
+        required
+      />
+
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        color="error"
+        :label="err"
+      />
+    </template>
+
+    <template
+      #actions
+      class="actions"
+    >
+      <div class="buttons">
+        <button
+          class="btn role-secondary mr-10"
+          @click="close"
+        >
+          {{ t('generic.cancel') }}
+        </button>
+
+        <AsyncButton
+          mode="apply"
+          :disabled="disableSave"
+          @click="apply"
+        />
+      </div>
+    </template>
+  </Card>
+</template>
+
+<style lang="scss" scoped>
+.actions {
+  width: 100%;
+}
+
+.buttons {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+</style>

pkg/harvester/dialog/HarvesterSupportBundle.vue

@@ -1,4 +1,5 @@
 <script>
+import { NAMESPACE } from '@shell/config/types';
 import { randomStr } from '@shell/utils/string';
 import { exceptionToErrorsArray, stringify } from '@shell/utils/error';
 import { LabeledInput } from '@components/Form/LabeledInput';
@@ -6,7 +7,15 @@ import AsyncButton from '@shell/components/AsyncButton';
 import GraphCircle from '@shell/components/graph/Circle';
 import { Banner } from '@components/Banner';
 import AppModal from '@shell/components/AppModal';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
+import UnitInput from '@shell/components/form/UnitInput';
 import { HCI } from '../types';
+import { HCI_SETTING } from '../config/settings';
+import { DOC } from '../config/doc-links';
+import { docLink } from '../utils/feature-flags';
+
+const SELECT_ALL = 'select_all';
+const UNSELECT_ALL = 'unselect_all';
 
 export default {
   name: 'SupportBundle',
@@ -17,14 +26,36 @@ export default {
     AsyncButton,
     Banner,
     AppModal,
+    LabeledSelect,
+    UnitInput
+  },
+
+  async fetch() {
+    await this.$store.dispatch('harvester/findAll', { type: NAMESPACE });
+
+    try {
+      const url = this.$store.getters['harvester-common/getHarvesterClusterUrl']('v1/harvester/namespaces?link=supportbundle');
+      const response = await this.$store.dispatch('harvester/request', { url });
+
+      this.defaultNamespaces = response.data || [];
+    } catch (error) {
+      this.defaultNamespaces = [];
+    }
   },
 
   data() {
     return {
-      url:         '',
-      description: '',
-      errors:      [],
-      isOpen:      false,
+      isOpen:            false,
+      errors:            [],
+      version:           '',
+      clusterName:       '',
+      url:               '',
+      description:       '',
+      namespaces:        [],
+      defaultNamespaces: [],
+      timeout:           '',
+      expiration:        '',
+      nodeTimeout:       '',
     };
   },
 
@@ -39,23 +70,51 @@ export default {
 
     percentage() {
       return this.$store.getters['harvester-common/getBundlePercentage'];
-    }
+    },
+
+    availableNamespaces() {
+      const allNamespaces = this.$store.getters['harvester/all'](NAMESPACE).map((ns) => ns.id);
+      const defaultNamespacesIds = this.defaultNamespaces.map((ns) => ns.id);
+
+      return allNamespaces.filter((ns) => !defaultNamespacesIds.includes(ns) || this.namespaces.includes(ns));
+    },
+
+    namespaceOptions() {
+      if (this.availableNamespaces.length === 0) return [];
+
+      const allSelected = this.namespaces.length === this.availableNamespaces.length &&
+      this.availableNamespaces.every((ns) => this.namespaces.includes(ns));
+
+      const controlOption = allSelected ? { label: this.t('harvester.modal.bundle.namespaces.unselectAll'), value: UNSELECT_ALL } : { label: this.t('harvester.modal.bundle.namespaces.selectAll'), value: SELECT_ALL };
+
+      return [controlOption, ...this.availableNamespaces];
+    },
+
+    docLink() {
+      const version = this.$store.getters['harvester-common/getServerVersion']();
+
+      return docLink(DOC.SUPPORT_BUNDLE_NAMESPACES, version);
+    },
+
+    customSupportBundleFeatureEnabled() {
+      return this.$store.getters['harvester-common/getFeatureEnabled']('customSupportBundle');
+    },
   },
 
   watch: {
     isShowBundleModal: {
+      immediate: true,
       handler(show) {
-        if (show) {
-          this.$nextTick(() => {
-            this.isOpen = true;
-          });
-        } else {
-          this.isOpen = false;
-          this.url = '';
-          this.description = '';
-        }
-      },
-      immediate: true
+        this.isOpen = show;
+      }
+    },
+
+    isOpen(newVal) {
+      if (newVal) {
+        this.loadDefaultSettings();
+      } else {
+        this.resetForm();
+      }
     },
   },
 
@@ -65,33 +124,93 @@ export default {
     close() {
       this.isOpen = false;
       this.$store.commit('harvester-common/toggleBundleModal', false);
-      this.backUpName = '';
+    },
+
+    loadDefaultSettings() {
+      const cluster = this.$store.getters['currentCluster'];
+      const versionSetting = this.$store.getters['harvester/byId'](HCI.SETTING, HCI_SETTING.SERVER_VERSION);
+      const namespacesSetting = this.$store.getters['harvester/byId'](HCI.SETTING, HCI_SETTING.SUPPORT_BUNDLE_NAMESPACES);
+      const timeoutSetting = this.$store.getters['harvester/byId'](HCI.SETTING, HCI_SETTING.SUPPORT_BUNDLE_TIMEOUT);
+      const expirationSetting = this.$store.getters['harvester/byId'](HCI.SETTING, HCI_SETTING.SUPPORT_BUNDLE_EXPIRATION);
+      const nodeTimeoutSetting = this.$store.getters['harvester/byId'](HCI.SETTING, HCI_SETTING.SUPPORT_BUNDLE_NODE_COLLECTION_TIMEOUT);
+
+      this.version = versionSetting?.currentVersion || '';
+      this.clusterName = cluster?.id || '';
+      this.namespaces = (namespacesSetting?.value ?? namespacesSetting?.default ?? '').split(',').map((ns) => ns.trim()).filter((ns) => ns);
+      this.timeout = timeoutSetting?.value ?? timeoutSetting?.default ?? '';
+      this.expiration = expirationSetting?.value ?? expirationSetting?.default ?? '';
+      this.nodeTimeout = nodeTimeoutSetting?.value ?? nodeTimeoutSetting?.default ?? '';
+      this.url = '';
+      this.description = '';
+      this.errors = [];
+    },
+
+    resetForm() {
+      this.url = '';
+      this.description = '';
+      this.namespaces = [];
+      this.timeout = '';
+      this.expiration = '';
+      this.nodeTimeout = '';
+      this.errors = [];
+    },
+
+    updateNamespaces(selected) {
+      if (selected.includes(SELECT_ALL)) {
+        this.namespaces = [...this.availableNamespaces];
+      } else if (selected.includes(UNSELECT_ALL)) {
+        this.namespaces = [];
+      } else {
+        this.namespaces = selected.filter((val) => val !== SELECT_ALL && val !== UNSELECT_ALL);
+      }
+    },
+
+    updateNumberValue(field, value) {
+      if (value === '' || value === null || isNaN(value)) {
+        this[field] = '';
+
+        return;
+      }
+
+      const num = Number(value);
+      const isValid = Number.isInteger(num) && num >= 0;
+
+      this[field] = isValid ? String(num) : '';
+    },
+
+    onKeyDown(e) {
+      if (['e', 'E', '+', '-', '.'].includes(e.key)) {
+        e.preventDefault();
+      }
     },
 
     async save(buttonCb) {
       this.errors = [];
 
-      const name = `bundle-${ randomStr(5).toLowerCase() }`;
+      const name = `bundle-${ this.clusterName }-${ this.version }-${ randomStr(5).toLowerCase() }`;
       const namespace = 'harvester-system';
 
+      const spec = {
+        description: this.description.trim(),
+        ...(this.url.trim() && { issueURL: this.url.trim() }),
+        ...(this.namespaces.length > 0 && { extraCollectionNamespaces: this.namespaces }),
+        ...(this.timeout !== '' && { timeout: Number(this.timeout) }),
+        ...(this.expiration !== '' && { expiration: Number(this.expiration) }),
+        ...(this.nodeTimeout !== '' && { nodeTimeout: Number(this.nodeTimeout) }),
+      };
+
       const bundleCrd = {
         apiVersion: 'harvesterhci.io/v1beta1',
         type:       HCI.SUPPORT_BUNDLE,
         kind:       'SupportBundle',
-        metadata:   {
-          name,
-          namespace
-        },
-        spec: {
-          issueURL:    this.url,
-          description: this.description
-        }
+        metadata:   { name, namespace },
+        spec,
       };
 
-      const inStore = this.$store.getters['currentProduct'].inStore;
-      const bundleValue = await this.$store.dispatch(`${ inStore }/create`, bundleCrd);
-
       try {
+        const inStore = this.$store.getters['currentProduct'].inStore;
+        const bundleValue = await this.$store.dispatch(`${ inStore }/create`, bundleCrd);
+
         await bundleValue.save();
 
         this.$store.commit('harvester-common/setLatestBundleId', `${ namespace }/${ name }`, { root: true });
@@ -118,69 +237,111 @@ export default {
       @close="close"
     >
       <div class="p-20">
-        <h2>
-          {{ t('harvester.modal.bundle.title') }}
-        </h2>
-
-        <div
-          v-if="!bundlePending"
-          class="content"
-        >
-          <LabeledInput
-            v-model:value="url"
-            :label="t('harvester.modal.bundle.url')"
-            class="mb-20"
-          />
-
-          <LabeledInput
-            v-model:value="description"
-            :label="t('harvester.modal.bundle.description')"
-            type="multiline"
-            :min-height="120"
-            required
-          />
-        </div>
-
-        <div
-          v-else
-          class="content"
-        >
-          <div class="circle">
+        <h2>{{ t('harvester.modal.bundle.title') }}</h2>
+        <div class="content">
+          <div
+            v-if="bundlePending"
+            class="circle mb-20"
+          >
             <GraphCircle
               primary-stroke-color="green"
-              secondary-stroke-color="white"
+              secondary-stroke-color="lightgrey"
               :stroke-width="6"
               :percentage="percentage"
               :show-text="true"
             />
           </div>
-        </div>
+          <template v-else>
+            <p
+              v-if="customSupportBundleFeatureEnabled"
+              v-clean-html="t('harvester.modal.bundle.tip', { doc: docLink }, true)"
+              class="mb-20"
+            />
+            <LabeledInput
+              v-model:value="url"
+              :label="t('harvester.modal.bundle.url')"
+              class="mb-10"
+            />
+            <LabeledInput
+              v-model:value="description"
+              required
+              :label="t('harvester.modal.bundle.description')"
+              type="multiline"
+              :min-height="80"
+              class="mb-10"
+            />
 
-        <div
-          v-for="(err, idx) in errors"
-          :key="idx"
-        >
-          <Banner
-            color="error"
-            :label="stringify(err)"
-          />
-        </div>
-
-        <div class="footer mt-20">
-          <button
-            class="btn btn-sm role-secondary mr-10"
-            @click="close"
+            <template v-if="customSupportBundleFeatureEnabled">
+              <LabeledSelect
+                v-model:value="namespaces"
+                :label="t('harvester.modal.bundle.namespaces.label')"
+                :clearable="true"
+                :multiple="true"
+                :append-to-body="false"
+                :options="namespaceOptions"
+                class="mb-10 namespace-select"
+                :tooltip="t('harvester.modal.bundle.namespaces.tooltip', _, true)"
+                @update:value="updateNamespaces"
+              />
+              <UnitInput
+                v-model:value="timeout"
+                :label="t('harvester.modal.bundle.timeout.label')"
+                class="mb-10"
+                type="number"
+                :min="0"
+                :tooltip="t('harvester.modal.bundle.timeout.tooltip', _, true)"
+                :suffix="timeout > 1 ? 'Minutes' : 'Minute'"
+                @keydown="onKeyDown"
+                @update:value="val => updateNumberValue('timeout', val)"
+              />
+              <UnitInput
+                v-model:value="expiration"
+                :label="t('harvester.modal.bundle.expiration.label')"
+                class="mb-10"
+                type="number"
+                :min="0"
+                :tooltip="t('harvester.modal.bundle.expiration.tooltip', _, true)"
+                :suffix="expiration > 1 ? 'Minutes' : 'Minute'"
+                @keydown="onKeyDown"
+                @update:value="val => updateNumberValue('expiration', val)"
+              />
+              <UnitInput
+                v-model:value="nodeTimeout"
+                :label="t('harvester.modal.bundle.nodeTimeout.label')"
+                class="mb-10"
+                type="number"
+                :min="0"
+                :tooltip="t('harvester.modal.bundle.nodeTimeout.tooltip', _, true)"
+                :suffix="nodeTimeout > 1 ? 'Minutes' : 'Minute'"
+                @keydown="onKeyDown"
+                @update:value="val => updateNumberValue('nodeTimeout', val)"
+              />
+            </template>
+          </template>
+          <div
+            v-for="(err, idx) in errors"
+            :key="idx"
           >
-            {{ t('generic.close') }}
-          </button>
-
-          <AsyncButton
-            type="submit"
-            mode="generate"
-            class="btn btn-sm bg-primary"
-            :disabled="bundlePending"
-            @click="save"
-          />
+            <Banner
+              color="error"
+              :label="stringify(err)"
+            />
+          </div>
+          <div class="footer mt-20">
+            <button
+              class="btn btn-sm role-secondary mr-10"
+              @click="close"
+            >
+              {{ t('generic.close') }}
+            </button>
+            <AsyncButton
+              type="submit"
+              mode="generate"
+              class="btn btn-sm bg-primary"
+              :disabled="bundlePending"
+              @click="save"
+            />
+          </div>
         </div>
       </div>
     </app-modal>
@@ -194,6 +355,10 @@ export default {
     max-height: 100vh;
   }
 
+  .labeled-select.taggable ::v-deep(.vs__selected-options .vs__selected.vs__selected > button) {
+    margin: 0 7px;
+  }
+
   .bundle {
     cursor: pointer;
     color: var(--primary);
@@ -204,12 +369,15 @@ export default {
   }
 
   .content {
-    height: 218px;
-
     .circle {
-      padding-top: 20px;
+      padding: 10px 0;
       height: 160px;
     }
+    .namespace-select {
+      :deep(.vs__dropdown-menu) {
+        max-height: 210px;
+      }
+    }
   }
 
   div {