100 lines
2.3 KiB
JavaScript
100 lines
2.3 KiB
JavaScript
import logo from './logo.svg';
|
|
import './App.css';
|
|
import React from 'react';
|
|
import MenuBar from './components/MenuBar';
|
|
import Login from './components/Login';
|
|
import Gamenights from "./components/Gamenights"
|
|
|
|
class App extends React.Component {
|
|
|
|
constructor(props) {
|
|
super(props)
|
|
this.handleLogin = this.handleLogin.bind(this);
|
|
this.onLogout = this.onLogout.bind(this);
|
|
this.state = {
|
|
user: null,
|
|
token: null,
|
|
gamenights: null
|
|
};
|
|
}
|
|
|
|
componentDidUpdate(prevProps, prevState) {
|
|
console.log("component update?")
|
|
if (prevState.token !== this.state.token) {
|
|
const requestOptions = {
|
|
method: 'GET',
|
|
headers: { 'Authorization': `bearer: ${this.state.token}` },
|
|
};
|
|
fetch('api/gamenights', requestOptions)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if(data.result === "Ok") {
|
|
this.setState((state, props) => ({
|
|
gamenights: data.gamenights
|
|
}));
|
|
} else {
|
|
this.setState((state, props) => ({
|
|
flash_data: {
|
|
type: "Error",
|
|
message: data.message
|
|
}
|
|
}));
|
|
}
|
|
console.log(this.state)
|
|
});
|
|
}
|
|
}
|
|
|
|
render() {
|
|
if(this.state.token === null) {
|
|
return (
|
|
<div className="App">
|
|
<Login onChange={this.handleLogin}/>
|
|
</div>
|
|
);
|
|
} else {
|
|
return (
|
|
<div className="App">
|
|
<MenuBar user={this.state.user} onLogout={this.onLogout}/>
|
|
<Gamenights />
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
onLogout() {
|
|
this.setState((state, props) => ({
|
|
user: null,
|
|
token: null,
|
|
flash_data: null
|
|
}));
|
|
}
|
|
|
|
handleLogin(input) {
|
|
const requestOptions = {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(input)
|
|
};
|
|
fetch('api/login', requestOptions)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if(data.result === "Ok") {
|
|
this.setState((state, props) => ({
|
|
token: data.jwt
|
|
}));
|
|
} else {
|
|
this.setState((state, props) => ({
|
|
flash_data: {
|
|
type: "Error",
|
|
message: data.message
|
|
}
|
|
}));
|
|
}
|
|
console.log(this.state)
|
|
});
|
|
}
|
|
}
|
|
|
|
export default App;
|