added dummy react files for replacing vue-components

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

package.json

@@ -12,7 +12,7 @@
   },
   "scripts": {
     "dev": "concurrently -k \"yarn dev-run -C\" \"yarn dev:main\" \"yarn dev:renderer\"",
-    "dev-run": "env DEBUG=true nodemon --watch out/main.* --exec \"electron --inspect .\" $@",
+    "dev-run": "nodemon --watch out/main.* --exec \"electron --inspect .\" $@",
     "dev:main": "env DEBUG=true yarn compile:main --watch $@",
     "dev:renderer": "env DEBUG=true yarn compile:renderer --watch $@",
     "compile": "concurrently \"yarn i18n:compile\" \"yarn compile:main -p\" \"yarn compile:renderer -p\"",

src/common/base-store.ts

@@ -18,7 +18,6 @@ export interface BaseStoreParams<T = any> {
 export class BaseStore<T = any> extends Singleton {
   protected storeConfig: Config<T>;
   protected syncDisposers: Function[] = [];
-  public whenLoaded = when(() => this.isLoaded);
 
   @observable isLoaded = false;
   @observable protected data: T;
@@ -26,7 +25,7 @@ export class BaseStore<T = any> extends Singleton {
   protected constructor(protected params: BaseStoreParams) {
     super();
     this.params = {
-      autoLoad: !app, // disabled in main process due delayed configuration
+      autoLoad: false,
       syncEnabled: true,
       ...params,
     }
@@ -50,7 +49,7 @@ export class BaseStore<T = any> extends Singleton {
       await this.load();
     }
     if (this.params.syncEnabled) {
-      await this.whenLoaded;
+      await when(() => this.isLoaded);
       this.enableSync();
     }
   }

src/main/index.ts

@@ -3,7 +3,7 @@
 import "../common/system-ca"
 import "../common/prometheus-providers"
 import { app, dialog } from "electron"
-import { appName, appProto, isDevelopment, isMac, staticDir, staticProto } from "../common/vars";
+import { appName, appProto, isMac, staticDir, staticProto } from "../common/vars";
 import path from "path"
 import { format as formatUrl } from "url"
 import initMenu from "./menu"

src/renderer/_vue/index.js

@@ -1,3 +1,5 @@
+// todo: remove, currently not used in runtime
+
 import "../../common/system-ca"
 import "./assets/css/app.scss"
 import { PromiseIpc } from 'electron-promise-ipc'
@@ -6,9 +8,6 @@ import BootstrapVue from 'bootstrap-vue'
 import App from './App'
 import router from './router'
 import store from './store'
-import { userStore } from "../../common/user-store"
-import { workspaceStore } from "../../common/workspace-store"
-import { clusterStore } from "../../common/cluster-store"
 
 const promiseIpc = new PromiseIpc({maxTimeoutMs: 6000});
 
@@ -26,12 +25,6 @@ Vue.mixin({
 })
 
 setTimeout(async () => {
-  await Promise.all([
-    userStore.whenLoaded,
-    workspaceStore.whenLoaded,
-    clusterStore.whenLoaded,
-  ]);
-
   await store.dispatch('init')
   new Vue({
     components: {App},

src/renderer/components/+clusters/add-cluster.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+
+interface Props {
+}
+
+export class AddCluster extends React.Component {
+  render() {
+    return "";
+  }
+}

src/renderer/components/+clusters/cluster-settings.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+
+interface Props {
+}
+
+export class ClusterSettings extends React.Component {
+  render() {
+    return "";
+  }
+}

src/renderer/components/+clusters/clusters-menu.tsx

@@ -0,0 +1,10 @@
+import React from "react";
+
+interface Props {
+}
+
+export class ClusterSettings extends React.Component {
+  render() {
+    return "";
+  }
+}

src/renderer/components/+clusters/clusters.tsx

@@ -0,0 +1,26 @@
+import React from "react";
+import { userStore } from "../../../common/user-store";
+import { workspaceStore } from "../../../common/workspace-store";
+import { clusterStore } from "../../../common/cluster-store";
+
+interface Props {
+}
+
+export class Clusters extends React.Component {
+  static async init(){
+    // todo: move to App.init()
+    await Promise.all([
+      userStore.load(),
+      workspaceStore.load(),
+      clusterStore.load(),
+    ]);
+  }
+
+  render() {
+    return (
+      <div className="Clusters">
+        Clusters page
+      </div>
+    );
+  }
+}

src/renderer/components/+clusters/index.tsx

@@ -0,0 +1 @@
+export * from "./clusters"

src/renderer/index.tsx

@@ -1,19 +1,11 @@
+import React from "react";
+import ReactDOM from "react-dom";
 import "../common/system-ca"
-import { userStore } from "../common/user-store";
+import { Clusters } from "./components/+clusters";
-import { workspaceStore } from "../common/workspace-store";
-import { clusterStore } from "../common/cluster-store";
-// import { App } from "./components/app";
 
 async function render() {
-  await Promise.all([
+  await Clusters.init();
-    userStore.whenLoaded,
+  ReactDOM.render(<Clusters/>, document.getElementById("app"),)
-    workspaceStore.whenLoaded,
-    clusterStore.whenLoaded,
-  ]);
-
-  // App.init();
-  document.getElementById("app").innerHTML = "<p>Hello from renderer!</p>"
 }
 
-// run
+window.addEventListener("load", render);
-render();