update yup

[alttp.git] / resources / js / components / results / ReportForm.js

diff --git a/resources/js/components/results/ReportForm.js b/resources/js/components/results/ReportForm.js
index 28a757a78ed9326a916aa6f3f24a18b3f7fedda6..2e85f4a4c3abfb9c334b3cd18253bf91727001f3 100644 (file)
--- a/resources/js/components/results/ReportForm.js
+++ b/resources/js/components/results/ReportForm.js
@@ -8,7 +8,7 @@ import toastr from 'toastr';
 
 import LargeCheck from '../common/LargeCheck';
 import laravelErrorsToFormik from '../../helpers/laravelErrorsToFormik';
-import { findResult } from '../../helpers/Participant';
+import { findResult } from '../../helpers/User';
 import { formatTime, parseTime } from '../../helpers/Result';
 import i18n from '../../i18n';
 import yup from '../../schema/yup';
@@ -19,50 +19,86 @@ const ReportForm = ({
        handleChange,
        handleSubmit,
        onCancel,
+       round,
        touched,
        values,
 }) =>
 <Form noValidate onSubmit={handleSubmit}>
        <Modal.Body>
-               <Row>
-                       <Form.Group as={Col} sm={9} controlId="report.time">
-                               <Form.Label>{i18n.t('results.reportTime')}</Form.Label>
-                               <Form.Control
-                                       isInvalid={!!(touched.time && errors.time)}
-                                       name="time"
-                                       onBlur={handleBlur}
-                                       onChange={handleChange}
-                                       placeholder={values.forfeit ? 'DNF' : '1:22:59'}
-                                       type="text"
-                                       value={values.time || ''}
-                               />
-                               {touched.time && errors.time ?
-                                       <Form.Control.Feedback type="invalid">
-                                               {i18n.t(errors.time)}
-                                       </Form.Control.Feedback>
-                               :
-                                       <Form.Text muted>
-                                               {parseTime(values.time) ?
-                                                       i18n.t(
-                                                               'results.reportPreview',
-                                                               { time: formatTime({ time: parseTime(values.time) })},
-                                                       )
-                                               : null}
-                                       </Form.Text>
-                               }
-                       </Form.Group>
-                       <Form.Group as={Col} sm={3} controlId="report.forfeit">
-                               <Form.Label>{i18n.t('results.forfeit')}</Form.Label>
-                               <Form.Control
-                                       as={LargeCheck}
-                                       isInvalid={!!(touched.forfeit && errors.forfeit)}
-                                       name="forfeit"
-                                       onBlur={handleBlur}
-                                       onChange={handleChange}
-                                       value={!!values.forfeit}
-                               />
-                       </Form.Group>
-               </Row>
+               {!round.locked ?
+                       <Row>
+                               <Form.Group as={Col} sm={9} controlId="report.time">
+                                       <Form.Label>{i18n.t('results.reportTime')}</Form.Label>
+                                       <Form.Control
+                                               isInvalid={!!(touched.time && errors.time)}
+                                               name="time"
+                                               onBlur={handleBlur}
+                                               onChange={handleChange}
+                                               placeholder={values.forfeit ? 'DNF' : '1:22:59'}
+                                               type="text"
+                                               value={values.time || ''}
+                                       />
+                                       {touched.time && errors.time ?
+                                               <Form.Control.Feedback type="invalid">
+                                                       {i18n.t(errors.time)}
+                                               </Form.Control.Feedback>
+                                       :
+                                               <Form.Text muted>
+                                                       {parseTime(values.time) ?
+                                                               i18n.t(
+                                                                       'results.reportPreview',
+                                                                       { time: formatTime({ time: parseTime(values.time) })},
+                                                               )
+                                                       : null}
+                                               </Form.Text>
+                                       }
+                               </Form.Group>
+                               <Form.Group as={Col} sm={3} controlId="report.forfeit">
+                                       <Form.Label>{i18n.t('results.forfeit')}</Form.Label>
+                                       <Form.Control
+                                               as={LargeCheck}
+                                               isInvalid={!!(touched.forfeit && errors.forfeit)}
+                                               name="forfeit"
+                                               onBlur={handleBlur}
+                                               onChange={handleChange}
+                                               value={!!values.forfeit}
+                                       />
+                               </Form.Group>
+                       </Row>
+               : null}
+               <Form.Group controlId="report.vod">
+                       <Form.Label>{i18n.t('results.vod')}</Form.Label>
+                       <Form.Control
+                               isInvalid={!!(touched.vod && errors.vod)}
+                               name="vod"
+                               onBlur={handleBlur}
+                               onChange={handleChange}
+                               placeholder="https://twitch.tv/youtube"
+                               type="text"
+                               value={values.vod || ''}
+                       />
+                       {touched.vod && errors.vod ?
+                               <Form.Control.Feedback type="invalid">
+                                       {i18n.t(errors.vod)}
+                               </Form.Control.Feedback>
+                       :
+                               <Form.Text muted>
+                                       {i18n.t('results.vodNote')}
+                               </Form.Text>
+                       }
+               </Form.Group>
+               <Form.Group controlId="report.comment">
+                       <Form.Label>{i18n.t('results.comment')}</Form.Label>
+                       <Form.Control
+                               as="textarea"
+                               isInvalid={!!(touched.comment && errors.comment)}
+                               name="comment"
+                               onBlur={handleBlur}
+                               onChange={handleChange}
+                               rows="6"
+                               value={values.comment || ''}
+                       />
+               </Form.Group>
        </Modal.Body>
        <Modal.Footer>
                {onCancel ?
@@ -78,20 +114,29 @@ const ReportForm = ({
 
 ReportForm.propTypes = {
        errors: PropTypes.shape({
+               comment: PropTypes.string,
                forfeit: PropTypes.string,
                time: PropTypes.string,
+               vod: PropTypes.string,
        }),
        handleBlur: PropTypes.func,
        handleChange: PropTypes.func,
        handleSubmit: PropTypes.func,
        onCancel: PropTypes.func,
+       round: PropTypes.shape({
+               locked: PropTypes.bool,
+       }),
        touched: PropTypes.shape({
+               comment: PropTypes.bool,
                forfeit: PropTypes.bool,
                time: PropTypes.bool,
+               vod: PropTypes.bool,
        }),
        values: PropTypes.shape({
+               comment: PropTypes.string,
                forfeit: PropTypes.bool,
                time: PropTypes.string,
+               vod: PropTypes.string,
        }),
 };
 
@@ -99,15 +144,17 @@ export default withFormik({
        displayName: 'ReportForm',
        enableReinitialize: true,
        handleSubmit: async (values, actions) => {
-               const { forfeit, participant_id, round_id, time } = values;
+               const { comment, forfeit, round_id, time, user_id, vod } = values;
                const { setErrors } = actions;
                const { onCancel } = actions.props;
                try {
                        await axios.post('/api/results', {
+                               comment,
                                forfeit,
-                               participant_id,
                                round_id,
                                time: parseTime(time) || 0,
+                               user_id,
+                               vod,
                        });
                        toastr.success(i18n.t('results.reportSuccess'));
                        if (onCancel) {
@@ -120,20 +167,24 @@ export default withFormik({
                        }
                }
        },
-       mapPropsToValues: ({ participant, round }) => {
-               const result = findResult(participant, round);
+       mapPropsToValues: ({ round, user }) => {
+               const result = findResult(user, round);
                return {
+                       comment: result && result.comment ? result.comment : '',
                        forfeit: result ? !!result.forfeit : false,
-                       participant_id: participant.id,
                        round_id: round.id,
                        time: result && result.time ? formatTime(result) : '',
+                       user_id: user.id,
+                       vod: result && result.vod ? result.vod : '',
                };
        },
        validationSchema: yup.object().shape({
+               comment: yup.string(),
                forfeit: yup.boolean().required(),
                time: yup.string().time().when('forfeit', {
                        is: false,
-                       then: yup.string().required().time(),
+                       then: () => yup.string().required().time(),
                }),
+               vod: yup.string().url(),
        }),
 })(withTranslation()(ReportForm));