1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Add warning when no detected provider

Signed-off-by: Juho Heikka <juho.heikka@gmail.com>
This commit is contained in:
Juho Heikka 2023-06-01 15:10:43 +03:00
parent adeb7339d3
commit dbb09b374a
4 changed files with 36 additions and 35 deletions

View File

@ -1,21 +0,0 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { getInjectable } from "@ogre-tools/injectable";
import apiBaseInjectable from "../../api-base.injectable";
import type { PrometheusDetails } from "../../../../main/cluster/prometheus-handler/prometheus-handler";
export type RequestPrometheusDetails = () => Promise<PrometheusDetails>;
const requestPrometheusDetailsInjectable = getInjectable({
id: "request-prometheus-details",
instantiate: (di): RequestPrometheusDetails => {
const apiBase = di.inject(apiBaseInjectable);
return () => apiBase.get("/prometheus/details");
},
});
export default requestPrometheusDetailsInjectable;

View File

@ -0,0 +1,18 @@
/**
* Copyright (c) OpenLens Authors. All rights reserved.
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import React from "react";
import { SubTitle } from "../layout/sub-title";
import { Icon } from "../icon";
export const NoPrometheusProviderDetected = () => (
<section>
<SubTitle title="Auto detected prometheus details" />
<div className="flex gaps align-center">
<Icon material="error_outline" />
<div>Could not detect any Prometheus provider.</div>
</div>
</section>
);

View File

@ -16,18 +16,18 @@ interface PrometheusDetailsProps {
} }
export const PrometheusDetails = ({ providerName, path }: PrometheusDetailsProps) => ( export const PrometheusDetails = ({ providerName, path }: PrometheusDetailsProps) => (
<section> <section>
<SubTitle title="Auto detected prometheus details" /> <SubTitle title="Auto detected Prometheus details" />
<div className="flex gaps align-center"> <div className="flex gaps">
<div> <div>
Prometheus provider name Provider:
</div> </div>
<div> <div>
{providerName} {providerName}
</div> </div>
</div> </div>
<div className="flex gaps align-center"> <div className="flex gaps">
<div> <div>
Prometheus path Path:
</div> </div>
<div> <div>
{path} {path}

View File

@ -21,6 +21,7 @@ import type { PrometheusDetailsData } from "../../../common/k8s-api/endpoints/me
import { loggerInjectionToken } from "@k8slens/logger"; import { loggerInjectionToken } from "@k8slens/logger";
import type { Logger } from "@k8slens/logger"; import type { Logger } from "@k8slens/logger";
import { PrometheusDetails } from "./prometheus-details"; import { PrometheusDetails } from "./prometheus-details";
import { NoPrometheusProviderDetected } from "./no-prometheus-provider-detectec";
export interface ClusterPrometheusSettingProps { export interface ClusterPrometheusSettingProps {
cluster: Cluster; cluster: Cluster;
@ -156,7 +157,7 @@ class NonInjectedClusterPrometheusSetting extends React.Component<ClusterPrometh
}; };
render() { render() {
const showPrometheusDetailsResult = this.selectedOption === autoDetectPrometheus;
return ( return (
<> <>
@ -188,18 +189,21 @@ class NonInjectedClusterPrometheusSetting extends React.Component<ClusterPrometh
) )
} }
</section> </section>
{this.prometheusDetails?.details && this.prometheusDetails?.type === "success" /*&& this.selectedOption === autoDetectPrometheus */ && ( {showPrometheusDetailsResult && (
<> <>
<hr /> <hr />
<PrometheusDetails {this.prometheusDetails?.type === "success" && this.prometheusDetails.details && (
providerName={this.prometheusDetails.details.provider.name} <PrometheusDetails
path={this.prometheusDetails.details.prometheusPath} providerName={this.prometheusDetails.details.provider.name}
/> path={this.prometheusDetails.details.prometheusPath}
/>
)}
{this.prometheusDetails?.type === "error" && (
<NoPrometheusProviderDetected />
)}
</> </>
)} )}
{this.prometheusDetails?.type === "error" && (
<div>auto detection did not find a prometheus provider</div>
)}
{this.canEditPrometheusPath && ( {this.canEditPrometheusPath && (
<> <>
<hr /> <hr />