diff --git a/src/renderer/components/+cluster-settings/cluster-icon.tsx b/src/renderer/components/+cluster-settings/cluster-icon.tsx index f1ba44a656..906d0b1626 100644 --- a/src/renderer/components/+cluster-settings/cluster-icon.tsx +++ b/src/renderer/components/+cluster-settings/cluster-icon.tsx @@ -7,6 +7,7 @@ import { Hashicon } from "@emeraldpay/hashicon-react"; import { Cluster } from "../../../main/cluster"; import { cssNames, IClassName } from "../../utils"; import { Badge } from "../badge"; +import { Tooltip, TooltipContent } from "../tooltip"; interface Props extends DOMAttributes { cluster: Cluster; @@ -28,14 +29,18 @@ export class ClusterIcon extends React.Component { render() { const { className: cName, cluster, showErrors, errorClass, options, interactive, isActive, children, ...elemProps } = this.props; - const { isAdmin, eventCount, preferences } = cluster; + const { isAdmin, eventCount, preferences, id: clusterId } = cluster; const { clusterName, icon } = preferences; + const clusterIconId = `cluster-icon-${clusterId}`; const className = cssNames("ClusterIcon flex inline", cName, { interactive: interactive || !!this.props.onClick, active: isActive, }); return ( -
+
+ + {clusterName} + {icon && {clusterName}/} {!icon && } {showErrors && isAdmin && eventCount > 0 && ( diff --git a/src/renderer/components/app.tsx b/src/renderer/components/app.tsx index e4ce14e086..4826ebff13 100755 --- a/src/renderer/components/app.tsx +++ b/src/renderer/components/app.tsx @@ -30,6 +30,7 @@ import { DeploymentScaleDialog } from "./+workloads-deployments/deployment-scale import { CustomResources } from "./+custom-resources/custom-resources"; import { crdRoute } from "./+custom-resources"; import { isAllowedResource } from "../api/rbac"; +import { clusterStore } from "../../common/cluster-store"; @observer export class App extends React.Component { @@ -47,9 +48,13 @@ export class App extends React.Component { - {/* todo: remove */} -

App is running!

}/> - + ( +
+

App is running!

+

Current cluster:

+
{JSON.stringify(clusterStore.activeCluster.toJSON(), null, 2)}
+
+ )}/> diff --git a/src/renderer/components/tooltip/tooltip.tsx b/src/renderer/components/tooltip/tooltip.tsx index 833ff0ce33..4ba738e3ca 100644 --- a/src/renderer/components/tooltip/tooltip.tsx +++ b/src/renderer/components/tooltip/tooltip.tsx @@ -7,8 +7,9 @@ import { createPortal } from "react-dom" import { autobind, cssNames } from "../../utils"; import { Animate } from "../animate"; -// fixme: better positioning + remove "flying effect" +// todo: refactoring // todo: add flag to show visible tooltip by default (until mouse-over the target) +// fixme: better positioning + remove "flying effect" export interface TooltipProps { htmlFor: string;