mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2025-02-17 00:21:20 -05:00
changed naming of user-provided radio input from other to custom
This commit is contained in:
parent
8725cee6a1
commit
c4d7ba0350
2 changed files with 18 additions and 15 deletions
|
@ -65,9 +65,9 @@ FormikRadioButtonSubComponent.propTypes = {
|
|||
const FormikRadioButton = ({
|
||||
buttonValue,
|
||||
className,
|
||||
isOther,
|
||||
isCustomInput,
|
||||
label,
|
||||
onSetOther,
|
||||
onSetCustom,
|
||||
...props
|
||||
}) => (
|
||||
<Field
|
||||
|
@ -76,18 +76,18 @@ const FormikRadioButton = ({
|
|||
component={FormikRadioButtonSubComponent}
|
||||
id="radioOption1"
|
||||
label={label}
|
||||
labelClassName={isOther ? 'formik-radio-label-other' : ''}
|
||||
labelClassName={isCustomInput ? 'formik-radio-label-other' : ''}
|
||||
{...props}
|
||||
>
|
||||
{isOther && (
|
||||
{isCustomInput && (
|
||||
<FormikInput
|
||||
className="formik-radio-input"
|
||||
id="other"
|
||||
name="other"
|
||||
wrapperClassName="formik-radio-input-wrapper"
|
||||
/* eslint-disable react/jsx-no-bind */
|
||||
onChange={event => onSetOther(event.target.value)}
|
||||
onFocus={event => onSetOther(event.target.value)}
|
||||
onChange={event => onSetCustom(event.target.value)}
|
||||
onFocus={event => onSetCustom(event.target.value)}
|
||||
/* eslint-enable react/jsx-no-bind */
|
||||
/>
|
||||
)}
|
||||
|
@ -97,9 +97,9 @@ const FormikRadioButton = ({
|
|||
FormikRadioButton.propTypes = {
|
||||
buttonValue: PropTypes.string,
|
||||
className: PropTypes.string,
|
||||
isOther: PropTypes.bool,
|
||||
isCustomInput: PropTypes.bool,
|
||||
label: PropTypes.string,
|
||||
onSetOther: PropTypes.func,
|
||||
onSetCustom: PropTypes.func,
|
||||
value: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
|
||||
};
|
||||
|
||||
|
|
|
@ -58,7 +58,7 @@ class GenderStep extends React.Component {
|
|||
if (!formData.gender || formData.gender === 'null') {
|
||||
formData.gender = 'Prefer not to say';
|
||||
}
|
||||
delete formData.other;
|
||||
delete formData.custom;
|
||||
this.props.onNextStep(formData);
|
||||
}
|
||||
render () {
|
||||
|
@ -66,7 +66,7 @@ class GenderStep extends React.Component {
|
|||
<Formik
|
||||
initialValues={{
|
||||
gender: 'null',
|
||||
other: ''
|
||||
custom: ''
|
||||
}}
|
||||
onSubmit={this.handleValidSubmit}
|
||||
>
|
||||
|
@ -104,22 +104,25 @@ class GenderStep extends React.Component {
|
|||
'row',
|
||||
'row-inline',
|
||||
'gender-radio-row',
|
||||
{'gender-radio-row-selected': (values.gender === values.other)}
|
||||
{'gender-radio-row-selected': (values.gender === values.custom)}
|
||||
)}
|
||||
/* eslint-disable react/jsx-no-bind */
|
||||
onClick={() => setFieldValue('gender', values.other, false)}
|
||||
onClick={() => setFieldValue('gender', values.custom, false)}
|
||||
/* eslint-enable react/jsx-no-bind */
|
||||
>
|
||||
<FormikRadioButton
|
||||
isOther
|
||||
buttonValue={values.other}
|
||||
isCustomInput
|
||||
buttonValue={values.custom}
|
||||
className={classNames(
|
||||
'join-flow-radio'
|
||||
)}
|
||||
label={this.props.intl.formatMessage({id: 'registration.genderOptionAnother'})}
|
||||
name="gender"
|
||||
/* eslint-disable react/jsx-no-bind */
|
||||
onSetOther={newOtherVal => setValues({gender: newOtherVal, other: newOtherVal})}
|
||||
onSetCustom={newCustomVal => setValues({
|
||||
gender: newCustomVal,
|
||||
custom: newCustomVal
|
||||
})}
|
||||
/* eslint-enable react/jsx-no-bind */
|
||||
/>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue