diff --git a/README.md b/README.md index e3a52e8..02dc5fa 100644 --- a/README.md +++ b/README.md @@ -181,22 +181,34 @@ module ScreamMutation = [%graphql {| [@react.component] let make = () => { /* Both variant and records available */ - let ( screamMutation, _simple, _full ) = useMutation(~variables=ScreamMutation.makeVariables(~screamLevel=10, ()), ScreamMutation.definition); + let ( screamMutation, simple, _full ) = + useMutation(~variables=ScreamMutation.makeVariables(~screamLevel=10, ()), ScreamMutation.definition); let scream = (_) => { screamMutation() - |> Js.Promise.then_(result => { - switch(result) { - | Data(data) => ... - | Error(error) => ... - | NoData => ... - } - Js.Promise.resolve() - }) + |> Js.Promise.then_(((simple, _full)) => { + // Trigger side effects by chaining the promise returned by screamMutation() + switch (simple) { + // You *must* set the error policy to be able to handle errors + // in then_. See EditPersons.re for more + | ApolloHooks.Mutation.Errors(_theErrors) => Js.log("OH NO!") + | NoData => Js.log("NO DATA?") + | Data(_theData) => Js.log("DATA!") + }; + Js.Promise.resolve(); + }) |> ignore } + // Use simple (and/or full) for (most) UI feedback
-
@@ -212,14 +224,9 @@ let make = () => { let ( screamMutation, _simple, _full ) = useMutation(ScreamMutation.definition); let scream = (_) => { screamMutation(~variables=ScreamMutation.makeVariables(~screamLevel=10, ()), ()) - |> Js.Promise.then_(result => { - switch(result) { - | Data(data) => ... - | Error(error) => ... - | NoData => ... - } - Js.Promise.resolve() - }) + |> Js.Promise.then_(((simple, _full)) => { + ... + }) |> ignore } diff --git a/examples/persons/src/EditPerson.re b/examples/persons/src/EditPerson.re index 9c92e49..3682a74 100644 --- a/examples/persons/src/EditPerson.re +++ b/examples/persons/src/EditPerson.re @@ -71,7 +71,12 @@ let make = (~refetchQueries, ~update) => { React.useReducer(reducer, {age: None, name: "", id: ""}); let (editPersonMutation, _simple, _full) = - useMutation(~refetchQueries, ~update, EditPersonMutation.definition); + useMutation( + ~refetchQueries, + ~update, + ~errorPolicy=All, // See note below on error policies + EditPersonMutation.definition, + ); let handleSubmit = event => { ReactEvent.Form.preventDefault(event); @@ -89,8 +94,26 @@ let make = (~refetchQueries, ~update) => { OptimisticResponse.make(~id=state.id, ~name=state.name, ~age), (), ) + /* Setting error policy to All (or Ignore) means that errors show up + * in then_ in the promise returned by editPersonMutation + * Not setting it (or setting it to None) makes the promise reject + * on errors and you'll have to handle errors in Js.catch(e => ...) instead, + * where e is just Js.Promise.error and you won't get any help from the type system. + * + * See also: https://www.apollographql.com/docs/react/data/error-handling/#error-policies + */ + |> Js.Promise.then_(((simple, _full) as result) => { + switch (simple) { + | ApolloHooks.Mutation.Errors(_theErrors) => Js.log("OH NO!") + | NoData => Js.log("NO DATA?") + | Data(_theData) => Js.log("DATA!") + }; + // If you don't need to handle the result elsewhere, + // the promise can just resolve to unit + Js.Promise.resolve(result); + }) |> ignore - | None => ignore() + | None => () }; }; diff --git a/src/ApolloHooksMutation.re b/src/ApolloHooksMutation.re index 8c10eff..a0672fe 100644 --- a/src/ApolloHooksMutation.re +++ b/src/ApolloHooksMutation.re @@ -64,6 +64,8 @@ type options('a) = { [@bs.optional] optimisticResponse: Js.Json.t, [@bs.optional] + errorPolicy: string, + [@bs.optional] context: Context.t, }; @@ -97,6 +99,7 @@ let useMutation: unit =?, ~optimisticResponse: Js.Json.t=?, + ~errorPolicy: ApolloHooksTypes.errorPolicy=?, ~context: Context.t=?, ApolloHooksTypes.graphqlDefinition('data, _, _) ) => @@ -112,6 +115,7 @@ let useMutation: ~awaitRefetchQueries=?, ~update=?, ~optimisticResponse=?, + ~errorPolicy=?, ~context=?, (parse, query, _), ) => { @@ -125,6 +129,8 @@ let useMutation: ~awaitRefetchQueries?, ~update?, ~optimisticResponse?, + ~errorPolicy=? + errorPolicy->Belt.Option.map(ApolloHooksTypes.errorPolicyToJs), ~context?, (), ),