I have an interface:

interface DataEntity {
  personId: number;
  name: string | null;
}

I need to validate these inputs in my form:

const validateSchema = yup.object().shape({
  personId: yup.number().required(),
  name: yup.string()
});

const A = () => {
  const { methods } = useForm({
     ...
     resolver: yupResolver(validationSchema),
  });
  ...
}

I get the following error:

Types of property ‘name’ are incompatible.
Type ‘string | null’ is not assignable to type ‘string | undefined’.
Type ‘null’ is not assignable to type ‘string | undefined’.ts(2322)

I changed to this:

const validateSchema = yup.object().shape({
  personId: yup.number().required(),
  name: yup.string().nullable()
});

I get the following error:

Type ‘ResolverOptions’ is not assignable to type ‘ResolverOptions<{ name?: string | null | undefined; personId: number; }>’.
Type ‘{ name?: string | null | undefined; personId: number; }’ is not assignable to type ‘DataEntity’.ts(2322)

packages:
“@hookform/resolvers”: “^3.3.4”
“react-hook-form”: “^7.51.3”
“yup”: “^1.4.0”

Tried solutions are given above.