cluster-view battling -- part 1 (iframe failing support nodeintegration)

Signed-off-by: Roman <ixrock@gmail.com>

src/renderer/components/cluster-manager/cluster-manager.scss

@@ -8,6 +8,7 @@
   #lens-view {
     position: relative;
     grid-area: lens-view;
+    display: flex;
   }
 
   .ClustersMenu {

src/renderer/components/cluster-manager/cluster-view.scss

@@ -5,6 +5,6 @@
   //display: none;
 
   &.loaded {
-    display: block;
+    display: flex;
   }
 }

src/renderer/components/cluster-manager/cluster-view.tsx

@@ -1,13 +1,16 @@
+import "./cluster-view.scss"
 import React from "react";
+import { WebviewTag } from "electron"
 import { autorun, computed, observable } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { ClusterId, clusterStore } from "../../../common/cluster-store";
 import { getMatchedClusterId } from "./cluster-view.route";
 import { Cluster } from "../../../main/cluster";
+import { ClusterStatus } from "./cluster-status";
 
 @observer
 export class ClusterView extends React.Component {
-  static views = observable.map<ClusterId, /*HTMLIFrameElement*/ any>()
+  static views = observable.map<ClusterId, WebviewTag>()
   static isLoaded = observable.map<ClusterId, boolean>()
 
   @computed get cluster() {
@@ -24,23 +27,31 @@ export class ClusterView extends React.Component {
     ])
   }
 
+  // fixme
   activateView = (cluster: Cluster) => {
     if (!cluster || ClusterView.views.has(cluster.id)) {
       return;
     }
     const view = document.createElement("webview");
     view.className = "ClusterView"
-    view.src = `${location.protocol}://${cluster.id}.${location.host}`
-    view.onload = () => console.log('CLUSTER VIEW READY!', cluster);
+    view.setAttribute("nodeintegration", "true")
+    view.setAttribute("enableremotemodule", "true")
+    view.addEventListener("did-finish-load", () => {
+      console.log('CLUSTER VIEW READY!', cluster)
+      view.openDevTools()
+    });
+    view.addEventListener("did-fail-load", event => {
+      // todo: handle
+    });
+    view.src = `${location.protocol}//${cluster.id}.${location.host}`
     document.body.appendChild(view);
     ClusterView.views.set(cluster.id, view);
   }
 
   render() {
     const { cluster } = this;
-    if (cluster && cluster.accessible) {
-
+    if (cluster) {
+      return <ClusterStatus clusterId={cluster.id}/>
     }
-    return "";
   }
 }