[feature] useMutation: add ability to handle server error before rethrow it to boundary

[czterystaczwarty]

Currently using useMutation is not possible to throw error to error boundary only if it is not handled in other way.

For example:

const [mutate] = useMutation(() => Promise.reject({ status: 422 }), {
  useErrorBoundary: true,
  throwOnError: true
})

try {
  await mutate(payload);
} catch (error) {
  if (error.status === 422) {
    return { message: "this is known exception" };
  }
  throw error;
}

or:

return mutate(payload, {
  onError(error) {
    if (error.status === 422) {
      return { message: "this is known exception" };
    }
    throw error;
  }
})

I am not sure what state should be in this case, but I should be able to convert the exception from the server before throwing it to the boundary.

[tannerlinsley]

You can do this in 2.0 (and quite possibly in 1.x as well) by simply mutating the error object. In 2.0, you are also given better callback order, which should let you more easily make these changes at the right timing (mutate side-effects run after useMutation ones)

[czterystaczwarty]

You can do this (...) by simply mutating the error object.

You mean something like this?

function handleSubmit() {
  let submitResult;
  await mutate(payload, {
    onError(error) {
      if (error.status === 422) {
        submitResult = { message: "this is known exception" };
        // here!
        error = null
      }
    }
  })
  // success - undefined, error - submitResult
  return submitResult;
}

[czterystaczwarty]

mutate side-effects run after useMutation ones

I'm not sure this is right order.
In my opinion onError hooks should be called from more specific to more general (eventually to boundary if not handled earlier).