From c81aa67ca409d2803f27fa3cee913b3a3c672e37 Mon Sep 17 00:00:00 2001
From: Westly Wright <westly.wright@gmail.com>
Date: Tue, 26 Feb 2019 14:33:26 -0700
Subject: [PATCH] Load correct external driver on edit of cluster

rancher/rancher#18406
---
 app/authenticated/cluster/edit/route.js     | 54 +++++++++++++++++++--
 app/authenticated/cluster/edit/template.hbs |  1 -
 app/models/cluster.js                       | 14 ++++--
 3 files changed, 61 insertions(+), 8 deletions(-)

diff --git a/app/authenticated/cluster/edit/route.js b/app/authenticated/cluster/edit/route.js
index fb7f26833..a36b36b50 100644
--- a/app/authenticated/cluster/edit/route.js
+++ b/app/authenticated/cluster/edit/route.js
@@ -1,7 +1,9 @@
 import { get, set } from '@ember/object';
 import { inject as service } from '@ember/service';
 import Route from '@ember/routing/route';
-import { hash } from 'rsvp';
+import { hash, hashSettled/* , all */ } from 'rsvp';
+import { loadScript, loadStylesheet, proxifyUrl } from 'shared/utils/load-script';
+import { isEmpty } from '@ember/utils';
 
 export default Route.extend({
   access:              service(),
@@ -26,15 +28,59 @@ export default Route.extend({
     });
   },
 
+  afterModel(model) {
+    // load the css/js url here, if the url loads fail we should error the driver out
+    // show the driver in the ui, greyed out, and possibly add error text "can not load comonent from url [put url here]"
+
+    let { kontainerDrivers } = model;
+    let externalDrivers      = kontainerDrivers.filter( (d) => d.uiUrl !== '');
+    let promises = {};
+
+    externalDrivers.forEach( (d) => {
+      if (get(d, 'hasUi')) {
+        const jsUrl  = proxifyUrl(d.uiUrl, this.get('app.proxyEndpoint'));
+        const cssUrl = proxifyUrl(d.uiUrl.replace(/\.js$/, '.css'), get(this, 'app.proxyEndpoint'));
+
+        // skip setProperties cause of weird names
+        set(promises, `${ d.name }Js`, loadScript(jsUrl, `driver-ui-js-${ d.name }`));
+        set(promises, `${ d.name }Css`, loadStylesheet(cssUrl, `driver-ui-css-${ d.name }`));
+      }
+    });
+
+    if (isEmpty(promises)) {
+      return model;
+    } else {
+      return hashSettled(promises).then( (settled) => {
+        let allkeys = Object.keys(settled);
+
+        allkeys.forEach( (key) => {
+          if (get(settled, `${ key }.state`) === 'rejected') {
+            let tmp = key.indexOf('Js') > -1 ? key.replace(/\Js$/, '') : key.replace(/\Css$/, '');
+            let match = kontainerDrivers.findBy('id', tmp);
+
+            console.log('Error Loading External Component for: ', match);
+            if (match && get(match, 'scriptError') !== true) {
+              set(match, 'scriptError', get(this, 'intl').t('clusterNew.externalError'));
+            }
+          }
+        });
+      }).finally(() => {
+        return model;
+      });
+    }
+  },
+
   setupController(controller/* , model*/) {
     this._super(...arguments);
     set(controller, 'step', 1);
   },
 
-  resetController(controller, isExisting /* , transition*/ ) {
-    if (isExisting) {
+  resetController(controller, isExiting /* , transition*/ ) {
+    if (isExiting) {
       controller.set('errors', null);
       controller.set('provider', null);
     }
-  }
+  },
+
+  queryParams: { provider: { refreshModel: true } },
 });
diff --git a/app/authenticated/cluster/edit/template.hbs b/app/authenticated/cluster/edit/template.hbs
index e9d29e1e9..3b09f37c3 100644
--- a/app/authenticated/cluster/edit/template.hbs
+++ b/app/authenticated/cluster/edit/template.hbs
@@ -1,7 +1,6 @@
 {{cru-cluster
   model=model
   initialProvider=cluster.provider
-  provider=provider
   mode="edit"
   close=(action "close")
 }}
diff --git a/app/models/cluster.js b/app/models/cluster.js
index 566835cb3..069a0dee5 100644
--- a/app/models/cluster.js
+++ b/app/models/cluster.js
@@ -113,7 +113,11 @@ export default Resource.extend(Grafana, ResourceUsage, {
         return 'custom';
       }
     default:
-      return 'import';
+      if (get(this, 'driver') && get(this, 'configName')) {
+        return get(this, 'driver');
+      } else {
+        return 'import';
+      }
     }
   }),
 
@@ -146,7 +150,11 @@ export default Resource.extend(Grafana, ResourceUsage, {
         return intl.t('clusterNew.custom.shortLabel');
       }
     default:
-      return intl.t('clusterNew.import.shortLabel');
+      if (get(this, 'driver') && get(this, 'configName')) {
+        return get(this, 'driver').capitalize();
+      } else {
+        return intl.t('clusterNew.import.shortLabel');
+      }
     }
   }),
 
@@ -245,7 +253,7 @@ export default Resource.extend(Grafana, ResourceUsage, {
     },
 
     edit() {
-      get(this, 'router').transitionTo('authenticated.cluster.edit', get(this, 'id'));
+      get(this, 'router').transitionTo('authenticated.cluster.edit', get(this, 'id'), { queryParams: { provider: get(this, 'driver') } });
     },
 
     scaleDownPool(id) {