73 lines
1.8 KiB
JavaScript
73 lines
1.8 KiB
JavaScript
import React from 'react';
|
|
import { Container } from 'react-bootstrap';
|
|
import './App.css';
|
|
import './bootstrap.min.css';
|
|
|
|
|
|
class LogoffPage extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {logged_in: props.loggedIn, loading: false};
|
|
}
|
|
|
|
componentDidMount() {
|
|
fetch(this.props.targetUrl + '/status', {credentials: 'include'})
|
|
.then(response => response.json())
|
|
.then(data => this.setState({
|
|
loggedIn: data.logged_in
|
|
}));
|
|
}
|
|
|
|
handleToggle = (event) => {
|
|
this.setState({loading: true})
|
|
|
|
fetch(this.props.targetUrl + '/logout', {
|
|
method: 'POST',
|
|
credentials: 'include'
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => this.setState({
|
|
loggedIn: data.logged_in, loading: false
|
|
}));
|
|
}
|
|
|
|
buttonValue() {
|
|
if (this.state.loggedIn) {
|
|
return "LOGOUT";
|
|
} else {
|
|
return "LOGIN";
|
|
}
|
|
}
|
|
|
|
dynButton() {
|
|
const logout = (
|
|
<Container >
|
|
<button type="button" className="btn btn-primary" onClick={this.handleToggle}>{this.buttonValue()}</button>
|
|
</Container>
|
|
);
|
|
|
|
const loading =
|
|
<Container>
|
|
<div className="spinner-border text-primary" role="status">
|
|
<span className="sr-only">Loading...</span>
|
|
</div>
|
|
</Container>;
|
|
|
|
if (this.state.loading) {
|
|
return loading;
|
|
} else {
|
|
return logout;
|
|
}
|
|
}
|
|
|
|
render() {
|
|
if (this.state.loggedIn) {
|
|
return this.dynButton();
|
|
} else {
|
|
return (<div><h2>You have to login first!</h2></div>);
|
|
}
|
|
}
|
|
}
|
|
|
|
export default LogoffPage;
|