diff --git a/src/components/login-form.js b/src/components/login-form.js index 62840d4..7e09091 100644 --- a/src/components/login-form.js +++ b/src/components/login-form.js @@ -30,7 +30,8 @@ class LoginForm extends Component { this.state = { username: '', - password: '' + password: '', + disableLogin: true } } @@ -47,7 +48,15 @@ class LoginForm extends Component { } handleChange(event) { - this.setState({ [event.target.id]: event.target.value }); + let disableLogin = this.state.disableLogin; + + if (event.target.id === 'username') { + disableLogin = this.state.password.length === 0 || event.target.value.length === 0; + } else if (event.target.id === 'password') { + disableLogin = this.state.username.length === 0 || event.target.value.length === 0; + } + + this.setState({ [event.target.id]: event.target.value, disableLogin }); } render() { @@ -71,9 +80,17 @@ class LoginForm extends Component { + {this.props.loginMessage && +
+ + Error: {this.props.loginMessage} + +
+ } + - + diff --git a/src/containers/login.js b/src/containers/login.js index cb23359..2a812cf 100644 --- a/src/containers/login.js +++ b/src/containers/login.js @@ -41,7 +41,8 @@ class Login extends Component { static calculateState() { return { currentUser: UserStore.getState().currentUser, - token: UserStore.getState().token + token: UserStore.getState().token, + loginMessage: UserStore.getState().loginMessage }; } @@ -83,7 +84,7 @@ class Login extends Component {
Login - +