diff --git a/src/renderer/components/+landing-page/landing-page.tsx b/src/renderer/components/+landing-page/landing-page.tsx index ea0b24bb87..a6925a1f0b 100644 --- a/src/renderer/components/+landing-page/landing-page.tsx +++ b/src/renderer/components/+landing-page/landing-page.tsx @@ -1,40 +1,51 @@ import "./landing-page.scss"; import React from "react"; -import { observable } from "mobx"; +import { observable, autorun } from "mobx"; import { observer } from "mobx-react"; import { clusterStore } from "../../../common/cluster-store"; -import { workspaceStore } from "../../../common/workspace-store"; - +import { Workspace, workspaceStore } from "../../../common/workspace-store"; +import { PageLayout } from "../layout/page-layout" +import { WorkspaceOverview } from "./workspace-overview" @observer export class LandingPage extends React.Component { @observable showHint = true; + @observable workspace: Workspace; + + currentWorkspace = autorun(() => { this.workspace = workspaceStore.currentWorkspace; }) render() { const clusters = clusterStore.getByWorkspaceId(workspaceStore.currentWorkspaceId); const noClustersInScope = !clusters.length; const showStartupHint = this.showHint && noClustersInScope; + const header =

{`Workspace: ${this.workspace?.name}`}

; + return ( -
- {showStartupHint && ( -
this.showHint = false}> -

This is the quick launch menu.

-

- Associate clusters and choose the ones you want to access via quick launch menu by clicking the + button. -

-
- )} - {noClustersInScope && ( -
-

- Welcome! -

-

- Get started by associating one or more clusters to Lens. -

-
- )} -
+ +
+ {showStartupHint && ( +
this.showHint = false}> +

This is the quick launch menu.

+

+ Click the + button to add clusters and choose the ones you want to access via quick launch menu. +

+
+ )} + {!noClustersInScope && ( + + )} + {noClustersInScope && ( +
+

+ Welcome! +

+

+ Get started by adding one or more clusters to this workspace. +

+
+ )} +
+
); } } diff --git a/src/renderer/components/+landing-page/workspace-overview.tsx b/src/renderer/components/+landing-page/workspace-overview.tsx new file mode 100644 index 0000000000..8e6e9a7ecb --- /dev/null +++ b/src/renderer/components/+landing-page/workspace-overview.tsx @@ -0,0 +1,57 @@ +import React, { Component } from "react"; +import { Workspace } from "../../../common/workspace-store"; +import { clusterStore } from "../../../common/cluster-store"; +import { Cluster } from "../../../main/cluster"; +import { observable, autorun } from "mobx"; +import { observer } from "mobx-react"; +import { Drawer, DrawerItem, DrawerTitle } from "../drawer"; +import { autobind, stopPropagation } from "../../utils"; +import { MarkdownViewer } from "../markdown-viewer"; +import { Spinner } from "../spinner"; +import { Button } from "../button"; +import { Select, SelectOption } from "../select"; +import { Badge } from "../badge"; + +interface Props { + workspace: Workspace; +} + +@observer +export class WorkspaceOverview extends Component { + + renderClusters() { + const { workspace } = this.props; + const clusters = clusterStore.getByWorkspaceId(workspace.id); + return
+ {clusters.map(cluster =>
{cluster.contextName}
)} +
+ } + + render() { + const { workspace } = this.props; + + return ( + + + {workspace.description} + + + {workspace.id} + + + {workspace.ownerRef} + + + {workspace.enabled} + + + {this.renderClusters()} + + ); + } +}