Change default on imported gke to be zonal and match fresh create page

rancher/rancher#32439

lib/shared/addon/components/cluster-driver/driver-import-gke/component.js

@@ -50,7 +50,7 @@ export default Component.extend(ClusterDriver, {
       clusterErrors: [],
       otherErrors:   [],
       zones:         [],
-      locationType:  this.google.defaultRegionType,
+      locationType:  this.google.defaultZoneType,
       regionChoices: this.google.regions.map((region) => ({ name: region })),
     });
 
@@ -108,6 +108,7 @@ export default Component.extend(ClusterDriver, {
       });
     },
     async loadClusters(cb) {
+      set(this, 'errors', []);
       const errors   = [];
       let step       = 3;
       let allClusters;
@@ -156,31 +157,56 @@ export default Component.extend(ClusterDriver, {
         });
       }
     },
-  },
+    setZone(selection) {
+      if (selection?.type === 'change') {
+        return;
+      }
+
+      const { name: zone } = selection;
+
+      setProperties(this.config, {
+        zone,
+        'region': null,
+      });
 
-  regionOrZoneChanged: observer('config.{region,zone}', function() {
-    next(this, () => {
       if (this.step > 2) {
         this.send('loadClusters');
       }
+    },
+    setRegion(selection) {
+      if (selection?.type === 'change') {
+        return;
+      }
+      const { name: region } = selection;
+
+      setProperties(this.config, {
+        'zone': null,
+        region,
       });
-  }),
+
+      if (this.step > 2) {
+        this.send('loadClusters');
+      }
+    },
+  },
 
   locationTypeChanged: observer('locationType', function() {
     const { config, locationType } = this;
 
     if (locationType === 'zonal') {
-      if (!isEmpty(get(config, 'region'))) {
-        delete this.config.region;
-      }
-
-      set(this, 'config.zone', 'us-west2-a');
+      setProperties(config, {
+        'zone':   'us-central1-c',
+        'region': null,
+      });
     } else {
-      if (!isEmpty(get(config, 'zone'))) {
-        delete this.config.zone;
+      setProperties(config, {
+        'zone':   null,
+        'region': 'us-central1',
+      });
     }
 
-      set(this, 'config.region', 'us-west2');
+    if (this.step > 2) {
+      this.send('loadClusters');
     }
   }),
 
@@ -241,12 +267,14 @@ export default Component.extend(ClusterDriver, {
     const gkeConfig = this.globalStore.createRecord({
       clusterName: '',
       imported:    true,
-      region:            'us-west2',
+      zone:        'us-central1-c',
       type:        'gkeclusterconfigspec',
     });
 
-    set(this, 'model.cluster.gkeConfig', gkeConfig);
-    set(this, 'config', gkeConfig);
+    setProperties(this, {
+      'model.cluster.gkeConfig': gkeConfig,
+      'config':                  gkeConfig,
+    });
   },
 
 });

lib/shared/addon/components/cluster-driver/driver-import-gke/template.hbs

@@ -79,11 +79,11 @@
           </div>
         </div>
         {{#if (eq locationType "zonal")}}
-          <div class="col span-4">
+          <div class="col span-6">
             <label class="acc-label">
               {{t "clusterNew.googlegke.zone.label"}}
             </label>
-            <NewSelect
+            <SearchableSelect
               @classNames="form-control select-algin-checkbox"
               @content={{zoneChoices}}
               @disabled={{editing}}
@@ -91,7 +91,8 @@
               @optionLabelPath="name"
               @optionValuePath="name"
               @prompt="clusterNew.googlegke.zone.prompt"
-              @value={{mut config.zone}}
+              @change={{action "setZone"}}
+              @value={{config.zone}}
             />
           </div>
         {{/if}}
@@ -100,7 +101,7 @@
             <label class="acc-label">
               {{t "clusterNew.googlegke.region.label"}}
             </label>
-            <NewSelect
+            <SearchableSelect
               @classNames="form-control select-algin-checkbox"
               @content={{regionChoices}}
               @disabled={{editing}}
@@ -108,7 +109,8 @@
               @optionLabelPath="name"
               @optionValuePath="name"
               @prompt="clusterNew.googlegke.region.prompt"
-              @value={{mut config.region}}
+              @change={{action "setRegion"}}
+              @value={{config.region}}
             />
           </div>
         {{/if}}