Reconsider useMutation API

[gajus]

The current API looks like this:

const [
  scrapeVenuesResult,
  {
    error,
    loading,
  },
] = useMutation(SCRAPE_VENUES_MUTATION);

This looks neat on its own, but becomes a problem when there are many mutations since all of the variables now need to be aliased and end up looking more like:

const [
  scrapeVenues,
  {
    error: scrapeVenuesMutationError,
    loading: scrapeVenuesMutationLoading,
  },
] = useMutation(SCRAPE_VENUES_MUTATION);

A neater API would return a single object describing the entire state of the mutation as a property the mutation function, e.g.

const scrapeVenues = useMutation(SCRAPE_VENUES_MUTATION);

scrapeVenues();
scrapeVenues.error;
scrapeVenues.loading;
scrapeVenues.result;

This would automatically provide a namespace for all properties of a mutation.

[zsolt-dev]

Both projects (this and official apollo-hooks) are in beta and it makes sense to go with the best possible solution now instead of everyone writing their own wrappers.

This would also make it more like the useQuery hook.

[sijad]

isn't it still possible?

const [doMutateScrape, scrapeVenues] = useMutation(SCRAPE_VENUES_MUTATION);

doMutateScrape();
scrapeVenues.error;
scrapeVenues.loading;
scrapeVenues.result;

[gajus]

See https://github.com/apollographql/react-apollo/issues/3303 discussion.