cluster-status -- part 3

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

src/main/cluster-manager.ts

@@ -33,6 +33,7 @@ export class ClusterManager {
         this.activeClusterId = activeCluster.id;
         activeCluster.bindEvents();
         activeCluster.refreshStatus();
+        activeCluster.pushState();
       }
     }, {
       fireImmediately: true

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

@@ -1,7 +1,7 @@
 import "./cluster-manager.scss"
 import React from "react";
 import { observer } from "mobx-react";
-import { computed } from "mobx";
+import { computed, observable } from "mobx";
 import { App } from "../app";
 import { ClusterStatus } from "./cluster-status";
 import { ClustersMenu } from "./clusters-menu";
@@ -18,23 +18,27 @@ interface Props {
 
 @observer
 export class ClusterManager extends React.Component<Props> {
-  @computed get isReady() {
+  @observable appReady = false;
+
+  @computed get clusterReady() {
     return clusterStore.activeCluster?.isReady
   }
 
   async componentDidMount() {
-    await invokeIpc(ClusterIpcChannel.INIT)
+    invokeIpc(ClusterIpcChannel.INIT);
     await App.init();
+    this.appReady = true;
   }
 
   render() {
     const { className, contentClass } = this.props;
+    const isReady = this.appReady && this.clusterReady;
     return (
       <div className={cssNames("ClusterManager", className)}>
         <div id="draggable-top"/>
-        <div id="lens-view" className={cssNames("flex", contentClass)}>
+        <div id="lens-view" className={cssNames("flex column", contentClass)}>
-          {this.isReady && <App/>}
+          {isReady && <App/>}
-          {!this.isReady && <ClusterStatus/>}
+          {!isReady && <ClusterStatus/>}
         </div>
         <ClustersMenu/>
         <BottomBar/>

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

@@ -6,10 +6,9 @@
   text-align: center;
 
   pre {
-    @include custom-scrollbar;
+    @include hidden-scrollbar;
     max-width: 70vw;
     max-height: 40vh;
-    //text-align: left;
   }
 
   .Icon {

src/renderer/index.tsx

@@ -18,14 +18,14 @@ import { Preferences, preferencesRoute } from "./components/+preferences";
 @observer
 class LensApp extends React.Component {
   static async init() {
+    const rootElem = document.getElementById("app");
+    rootElem.classList.toggle("is-mac", isMac);
     await Promise.all([
       userStore.load(),
       workspaceStore.load(),
       clusterStore.load(),
     ]);
-    const elem = document.getElementById("app");
+    render(<LensApp/>, rootElem);
-    elem.classList.toggle("is-mac", isMac);
-    render(<LensApp/>, elem);
   }
 
   render() {