Make useQuery refetch async #3434
Conversation
|
| @@ -267,7 +267,9 @@ describe('useQuery', () => { | |||
| expect(client.executeQuery).toBeCalledTimes(1); | |||
|
|
|||
| const [, executeQuery] = result.current; | |||
| act(() => executeQuery()); | |||
| act(() => { | |||
There was a problem hiding this comment.
As this returns a promise now, tsc complained
| }); | ||
| }, | ||
| deferDispatch(setState, state => { | ||
| const source = suspense |
There was a problem hiding this comment.
I also did source.then(resolve) below everything (which works fine when running locally), but Typescript complains
| }) | ||
| ) | ||
| : pipe(client.executeQuery(request, context), result => { | ||
| resolve(); |
There was a problem hiding this comment.
in a cache-and-network call this would most likely return the stale equivalent. We do already have a streaming util to convert this to a Promise conditionally in [https://github.com/urql-graphql/urql/blob/main/packages/core/src/utils/streamUtils.ts#L15].
So what we could do is create the source, do a deferDispatch to set the state to React and return the source
| export type UseQueryExecute = (opts?: Partial<OperationContext>) => void; | ||
| export type UseQueryExecute = ( | ||
| opts?: Partial<OperationContext> | ||
| ) => Promise<unknown>; |
There was a problem hiding this comment.
I am wondering whether this could turn into a breaking change, i.e. something complaining about not awaiting/... when doing onClick={() => executeQuery()}
Summary
In my React app I want to be able to
awaitthe refetch function, for example to call another function after refetch is doneSet of changes
Mainly the React package's
useQuery.ts. Let me know if there's a better way to promisify this using wonka