@rancher/shell 2.0.0 → 3.0.0-rc.1

package/edit/provisioning.cattle.io.cluster/rke2.vue

@@ -89,6 +89,8 @@ const NODE_TOTAL = {
 const CLUSTER_AGENT_CUSTOMIZATION = 'clusterAgentDeploymentCustomization';
 const FLEET_AGENT_CUSTOMIZATION = 'fleetAgentDeploymentCustomization';
 
+const isAzureK8sUnsupported = (version) => semver.gte(version, '1.30.0');
+
 export default {
   components: {
     AgentEnv,
@@ -155,36 +157,50 @@ export default {
 
   data() {
     if (!this.value.spec.rkeConfig) {
-      set(this.value.spec, 'rkeConfig', {});
+      this.value.spec.rkeConfig = {};
     }
 
     if (!this.value.spec.rkeConfig.chartValues) {
-      set(this.value.spec.rkeConfig, 'chartValues', {});
+      this.value.spec.rkeConfig.chartValues = {};
     }
 
     if (!this.value.spec.rkeConfig.upgradeStrategy) {
-      set(this.value.spec.rkeConfig, 'upgradeStrategy', {
+      this.value.spec.rkeConfig.upgradeStrategy = {
         controlPlaneConcurrency:  '1',
         controlPlaneDrainOptions: {},
         workerConcurrency:        '1',
         workerDrainOptions:       {},
-      });
+      };
     }
 
+    // default for dataDirectories configuration obj
     if (!this.value.spec.rkeConfig.dataDirectories) {
-      set(this.value.spec.rkeConfig, 'dataDirectories', {
+      this.value.spec.rkeConfig.dataDirectories = {
         systemAgent:  '',
         provisioning: '',
         k8sDistro:    '',
-      });
+      };
+    }
+
+    // default for dataDirectories configuration systemAgent config
+    if (!this.value.spec.rkeConfig.dataDirectories.systemAgent) {
+      this.value.spec.rkeConfig.dataDirectories.systemAgent = '';
+    }
+    // default for dataDirectories configuration provisioning config
+    if (!this.value.spec.rkeConfig.dataDirectories.provisioning) {
+      this.value.spec.rkeConfig.dataDirectories.provisioning = '';
+    }
+    // default for dataDirectories configuration k8sDistro config
+    if (!this.value.spec.rkeConfig.dataDirectories.k8sDistro) {
+      this.value.spec.rkeConfig.dataDirectories.k8sDistro = '';
     }
 
     if (!this.value.spec.rkeConfig.machineGlobalConfig) {
-      set(this.value.spec, 'rkeConfig.machineGlobalConfig', {});
+      this.value.spec.rkeConfig.machineGlobalConfig = {};
     }
 
     if (!this.value.spec.rkeConfig.machineSelectorConfig?.length) {
-      set(this.value.spec, 'rkeConfig.machineSelectorConfig', [{ config: {} }]);
+      this.value.spec.rkeConfig.machineSelectorConfig = [{ config: {} }];
     }
 
     const truncateLimit = this.value.defaultHostnameLengthLimit || 0;
@@ -297,6 +313,7 @@ export default {
       const cur = this.liveValue?.spec?.kubernetesVersion || '';
       const existingRke2 = this.mode === _EDIT && cur.includes('rke2');
       const existingK3s = this.mode === _EDIT && cur.includes('k3s');
+      const isAzure = this.agentConfig?.['cloud-provider-name'] === 'azure';
 
       let allValidRke2Versions = this.getAllOptionsAfterCurrentVersion(this.rke2Versions, (existingRke2 ? cur : null), this.defaultRke2);
       let allValidK3sVersions = this.getAllOptionsAfterCurrentVersion(this.k3sVersions, (existingK3s ? cur : null), this.defaultK3s);
@@ -309,6 +326,11 @@ export default {
         allValidK3sVersions = this.filterOutDeprecatedPatchVersions(allValidK3sVersions, cur);
       }
 
+      if (isAzure) {
+        allValidRke2Versions = allValidRke2Versions.filter((v) => !isAzureK8sUnsupported(v.value));
+        allValidK3sVersions = allValidK3sVersions.filter((v) => !isAzureK8sUnsupported(v.value));
+      }
+
       const showRke2 = allValidRke2Versions.length && !existingK3s;
       const showK3s = allValidK3sVersions.length && !existingRke2;
       const out = [];
@@ -356,7 +378,7 @@ export default {
       // https://github.com/rancher/dashboard/issues/10338
       // there's an update loop on refresh that might include 'none'
       // multiple times... Prevent that
-      if (out.serverArgs?.cni?.options && !out.serverArgs?.cni?.options.includes('none')) {
+      if (out?.serverArgs?.cni?.options && !out.serverArgs?.cni?.options.includes('none')) {
         out.serverArgs.cni.options.push('none');
       }
 
@@ -580,8 +602,9 @@ export default {
 
     cloudProviderOptions() {
       const out = [{
-        label: this.$store.getters['i18n/t']('cluster.rke2.cloudProvider.defaultValue.label'),
-        value: '',
+        label:    this.$store.getters['i18n/t']('cluster.rke2.cloudProvider.defaultValue.label'),
+        value:    '',
+        disabled: this.canAzureMigrateOnEdit
       }];
 
       if (!!this.agentArgs['cloud-provider-name']?.options) {
@@ -593,12 +616,22 @@ export default {
           // If we have a preferred provider... only show default, preferred and external
           const isPreferred = opt === preferred;
           const isExternal = opt === 'external';
+          const isAzure = opt === 'azure';
+
           let disabled = false;
 
           if ((this.isHarvesterExternalCredential || this.isHarvesterIncompatible) && isPreferred) {
             disabled = true;
           }
 
+          if (isAzure && isAzureK8sUnsupported(this.value.spec.kubernetesVersion)) {
+            disabled = true;
+          }
+
+          if (!isAzure && !isExternal && this.canAzureMigrateOnEdit) {
+            disabled = true;
+          }
+
           if (showAllOptions || isPreferred || isExternal) {
             out.push({
               label: this.$store.getters['i18n/withFallback'](`cluster.cloudProvider."${ opt }".label`, null, opt),
@@ -618,6 +651,22 @@ export default {
       return out;
     },
 
+    isAzureProviderUnsupported() {
+      return isAzureK8sUnsupported(this.value.spec.kubernetesVersion) || this.agentConfig['cloud-provider-name'] === 'azure';
+    },
+
+    canAzureMigrateOnEdit() {
+      if (!this.isEdit) {
+        return false;
+      }
+
+      const isAzureLiveProvider = this.liveValue.agentConfig['cloud-provider-name'] === 'azure';
+
+      return isAzureLiveProvider &&
+        semver.gte(this.liveValue?.spec?.kubernetesVersion, '1.27.0') &&
+        semver.lt(this.liveValue?.spec?.kubernetesVersion, '1.30.0');
+    },
+
     canManageMembers() {
       return canViewClusterMembershipEditor(this.$store);
     },
@@ -659,7 +708,7 @@ export default {
       const { linuxWorkerCount, windowsWorkerCount } = this.value?.mgmt?.status || {};
 
       if (!windowsWorkerCount) {
-        if (!!this.machinePools.find((pool) => {
+        if (!!this.machinePools?.find((pool) => {
           return pool?.config?.os === 'windows';
         })) {
           return this.t('cluster.banner.os', { newOS: 'Windows', existingOS: 'Linux' });
@@ -726,6 +775,14 @@ export default {
       } else {
         return this.$store.getters['customisation/getPreviewCluster'];
       }
+    },
+    localValue: {
+      get() {
+        return this.value;
+      },
+      set(newValue) {
+        this.$emit('update:value', newValue);
+      }
     }
   },
 
@@ -794,11 +851,11 @@ export default {
         if (!this.serverConfig.cni) {
           const def = this.serverArgs.cni.default;
 
-          set(this.serverConfig, 'cni', def);
+          this.serverConfig.cni = def;
         }
       } else {
         // Type doesn't support cni, clear `cni`
-        set(this.serverConfig, 'cni', undefined);
+        this.serverConfig.cni = undefined;
       }
     },
 
@@ -806,7 +863,7 @@ export default {
       if (!neu) {
         // No cloud provider available? Then clear cloud provider setting. This will recalculate addonNames...
         // ... which will eventually update `value.spec.rkeConfig.chartValues`
-        set(this.agentConfig, 'cloud-provider-name', undefined);
+        this.agentConfig['cloud-provider-name'] = undefined;
       }
     },
   },
@@ -831,11 +888,11 @@ export default {
      */
     async initSpecs() {
       if (!this.value.spec) {
-        set(this.value, 'spec', {});
+        this.value.spec = {};
       }
 
       if (!this.value.spec.machineSelectorConfig) {
-        set(this.value.spec, 'machineSelectorConfig', []);
+        this.value.spec.machineSelectorConfig = [];
       }
 
       if (!this.value.spec.machineSelectorConfig.find((x) => !x.machineLabelSelector)) {
@@ -848,7 +905,7 @@ export default {
       }
 
       if (!this.value.spec.kubernetesVersion) {
-        set(this.value.spec, 'kubernetesVersion', this.defaultVersion);
+        this.value.spec.kubernetesVersion = this.defaultVersion;
       }
 
       if (this.rkeConfig.etcd?.s3?.bucket) {
@@ -856,16 +913,16 @@ export default {
       }
 
       if (!this.rkeConfig.etcd) {
-        set(this.rkeConfig, 'etcd', {
+        this.rkeConfig.etcd = {
           disableSnapshots:     false,
           s3:                   null,
           snapshotRetention:    5,
           snapshotScheduleCron: '0 */5 * * *',
-        });
+        };
       } else if (typeof this.rkeConfig.etcd.disableSnapshots === 'undefined') {
         const disableSnapshots = !this.rkeConfig.etcd.snapshotRetention && !this.rkeConfig.etcd.snapshotScheduleCron;
 
-        set(this.rkeConfig.etcd, 'disableSnapshots', disableSnapshots);
+        this.rkeConfig.etcd.disableSnapshots = disableSnapshots;
       }
 
       // Namespaces if required - this is mainly for custom provisioners via extensions that want
@@ -882,7 +939,7 @@ export default {
       }
 
       if (this.value.spec.defaultPodSecurityAdmissionConfigurationTemplateName === undefined) {
-        set(this.value.spec, 'defaultPodSecurityAdmissionConfigurationTemplateName', '');
+        this.value.spec.defaultPodSecurityAdmissionConfigurationTemplateName = '';
       }
     },
 
@@ -989,12 +1046,12 @@ export default {
     setAgentConfiguration() {
       // Cluster Agent Configuration
       if (!this.value.spec[CLUSTER_AGENT_CUSTOMIZATION]) {
-        set(this.value.spec, CLUSTER_AGENT_CUSTOMIZATION, {});
+        this.value.spec[CLUSTER_AGENT_CUSTOMIZATION] = {};
       }
 
       // Fleet Agent Configuration
       if (!this.value.spec[FLEET_AGENT_CUSTOMIZATION]) {
-        set(this.value.spec, FLEET_AGENT_CUSTOMIZATION, {});
+        this.value.spec[FLEET_AGENT_CUSTOMIZATION] = {};
       }
     },
 
@@ -1211,7 +1268,7 @@ export default {
         await this.syncMachineConfigWithLatest(entry);
 
         // Capitals and such aren't allowed;
-        set(entry.pool, 'name', normalizeName(entry.pool.name) || 'pool');
+        entry.pool.name = normalizeName(entry.pool.name) || 'pool';
 
         const prefix = `${ this.value.metadata.name }-${ entry.pool.name }`.substr(0, 50).toLowerCase();
 
@@ -1303,7 +1360,7 @@ export default {
 
     // Set busy before save and clear after save
     async saveOverride(btnCb) {
-      this.$set(this, 'busy', true);
+      this['busy'] = true;
 
       // If the provider is from an extension, let it do the provision step
       if (this.extensionProvider?.provision) {
@@ -1311,7 +1368,7 @@ export default {
         const okay = (errors || []).length === 0;
 
         this.errors = errors;
-        this.$set(this, 'busy', false);
+        this['busy'] = false;
 
         btnCb(okay);
 
@@ -1323,7 +1380,7 @@ export default {
 
       // Default save
       return this._doSaveOverride((done) => {
-        this.$set(this, 'busy', false);
+        this['busy'] = false;
 
         return btnCb(done);
       });
@@ -1378,15 +1435,15 @@ export default {
 
           const harvesterKubeconfigSecret = await this.createKubeconfigSecret(kubeconfig);
 
-          set(this.agentConfig, 'cloud-provider-config', `secret://fleet-default:${ harvesterKubeconfigSecret?.metadata?.name }`);
+          this.agentConfig['cloud-provider-config'] = `secret://fleet-default:${ harvesterKubeconfigSecret?.metadata?.name }`;
 
           if (this.isCreate) {
-            set(this.chartValues, `${ HARVESTER_CLOUD_PROVIDER }.global.cattle.clusterName`, this.value.metadata.name);
+            this.chartValues[`${ HARVESTER_CLOUD_PROVIDER }.global.cattle.clusterName`] = this.value.metadata.name;
           }
 
           const distroRoot = this.value?.spec?.rkeConfig?.dataDirectories?.k8sDistro?.length ? this.value?.spec?.rkeConfig?.dataDirectories?.k8sDistro : '/var/lib/rancher/rke2';
 
-          set(this.chartValues, `${ HARVESTER_CLOUD_PROVIDER }.cloudConfigPath`, `${ distroRoot }/etc/config-files/cloud-provider-config`);
+          this.chartValues[`${ HARVESTER_CLOUD_PROVIDER }.cloudConfigPath`] = `${ distroRoot }/etc/config-files/cloud-provider-config`;
         }
       } catch (err) {
         this.errors.push(err);
@@ -1412,8 +1469,8 @@ export default {
       // if there are any errors saving, restore the agent config data
       if (this.errors?.length) {
         // Ensure the agent configuration is set back to the values before we changed (cleaned) it
-        set(this.value.spec, CLUSTER_AGENT_CUSTOMIZATION, clusterAgentDeploymentCustomization);
-        set(this.value.spec, FLEET_AGENT_CUSTOMIZATION, fleetAgentDeploymentCustomization);
+        this.value.spec[CLUSTER_AGENT_CUSTOMIZATION] = clusterAgentDeploymentCustomization;
+        this.value.spec[FLEET_AGENT_CUSTOMIZATION] = fleetAgentDeploymentCustomization;
       }
     },
 
@@ -1484,7 +1541,7 @@ export default {
             versionName: entry.version,
           });
 
-          set(this.versionInfo, chartName, res);
+          this.versionInfo.chartName = res;
           const key = this.chartVersionKey(chartName);
 
           if (!this.userChartValues[key]) {
@@ -1501,7 +1558,7 @@ export default {
       this.addonNames.forEach((name) => {
         const chartValues = this.versionInfo[name]?.questions ? this.initYamlEditor(name) : {};
 
-        set(this.userChartValuesTemp, name, chartValues);
+        this.userChartValuesTemp.name = chartValues;
       });
       this.refreshComponentWithYamls(key);
     },
@@ -1527,7 +1584,7 @@ export default {
     },
 
     updateValues(name, values) {
-      set(this.userChartValuesTemp, name, values);
+      this.userChartValuesTemp.name = values;
       this.syncChartValues(name);
     },
 
@@ -1551,7 +1608,7 @@ export default {
         if (this.serverConfig[k] === undefined) {
           const def = this.serverArgs[k].default;
 
-          set(this.serverConfig, k, (def !== undefined ? def : undefined));
+          this.serverConfig[k] = (def !== undefined ? def : undefined);
         }
       }
 
@@ -1559,12 +1616,12 @@ export default {
         if (this.agentConfig?.[k] === undefined) {
           const def = this.agentArgs[k].default;
 
-          set(this.agentConfig, k, (def !== undefined ? def : undefined));
+          this.agentConfig[k] = (def !== undefined ? def : undefined);
         }
       }
 
       if (!this.serverConfig?.profile) {
-        set(this.serverConfig, 'profile', null);
+        this.serverConfig.profile = null;
       }
     },
 
@@ -1575,7 +1632,7 @@ export default {
     },
 
     onMembershipUpdate(update) {
-      this.$set(this, 'membershipUpdate', update);
+      this['membershipUpdate'] = update;
     },
 
     async initRegistry() {
@@ -1598,15 +1655,15 @@ export default {
 
       if (!regs) {
         regs = {};
-        set(this.rkeConfig, 'registries', regs);
+        this.rkeConfig.registries = regs;
       }
 
       if (!regs.configs) {
-        set(regs, 'configs', {});
+        regs.configs = {};
       }
 
       if (!regs.mirrors) {
-        set(regs, 'mirrors', {});
+        regs.mirrors = {};
       }
 
       const config = regs.configs[this.registryHost];
@@ -1633,16 +1690,16 @@ export default {
 
       if (this.systemRegistry) {
         // Empty string overrides the system default to nothing
-        set(this.agentConfig, 'system-default-registry', '');
+        this.agentConfig['system-default-registry'] = '';
       } else {
         // No need to set anything
-        set(this.agentConfig, 'system-default-registry', undefined);
+        this.agentConfig['system-default-registry'] = undefined;
       }
       if (!hostname || hostname === this.systemRegistry) {
         // Undefined removes the key which uses the global setting without hardcoding it into the config
-        set(this.agentConfig, 'system-default-registry', undefined);
+        this.agentConfig['system-default-registry'] = undefined;
       } else {
-        set(this.agentConfig, 'system-default-registry', hostname);
+        this.agentConfig['system-default-registry'] = hostname;
       }
 
       if (hostname && this.registrySecret) {
@@ -1684,7 +1741,7 @@ export default {
       if (!this.value.spec?.rkeConfig) {
         this.value.spec.rkeConfig = { registries: {} };
       }
-      set(this.value.spec.rkeConfig.registries, 'configs', configs);
+      this.value.spec.rkeConfig.registries.configs = configs;
     },
 
     getAllOptionsAfterCurrentVersion(versions, currentVersion, defaultVersion) {
@@ -1811,7 +1868,7 @@ export default {
         const userValues = this.userChartValues[key];
 
         if (userValues) {
-          set(rkeConfig.chartValues, name, userValues);
+          rkeConfig.chartValues.name = userValues;
         }
       });
     },
@@ -1869,7 +1926,7 @@ export default {
 
       if (!this.cisOverride) {
         if (cisValue) {
-          set(this.value.spec, 'defaultPodSecurityAdmissionConfigurationTemplateName', hardcodedTemplate);
+          this.value.spec.defaultPodSecurityAdmissionConfigurationTemplateName = hardcodedTemplate;
         }
       }
     },
@@ -1886,9 +1943,9 @@ export default {
       const selectedCisProfile = this.agentConfig?.profile;
 
       if (selectedCisProfile) {
-        set(this.agentConfig, 'protect-kernel-defaults', true);
+        this.agentConfig['protect-kernel-defaults'] = true;
       } else {
-        set(this.agentConfig, 'protect-kernel-defaults', false);
+        this.agentConfig['protect-kernel-defaults'] = false;
       }
     },
     updateAdditionalManifest(neu) {
@@ -1917,13 +1974,13 @@ export default {
      */
     machinePoolValidationChanged(id, value) {
       if (value === undefined) {
-        this.$delete(this.machinePoolValidation, id);
+        delete this.machinePoolValidation[id];
       } else {
-        this.$set(this.machinePoolValidation, id, value);
+        this.machinePoolValidation[id] = value;
       }
     },
     handleEnabledSystemServicesChanged(val) {
-      set(this.serverConfig, 'disable', val);
+      this.serverConfig.disable = val;
     },
 
     handleCiliumValuesChanged(neu) {
@@ -1933,10 +1990,10 @@ export default {
 
       const name = this.chartVersionKey('rke2-cilium');
 
-      set(this, 'userChartValues', {
+      this.userChartValues = {
         ...this.userChartValues,
         [name]: { ...neu }
-      });
+      };
     },
 
     handleCisChanged() {
@@ -1985,14 +2042,14 @@ export default {
       if (neu) {
         // We need to make sure that s3 doesn't already have an existing value otherwise when editing a cluster with s3 defined this will clear s3.
         if (isEmpty(this.rkeConfig.etcd?.s3)) {
-          set(this.rkeConfig.etcd, 's3', {});
+          this.rkeConfig.etcd.s3 = {};
         }
       } else {
-        set(this.rkeConfig.etcd, 's3', null);
+        this.rkeConfig.etcd.s3 = null;
       }
     },
     handleConfigEtcdExposeMetricsChanged(neu) {
-      set(this.serverConfig, 'etcd-expose-metrics', neu);
+      this.serverConfig['etcd-expose-metrics'] = neu;
     },
     handleRegistryHostChanged(neu) {
       this.registryHost = neu;
@@ -2071,7 +2128,7 @@ export default {
     </div>
     <SelectCredential
       v-if="needCredential"
-      v-model="credentialId"
+      v-model:value="credentialId"
       :mode="mode"
       :provider="provider"
       :cancel="cancelCredential"
@@ -2088,7 +2145,7 @@ export default {
     >
       <NameNsDescription
         v-if="!isView"
-        v-model="value"
+        v-model:value="localValue"
         :mode="mode"
         :namespaced="needsNamespace"
         :namespace-options="allNamespaces"
@@ -2097,10 +2154,9 @@ export default {
         description-label="cluster.description.label"
         description-placeholder="cluster.description.placeholder"
         :rules="{ name: fvGetAndReportPathRules('metadata.name') }"
+        @update:value="$emit('input', $event)"
       >
-        <template
-          slot="customize"
-        >
+        <template #customize>
           <ClusterAppearance
             :name="clusterName"
             :currentCluster="currentCluster"
@@ -2158,7 +2214,10 @@ export default {
           @addTab="addMachinePool($event)"
           @removeTab="removeMachinePool($event)"
         >
-          <template v-for="(obj, idx) in machinePools">
+          <template
+            v-for="(obj, idx) in machinePools"
+            :key="idx"
+          >
             <Tab
               v-if="!obj.remove"
               :key="obj.id"
@@ -2206,7 +2265,7 @@ export default {
           <!-- Basic -->
           <Basics
             ref="tab-Basics"
-            v-model="value"
+            v-model:value="localValue"
             :live-value="liveValue"
             :mode="mode"
             :provider="provider"
@@ -2225,6 +2284,9 @@ export default {
             :show-cni="showCni"
             :show-cloud-provider="showCloudProvider"
             :cloud-provider-options="cloudProviderOptions"
+            :is-azure-provider-unsupported="isAzureProviderUnsupported"
+            :can-azure-migrate-on-edit="canAzureMigrateOnEdit"
+            @update:value="$emit('input', $event)"
             @cilium-values-changed="handleCiliumValuesChanged"
             @enabled-system-services-changed="handleEnabledSystemServicesChanged"
             @kubernetes-changed="handleKubernetesChange"
@@ -2242,9 +2304,10 @@ export default {
           :weight="10"
         >
           <MemberRoles
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :on-membership-update="onMembershipUpdate"
+            @update:value="$emit('input', $event)"
           />
         </Tab>
         <!-- etcd -->
@@ -2253,11 +2316,12 @@ export default {
           label-key="cluster.tabs.etcd"
         >
           <Etcd
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :s3-backup="s3Backup"
             :register-before-hook="registerBeforeHook"
             :selected-version="selectedVersion"
+            @update:value="$emit('input', $event)"
             @s3-backup-changed="handleS3BackupChanged"
             @config-etcd-expose-metrics-changed="handleConfigEtcdExposeMetricsChanged"
           />
@@ -2270,10 +2334,11 @@ export default {
           label-key="cluster.tabs.networking"
         >
           <Networking
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :selected-version="selectedVersion"
             :truncate-limit="truncateLimit"
+            @update:value="$emit('input', $event)"
             @truncate-hostname="truncateHostname"
           />
         </Tab>
@@ -2284,8 +2349,9 @@ export default {
           label-key="cluster.tabs.upgrade"
         >
           <Upgrade
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
+            @update:value="$emit('input', $event)"
           />
         </Tab>
 
@@ -2295,13 +2361,14 @@ export default {
           label-key="cluster.tabs.registry"
         >
           <Registries
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :register-before-hook="registerBeforeHook"
             :show-custom-registry-input="showCustomRegistryInput"
             :registry-host="registryHost"
             :registry-secret="registrySecret"
             :show-custom-registry-advanced-input="showCustomRegistryAdvancedInput"
+            @update:value="$emit('input', $event)"
             @update-configs-changed="updateConfigs"
             @custom-registry-changed="toggleCustomRegistry"
             @registry-host-changed="handleRegistryHostChanged"
@@ -2317,13 +2384,14 @@ export default {
         >
           <AddOnConfig
             ref="tab-addOnConfig"
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :version-info="versionInfo"
             :addon-versions="addonVersions"
             :addons-rev="addonsRev"
             :user-chart-values-temp="userChartValuesTemp"
             :init-yaml-editor="initYamlEditor"
+            @update:value="$emit('input', $event)"
             @update-questions="syncChartValues"
             @update-values="updateValues"
             @additional-manifest-changed="updateAdditionalManifest"
@@ -2337,7 +2405,7 @@ export default {
         >
           <AgentConfiguration
             v-if="value.spec.clusterAgentDeploymentCustomization"
-            v-model="value.spec.clusterAgentDeploymentCustomization"
+            v-model:value="value.spec.clusterAgentDeploymentCustomization"
             data-testid="rke2-cluster-agent-config"
             type="cluster"
             :mode="mode"
@@ -2351,7 +2419,7 @@ export default {
         >
           <AgentConfiguration
             v-if="value.spec.fleetAgentDeploymentCustomization"
-            v-model="value.spec.fleetAgentDeploymentCustomization"
+            v-model:value="value.spec.fleetAgentDeploymentCustomization"
             data-testid="rke2-fleet-agent-config"
             type="fleet"
             :mode="mode"
@@ -2366,20 +2434,23 @@ export default {
           :weight="-1"
         >
           <Advanced
-            v-model="value"
+            v-model:value="localValue"
             :mode="mode"
             :have-arg-info="haveArgInfo"
             :selected-version="selectedVersion"
+            @update:value="$emit('input', $event)"
           />
         </Tab>
 
         <AgentEnv
-          v-model="value"
+          v-model:value="localValue"
           :mode="mode"
+          @update:value="$emit('input', $event)"
         />
         <Labels
-          v-model="value"
+          v-model:value="localValue"
           :mode="mode"
+          @update:value="$emit('input', $event)"
         />
 
         <!-- Extension tabs -->