diff --git a/src/components/ChallengeEditor/ChallengePrizes-Field/index.js b/src/components/ChallengeEditor/ChallengePrizes-Field/index.js index 24fb5f83..5897a08b 100644 --- a/src/components/ChallengeEditor/ChallengePrizes-Field/index.js +++ b/src/components/ChallengeEditor/ChallengePrizes-Field/index.js @@ -8,7 +8,12 @@ import PrizeInput from '../../PrizeInput' import styles from './ChallengePrizes-Field.module.scss' import cn from 'classnames' import { PrimaryButton } from '../../Buttons' -import { CHALLENGE_PRIZE_TYPE, VALIDATION_VALUE_TYPE, PRIZE_SETS_TYPE, CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES } from '../../../config/constants' +import { + CHALLENGE_PRIZE_TYPE, + VALIDATION_VALUE_TYPE, + PRIZE_SETS_TYPE, + CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES +} from '../../../config/constants' import { validateValue } from '../../../util/input-check' class ChallengePrizesField extends Component { @@ -26,7 +31,10 @@ class ChallengePrizesField extends Component { addNewPrize () { const challengePrize = this.getChallengePrize() - challengePrize.prizes = [...challengePrize.prizes, { type: CHALLENGE_PRIZE_TYPE.USD, value: 1 }] + challengePrize.prizes = [ + ...challengePrize.prizes, + { type: CHALLENGE_PRIZE_TYPE.USD, value: 1 } + ] this.onUpdateValue(challengePrize) } @@ -38,7 +46,10 @@ class ChallengePrizesField extends Component { onUpdateInput (value, index) { const challengePrize = this.getChallengePrize() - challengePrize.prizes[index].value = validateValue(value, VALIDATION_VALUE_TYPE.INTEGER) + challengePrize.prizes[index].value = validateValue( + value, + VALIDATION_VALUE_TYPE.INTEGER + ) if (parseInt(challengePrize.prizes[index].value) > 1000000) { challengePrize.prizes[index].value = '1000000' } @@ -48,60 +59,102 @@ class ChallengePrizesField extends Component { onUpdateValue (challengePrize) { const type = PRIZE_SETS_TYPE.CHALLENGE_PRIZES const { onUpdateOthers, challenge } = this.props - const existingPrizes = challenge.prizeSets ? challenge.prizeSets.filter(p => p.type !== type) : [] + const existingPrizes = challenge.prizeSets + ? challenge.prizeSets.filter(p => p.type !== type) + : [] - onUpdateOthers({ field: 'prizeSets', value: [...existingPrizes, challengePrize] }) + onUpdateOthers({ + field: 'prizeSets', + value: [...existingPrizes, challengePrize] + }) } getChallengePrize () { const type = PRIZE_SETS_TYPE.CHALLENGE_PRIZES - return (this.props.challenge.prizeSets && this.props.challenge.prizeSets.length && this.props.challenge.prizeSets.find(p => p.type === type)) || { type, prizes: [{ type: CHALLENGE_PRIZE_TYPE.USD, value: 0 }] } + return ( + (this.props.challenge.prizeSets && + this.props.challenge.prizeSets.length && + this.props.challenge.prizeSets.find(p => p.type === type)) || { + type, + prizes: [{ type: CHALLENGE_PRIZE_TYPE.USD, value: 0 }] + } + ) } renderPrizes () { const { currentPrizeIndex } = this.state const { readOnly, challenge } = this.props - const allowMultiplePrizes = _.includes(CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES, challenge.type) - return _.map(this.getChallengePrize().prizes, (prize, index, { length }) => ( -
-
-
- -
- {readOnly ? ( - ${prize.value} - ) : (
- - { - index > 0 && ( -
this.removePrize(index)}> - + const allowMultiplePrizes = _.includes( + CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES, + challenge.type + ) + return _.map( + this.getChallengePrize().prizes, + (prize, index, { length }) => { + let errMessage = '' + if (prize.value === '') { + errMessage = 'Prize amount is required field' + } else if (+prize.value <= 0 || +prize.value > 1000000) { + errMessage = + 'Prize amount must be more than 0 and no more than 1000000' + } else if (index > 0) { + const prePrize = this.getChallengePrize().prizes[index - 1] + if (+prePrize.value < +prize.value) { + errMessage = + 'Prize for the higher place cannot be bigger than for lower place' + } + } + return ( +
+
+
+ +
+ {readOnly ? ( + ${prize.value} + ) : ( +
+ + {index > 0 && ( +
this.removePrize(index)} + > + +
+ )}
- ) - } -
)} -
- {!readOnly && challenge.submitTriggered && (prize.value === '' || (+prize.value <= 0 || +prize.value > 1000000)) && ( -
-
-
- {prize.value === '' - ? 'Prize amount is required field' - : 'Prize amount must be more than 0 and no more than 1000000'} + )}
+ {!readOnly && challenge.submitTriggered && errMessage && ( +
+
+
+ {errMessage} +
+
+ )}
- )} -
- )) + ) + } + ) } render () { const { readOnly, challenge } = this.props - const allowMultiplePrizes = _.includes(CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES, challenge.type) + const allowMultiplePrizes = _.includes( + CHALLENGE_TYPES_WITH_MULTIPLE_PRIZES, + challenge.type + ) return (
@@ -109,10 +162,12 @@ class ChallengePrizesField extends Component {
- { this.renderPrizes() } - {!readOnly && allowMultiplePrizes && (
- -
)} + {this.renderPrizes()} + {!readOnly && allowMultiplePrizes && ( +
+ +
+ )}
) } diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js index d4a20a31..bfb86d45 100644 --- a/src/components/ChallengeEditor/index.js +++ b/src/components/ChallengeEditor/index.js @@ -677,7 +677,7 @@ class ChallengeEditor extends Component { return false } - return _.every(challengePrizes.prizes, (prize) => { + return _.every(challengePrizes.prizes, (prize, index) => { if (prize.value === '') { return false } @@ -685,6 +685,11 @@ class ChallengeEditor extends Component { if (prizeNumber <= 0 || prizeNumber > 1000000) { return false } + if (index > 0) { + if (+prize.value > +challengePrizes.prizes[index - 1].value) { + return false + } + } return true }) }