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

Saving input fields on blur

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/renderer/components/+cluster-settings/components/cluster-home-dir-setting.tsx
View File

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

10
src/renderer/components/+cluster-settings/components/cluster-name-setting.tsx
View File

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

8
src/renderer/components/+cluster-settings/components/cluster-prometheus-setting.tsx
View File

@ -1,4 +1,5 @@
import React from "react"; import React from "react";
import merge from "lodash/merge";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { prometheusProviders } from "../../../../common/prometheus-providers"; import { prometheusProviders } from "../../../../common/prometheus-providers";
import { Cluster } from "../../../../main/cluster"; import { Cluster } from "../../../../main/cluster";
@ -28,7 +29,12 @@ export class ClusterPrometheusSetting extends React.Component<Props> {
<Select <Select
value={this.props.cluster.preferences.prometheusProvider?.type || ""} value={this.props.cluster.preferences.prometheusProvider?.type || ""}
onChange={({value}) => { onChange={({value}) => {
this.props.cluster.preferences.prometheusProvider.type = value const provider = {
prometheusProvider: {
type: value
}
}
merge(this.props.cluster.preferences, provider);
}} }}
options={options} options={options}
/> />

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

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