diff --git a/src/renderer/browser-check.tsx b/src/renderer/browser-check.tsx deleted file mode 100644 index ce6c9ecad6..0000000000 --- a/src/renderer/browser-check.tsx +++ /dev/null @@ -1,20 +0,0 @@ -import React from "react"; -import { Notifications } from "./components/notifications"; -import { Trans } from "@lingui/macro"; - -export function browserCheck() { - const ua = window.navigator.userAgent - const msie = ua.indexOf('MSIE ') // IE < 11 - const trident = ua.indexOf('Trident/') // IE 11 - const edge = ua.indexOf('Edge') // Edge - if (msie > 0 || trident > 0 || edge > 0) { - Notifications.info( -

- - Your browser does not support all Lens features. {" "} - Please consider using another browser. - -

- ) - } -} \ No newline at end of file diff --git a/src/renderer/components/+cluster-settings/cluster-settings.scss b/src/renderer/components/+cluster-settings/cluster-settings.scss index e02a4da5f8..acb59ea0ac 100644 --- a/src/renderer/components/+cluster-settings/cluster-settings.scss +++ b/src/renderer/components/+cluster-settings/cluster-settings.scss @@ -57,6 +57,10 @@ font-size: smaller; opacity: 0.8; } + + p + p, .hint + p { + padding-top: $padding; + } } .status-table { @@ -79,7 +83,13 @@ } } - .Input,.Select { + .Input, .Select { margin-top: 10px; } + + .Select { + &__control { + box-shadow: 0 0 0 1px $borderFaintColor; + } + } } \ No newline at end of file diff --git a/src/renderer/components/+cluster-settings/components/cluster-prometheus-setting.tsx b/src/renderer/components/+cluster-settings/components/cluster-prometheus-setting.tsx index e4f81bb18a..729090629d 100644 --- a/src/renderer/components/+cluster-settings/components/cluster-prometheus-setting.tsx +++ b/src/renderer/components/+cluster-settings/components/cluster-prometheus-setting.tsx @@ -1,10 +1,11 @@ import React from "react"; -import merge from "lodash/merge"; import { observer } from "mobx-react"; import { prometheusProviders } from "../../../../common/prometheus-providers"; import { Cluster } from "../../../../main/cluster"; import { SubTitle } from "../../layout/sub-title"; import { Select, SelectOption } from "../../select"; +import { Input } from "../../input"; +import { observable, computed } from "mobx"; const options: SelectOption[] = [ { value: "", label: "Auto detect" }, @@ -17,6 +18,52 @@ interface Props { @observer export class ClusterPrometheusSetting extends React.Component { + @observable path = ""; + @observable provider = ""; + + @computed get canEditPrometheusPath() { + if (this.provider === "" || this.provider === "lens") return false; + return true; + } + + componentDidMount() { + const { prometheus, prometheusProvider } = this.props.cluster.preferences; + if (prometheus) { + const prefix = prometheus.prefix || ""; + this.path = `${prometheus.namespace}/${prometheus.service}:${prometheus.port}${prefix}`; + } + if (prometheusProvider) { + this.provider = prometheusProvider.type; + } + } + + parsePrometheusPath = () => { + if (!this.provider || !this.path) { + return null; + } + const parsed = this.path.split(/\/|:/, 3); + const apiPrefix = this.path.substring(parsed.join("/").length); + if (!parsed[0] || !parsed[1] || !parsed[2]) { + return null; + } + return { + namespace: parsed[0], + service: parsed[1], + port: parseInt(parsed[2]), + prefix: apiPrefix + } + } + + onSaveProvider = () => { + this.props.cluster.preferences.prometheusProvider = this.provider ? + { type: this.provider } : + null; + } + + onSavePath = () => { + this.props.cluster.preferences.prometheus = this.parsePrometheusPath(); + }; + render() { return ( <> @@ -26,18 +73,32 @@ export class ClusterPrometheusSetting extends React.Component { guide{" "} for possible configuration changes.

+

Prometheus installation method.

this.path = value} + onBlur={this.onSavePath} + placeholder="/:" + /> + + An address to an existing Prometheus installation{" "} + ({'/:'}). Lens tries to auto-detect address if left empty. + + + )} ); } diff --git a/src/renderer/components/select/select.scss b/src/renderer/components/select/select.scss index 20078215ba..1b5a081362 100644 --- a/src/renderer/components/select/select.scss +++ b/src/renderer/components/select/select.scss @@ -31,7 +31,7 @@ html { border-radius: $radius; background: transparent; min-height: 0; - box-shadow: 0 0 0 1px $borderFaintColor; + box-shadow: 0 0 0 1px $halfGray; &--is-focused { box-shadow: 0 0 0 2px $primary;