Return an union type in Validation functions

example/Example.res

@@ -18,6 +18,7 @@ module Form = {
           "lastName": "",
           "acceptTerms": false,
           "hobbies": [{"name": ""}],
+          "location": "",
         }),
         (),
       ),
@@ -52,13 +53,17 @@ module Form = {
             (
               "validEmail",
               Validation.sync(value =>
-                value->ReCode.Decode.string->Belt.Result.getWithDefault("")->String.contains('@')
+                ValidationResult.boolResult(
+                  value->ReCode.Decode.string->Belt.Result.getWithDefault("")->String.contains('@'),
+                )
               ),
             ),
             (
               "validLength",
               Validation.sync(value =>
-                value->ReCode.Decode.string->Belt.Result.getWithDefault("")->String.length >= 8
+                ValidationResult.boolResult(
+                  value->ReCode.Decode.string->Belt.Result.getWithDefault("")->String.length >= 8,
+                )
               ),
             ),
           ]),
@@ -139,6 +144,30 @@ module Form = {
             <ErrorMessage errors name message={"Required"->React.string} />
           </div>}
       />
+      <Controller
+        name=Values.location
+        control
+        rules={Rules.make(
+          ~required=true,
+          ~validate=Js.Dict.fromArray([
+            ("minThreeChars", Validations.minThreeChars),
+            ("maxTenChars", Validations.maxTenChars),
+          ]),
+          (),
+        )}
+        render={({field: {name, onBlur, onChange, ref, value}}) =>
+          <div>
+            <label> {name->React.string} </label>
+            <input
+              name
+              onBlur={_event => onBlur()}
+              onChange={event => onChange(Controller.OnChangeArg.event(event))}
+              ref
+              value={value->ReCode.Decode.string->Belt.Result.getWithDefault("")}
+            />
+            <ErrorMessage errors name message={"Required"->React.string} />
+          </div>}
+      />
       <Controller
         name=Values.acceptTerms
         control

example/Validations.res

@@ -0,0 +1,23 @@
+@ocaml.doc(
+  "Custom validator fuction to check that the input has at least three characters. Will return a boolean."
+)
+let minThreeCharsValue = value => {
+  let decodedValue = value->Js.Json.decodeString->Belt.Option.getWithDefault("")
+
+  ValidationResult.boolResult(decodedValue->Js.String2.length >= 3)
+}
+
+let minThreeChars = Validation.sync(minThreeCharsValue)
+
+@ocaml.doc(
+  "Custom validator fuction to check that the input has at most ten characters. Will throw a custom error otherwise."
+)
+let maxTenCharsValue = value => {
+  let decodedValue = value->Js.Json.decodeString->Belt.Option.getWithDefault("")
+
+  decodedValue->Js.String2.length > 10
+    ? ValidationResult.stringResult("There are over ten characters in this input.")
+    : ValidationResult.boolResult(true)
+}
+
+let maxTenChars = Validation.syncWithCustomError(maxTenCharsValue)

example/Values.res

@@ -23,21 +23,24 @@ type t = {
   email: string,
   firstName: string,
   lastName: string,
+  location: string,
   acceptTerms: bool,
   hobbies: array<Hobby.t>,
 }
 
 let email = "email"
 let firstName = "firstName"
 let lastName = "lastName"
+let location = "location"
 let acceptTerms = "acceptTerms"
 let hobbies = "hobbies"
 let hobby = index => `${hobbies}.${index->Belt.Int.toString}.${Hobby.name}`
 
-let make = (email, firstName, lastName, acceptTerms, hobbies) => {
+let make = (email, firstName, lastName, acceptTerms, hobbies, location) => {
   email: email,
   firstName: firstName,
   lastName: lastName,
+  location: location,
   acceptTerms: acceptTerms,
   hobbies: hobbies,
 }
@@ -52,6 +55,7 @@ let decoder = {
   ->Object.required(lastName, string)
   ->Object.required(acceptTerms, bool)
   ->Object.required(hobbies, array(Hobby.decoder))
+  ->Object.required(location, string)
 }
 
 let encoder = values => {
@@ -61,6 +65,7 @@ let encoder = values => {
     (email, string(values["email"])),
     (firstName, string(values["firstName"])),
     (lastName, string(values["lastName"])),
+    (location, string(values["location"])),
     (acceptTerms, bool(values["acceptTerms"])),
     (hobbies, array(Hobby.encoder, values["hobbies"])),
   ])

src/Validation.res

@@ -3,4 +3,8 @@ type rec t = Any('a): t
 
 let sync = syncHandler => Any(syncHandler)
 
+let syncWithCustomError = syncHandler => Any(syncHandler)
+
 let async = asyncHandler => Any(asyncHandler)
+
+let asyncWithCustomError = asyncHandler => Any(asyncHandler)

src/Validation.resi

@@ -3,7 +3,11 @@
 type rec t
 
 @ocaml.doc("Synchronous validation")
-let sync: (Js.Json.t => bool) => t
+let sync: (Js.Json.t => ValidationResult.t) => t
+
+let syncWithCustomError: (Js.Json.t => ValidationResult.t) => t
 
 @ocaml.doc("Asynchronous validation")
-let async: (Js.Json.t => Js.Promise.t<bool>) => t
+let async: (Js.Json.t => Js.Promise.t<ValidationResult.t>) => t
+
+let asyncWithCustomError: (Js.Json.t => Js.Promise.t<ValidationResult.t>) => t

src/ValidationResult.res

@@ -0,0 +1,5 @@
+@unboxed type rec t = Any('value): t
+
+let boolResult = validationResult => Any(validationResult)
+
+let stringResult = validationResult => Any(validationResult)

src/ValidationResult.resi

@@ -0,0 +1,8 @@
+@ocaml.doc(
+  "The union type for the result of a validator function;  allows validation functions to return either boolean or a string"
+)
+type rec t
+
+let boolResult: bool => t
+
+let stringResult: string => t