question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

useMutation adds undefined to TResult of MutateFunction type

See original GitHub issue

Describe the bug

useMutation changes the return type of provided promise by adding undefined to it.

To Reproduce

const apiCall = () => new Promise<string>(resolve => resolve());

const useExample = async () => {
	const [mutateCall] = useMutation(apiCall);
	const response = await apiCall(); // string
	const mutateR = await mutateCall(); // string | undefined
};

Wrapping a function in useMutation adds a undefined to it’s returned promise

Expected behavior

The provided function’s return type should not be changed.

Desktop (please complete the following information):

  • Version: 23

Additional context

I don’t see any reason why this would be required. Together with #1077 this is making migration to this library pretty unnecessarily painful by imposing this opinionated types.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:1
  • Comments:21

github_iconTop GitHub Comments

4reactions
tannerlinsleycommented, Oct 4, 2020

I think the PR above fixes this issue. v3 will be awesome!

4reactions
boschnicommented, Oct 3, 2020

What about providing two mutate functions? One for callbacks and for promises?

Callback version:

const { mutate } = useMutation(apiMutate)

mutate({
  onSuccess: result => {
    console.log(result)
  },
  onError: error => {
    console.error(error)
  },
});

Promise version:

const { mutateAsync } = useMutation(apiMutate)

try {
  const result = await mutateAsync()
  console.log(result)
} catch (error) {
  console.error(error)
}

Then mutate would return nothing, mutateAsync would return a promise and throwOnError can be removed.

Read more comments on GitHub >

github_iconTop Results From Across the Web

useMutation adds undefined to TResult of MutateFunction type
This function will fire when the mutation is successful and will be passed the mutation's result. Fires after the mutate-level onSuccess handler ...
Read more >
Mutations in Apollo Client - Apollo GraphQL Docs
The useMutation result is a tuple with a mutate function in the first position and an object representing the mutation result in the...
Read more >
How to declare useMutation return type in 'react-query'
With the types that I put on api and setFriendCode , I get <Response, unknown, Params, unknown> . const object = useMutation( setFriendCode...
Read more >
Apollo useMutation React hook - Hasura
We will use the Apollo Client useMutation from @apollo/client in React app as an example ... the first argument of the result tuple...
Read more >
Mutations | TanStack Query Docs
For this purpose, React Query exports a useMutation hook. Here's an example of a mutation that adds a new todo to the server:...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found