formik-apollo

A React hook to extract validation errors from a GraphQL request and apply them to a Formik form.

useSubmit

This is a React hook that will automatically extract validation errors from a failed GraphQL response and apply them to a Formik form.

const handleSubmit = useSubmit({
  mutate(data, actions) {
    return client.mutate(MyMutation, { variables: { data } });
  }
});

On the server side, a failed GraphQL response should look like this:

{
  "errors": [
    {
      "message": "Some generic error message",
      "extensions": {
        "code": "VALIDATION_ERROR",
        "problems": {
          "email": ["is required"]
        }
      }
    }
  ]
}

Options

| Name | Required | Type | Description | | ------------- | -------- | -------- | ----------------------------------------------------- | | mutate | ✔️ | Function | Performs the form submission. | | onCompleted | | Function | Add behavior after a successful submission. | | onError | | Function | Add behavior after a failed submission. | | getStatus | | Function | Extracts the error message from the GraphQL response. | | getErrors | | Function | Extracts field validation errors from the response. |