How to handle multiple dependent validation schema?

[crowd-dong]

Grettings Yup team. As the title implies i have a question regarding mutlipe fields and how to validate them when they are dependepent upon each other.

https://dev.to/gabrielterriaga/how-to-validate-two-fields-that-depend-on-each-other-with-yup-1ccg

I kinda use the article above to help me solve my problem but i am just not sure if i understand what is happening.

I basically have a form with 4 fields. If 1 of the field is filed then the other 3 fields become a required field.

   Myfield: Yup.object().shape(
      {
        code: Yup.string().when(['number', 'secondary_code', 'name'], {
          is: (number, code, name) => !!number || !!code || !!name,
          then: Yup.string().required(),
        }),
        number: Yup.string().when(['code', 'secondary_code', 'name'], {
          is: (code, secondaryCode, name) => {
            return !!code || !!secondaryCode || !!name;
          },
          then: Yup.string().required(),
        }),
        secondary_code: Yup.string().when(['code', 'number', 'name'], {
          is: (code, number, name) => !!code || !!number || !!name,
          then: Yup.string().required(),
        }),
        name: Yup.string().when(['code', 'number', 'secondyar_code'], {
          is: (code, number, secondaryCode) => !!code || !!number || !!secondaryCode,
          then: Yup.string().required(),
        }),
      },
      [  // What is going on with this.  Rearranging it causes cyclical errors. Why is that?
        ['code', 'secondary_code'],
        ['code', 'number'],
        ['number', 'secondary_code'],
        ['number', 'name'],
        ['name', 'secondary_code'],
        ['code', 'name'],
      ],
    ),

My questions is what is happening behind the scenes, and what is happening regarding the second argument in Yup.shape()
I believe its call the noSortEdges value. While the above code works and it solves my problem, i would like to understand what is happening. Is my way of doing it a very roundabout way? I also tried use test() as a means to solve my problem. What would be a better option. Any help would be greatly appreciated.

Sandbox
https://codesandbox.io/s/formik-with-yup-example-form-forked-nksgl?file=/src/index.js

[crowd-dong]

I end up trying Yup.lazy and this would also worked for my needs. Would be this be a better solution?

my_field: Yup.lazy((values) => {
   const {name, code, secondary_code, number} = values
   if (!!name || !!code || !!secondary_code || !!number) {
     return Yup.object().shape({
            code: Yup.string().required(),
            name: Yup.string().required(),
            .....
            })
       }
   return Yup.mixed().notRequired()
 })

[mdestafadilah]

Hi, can you help me my question in SO, please.

https://stackoverflow.com/questions/72008036/added-2-schema-in-yup-validation-react-hook-form

thanks b4.

[Leoocast]

Yup lazy with the dependency array works for me, thanks!