Fix login page breaking on wrong password

Fixes https://github.com/vector-im/riot-web/issues/9942
This commit is contained in:
David Baker 2019-06-04 13:51:33 +01:00
parent 1618813652
commit 9897e99195

View file

@ -83,6 +83,7 @@ module.exports = React.createClass({
busy: false, busy: false,
errorText: null, errorText: null,
loginIncorrect: false, loginIncorrect: false,
canTryLogin: true, // can we attempt to log in or are there validation errors?
// used for preserving form values when changing homeserver // used for preserving form values when changing homeserver
username: "", username: "",
@ -135,13 +136,9 @@ module.exports = React.createClass({
return this.state.busy || this.props.busy; return this.state.busy || this.props.busy;
}, },
hasError: function() {
return this.state.errorText;
},
onPasswordLogin: function(username, phoneCountry, phoneNumber, password) { onPasswordLogin: function(username, phoneCountry, phoneNumber, password) {
// Prevent people from submitting their password when something isn't right. // Prevent people from submitting their password when something isn't right.
if (this.isBusy() || this.hasError()) return; if (this.isBusy() || !this.state.canTryLogin) return;
this.setState({ this.setState({
busy: true, busy: true,
@ -236,6 +233,7 @@ module.exports = React.createClass({
username: username, username: username,
busy: doWellknownLookup, // unset later by the result of onServerConfigChange busy: doWellknownLookup, // unset later by the result of onServerConfigChange
errorText: null, errorText: null,
canTryLogin: true,
}); });
if (doWellknownLookup) { if (doWellknownLookup) {
const serverName = username.split(':').slice(1).join(':'); const serverName = username.split(':').slice(1).join(':');
@ -249,7 +247,7 @@ module.exports = React.createClass({
if (e.translatedMessage) { if (e.translatedMessage) {
message = e.translatedMessage; message = e.translatedMessage;
} }
this.setState({errorText: message, busy: false}); this.setState({errorText: message, busy: false, canTryLogin: false});
} }
} }
}, },
@ -265,14 +263,16 @@ module.exports = React.createClass({
}, },
onPhoneNumberBlur: function(phoneNumber) { onPhoneNumberBlur: function(phoneNumber) {
this.setState({
errorText: null,
});
// Validate the phone number entered // Validate the phone number entered
if (!PHONE_NUMBER_REGEX.test(phoneNumber)) { if (!PHONE_NUMBER_REGEX.test(phoneNumber)) {
this.setState({ this.setState({
errorText: _t('The phone number entered looks invalid'), errorText: _t('The phone number entered looks invalid'),
canTryLogin: false,
});
} else {
this.setState({
errorText: null,
canTryLogin: true,
}); });
} }
}, },
@ -343,6 +343,7 @@ module.exports = React.createClass({
self.setState({ self.setState({
errorText: self._errorTextFromError(err), errorText: self._errorTextFromError(err),
loginIncorrect: false, loginIncorrect: false,
canTryLogin: false,
}); });
}).finally(function() { }).finally(function() {
self.setState({ self.setState({