Fix issue with order of mounting of components

Since the credentials were checked in the componentDidMount of the App
but the tournamen was loaded in the componentDidMount of the EditTournament component,
which was done first. Thus the auth headers were cleared, and the user was logged out.
This commit is contained in:
JP1998 2018-12-12 20:47:09 +01:00
parent ec0a75e5df
commit cbaa1b8270
13 changed files with 208 additions and 83 deletions

View File

@ -2,18 +2,15 @@ import App, {Container} from 'next/app';
import React from 'react';
import { Provider } from 'react-redux';
import withReduxStore from '../js/redux/reduxStoreBinder';
import { verifyCredentials } from '../js/api';
import Notifications from 'react-notify-toast';
class TurniereApp extends App {
componentDidMount() {
verifyCredentials();
}
render () {
const {Component, pageProps, reduxStore} = this.props;
return (
<Container>
<Notifications />
<Provider store={reduxStore}>
<Component {...pageProps} />
</Provider>

View File

@ -1,11 +1,19 @@
import { ErrorPageComponent } from '../js/components/ErrorComponents.js';
import {
verifyCredentials
} from '../js/api';
export default class Error extends React.Component {
static getInitialProps({ res, err }) {
const statusCode = res ? res.statusCode : err ? err.statusCode : 400;
return { statusCode };
}
componentDidMount() {
verifyCredentials();
}
render() {
return (
<ErrorPageComponent statusCode={this.props.statusCode}/>

View File

@ -16,9 +16,20 @@ import {
Label
} from 'reactstrap';
import {
verifyCredentials
} from '../js/api';
import EditableStringList from '../js/EditableStringList';
export default () => (
export default class CreatePage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div className="main generic-fullpage-bg">
<Head>
<title>Turnier erstellen: turnie.re</title>
@ -29,7 +40,10 @@ export default () => (
</div>
<Footer/>
</div>
);
);
}
}
function CreateTournamentCard() {
return (

View File

@ -5,6 +5,10 @@ import 'bootstrap/dist/css/bootstrap.min.css';
import { BigImage, Footer, TurniereNavigation } from '../js/CommonComponents.js';
import '../static/everypage.css';
import {
verifyCredentials
} from '../js/api';
function Main() {
return (
<div className="main">
@ -216,7 +220,14 @@ function TournamentFaq() {
);
}
export default () => (
export default class FaqPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>
<Head>
<title>FAQ: turnie.re</title>
@ -226,4 +237,6 @@ export default () => (
<Main/>
<Footer/>
</div>
);
);
}
}

View File

@ -5,6 +5,10 @@ import 'bootstrap/dist/css/bootstrap.min.css';
import {BigImage, Footer, TurniereNavigation} from '../js/CommonComponents.js';
import '../static/everypage.css';
import {
verifyCredentials
} from '../js/api';
function Main() {
return (
<div className="main running-text">
@ -69,7 +73,14 @@ function ImprintText(){
}
export default () => (
export default class ImprintPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>
<Head>
<title>Impressum: turnie.re</title>
@ -79,4 +90,6 @@ export default () => (
<Main/>
<Footer/>
</div>
);
);
}
}

View File

@ -12,6 +12,10 @@ import '../static/css/index.css';
import { connect } from 'react-redux';
import {
verifyCredentials
} from '../js/api';
function Main() {
return (
<div className="main">
@ -165,6 +169,11 @@ function PromotedLinkCreateTournament() {
class Index extends React.Component {
componentDidMount() {
verifyCredentials();
}
render () {
return (
<div>

View File

@ -1,10 +1,24 @@
import Head from 'next/head';
import React from 'react';
export default () => (
import {
verifyCredentials
} from '../js/api';
export default class ListPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>
<Head>
<title>Turnie.re - Turnierliste</title>
</Head>
<p>Turnierliste</p>
</div>
);
);
}
}

View File

@ -6,7 +6,18 @@ import { Button, Card, CardBody, Container, Form, FormGroup, Input, Label } from
import { login } from '../js/api';
import { connect } from 'react-redux';
export default () => (
import {
verifyCredentials
} from '../js/api';
export default class LoginPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div className="main generic-fullpage-bg">
<Head>
<title>Login: turnie.re</title>
@ -17,7 +28,9 @@ export default () => (
</div>
<Footer/>
</div>
);
);
}
}
function Login() {
return (

View File

@ -5,6 +5,10 @@ import 'bootstrap/dist/css/bootstrap.min.css';
import { BigImage, Footer, TurniereNavigation } from '../js/CommonComponents.js';
import '../static/everypage.css';
import {
verifyCredentials
} from '../js/api';
function Main() {
return (
<div className="main running-text">
@ -488,7 +492,14 @@ function PrivacyText(){
}
export default () => (
export default class PrivacyPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>
<Head>
<title>Datenschutzerklärung: turnie.re</title>
@ -498,4 +509,6 @@ export default () => (
<Main/>
<Footer/>
</div>
);
);
}
}

View File

@ -6,7 +6,18 @@ import { Button, Card, CardBody, Container, Form, FormGroup, FormText, Input, La
import { register } from '../js/api';
import { connect } from 'react-redux';
export default () => (
import {
verifyCredentials
} from '../js/api';
export default class RegisterPage extends React.Component {
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div className="main generic-fullpage-bg">
<Head>
<title>Registrieren: turnie.re</title>
@ -18,7 +29,9 @@ export default () => (
</div>
<Footer/>
</div>
);
);
}
}
function Register() {
return (

View File

@ -18,6 +18,7 @@ import {
} from 'reactstrap';
import {
verifyCredentials,
updateTeamName
} from '../js/api';
@ -39,6 +40,7 @@ class EditTournamentPage extends React.Component {
}
componentDidMount() {
verifyCredentials();
requestTournament(this.props.query.code, () => {
this.setState({ validCode: true });
this._edittournamentcontent.notifyOfContentUpdate();

View File

@ -1,12 +1,20 @@
import Head from 'next/head';
import React from 'react';
import {
verifyCredentials
} from '../js/api';
class FullscreenTournamentPage extends React.Component {
static async getInitialProps({query}) {
return {query};
}
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>

View File

@ -2,12 +2,20 @@ import Head from 'next/head';
import React from 'react';
import '../style.css';
import {
verifyCredentials
} from '../js/api';
class TournamentPage extends React.Component {
static async getInitialProps({query}) {
return {query};
}
componentDidMount() {
verifyCredentials();
}
render() {
return (
<div>