hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

ClusterProxySetting refactoring

Browse Source 
Signed-off-by: alexfront <alex.andreev.email@gmail.com>
This commit is contained in:
alexfront 2020-08-05 17:25:39 +03:00
parent f533331864
commit dbce47bef4
1 changed files with 28 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
src/renderer/components/+cluster-settings/components/cluster-proxy-setting.tsx
View File

@ -1,14 +1,11 @@
import React from "react"; import React from "react";
import { Cluster } from "../../../../main/cluster"; import throttle from "lodash/throttle";
import { Input } from "../../input";
import { Spinner } from "../../spinner";
import { clusterStore } from "../../../../common/cluster-store"
import { Icon } from "../../icon";
import { Tooltip, TooltipPosition } from "../../tooltip";
import { autobind } from "../../../utils";
import { TextInputStatus } from "./statuses"
import { observable } from "mobx"; import { observable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { Cluster } from "../../../../main/cluster";
import { Input } from "../../input";
import { isUrl } from "../../input/input.validators";
import { SubTitle } from "../../layout/sub-title";
interface Props { interface Props {
cluster: Cluster; cluster: Cluster;
@ -17,89 +14,29 @@ interface Props {
@observer @observer
export class ClusterProxySetting extends React.Component<Props> { export class ClusterProxySetting extends React.Component<Props> {
@observable proxy = this.props.cluster.preferences.httpsProxy || ""; @observable proxy = this.props.cluster.preferences.httpsProxy || "";
@observable status = TextInputStatus.CLEAN;
@observable errorText?: string; save = throttle((value: string) => {
this.props.cluster.preferences.httpsProxy = value;
}, 500);
onChange = (value: string) => {
this.proxy = value;
this.save(value);
}
render() { render() {
return <> return (
<h4>HTTPS Proxy</h4> <>
<p>HTTPS Proxy server. Used for communicating with Kubernetes API.</p> <SubTitle title="HTTP Proxy"/>
<p>HTTP Proxy server. Used for communicating with Kubernetes API.</p>
<Input <Input
theme="round-black" theme="round-black"
className="box grow"
value={this.proxy} value={this.proxy}
onSubmit={this.updateClusterProxy} onChange={this.onChange}
onChange={this.changeProxyState} placeholder="http://<address>:<port>"
iconRight={this.getIconRight()} validators={isUrl}
placeholder="https://<address>:<port>"
/> />
</>; </>
} );
@autobind()
changeProxyState(proxy: string, _e: React.ChangeEvent) {
if (this.status === TextInputStatus.UPDATING) {
console.log("prevent changing cluster proxy while updating");
return;
}
this.status = this.proxyDiffers(proxy);
this.proxy = proxy;
}
proxyDiffers(proxy: string): TextInputStatus {
const { httpsProxy = "" } = this.props.cluster.preferences;
return proxy === httpsProxy ? TextInputStatus.CLEAN : TextInputStatus.DIRTY;
}
getIconRight(): React.ReactNode {
switch (this.status) {
case TextInputStatus.CLEAN:
return null;
case TextInputStatus.DIRTY:
return <Icon size="16px" material="fiber_manual_record"/>;
case TextInputStatus.UPDATED:
return <Icon size="16px" className="updated" material="done"/>;
case TextInputStatus.UPDATING:
return <Spinner />;
case TextInputStatus.ERROR:
return <Icon id="cluster-proxy-setting-error-icon" size="16px" material="error">
<Tooltip targetId="cluster-proxy-setting-error-icon" position={TooltipPosition.TOP}>
{this.errorText}
</Tooltip>
</Icon>
}
}
@autobind()
updateClusterProxy(proxy: string) {
if (this.proxyDiffers(proxy) !== TextInputStatus.DIRTY) {
return;
}
try {
const url = new URL(proxy);
if (url.protocol !== "https") {
this.status = TextInputStatus.ERROR
this.errorText= `Proxy's protocol should be "https"`
return
}
if (url.port === "") {
this.status = TextInputStatus.ERROR
this.errorText= "Proxy should include a port"
return
}
} catch (e) {
this.status = TextInputStatus.ERROR
this.errorText= "Invalid URL"
return
}
this.status = TextInputStatus.UPDATING
this.props.cluster.preferences.httpsProxy = proxy;
this.proxy = proxy;
this.status = TextInputStatus.UPDATED
} }
} }