Disable login button while login is in progress.

This commit is contained in:
Caleb 2017-08-31 13:46:02 -06:00 committed by Shawn Erquhart
parent a14f25355e
commit c707228c8f
6 changed files with 20 additions and 7 deletions

View File

@ -43,7 +43,11 @@ export function authenticateUser() {
dispatch(authenticating());
return backend.currentUser()
.then((user) => {
if (user) dispatch(authenticate(user));
if (user) {
dispatch(authenticate(user));
} else {
dispatch(logoutUser());
}
})
.catch((error) => {
dispatch(authError(error));

View File

@ -54,6 +54,7 @@ export default class AuthenticationPage extends React.Component {
static propTypes = {
onLogin: PropTypes.func.isRequired,
inProgress: PropTypes.bool.isRequired,
};
state = { email: "", password: "", errors: {} };
@ -90,7 +91,7 @@ export default class AuthenticationPage extends React.Component {
render() {
const { errors } = this.state;
const { error } = this.props;
const { error, inProgress } = this.props;
if (window.netlifyIdentity) {
return <section className="nc-gitGatewayAuthenticationPage-root">
@ -131,8 +132,9 @@ export default class AuthenticationPage extends React.Component {
<Button
className="nc-gitGatewayAuthenticationPage-button"
raised
disabled={inProgress}
>
<Icon type="login" /> Login
<Icon type="login" /> {inProgress ? "Logging in..." : "Login"}
</Button>
</form>
</Card>

View File

@ -9,6 +9,7 @@ import { Toast } from '../../components/UI/index';
export default class AuthenticationPage extends React.Component {
static propTypes = {
onLogin: PropTypes.func.isRequired,
inProgress: PropTypes.bool.isRequired,
};
state = {};
@ -32,6 +33,7 @@ export default class AuthenticationPage extends React.Component {
render() {
const { loginError } = this.state;
const { inProgress } = this.props;
return (
<section className="nc-githubAuthenticationPage-root">
@ -40,9 +42,10 @@ export default class AuthenticationPage extends React.Component {
<Button
className="nc-githubAuthenticationPage-button"
raised
disabled={inProgress}
onClick={this.handleLogin}
>
<Icon type="github" /> Login with GitHub
<Icon type="github" /> {inProgress ? "Logging in..." : "Login with GitHub"}
</Button>
</section>
);

View File

@ -8,6 +8,7 @@ import logo from "../git-gateway/netlify_logo.svg";
export default class AuthenticationPage extends React.Component {
static propTypes = {
onLogin: PropTypes.func.isRequired,
inProgress: PropTypes.bool.isRequired,
};
state = { email: '' };
@ -22,6 +23,8 @@ export default class AuthenticationPage extends React.Component {
};
render() {
const { inProgress } = this.props;
return (<section className="nc-gitGatewayAuthenticationPage-root">
<Card className="nc-gitGatewayAuthenticationPage-card">
<img src={logo} width={100} role="presentation" />
@ -36,9 +39,10 @@ export default class AuthenticationPage extends React.Component {
<Button
className="nc-gitGatewayAuthenticationPage-button"
raised
disabled={inProgress}
onClick={this.handleLogin}
>
<Icon type="login" /> Login
<Icon type="login" /> {inProgress ? "Logging in..." : "Login"}
</Button>
</Card>
</section>);

View File

@ -88,7 +88,7 @@ class App extends React.Component {
React.createElement(backend.authComponent(), {
onLogin: this.handleLogin.bind(this),
error: auth && auth.get('error'),
isFetching: auth && auth.get('isFetching'),
inProgress: (auth && auth.get('isFetching')) || false,
siteId: this.props.config.getIn(["backend", "site_domain"]),
base_url: this.props.config.getIn(["backend", "base_url"], null)
})

View File

@ -10,7 +10,7 @@ const auth = (state = null, action) => {
case AUTH_FAILURE:
return Immutable.Map({ error: action.payload.toString() });
case LOGOUT:
return state.remove('user');
return state.remove('user').remove('isFetching');
default:
return state;
}