From 7356abc762bd899ff7ce8fdd9987dd44c98d37a6 Mon Sep 17 00:00:00 2001
From: Roman <ixrock@gmail.com>
Date: Mon, 20 Jul 2020 19:14:27 +0300
Subject: [PATCH] cluster-status -- part 3

Signed-off-by: Roman <ixrock@gmail.com>
---
 src/main/cluster-manager.ts                      |  1 +
 .../cluster-manager/cluster-manager.tsx          | 16 ++++++++++------
 .../cluster-manager/cluster-status.scss          |  3 +--
 src/renderer/index.tsx                           |  6 +++---
 4 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/main/cluster-manager.ts b/src/main/cluster-manager.ts
index f569012c3a..a4e8057bef 100644
--- a/src/main/cluster-manager.ts
+++ b/src/main/cluster-manager.ts
@@ -33,6 +33,7 @@ export class ClusterManager {
         this.activeClusterId = activeCluster.id;
         activeCluster.bindEvents();
         activeCluster.refreshStatus();
+        activeCluster.pushState();
       }
     }, {
       fireImmediately: true
diff --git a/src/renderer/components/cluster-manager/cluster-manager.tsx b/src/renderer/components/cluster-manager/cluster-manager.tsx
index 50bff19daa..09e89dc3a2 100644
--- a/src/renderer/components/cluster-manager/cluster-manager.tsx
+++ b/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)}>
-          {this.isReady && <App/>}
-          {!this.isReady && <ClusterStatus/>}
+        <div id="lens-view" className={cssNames("flex column", contentClass)}>
+          {isReady && <App/>}
+          {!isReady && <ClusterStatus/>}
         </div>
         <ClustersMenu/>
         <BottomBar/>
diff --git a/src/renderer/components/cluster-manager/cluster-status.scss b/src/renderer/components/cluster-manager/cluster-status.scss
index f60b79d8ac..59a0103db8 100644
--- a/src/renderer/components/cluster-manager/cluster-status.scss
+++ b/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 {
diff --git a/src/renderer/index.tsx b/src/renderer/index.tsx
index c68cc004ac..38486fd368 100644
--- a/src/renderer/index.tsx
+++ b/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");
-    elem.classList.toggle("is-mac", isMac);
-    render(<LensApp/>, elem);
+    render(<LensApp/>, rootElem);
   }
 
   render() {