I am creating a multipage form with formik and yup. Some of the values are required at times and are nullable at other times. to combate rewritting a simialr yup schema mutiple times I have a hook that holds all of the yup fields as so
export type UpdateFormYupFields = Required<{
[key in keyof UpdateFormInput]: yup.AnySchema;
}>;
type UseGetChemicalReceiptYupSchemaReturn = {
values: UpdateFormYupFields;
nullables: UpdateFormYupFields;
};
export const useGetYupFields(): UseGetYupFields =>{
return useMemo(()=>{
values:
//WORKS
rejectionNote: yup.string().typeError("...").required("...")
id: yup.string().typeError("...").required("..."),
status: yup.mixed<FormStatusEnum>().oneOf(Object.values(FormStatusEnum)).typeError("...").required("..."),
//DOES NOT WORK
sealNumbers: yup.array().of(yup.string().min(1).typeError("error type").required("Required")),
}
nullables:{
rejectionNote: yup.string().nullable()
id: yup.string().nullable(),
//etc.
}
},[])
}
I then pull this into another custom hook where I destructure only the required values or nullable values I want. This has been working for the last 20 properties on the form but since.
When I try to reference sealNumbers as shown below I get the following error
export type CreateFormInputInput = {
billOfLadingNumber: Scalars["String"];
chemicalId: Scalars["String"];
createdBy: Scalars["String"];
deliveryQuantity: Scalars["String"];
facilityId: Scalars["String"];
poNumber: Scalars["String"];
receivedBy: Scalars["String"];
receivingDate: Scalars["Date"];
sealNumbers: Array<Scalars["String"]>;
supplier: Scalars["String"];
};
const useGetCreatePrepSchema = (): SchemaOF<CreateFormInput> =>{
const {
values: {
receivingDate,
supplier,
chemicalId,
sealNumbers, // getting sealNumbers from here currently does not work for some reason like it does for the others
poNumber,
deliveryQuantity,
billOfLadingNumber,
createdBy,
receivedBy,
facilityId,} } = useGetYupFields()
return useMemo(()=>{
receivingDate,
supplier,
chemicalId,
//USING sealNumbers LIKE THIS DOESNT WORK
sealNumbers,
//BUT WHEN I WRITE IT IN THIS FILE IT DOES WORK
// sealNumbers: yup.array().of(yup.string().min(1).typeError("error type").required("Required")),
poNumber,
deliveryQuantity,
billOfLadingNumber,
createdBy,
receivedBy,
facilityId,
}
,[])
}
Full Error message:
Error:(26, 3) TS2322: Type 'OptionalObjectSchema<{ receivingDate: AnySchema<any, any, any>; supplier: AnySchema<any, any, any>; chemicalId: AnySchema<any, any, any>; sealNumbers: RequiredArraySchema<StringSchema<string | undefined, AnyObject, string | undefined>, AnyObject, (string | undefined)[] | undefined>; ... 5 more ...; facilityId: AnySc...' is not assignable to type 'ObjectSchemaOf<CreateChemicalReceiptInput, never>'.
The types of 'fields.sealNumbers.innerType' are incompatible between these types.
Type 'StringSchema<string | undefined, AnyObject, string | undefined> | undefined' is not assignable to type 'BaseSchema<Maybe<string>, AnyObject, string> | Lazy<BaseSchema<Maybe<string>, AnyObject, string>, AnyObject> | undefined'.
Type 'StringSchema<string | undefined, AnyObject, string | undefined>' is not assignable to type 'BaseSchema<Maybe<string>, AnyObject, string> | Lazy<BaseSchema<Maybe<string>, AnyObject, string>, AnyObject> | undefined'.
Type 'StringSchema<string | undefined, AnyObject, string | undefined>' is not assignable to type 'BaseSchema<Maybe<string>, AnyObject, string>'.
Types of property '__outputType' are incompatible.
Type 'string | undefined' is not assignable to type 'string'.
Type 'undefined' is not assignable to type 'string'.