diff --git a/sports-matcher/client/src/pages/Login.js b/sports-matcher/client/src/pages/Login.js index a7f5793..526852e 100644 --- a/sports-matcher/client/src/pages/Login.js +++ b/sports-matcher/client/src/pages/Login.js @@ -1,5 +1,5 @@ import React from "react"; -import { Button, Card, Container, Form } from "react-bootstrap"; +import { Alert, Button, Card, Container, Form } from "react-bootstrap"; import { globalContext } from "../context"; import { apiClient } from "../utils/httpClients"; import { guard } from "../utils/routing"; @@ -9,7 +9,8 @@ export default class Login extends React.Component { super(props); this.state = { email: "", - password: "" + password: "", + errorDisplayed: false, }; this.attemptLogin = this.attemptLogin.bind(this); @@ -33,18 +34,36 @@ export default class Login extends React.Component { const loginResponse = await apiClient.post("/user/login", { email: this.state.email, password: this.state.password, + }, { + validateStatus: function (status) { + return status === 200 || status === 401 || status === 400; + } }); - if (loginResponse.status === 200) { this.context.navigate("/dashboard", { replace: true }); + } else if (loginResponse.status === 401) { + this.setState({ errorDisplayed: true }); } } render() { + let errorMsg = ( +
+ ); + if (this.state.errorDisplayed) { + errorMsg = ( + < Alert variant="danger" onClose={() => this.setState({ errorDisplayed: false })} dismissible > +Double check your provided e-mail and password!
+ + ); + } + return (