From 5b64dc6c0ed00b52309cd5470318163e8ea1e78e Mon Sep 17 00:00:00 2001 From: Jonny Date: Sun, 16 Jun 2019 18:25:13 +0200 Subject: [PATCH 1/8] Remove upper bounds for numeric inputs --- pages/create.js | 19 +++++-------------- 1 file changed, 5 insertions(+), 14 deletions(-) diff --git a/pages/create.js b/pages/create.js index 9165c1b..01b92a2 100644 --- a/pages/create.js +++ b/pages/create.js @@ -153,11 +153,9 @@ class CreateTournamentForm extends React.Component { increaseGroupAdvance() { const newGroupAdvance = this.state.groupAdvance * 2; - if (newGroupAdvance <= this.state.groupSize) { - this.setState({ - groupAdvance: newGroupAdvance - }); - } + this.setState({ + groupAdvance: newGroupAdvance + }); } decreaseGroupAdvance() { @@ -171,21 +169,14 @@ class CreateTournamentForm extends React.Component { } increaseGroupSize() { - this.setState({groupSize: this.state.groupSize+1}); + this.setState({groupSize: this.state.groupSize + 1}); } decreaseGroupSize() { const newGroupSize = this.state.groupSize - 1; if (newGroupSize >= 3) { - if (newGroupSize >= this.state.groupAdvance) { - this.setState({groupSize: newGroupSize}); - } else { - this.setState({ - groupSize: newGroupSize, - groupAdvance: Math.floor(this.state.groupAdvance / 2) - }); - } + this.setState({groupSize: newGroupSize}); } } From 932cefff7ba6d50221cca897da0283abbd386039 Mon Sep 17 00:00:00 2001 From: Jonny Date: Sun, 16 Jun 2019 18:28:37 +0200 Subject: [PATCH 2/8] Make sanity check before sending create request to backend --- pages/create.js | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/pages/create.js b/pages/create.js index 01b92a2..1a81f1f 100644 --- a/pages/create.js +++ b/pages/create.js @@ -78,6 +78,7 @@ class CreateTournamentForm extends React.Component { this.increaseGroupSize = this.increaseGroupSize.bind(this); this.decreaseGroupSize = this.decreaseGroupSize.bind(this); this.generateTournamentCreationObject = this.generateTournamentCreationObject.bind(this); + this.valuesAreCredible = this.valuesAreCredible.bind(this); this.create = this.create.bind(this); } @@ -197,11 +198,17 @@ class CreateTournamentForm extends React.Component { } create() { - createTournament(this.generateTournamentCreationObject(), () => { - notify.show('Das Turnier wurde erfolgreich erstellt.', 'success', 5000); - }, () => { - notify.show('Das Turnier konnte nicht erstellt werden.', 'warning', 5000); - }); + if (this.valuesAreCredible()) { + createTournament(this.generateTournamentCreationObject(), () => { + notify.show('Das Turnier wurde erfolgreich erstellt.', 'success', 5000); + }, () => { + notify.show('Das Turnier konnte nicht erstellt werden.', 'warning', 5000); + }); + } + } + + valuesAreCredible() { + return this.state.groups.length >= this.state.groupAdvance; } generateTournamentCreationObject() { From 39164053ffe1485172f19c6ebf68caf15d299bab Mon Sep 17 00:00:00 2001 From: Jonny Date: Sun, 16 Jun 2019 19:10:04 +0200 Subject: [PATCH 3/8] Add warning popup for invalid values --- js/components/WarningPopup.js | 23 +++++++++++++++++++++++ pages/create.js | 20 +++++++++++++------- 2 files changed, 36 insertions(+), 7 deletions(-) create mode 100644 js/components/WarningPopup.js diff --git a/js/components/WarningPopup.js b/js/components/WarningPopup.js new file mode 100644 index 0000000..a1196cc --- /dev/null +++ b/js/components/WarningPopup.js @@ -0,0 +1,23 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import {Alert} from 'reactstrap'; + +export class WarningPopup extends React.Component { + render() { + if (this.props.shown) { + return (
+ {this.props.children} + + {this.props.text} + +
); + } else { + return this.props.children; + } + } +} + +WarningPopup.propTypes = { + text: PropTypes.string.isRequired, + shown: PropTypes.bool.isRequired +} \ No newline at end of file diff --git a/pages/create.js b/pages/create.js index 1a81f1f..acbedb8 100644 --- a/pages/create.js +++ b/pages/create.js @@ -8,6 +8,7 @@ import {TurniereNavigation} from '../js/components/Navigation'; import {Footer} from '../js/components/Footer'; import EditableStringList from '../js/components/EditableStringList'; import {createTournament} from '../js/api'; +import {WarningPopup} from '../js/components/WarningPopup' import '../static/css/everypage.css'; import RequireLogin from '../js/components/RequireLogin'; @@ -50,7 +51,7 @@ function CreateTournamentCard() { const GroupphaseFader = posed.div({ visible: { - opacity: 1, height: 150 + opacity: 1, height: 200 }, hidden: { opacity: 0, height: 0 } @@ -118,11 +119,14 @@ class CreateTournamentForm extends React.Component { - - - + + + + + @@ -204,11 +208,13 @@ class CreateTournamentForm extends React.Component { }, () => { notify.show('Das Turnier konnte nicht erstellt werden.', 'warning', 5000); }); + } else { + notify.show('Bitte korrigiere deine Eingaben zuerst.', 'warning', 5000); } } valuesAreCredible() { - return this.state.groups.length >= this.state.groupAdvance; + return this.state.teams.length >= this.state.groupAdvance; } generateTournamentCreationObject() { From 4cc26605515ed96e88e5281f6cc61cc4bc6cf51d Mon Sep 17 00:00:00 2001 From: Felix Hamme Date: Mon, 17 Jun 2019 19:40:53 +0200 Subject: [PATCH 4/8] Code style fixes --- js/components/WarningPopup.js | 2 +- pages/create.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/js/components/WarningPopup.js b/js/components/WarningPopup.js index a1196cc..77729dc 100644 --- a/js/components/WarningPopup.js +++ b/js/components/WarningPopup.js @@ -20,4 +20,4 @@ export class WarningPopup extends React.Component { WarningPopup.propTypes = { text: PropTypes.string.isRequired, shown: PropTypes.bool.isRequired -} \ No newline at end of file +}; diff --git a/pages/create.js b/pages/create.js index acbedb8..1e8f678 100644 --- a/pages/create.js +++ b/pages/create.js @@ -8,7 +8,7 @@ import {TurniereNavigation} from '../js/components/Navigation'; import {Footer} from '../js/components/Footer'; import EditableStringList from '../js/components/EditableStringList'; import {createTournament} from '../js/api'; -import {WarningPopup} from '../js/components/WarningPopup' +import {WarningPopup} from '../js/components/WarningPopup'; import '../static/css/everypage.css'; import RequireLogin from '../js/components/RequireLogin'; From 5230b0b52b833cccbc272b4d1b9a54889a2d109c Mon Sep 17 00:00:00 2001 From: Felix Hamme Date: Mon, 17 Jun 2019 21:23:15 +0200 Subject: [PATCH 5/8] Bugfix: don't sign out if the tournament creation backend call fails --- js/api.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/api.js b/js/api.js index a29021c..bf66369 100644 --- a/js/api.js +++ b/js/api.js @@ -183,7 +183,10 @@ const reducerTournamentinfo = (state = defaultStateTournamentinfo, action) => { postRequest(action.state, '/tournaments', action.parameters.tournament).then(resp => { storeOptionalToken(resp); action.parameters.successCallback(); - }).catch(() => { + }).catch(error => { + if (error.response) { + storeOptionalToken(error.response); + } action.parameters.errorCallback(); }); return Object.assign({}, state, {}); From 682db6f8322a80d5628fe941734bf5c9095f5f22 Mon Sep 17 00:00:00 2001 From: Felix Hamme Date: Mon, 17 Jun 2019 22:26:58 +0200 Subject: [PATCH 6/8] Cleanup: Use reactstrap components instead of buggy "self-coded" stuff --- js/components/WarningPopup.js | 17 +++++------- pages/create.js | 50 ++++++++++++++++++++--------------- 2 files changed, 34 insertions(+), 33 deletions(-) diff --git a/js/components/WarningPopup.js b/js/components/WarningPopup.js index 77729dc..0c0152a 100644 --- a/js/components/WarningPopup.js +++ b/js/components/WarningPopup.js @@ -1,19 +1,14 @@ import React from 'react'; import PropTypes from 'prop-types'; -import {Alert} from 'reactstrap'; +import {Alert, Collapse} from 'reactstrap'; export class WarningPopup extends React.Component { render() { - if (this.props.shown) { - return (
- {this.props.children} - - {this.props.text} - -
); - } else { - return this.props.children; - } + return ( + + {this.props.text} + + ); } } diff --git a/pages/create.js b/pages/create.js index 1e8f678..1d654f6 100644 --- a/pages/create.js +++ b/pages/create.js @@ -2,8 +2,20 @@ import Head from 'next/head'; import React from 'react'; import {notify} from 'react-notify-toast'; import {connect} from 'react-redux'; -import posed from 'react-pose'; -import {Button, Card, CardBody, Col, Container, CustomInput, Form, FormGroup, Input, Label} from 'reactstrap'; +import { + Button, + Card, + CardBody, + Col, + Collapse, + Container, + CustomInput, + Form, + FormGroup, + Input, + Label, + Row +} from 'reactstrap'; import {TurniereNavigation} from '../js/components/Navigation'; import {Footer} from '../js/components/Footer'; import EditableStringList from '../js/components/EditableStringList'; @@ -49,14 +61,6 @@ function CreateTournamentCard() { ); } -const GroupphaseFader = posed.div({ - visible: { - opacity: 1, height: 200 - }, hidden: { - opacity: 0, height: 0 - } -}); - class CreateTournamentForm extends React.Component { constructor(props) { super(props); @@ -106,29 +110,31 @@ class CreateTournamentForm extends React.Component { checked={this.state.groupPhaseEnabled} onChange={this.handleGroupPhaseEnabledInput}/> - + - - - + + + + + - - + + - + + - +

Teams

Date: Mon, 17 Jun 2019 22:28:24 +0200 Subject: [PATCH 7/8] Make group advance input error message more verbose --- pages/create.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/pages/create.js b/pages/create.js index 1d654f6..e9fedbc 100644 --- a/pages/create.js +++ b/pages/create.js @@ -131,7 +131,9 @@ class CreateTournamentForm extends React.Component { decrementText="÷2" decrementCallback={this.decreaseGroupAdvance}/> - From d421cb29745ec5c7f6520c7a79e6e8650fb7bcf2 Mon Sep 17 00:00:00 2001 From: Felix Hamme Date: Mon, 17 Jun 2019 22:42:51 +0200 Subject: [PATCH 8/8] Add error message and prevent submit on tournament creation if not all groups are 100% full --- pages/create.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/pages/create.js b/pages/create.js index e9fedbc..0883b4a 100644 --- a/pages/create.js +++ b/pages/create.js @@ -120,6 +120,7 @@ class CreateTournamentForm extends React.Component { decrementText="-1" decrementCallback={this.decreaseGroupSize}/> +