Update for view

lib/shared/addon/components/cru-cloud-provider/component.js

@@ -19,6 +19,7 @@ const AZURE_PATH    = 'cluster.rancherKubernetesEngineConfig.cloudProvider.azure
 export default Component.extend({
   globalStore:           service(),
   settings:              service(),
+  growl:                 service(),
   layout,
   configType:            null,
   cluster:               null,
@@ -187,6 +188,10 @@ export default Component.extend({
            (selectedCloudProvider === 'external')
   }),
 
+  harvesterCloudProviderDisabled: computed('model.nodeTemplates.firstObject', function() {
+    return !get(this, 'model.nodeTemplates.firstObject')
+  }),
+
   checkDefaults(record) {
     get(this, 'azureDefaults').forEach((def) => {
       if (isEmpty(record[def])) {
@@ -276,6 +281,7 @@ export default Component.extend({
       set(config, 'cloudProvider', get(this, 'globalStore').createRecord({
         type:                   'cloudProvider',
         name:                   'harvester',
+        harvesterCloudProvider: nue,
       }));
 
       set(this, 'configAnswers', nue);
@@ -285,7 +291,7 @@ export default Component.extend({
           set(config, 'cloudProvider.harvesterCloudProvider.cloudConfig', get(obj, 'config'))
         })
         .catch((err) => {
-          this.get('growl').fromError('Error getting kubeconfig file', err);
+          get(this, 'growl').fromError('Error getting kubeconfig file', err);
         })
 
       break;

lib/shared/addon/components/cru-cloud-provider/template.hbs

@@ -106,11 +106,28 @@
             </div>
           {{else if isCreateClusterOrClusterTemplate}}
             <div class="radio">
-              <label>
+              <label style={{if harvesterCloudProviderDisabled "color: #adaeb4"}}>
                 {{radio-button
                   selection=selectedCloudProvider
                   value="harvester"
-                }} {{t "cloudProvider.harvester.label"}}
+                  disabled=harvesterCloudProviderDisabled
+                }} 
+                {{t "cloudProvider.harvester.label"}}
+                {{#if harvesterCloudProviderDisabled}}
+                  <span class="inline-block">
+                    {{#tooltip-element
+                      type="tooltip-basic"
+                      model=(t "cloudProvider.harvester.helpText" htmlSafe=true)
+                      tooltipTemplate="tooltip-static"
+                      aria-describedby="tooltip-base"
+                      tooltipFor="tooltipPoolCreateAfter"
+                      placement="top"
+                      tagName="div"
+                    }}
+                      <i class="icon icon-help icon-blue"></i>
+                    {{/tooltip-element}}
+                  </span>
+                {{/if}}
               </label>
             </div>
           {{/if}}

translations/en-us.yaml

@@ -3175,6 +3175,7 @@ cloudProvider:
     helpText: 'Please edit the YAML to add in any other <a href="http://rancher.com/docs/rke/v0.1.x/en/config-options/cloud-providers/" target="_blank" rel="nofollow noopener noreferrer">cloud providers</a>'
   harvester:
     label: Harvester (Out-of-tree)
+    helpText: Please select a node template first to enable the option
 
   helpText: |
      Read more about the state of the <a href="https://kubernetes.io/blog/2019/04/17/the-future-of-cloud-providers-in-kubernetes/" target="_blank" rel="nofollow noopener noreferrer">Kubernetes in-tree cloud providers</a>