I am using formik with Yup validation, and I want to perform a validation where the field is at at a different level of the shape.
Here is what I've tried so far, and doesn't seem to work.
const conditional = Yup.object().shape({
signup: Yup.object().shape({
callingFor: Yup.string(),
person: Yup.object().shape({
firstName: Yup.string()
.when('callingFor', {
is: (callingFor) => callingFor !== 'Myself',
then: Yup.string().required('First Name is required')
})
})
})
})
What I want to happen is that when a user selects Myself from a select input, then I would expect that the first name is required, otherwise it is not.