Rhys - const formSchema = z .object({ veh...

const formSchema = z
  .object({
    vehicleReg: z.string(),
    depot: z.string(),
    replacing: z.boolean().optional(),
    replacingReg: z.string(),
  })
  .refine((data) => data.replacing === true, {
    message:
      "Replacing registration is required if replacing and required are checked",
    path: ["replacingReg"],
  });

const formSchema = z
  .object({
    vehicleReg: z.string(),
    depot: z.string(),
    replacing: z.boolean().optional(),
    replacingReg: z.string(),
  })
  .refine((data) => data.replacing === true, {
    message:
      "Replacing registration is required if replacing and required are checked",
    path: ["replacingReg"],
  });

- Trying to make it so replacing is optional and if replacing is set to true then replacingReg needs to be required, otherwise its optional. Anyone got some advice

Solution

If the flaky types from the

refine

refine

approach is not a problem for you, it is probably the easier solution to maintain.
By flaky types I am referring to the fact that you cannot do exhaustive checks with TS like you can with discriminated unions:

// Refine approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // still string | undefined here
} else {
  data.replacingReg // still string | undefined here
}

// Refine approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // still string | undefined here
} else {
  data.replacingReg // still string | undefined here
}

// Discriminated union approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // now just string
} else {
  data.replacingReg // now just undefined
}

// Discriminated union approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // now just string
} else {
  data.replacingReg // now just undefined
}

Jump to solution

Rhys - const formSchema = z .object({ veh...

const formSchema = z
  .object({
    vehicleReg: z.string(),
    depot: z.string(),
    replacing: z.boolean().optional(),
    replacingReg: z.string(),
  })
  .refine((data) => data.replacing === true, {
    message:
      "Replacing registration is required if replacing and required are checked",
    path: ["replacingReg"],
  });

const formSchema = z
  .object({
    vehicleReg: z.string(),
    depot: z.string(),
    replacing: z.boolean().optional(),
    replacingReg: z.string(),
  })
  .refine((data) => data.replacing === true, {
    message:
      "Replacing registration is required if replacing and required are checked",
    path: ["replacingReg"],
  });

- Trying to make it so replacing is optional and if replacing is set to true then replacingReg needs to be required, otherwise its optional. Anyone got some advice

Solution

If the flaky types from the

refine

refine

// Refine approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // still string | undefined here
} else {
  data.replacingReg // still string | undefined here
}

// Refine approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // still string | undefined here
} else {
  data.replacingReg // still string | undefined here
}

// Discriminated union approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // now just string
} else {
  data.replacingReg // now just undefined
}

// Discriminated union approach
const data = formSchema.parse(...);

if (data.replacing) {
  data.replacingReg // now just string
} else {
  data.replacingReg // now just undefined
}

Jump to solution

Rhys - const formSchema = z .object({ veh...

Similar Threads

Rhys - const formSchema = z .object({ veh...

Similar Threads

Similar Threads

Similar Threads