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

Saving input fields on blur

Signed-off-by: alexfront <alex.andreev.email@gmail.com>
This commit is contained in:
alexfront 2020-08-07 15:48:25 +03:00
parent 5a014439a0
commit 8629b68c50
4 changed files with 19 additions and 17 deletions

View File

@ -1,5 +1,4 @@
import React from "react";
import throttle from "lodash/throttle";
import { observable } from "mobx";
import { observer } from "mobx-react";
import { Cluster } from "../../../../main/cluster";
@ -14,13 +13,12 @@ interface Props {
export class ClusterHomeDirSetting extends React.Component<Props> {
@observable directory = this.props.cluster.preferences.terminalCWD || "";
save = throttle((value: string) => {
this.props.cluster.preferences.terminalCWD = value;
}, 500);
save = () => {
this.props.cluster.preferences.terminalCWD = this.directory;
};
onChange = (value: string) => {
this.directory = value;
this.save(value);
}
render() {
@ -32,6 +30,7 @@ export class ClusterHomeDirSetting extends React.Component<Props> {
theme="round-black"
value={this.directory}
onChange={this.onChange}
onBlur={this.save}
placeholder="$HOME"
/>
<span className="hint">

View File

@ -5,7 +5,6 @@ import { observable } from "mobx";
import { observer } from "mobx-react";
import { SubTitle } from "../../layout/sub-title";
import { isRequired } from "../../input/input.validators";
import throttle from "lodash/throttle";
interface Props {
cluster: Cluster;
@ -15,14 +14,12 @@ interface Props {
export class ClusterNameSetting extends React.Component<Props> {
@observable name = this.props.cluster.preferences.clusterName || "";
save = throttle((value: string) => {
if (!value) return;
this.props.cluster.preferences.clusterName = value;
}, 500);
save = () => {
this.props.cluster.preferences.clusterName = this.name;
};
onChange = (value: string) => {
this.name = value;
this.save(value);
}
render() {
@ -35,6 +32,7 @@ export class ClusterNameSetting extends React.Component<Props> {
validators={isRequired}
value={this.name}
onChange={this.onChange}
onBlur={this.save}
/>
</>
);

View File

@ -1,4 +1,5 @@
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";
@ -28,7 +29,12 @@ export class ClusterPrometheusSetting extends React.Component<Props> {
<Select
value={this.props.cluster.preferences.prometheusProvider?.type || ""}
onChange={({value}) => {
this.props.cluster.preferences.prometheusProvider.type = value
const provider = {
prometheusProvider: {
type: value
}
}
merge(this.props.cluster.preferences, provider);
}}
options={options}
/>

View File

@ -1,5 +1,4 @@
import React from "react";
import throttle from "lodash/throttle";
import { observable } from "mobx";
import { observer } from "mobx-react";
import { Cluster } from "../../../../main/cluster";
@ -15,13 +14,12 @@ interface Props {
export class ClusterProxySetting extends React.Component<Props> {
@observable proxy = this.props.cluster.preferences.httpsProxy || "";
save = throttle((value: string) => {
this.props.cluster.preferences.httpsProxy = value;
}, 500);
save = () => {
this.props.cluster.preferences.httpsProxy = this.proxy;
};
onChange = (value: string) => {
this.proxy = value;
this.save(value);
}
render() {
@ -33,6 +31,7 @@ export class ClusterProxySetting extends React.Component<Props> {
theme="round-black"
value={this.proxy}
onChange={this.onChange}
onBlur={this.save}
placeholder="http://<address>:<port>"
validators={isUrl}
/>