Export all the common components into their own files
This commit is contained in:
JP1998
parent
ebbff7b01a
commit
7838237f4b
|
|
@ -1,282 +0,0 @@
|
||||||
import {
|
|
||||||
Badge,
|
|
||||||
Button,
|
|
||||||
ButtonGroup,
|
|
||||||
Card,
|
|
||||||
CardBody,
|
|
||||||
Container,
|
|
||||||
Collapse,
|
|
||||||
Form,
|
|
||||||
FormGroup,
|
|
||||||
Nav,
|
|
||||||
Navbar,
|
|
||||||
NavbarBrand,
|
|
||||||
NavbarToggler,
|
|
||||||
NavItem,
|
|
||||||
NavLink,
|
|
||||||
Input,
|
|
||||||
Label
|
|
||||||
} from 'reactstrap';
|
|
||||||
|
|
||||||
import { connect } from 'react-redux';
|
|
||||||
|
|
||||||
import React from 'react';
|
|
||||||
|
|
||||||
import { login, logout } from './api';
|
|
||||||
|
|
||||||
export function BigImage(props) {
|
|
||||||
return (
|
|
||||||
<div className="big-image">
|
|
||||||
<h1 className="display-1">{props.text}</h1>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
export class TurniereNavigation extends React.Component {
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
|
|
||||||
this.toggle = this.toggle.bind(this);
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
collapsed: true
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
toggle() {
|
|
||||||
this.setState({
|
|
||||||
collapsed: !this.state.collapsed
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<Navbar color="light" light expand="lg">
|
|
||||||
<NavbarBrand href="/">turnie.re</NavbarBrand>
|
|
||||||
<Betabadge/>
|
|
||||||
<NavbarToggler onClick={this.toggle} />
|
|
||||||
<Collapse isOpen={!this.state.collapsed} navbar>
|
|
||||||
<Nav navbar className="mr-auto">
|
|
||||||
<Navlink target="/create" text="Turnier erstellen"/>
|
|
||||||
<Navlink target="/list" text="Öffentliche Turniere"/>
|
|
||||||
<Navlink target="/faq" text="FAQ"/>
|
|
||||||
</Nav>
|
|
||||||
<LoginLogoutButtons/>
|
|
||||||
</Collapse>
|
|
||||||
</Navbar>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function Navlink(props) {
|
|
||||||
return (
|
|
||||||
<NavItem active={true}>
|
|
||||||
<NavLink href={props.target}>{props.text}</NavLink>
|
|
||||||
</NavItem>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
function Betabadge() {
|
|
||||||
return (<Badge color="danger" className="mr-2">BETA</Badge>);
|
|
||||||
}
|
|
||||||
|
|
||||||
class InvisibleLoginLogoutButtons extends React.Component {
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { isSignedIn, username } = this.props;
|
|
||||||
|
|
||||||
if(isSignedIn) {
|
|
||||||
return (
|
|
||||||
<ButtonGroup className="nav-item">
|
|
||||||
<Button outline color="success" href="/profile" className="navbar-btn my-2 my-sm-0 px-5">{ username }</Button>
|
|
||||||
<Button outline color="success" onClick={logout.bind(this)} className="navbar-btn my-2 my-sm-0 px-5">Logout</Button>
|
|
||||||
</ButtonGroup>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return (
|
|
||||||
<ButtonGroup className="nav-item">
|
|
||||||
<Button outline color="success" href="/login" className="navbar-btn my-2 my-sm-0 px-5">Login</Button>
|
|
||||||
<Button outline color="success" href="/register" className="navbar-btn my-2 my-sm-0 px-5">Registrieren</Button>
|
|
||||||
</ButtonGroup>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapStateToLoginLogoutButtonProperties = (state) => {
|
|
||||||
const { isSignedIn, username } = state.userinfo;
|
|
||||||
return { isSignedIn, username };
|
|
||||||
};
|
|
||||||
|
|
||||||
const LoginLogoutButtons = connect(
|
|
||||||
mapStateToLoginLogoutButtonProperties
|
|
||||||
)(InvisibleLoginLogoutButtons);
|
|
||||||
|
|
||||||
export function Footer() {
|
|
||||||
return (
|
|
||||||
<footer className="footer mt-5 bg-dark text-light">
|
|
||||||
<div className="container py-3">
|
|
||||||
<div className="row">
|
|
||||||
<div className="col-md-6 text-center">
|
|
||||||
© 2018 turnie.re ·
|
|
||||||
<a className="text-white" href="/privacy"> Datenschutzerklärung </a>
|
|
||||||
·
|
|
||||||
<a className="text-white" href="/imprint"> Impressum</a>
|
|
||||||
</div>
|
|
||||||
<div className="col-md-6 text-center"><a href="#" className="text-white">zurück nach oben</a></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* This component works just like a switch statement, although the conditions of the first items
|
|
||||||
* are checked first, and the first component with a condition that is true will be shown.
|
|
||||||
*
|
|
||||||
* For single conditions and options any kind of component can be taken, while the Option-component
|
|
||||||
* is dedicated for this job. The only important thing is that this component has to have a condition property.
|
|
||||||
*
|
|
||||||
* You should also give a default option with a condition that always evaluates to true.
|
|
||||||
*
|
|
||||||
* A quick example would be some content that is only to be shown when the user is logged in:
|
|
||||||
*
|
|
||||||
* function SomeRestrictedContent(props) {
|
|
||||||
* const { isSignedIn } = props;
|
|
||||||
*
|
|
||||||
* return (
|
|
||||||
* <UserRestrictor>
|
|
||||||
* <Option condition={isSignedIn}>
|
|
||||||
* < The restricted content >
|
|
||||||
* </Option>
|
|
||||||
* <Option condition={true}>
|
|
||||||
* < Some default content; in this case some kind of login >
|
|
||||||
* </Option>
|
|
||||||
* </UserRestrictor>
|
|
||||||
* );
|
|
||||||
* }
|
|
||||||
*
|
|
||||||
* In the example you'll have to note that the default option is at the bottom of all the options
|
|
||||||
* since it would always be taken otherwise (the options' conditions are checked from top to bottom)
|
|
||||||
*/
|
|
||||||
export class UserRestrictor extends React.Component {
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { children } = this.props;
|
|
||||||
|
|
||||||
for(var i in children) {
|
|
||||||
var c = children[i];
|
|
||||||
|
|
||||||
if(c.props.condition) {
|
|
||||||
return c;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function Option(props) {
|
|
||||||
return props.children;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function Login(props) {
|
|
||||||
return (
|
|
||||||
<Container className="py-5">
|
|
||||||
<Card className="shadow">
|
|
||||||
<CardBody>
|
|
||||||
<h1 className="custom-font">Login</h1>
|
|
||||||
<Hint hint={props.hint}/>
|
|
||||||
<LoginForm/>
|
|
||||||
<div className="mt-3">
|
|
||||||
<a href="/register" className="mr-3">Account anlegen</a>
|
|
||||||
<a href="/register#account-requirement">Warum ist ein Account nötig?</a>
|
|
||||||
</div>
|
|
||||||
</CardBody>
|
|
||||||
</Card>
|
|
||||||
</Container>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
class LoginErrorList extends React.Component {
|
|
||||||
render() {
|
|
||||||
const { error, errorMessages } = this.props;
|
|
||||||
if(error) {
|
|
||||||
return (
|
|
||||||
<ul>
|
|
||||||
{ errorMessages.map((message, index) =>
|
|
||||||
<li key={index}>
|
|
||||||
<style jsx>{`
|
|
||||||
li {
|
|
||||||
color:red;
|
|
||||||
}
|
|
||||||
`}</style>
|
|
||||||
{message}
|
|
||||||
</li>
|
|
||||||
|
|
||||||
) }
|
|
||||||
</ul>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const mapStateToErrorMessages = (state) => {
|
|
||||||
const { errorMessages, error } = state.userinfo;
|
|
||||||
return { errorMessages, error };
|
|
||||||
};
|
|
||||||
|
|
||||||
const VisibleLoginErrorList = connect(
|
|
||||||
mapStateToErrorMessages
|
|
||||||
)(LoginErrorList);
|
|
||||||
|
|
||||||
|
|
||||||
class LoginForm extends React.Component {
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
email : '',
|
|
||||||
password : ''
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<Form>
|
|
||||||
<FormGroup>
|
|
||||||
<Label for="username">E-Mail-Adresse</Label>
|
|
||||||
<Input type="email" name="username" value={this.state.email} onChange={ this.handleEmailInput.bind(this) } />
|
|
||||||
</FormGroup>
|
|
||||||
<FormGroup>
|
|
||||||
<Label for="password">Passwort</Label>
|
|
||||||
<Input type="password" name="password" value={this.state.password} onChange={ this.handlePasswordInput.bind(this) } />
|
|
||||||
</FormGroup>
|
|
||||||
<Button onClick={login.bind(this, this.state.email, this.state.password)} color="success" size="lg" className="w-100 shadow-sm">Anmelden</Button>
|
|
||||||
<VisibleLoginErrorList/>
|
|
||||||
</Form>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
handlePasswordInput(input) {
|
|
||||||
this.setState({ password : input.target.value });
|
|
||||||
}
|
|
||||||
|
|
||||||
handleEmailInput(input) {
|
|
||||||
this.setState({ email : input.target.value });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function Hint(props) {
|
|
||||||
if(props.hint != null) {
|
|
||||||
return (
|
|
||||||
<h3>{ props.hint }</h3>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import Head from 'next/head';
|
import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Footer, TurniereNavigation} from '../CommonComponents';
|
import { TurniereNavigation } from './Navigation';
|
||||||
|
import { Footer } from './Footer'
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
import {Container} from 'reactstrap';
|
import {Container} from 'reactstrap';
|
||||||
import '../../static/everypage.css';
|
import '../../static/everypage.css';
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
|
||||||
|
|
||||||
|
export function Footer() {
|
||||||
|
return (
|
||||||
|
<footer className="footer mt-5 bg-dark text-light">
|
||||||
|
<div className="container py-3">
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-md-6 text-center">
|
||||||
|
© 2018 turnie.re ·
|
||||||
|
<a className="text-white" href="/privacy"> Datenschutzerklärung </a>
|
||||||
|
·
|
||||||
|
<a className="text-white" href="/imprint"> Impressum</a>
|
||||||
|
</div>
|
||||||
|
<div className="col-md-6 text-center"><a href="#" className="text-white">zurück nach oben</a></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,112 @@
|
||||||
|
import {
|
||||||
|
Container,
|
||||||
|
Card,
|
||||||
|
CardBody,
|
||||||
|
Form,
|
||||||
|
FormGroup,
|
||||||
|
Label,
|
||||||
|
Input,
|
||||||
|
Button
|
||||||
|
} from 'reactstrap';
|
||||||
|
import React from 'react';
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
import { login } from '../api';
|
||||||
|
|
||||||
|
export function Login(props) {
|
||||||
|
return (
|
||||||
|
<Container className="py-5">
|
||||||
|
<Card className="shadow">
|
||||||
|
<CardBody>
|
||||||
|
<h1 className="custom-font">Login</h1>
|
||||||
|
<Hint hint={props.hint}/>
|
||||||
|
<LoginForm/>
|
||||||
|
<div className="mt-3">
|
||||||
|
<a href="/register" className="mr-3">Account anlegen</a>
|
||||||
|
<a href="/register#account-requirement">Warum ist ein Account nötig?</a>
|
||||||
|
</div>
|
||||||
|
</CardBody>
|
||||||
|
</Card>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
class LoginErrorList extends React.Component {
|
||||||
|
render() {
|
||||||
|
const { error, errorMessages } = this.props;
|
||||||
|
if(error) {
|
||||||
|
return (
|
||||||
|
<ul>
|
||||||
|
{ errorMessages.map((message, index) =>
|
||||||
|
<li key={index}>
|
||||||
|
<style jsx>{`
|
||||||
|
li {
|
||||||
|
color:red;
|
||||||
|
}
|
||||||
|
`}</style>
|
||||||
|
{message}
|
||||||
|
</li>
|
||||||
|
|
||||||
|
) }
|
||||||
|
</ul>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const mapStateToErrorMessages = (state) => {
|
||||||
|
const { errorMessages, error } = state.userinfo;
|
||||||
|
return { errorMessages, error };
|
||||||
|
};
|
||||||
|
|
||||||
|
const VisibleLoginErrorList = connect(
|
||||||
|
mapStateToErrorMessages
|
||||||
|
)(LoginErrorList);
|
||||||
|
|
||||||
|
class LoginForm extends React.Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
email : '',
|
||||||
|
password : ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<Form>
|
||||||
|
<FormGroup>
|
||||||
|
<Label for="username">E-Mail-Adresse</Label>
|
||||||
|
<Input type="email" name="username" value={this.state.email} onChange={ this.handleEmailInput.bind(this) } />
|
||||||
|
</FormGroup>
|
||||||
|
<FormGroup>
|
||||||
|
<Label for="password">Passwort</Label>
|
||||||
|
<Input type="password" name="password" value={this.state.password} onChange={ this.handlePasswordInput.bind(this) } />
|
||||||
|
</FormGroup>
|
||||||
|
<Button onClick={login.bind(this, this.state.email, this.state.password)} color="success" size="lg" className="w-100 shadow-sm">Anmelden</Button>
|
||||||
|
<VisibleLoginErrorList/>
|
||||||
|
</Form>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
handlePasswordInput(input) {
|
||||||
|
this.setState({ password : input.target.value });
|
||||||
|
}
|
||||||
|
|
||||||
|
handleEmailInput(input) {
|
||||||
|
this.setState({ email : input.target.value });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function Hint(props) {
|
||||||
|
if(props.hint != null) {
|
||||||
|
return (
|
||||||
|
<h3>{ props.hint }</h3>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,97 @@
|
||||||
|
import {
|
||||||
|
Badge,
|
||||||
|
Button,
|
||||||
|
ButtonGroup,
|
||||||
|
Collapse,
|
||||||
|
Nav,
|
||||||
|
Navbar,
|
||||||
|
NavbarBrand,
|
||||||
|
NavbarToggler,
|
||||||
|
NavItem,
|
||||||
|
NavLink
|
||||||
|
} from 'reactstrap';
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
import React from 'react';
|
||||||
|
import { login, logout } from '../api';
|
||||||
|
|
||||||
|
export class TurniereNavigation extends React.Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
|
||||||
|
this.toggle = this.toggle.bind(this);
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
collapsed: true
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
toggle() {
|
||||||
|
this.setState({
|
||||||
|
collapsed: !this.state.collapsed
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<Navbar color="light" light expand="lg">
|
||||||
|
<NavbarBrand href="/">turnie.re</NavbarBrand>
|
||||||
|
<Betabadge/>
|
||||||
|
<NavbarToggler onClick={this.toggle} />
|
||||||
|
<Collapse isOpen={!this.state.collapsed} navbar>
|
||||||
|
<Nav navbar className="mr-auto">
|
||||||
|
<Navlink target="/create" text="Turnier erstellen"/>
|
||||||
|
<Navlink target="/list" text="Öffentliche Turniere"/>
|
||||||
|
<Navlink target="/faq" text="FAQ"/>
|
||||||
|
</Nav>
|
||||||
|
<LoginLogoutButtons/>
|
||||||
|
</Collapse>
|
||||||
|
</Navbar>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function Navlink(props) {
|
||||||
|
return (
|
||||||
|
<NavItem active={true}>
|
||||||
|
<NavLink href={props.target}>{props.text}</NavLink>
|
||||||
|
</NavItem>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function Betabadge() {
|
||||||
|
return (<Badge color="danger" className="mr-2">BETA</Badge>);
|
||||||
|
}
|
||||||
|
|
||||||
|
class InvisibleLoginLogoutButtons extends React.Component {
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { isSignedIn, username } = this.props;
|
||||||
|
|
||||||
|
if(isSignedIn) {
|
||||||
|
return (
|
||||||
|
<ButtonGroup className="nav-item">
|
||||||
|
<Button outline color="success" href="/profile" className="navbar-btn my-2 my-sm-0 px-5">{ username }</Button>
|
||||||
|
<Button outline color="success" onClick={logout.bind(this)} className="navbar-btn my-2 my-sm-0 px-5">Logout</Button>
|
||||||
|
</ButtonGroup>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<ButtonGroup className="nav-item">
|
||||||
|
<Button outline color="success" href="/login" className="navbar-btn my-2 my-sm-0 px-5">Login</Button>
|
||||||
|
<Button outline color="success" href="/register" className="navbar-btn my-2 my-sm-0 px-5">Registrieren</Button>
|
||||||
|
</ButtonGroup>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const mapStateToLoginLogoutButtonProperties = (state) => {
|
||||||
|
const { isSignedIn, username } = state.userinfo;
|
||||||
|
return { isSignedIn, username };
|
||||||
|
};
|
||||||
|
|
||||||
|
const LoginLogoutButtons = connect(
|
||||||
|
mapStateToLoginLogoutButtonProperties
|
||||||
|
)(InvisibleLoginLogoutButtons);
|
||||||
|
|
||||||
|
|
@ -0,0 +1,51 @@
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* This component works just like a switch statement, although the conditions of the first items
|
||||||
|
* are checked first, and the first component with a condition that is true will be shown.
|
||||||
|
*
|
||||||
|
* For single conditions and options any kind of component can be taken, while the Option-component
|
||||||
|
* is dedicated for this job. The only important thing is that this component has to have a condition property.
|
||||||
|
*
|
||||||
|
* You should also give a default option with a condition that always evaluates to true.
|
||||||
|
*
|
||||||
|
* A quick example would be some content that is only to be shown when the user is logged in:
|
||||||
|
*
|
||||||
|
* function SomeRestrictedContent(props) {
|
||||||
|
* const { isSignedIn } = props;
|
||||||
|
*
|
||||||
|
* return (
|
||||||
|
* <UserRestrictor>
|
||||||
|
* <Option condition={isSignedIn}>
|
||||||
|
* < The restricted content >
|
||||||
|
* </Option>
|
||||||
|
* <Option condition={true}>
|
||||||
|
* < Some default content; in this case some kind of login >
|
||||||
|
* </Option>
|
||||||
|
* </UserRestrictor>
|
||||||
|
* );
|
||||||
|
* }
|
||||||
|
*
|
||||||
|
* In the example you'll have to note that the default option is at the bottom of all the options
|
||||||
|
* since it would always be taken otherwise (the options' conditions are checked from top to bottom)
|
||||||
|
*/
|
||||||
|
export class UserRestrictor extends React.Component {
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { children } = this.props;
|
||||||
|
|
||||||
|
for(var i in children) {
|
||||||
|
var c = children[i];
|
||||||
|
|
||||||
|
if(c.props.condition) {
|
||||||
|
return c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Option(props) {
|
||||||
|
return props.children;
|
||||||
|
}
|
||||||
|
|
@ -1,6 +1,9 @@
|
||||||
import Head from 'next/head';
|
import Head from 'next/head';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
import { Footer, TurniereNavigation, UserRestrictor, Option, Login } from '../js/CommonComponents';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
|
import { UserRestrictor, Option } from '../js/components/UserRestrictor';
|
||||||
|
import { Login } from '../js/components/Login.js';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,9 @@ import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Col, Container, Row} from 'reactstrap';
|
import {Col, Container, Row} from 'reactstrap';
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
import { BigImage, Footer, TurniereNavigation } from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,9 @@ import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Container} from 'reactstrap';
|
import {Container} from 'reactstrap';
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
import {BigImage, Footer, TurniereNavigation} from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,9 @@ import { Alert, Button, Card, CardBody } from 'reactstrap';
|
||||||
|
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
|
|
||||||
import { BigImage, Footer, TurniereNavigation } from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
|
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
import '../static/css/index.css';
|
import '../static/css/index.css';
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,8 @@ import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Card, CardBody, Container } from 'reactstrap';
|
import { Card, CardBody, Container } from 'reactstrap';
|
||||||
|
|
||||||
import { Footer, TurniereNavigation } from '../js/CommonComponents';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import {
|
import {
|
||||||
getRequest,
|
getRequest,
|
||||||
getState,
|
getState,
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,8 @@
|
||||||
import Head from 'next/head';
|
import Head from 'next/head';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
import { Footer, TurniereNavigation, Login } from '../js/CommonComponents';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
|
import { Login } from '../js/components/Login.js';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,9 @@ import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {Container} from 'reactstrap';
|
import {Container} from 'reactstrap';
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
import { BigImage, Footer, TurniereNavigation } from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import Head from 'next/head';
|
import Head from 'next/head';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
import {Footer, TurniereNavigation} from '../js/CommonComponents';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Button, Card, CardBody, Container, Form, FormGroup, FormText, Input, Label } from 'reactstrap';
|
import { Button, Card, CardBody, Container, Form, FormGroup, FormText, Input, Label } from 'reactstrap';
|
||||||
import { register } from '../js/api';
|
import { register } from '../js/api';
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,11 @@ import { connect } from 'react-redux';
|
||||||
import { notify } from 'react-notify-toast';
|
import { notify } from 'react-notify-toast';
|
||||||
|
|
||||||
import { requestTournament } from '../js/api';
|
import { requestTournament } from '../js/api';
|
||||||
import { BigImage, Footer, TurniereNavigation, Login, UserRestrictor, Option } from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
|
import { UserRestrictor, Option } from '../js/components/UserRestrictor.js';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
|
import { Login } from '../js/components/Login.js';
|
||||||
import { ErrorPageComponent } from '../js/components/ErrorComponents.js';
|
import { ErrorPageComponent } from '../js/components/ErrorComponents.js';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
|
||||||
|
|
@ -19,8 +19,10 @@ import {
|
||||||
Table
|
Table
|
||||||
} from 'reactstrap';
|
} from 'reactstrap';
|
||||||
import { ErrorPageComponent } from '../js/components/ErrorComponents.js';
|
import { ErrorPageComponent } from '../js/components/ErrorComponents.js';
|
||||||
|
import { Footer } from '../js/components/Footer.js';
|
||||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||||
import {BigImage, Footer, TurniereNavigation} from '../js/CommonComponents.js';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
|
import { BigImage } from '../js/components/BigImage';
|
||||||
import '../static/everypage.css';
|
import '../static/everypage.css';
|
||||||
import '../static/css/tournament.css';
|
import '../static/css/tournament.css';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue