-
+
+ {this.isReady &&
}
+ {!this.isReady &&
}
diff --git a/src/renderer/components/cluster-manager/cluster-status.scss b/src/renderer/components/cluster-manager/cluster-status.scss
index ad1fc1d11e..f60b79d8ac 100644
--- a/src/renderer/components/cluster-manager/cluster-status.scss
+++ b/src/renderer/components/cluster-manager/cluster-status.scss
@@ -1,3 +1,19 @@
.ClusterStatus {
+ --flex-gap: #{$padding * 2};
+ min-width: 350px;
+ margin: auto;
+ text-align: center;
+
+ pre {
+ @include custom-scrollbar;
+ max-width: 70vw;
+ max-height: 40vh;
+ //text-align: left;
+ }
+
+ .Icon {
+ --size: 70px;
+ margin: auto;
+ }
}
\ No newline at end of file
diff --git a/src/renderer/components/cluster-manager/cluster-status.tsx b/src/renderer/components/cluster-manager/cluster-status.tsx
index 6863d855ba..d1d5239f4c 100644
--- a/src/renderer/components/cluster-manager/cluster-status.tsx
+++ b/src/renderer/components/cluster-manager/cluster-status.tsx
@@ -1,29 +1,32 @@
-import "./cluster-manager.scss"
-import type { KubeAuthProxyResponse } from "../../../main/kube-auth-proxy";
-import { Cluster, ClusterIpcEvent } from "../../../main/cluster";
+import "./cluster-status.scss"
import React from "react";
+import type { KubeAuthProxyResponse } from "../../../main/kube-auth-proxy";
+import { ClusterIpcChannel } from "../../../main/cluster";
+import { invokeIpc } from "../../../common/ipc";
+import { clusterStore } from "../../../common/cluster-store";
import { ipcRenderer } from "electron";
-import { computed, observable } from "mobx";
+import { observable } from "mobx";
import { observer } from "mobx-react";
import { Icon } from "../icon";
import { Button } from "../button";
-import { Trans } from "@lingui/macro";
-
-interface Props {
- cluster: Cluster;
-}
+import { cssNames } from "../../utils";
@observer
-export class ClusterStatus extends React.Component
{
- @observable authProxyOutput = "Connecting ...\n"
+export class ClusterStatus extends React.Component {
+ @observable authOutput: string[] = [];
- @computed get clusterId() {
- return this.props.cluster.id;
+ get cluster() {
+ return clusterStore.activeCluster;
+ }
+
+ get clusterId() {
+ return clusterStore.activeClusterId;
}
componentDidMount() {
- ipcRenderer.on(`kube-auth:${this.clusterId}`, (evt, authResponse: KubeAuthProxyResponse) => {
- this.authProxyOutput += authResponse.data;
+ this.authOutput = ["Connecting ...\n"];
+ ipcRenderer.on(`kube-auth:${this.clusterId}`, (evt, { data, stream }: KubeAuthProxyResponse) => {
+ this.authOutput.push(`[${stream}]: ${data}`);
})
}
@@ -31,22 +34,32 @@ export class ClusterStatus extends React.Component {
ipcRenderer.removeAllListeners(`kube-auth:${this.clusterId}`);
}
- reconnectCluster = () => {
- ipcRenderer.send(ClusterIpcEvent.RECONNECT, this.clusterId);
+ reconnect = () => {
+ this.authOutput = ["Reconnecting ...\n"];
+ invokeIpc(ClusterIpcChannel.RECONNECT, this.clusterId);
}
render() {
- const { authProxyOutput } = this;
- const { contextName, online } = this.props.cluster;
+ const { authOutput, cluster } = this;
+ const isError = cluster?.accessible === false;
return (
-
-
-
{contextName}
-
{authProxyOutput}
-
Reconnect}
- onClick={this.reconnectCluster}
- />
+
+ {!isError &&
}
+ {isError &&
}
+
{cluster?.contextName}
+
+ {authOutput.map((data, index) => {
+ const error = data.startsWith("[stderr]");
+ return {data}
+ })}
+
+ {isError && (
+
+ )}
)
}
diff --git a/src/renderer/components/cluster-manager/clusters-menu.tsx b/src/renderer/components/cluster-manager/clusters-menu.tsx
index c3c66b697b..132f39e5cd 100644
--- a/src/renderer/components/cluster-manager/clusters-menu.tsx
+++ b/src/renderer/components/cluster-manager/clusters-menu.tsx
@@ -51,7 +51,7 @@ export class ClustersMenu extends React.Component {
label: _i18n._(t`Settings`),
click: () => navigate(clusterSettingsURL())
}));
- if (cluster.initialized) {
+ if (cluster.online) {
menu.append(new MenuItem({
label: _i18n._(t`Disconnect`),
click: () => {
diff --git a/src/renderer/index.tsx b/src/renderer/index.tsx
index 86c24632d1..c68cc004ac 100644
--- a/src/renderer/index.tsx
+++ b/src/renderer/index.tsx
@@ -10,7 +10,6 @@ import { I18nProvider } from "@lingui/react";
import { browserHistory } from "./navigation";
import { isMac } from "../common/vars";
import { _i18n } from "./i18n";
-import { App } from "./components/app";
import { ClusterManager } from "./components/cluster-manager";
import { ErrorBoundary } from "./components/error-boundary";
import { WhatsNew, whatsNewRoute } from "./components/+whats-new";
@@ -19,14 +18,14 @@ import { Preferences, preferencesRoute } from "./components/+preferences";
@observer
class LensApp extends React.Component {
static async init() {
- App.rootElem.classList.toggle("is-mac", isMac);
await Promise.all([
userStore.load(),
workspaceStore.load(),
clusterStore.load(),
]);
- await App.init();
- render( , App.rootElem);
+ const elem = document.getElementById("app");
+ elem.classList.toggle("is-mac", isMac);
+ render( , elem);
}
render() {