Handle error on logout

This commit is contained in:
Tom Russell 2018-09-13 17:02:27 +01:00
parent 1ea6b0b75b
commit bdb4e45d8b
3 changed files with 16 additions and 8 deletions

View File

@ -29,6 +29,8 @@ class Login extends Component {
handleSubmit(event) {
event.preventDefault();
this.setState({error: undefined})
fetch('/login', {
method: 'POST',
body: JSON.stringify(this.state),
@ -41,7 +43,6 @@ class Login extends Component {
if (res.error) {
this.setState({error: res.error})
} else {
this.setState({error: undefined})
fetch('/users/me').then(
(res) => res.json()
).then(

View File

@ -1,28 +1,33 @@
import React, { Component } from 'react';
import { Redirect } from 'react-router';
import ErrorBox from './error-box';
class MyAccountPage extends Component {
constructor(props) {
super(props);
this.state = {
error: undefined
};
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit(event) {
const logout = this.props.logout;
event.preventDefault();
this.setState({error: undefined});
fetch('/logout', {
method: 'POST'
}).then(
res => res.json()
).then(function(res){
if (res.error) {
console.error(res.error); // tell user
this.setState({error: res.error})
} else {
logout();
console.log(res); // redirect back
this.props.logout();
}
}).catch(
err => console.error(err)
}.bind(this)).catch(
(err) => this.setState({error: err})
);
}
@ -32,6 +37,7 @@ class MyAccountPage extends Component {
<article>
<section className="main-col">
<h1 className="h3">Welcome, {this.props.user.username}</h1>
<ErrorBox msg={this.state.error} />
<form method="POST" action="/logout" onSubmit={this.handleSubmit}>
<input className="btn btn-secondary" type="submit" value="Log out"/>
</form>

View File

@ -32,6 +32,8 @@ class SignUp extends Component {
handleSubmit(event) {
event.preventDefault();
this.setState({error: undefined})
fetch('/users', {
method: 'POST',
body: JSON.stringify(this.state),
@ -44,7 +46,6 @@ class SignUp extends Component {
if (res.error) {
this.setState({error: res.error})
} else {
this.setState({error: undefined})
fetch('/users/me').then(
(res) => res.json()
).then(