Merge pull request #883 from ubavic/fix/bill_count_validation_error_missing

fix: add validation errors to the update wizard
This commit is contained in:
Rafael Taranto 2021-11-12 10:08:17 +00:00 committed by GitHub
commit 82f1eaa87c
2 changed files with 19 additions and 4 deletions

View file

@ -76,7 +76,7 @@ const Wizard = ({ machine, cashoutSettings, locale, onClose, save, error }) => {
{ {
type: 'cashbox', type: 'cashbox',
schema: Yup.object().shape({ schema: Yup.object().shape({
wasCashboxEmptied: Yup.string().required() wasCashboxEmptied: Yup.string().required('Select one option.')
}), }),
cashoutRequired: false cashoutRequired: false
}, },
@ -84,6 +84,7 @@ const Wizard = ({ machine, cashoutSettings, locale, onClose, save, error }) => {
type: 'cassette 1', type: 'cassette 1',
schema: Yup.object().shape({ schema: Yup.object().shape({
cassette1Count: Yup.number() cassette1Count: Yup.number()
.label('Bill count')
.required() .required()
.min(0) .min(0)
.max(CASHBOX_DEFAULT_CAPACITY) .max(CASHBOX_DEFAULT_CAPACITY)
@ -94,6 +95,7 @@ const Wizard = ({ machine, cashoutSettings, locale, onClose, save, error }) => {
type: 'cassette 2', type: 'cassette 2',
schema: Yup.object().shape({ schema: Yup.object().shape({
cassette2Count: Yup.number() cassette2Count: Yup.number()
.label('Bill count')
.required() .required()
.min(0) .min(0)
.max(CASHBOX_DEFAULT_CAPACITY) .max(CASHBOX_DEFAULT_CAPACITY)

View file

@ -14,7 +14,7 @@ import cashbox from 'src/styling/icons/cassettes/acceptor-left.svg'
import cassetteOne from 'src/styling/icons/cassettes/dispenser-1.svg' import cassetteOne from 'src/styling/icons/cassettes/dispenser-1.svg'
import cassetteTwo from 'src/styling/icons/cassettes/dispenser-2.svg' import cassetteTwo from 'src/styling/icons/cassettes/dispenser-2.svg'
import { ReactComponent as TxOutIcon } from 'src/styling/icons/direction/cash-out.svg' import { ReactComponent as TxOutIcon } from 'src/styling/icons/direction/cash-out.svg'
import { comet } from 'src/styling/variables' import { comet, errorColor } from 'src/styling/variables'
const styles = { const styles = {
content: { content: {
@ -83,6 +83,9 @@ const styles = {
}, },
fiatTotal: { fiatTotal: {
color: comet color: comet
},
errorMessage: {
color: errorColor
} }
} }
@ -142,7 +145,7 @@ const WizardStep = ({
initialValues={{ wasCashboxEmptied: '' }} initialValues={{ wasCashboxEmptied: '' }}
enableReinitialize enableReinitialize
validationSchema={steps[step - 1].schema}> validationSchema={steps[step - 1].schema}>
{({ values }) => ( {({ values, errors }) => (
<Form> <Form>
<div <div
className={classnames(classes.horizontalAlign, classes.form)}> className={classnames(classes.horizontalAlign, classes.form)}>
@ -163,6 +166,11 @@ const WizardStep = ({
options={stepOneRadioOptions} options={stepOneRadioOptions}
className={classes.horizontalAlign} className={classes.horizontalAlign}
/> />
{errors.wasCashboxEmptied && (
<div className={classes.errorMessage}>
{errors.wasCashboxEmptied}
</div>
)}
<div <div
className={classnames( className={classnames(
classes.horizontalAlign, classes.horizontalAlign,
@ -205,7 +213,7 @@ const WizardStep = ({
initialValues={{ cassette1Count: '', cassette2Count: '' }} initialValues={{ cassette1Count: '', cassette2Count: '' }}
enableReinitialize enableReinitialize
validationSchema={steps[step - 1].schema}> validationSchema={steps[step - 1].schema}>
{({ values }) => ( {({ values, errors }) => (
<Form> <Form>
<div <div
className={classnames(classes.horizontalAlign, classes.form)}> className={classnames(classes.horizontalAlign, classes.form)}>
@ -269,6 +277,11 @@ const WizardStep = ({
cassetteInfo.denomination}{' '} cassetteInfo.denomination}{' '}
{fiatCurrency} {fiatCurrency}
</P> </P>
<P className={classes.errorMessage}>
{step === 2
? errors.cassette1Count
: errors.cassette2Count}
</P>
</div> </div>
</div> </div>
</div> </div>