PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Added loading and disabled the button while searching for server

Browse source 
Signed-off-by: Jaiwanth <jaiwanth2011@gmail.com>
This commit is contained in:
Jaiwanth 2021-02-10 10:15:24 +05:30
parent fb499e54b3
commit 3fc6d73158
1 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/components/views/dialogs/TextInputDialog.js
View file

@ -18,6 +18,7 @@ import React, {createRef} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import * as sdk from '../../../index'; import * as sdk from '../../../index';
import Field from "../elements/Field"; import Field from "../elements/Field";
import { _t } from '../../../languageHandler';
export default class TextInputDialog extends React.Component { export default class TextInputDialog extends React.Component {
static propTypes = { static propTypes = {
@ -29,6 +30,7 @@ export default class TextInputDialog extends React.Component {
value: PropTypes.string, value: PropTypes.string,
placeholder: PropTypes.string, placeholder: PropTypes.string,
button: PropTypes.string, button: PropTypes.string,
busyMessage: PropTypes.string,
focus: PropTypes.bool, focus: PropTypes.bool,
onFinished: PropTypes.func.isRequired, onFinished: PropTypes.func.isRequired,
hasCancel: PropTypes.bool, hasCancel: PropTypes.bool,
@ -40,6 +42,7 @@ export default class TextInputDialog extends React.Component {
title: "", title: "",
value: "", value: "",
description: "", description: "",
busyMessage: "Loading...",
focus: true, focus: true,
hasCancel: true, hasCancel: true,
}; };
@ -51,6 +54,7 @@ export default class TextInputDialog extends React.Component {
this.state = { this.state = {
value: this.props.value, value: this.props.value,
busy: false,
valid: false, valid: false,
}; };
} }
@ -66,11 +70,13 @@ export default class TextInputDialog extends React.Component {
onOk = async ev => { onOk = async ev => {
ev.preventDefault(); ev.preventDefault();
if (this.props.validator) { if (this.props.validator) {
this.setState({ busy: true });
await this._field.current.validate({ allowEmpty: false }); await this._field.current.validate({ allowEmpty: false });
if (!this._field.current.state.valid) { if (!this._field.current.state.valid) {
this._field.current.focus(); this._field.current.focus();
this._field.current.validate({ allowEmpty: false, focused: true }); this._field.current.validate({ allowEmpty: false, focused: true });
this.setState({ busy: false });
return; return;
} }
} }
@ -125,7 +131,8 @@ export default class TextInputDialog extends React.Component {
</div> </div>
</form> </form>
<DialogButtons <DialogButtons
primaryButton={this.props.button} primaryButton={this.state.busy ? _t(this.props.busyMessage) : this.props.button}
disabled={this.state.busy}
onPrimaryButtonClick={this.onOk} onPrimaryButtonClick={this.onOk}
onCancel={this.onCancel} onCancel={this.onCancel}
hasCancel={this.props.hasCancel} hasCancel={this.props.hasCancel}