diff --git a/.changeset/chatty-toes-melt.md b/.changeset/chatty-toes-melt.md new file mode 100644 index 0000000000..3298a53612 --- /dev/null +++ b/.changeset/chatty-toes-melt.md @@ -0,0 +1,9 @@ +--- +'@urql/preact': patch +'@urql/svelte': patch +'urql': patch +'@urql/solid': patch +'@urql/vue': patch +--- + +Add type for `hasNext` to the query and mutation results diff --git a/packages/preact-urql/src/hooks/constants.ts b/packages/preact-urql/src/hooks/constants.ts index 1852afcda4..96788f5498 100644 --- a/packages/preact-urql/src/hooks/constants.ts +++ b/packages/preact-urql/src/hooks/constants.ts @@ -1,6 +1,7 @@ export const initialState = { fetching: false, stale: false, + hasNext: false, error: undefined, data: undefined, extensions: undefined, diff --git a/packages/preact-urql/src/hooks/useMutation.ts b/packages/preact-urql/src/hooks/useMutation.ts index a66bb54a5e..e08ed6254f 100644 --- a/packages/preact-urql/src/hooks/useMutation.ts +++ b/packages/preact-urql/src/hooks/useMutation.ts @@ -45,6 +45,8 @@ export interface UseMutationState< data?: Data; /** The {@link OperationResult.error} for the executed mutation. */ error?: CombinedError; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; /** The {@link OperationResult.extensions} for the executed mutation. */ extensions?: Record; /** The {@link Operation} that the current state is for. @@ -164,6 +166,7 @@ export function useMutation< fetching: false, stale: result.stale, data: result.data, + hasNext: result.hasNext, error: result.error, extensions: result.extensions, operation: result.operation, diff --git a/packages/preact-urql/src/hooks/useQuery.ts b/packages/preact-urql/src/hooks/useQuery.ts index cf3c4f9e3e..9248788c29 100644 --- a/packages/preact-urql/src/hooks/useQuery.ts +++ b/packages/preact-urql/src/hooks/useQuery.ts @@ -137,6 +137,8 @@ export interface UseQueryState< * last `Operation` that the current state was for. */ operation?: Operation; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; } /** Triggers {@link useQuery} to execute a new GraphQL query operation. @@ -303,16 +305,18 @@ export function useQuery< return pipe( query$$, switchMap(query$ => { - if (!query$) return fromValue({ fetching: false, stale: false }); + if (!query$) + return fromValue({ fetching: false, stale: false, hasNext: false }); return concat([ // Initially set fetching to true fromValue({ fetching: true, stale: false }), pipe( query$, - map(({ stale, data, error, extensions, operation }) => ({ + map(({ stale, data, error, extensions, operation, hasNext }) => ({ fetching: false, stale: !!stale, + hasNext, data, error, operation, @@ -320,7 +324,7 @@ export function useQuery< })) ), // When the source proactively closes, fetching is set to false - fromValue({ fetching: false, stale: false }), + fromValue({ fetching: false, stale: false, hasNext: false }), ]); }), // The individual partial results are merged into each previous result diff --git a/packages/preact-urql/src/hooks/useSubscription.test.tsx b/packages/preact-urql/src/hooks/useSubscription.test.tsx index e255ec086e..fd3ae4daea 100644 --- a/packages/preact-urql/src/hooks/useSubscription.test.tsx +++ b/packages/preact-urql/src/hooks/useSubscription.test.tsx @@ -106,6 +106,7 @@ describe('useSubscription', () => { ); expect(state).toEqual({ ...data, + hasNext: false, extensions: undefined, fetching: true, stale: false, diff --git a/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap index d40f6110f4..3113e91b32 100644 --- a/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap +++ b/packages/react-urql/src/hooks/__snapshots__/useMutation.test.tsx.snap @@ -6,6 +6,7 @@ exports[`on initial useEffect > initialises default state 1`] = ` "error": undefined, "extensions": undefined, "fetching": false, + "hasNext": false, "operation": undefined, "stale": false, } diff --git a/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap index 442ec1027e..98b0419351 100644 --- a/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap +++ b/packages/react-urql/src/hooks/__snapshots__/useQuery.test.tsx.snap @@ -6,6 +6,7 @@ exports[`on initial useEffect > initialises default state 1`] = ` "error": undefined, "extensions": undefined, "fetching": true, + "hasNext": false, "operation": undefined, "stale": false, } diff --git a/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap b/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap index 442ec1027e..98b0419351 100644 --- a/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap +++ b/packages/react-urql/src/hooks/__snapshots__/useSubscription.test.tsx.snap @@ -6,6 +6,7 @@ exports[`on initial useEffect > initialises default state 1`] = ` "error": undefined, "extensions": undefined, "fetching": true, + "hasNext": false, "operation": undefined, "stale": false, } diff --git a/packages/react-urql/src/hooks/state.ts b/packages/react-urql/src/hooks/state.ts index bf8d4f4ad3..4bdde5fe4d 100644 --- a/packages/react-urql/src/hooks/state.ts +++ b/packages/react-urql/src/hooks/state.ts @@ -3,6 +3,7 @@ import * as React from 'react'; export const initialState = { fetching: false, stale: false, + hasNext: false, error: undefined, data: undefined, extensions: undefined, @@ -38,6 +39,7 @@ const isShallowDifferent = >(a: T, b: T) => { interface Stateish { data?: any; error?: any; + hasNext: boolean; fetching: boolean; stale: boolean; } diff --git a/packages/react-urql/src/hooks/useMutation.ts b/packages/react-urql/src/hooks/useMutation.ts index 9964ae0f17..523852dfb5 100644 --- a/packages/react-urql/src/hooks/useMutation.ts +++ b/packages/react-urql/src/hooks/useMutation.ts @@ -47,6 +47,8 @@ export interface UseMutationState< error?: CombinedError; /** The {@link OperationResult.extensions} for the executed mutation. */ extensions?: Record; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; /** The {@link Operation} that the current state is for. * * @remarks @@ -167,6 +169,7 @@ export function useMutation< error: result.error, extensions: result.extensions, operation: result.operation, + hasNext: result.hasNext, }); } }), diff --git a/packages/react-urql/src/hooks/useQuery.spec.ts b/packages/react-urql/src/hooks/useQuery.spec.ts index 57710ac83c..3910038eab 100644 --- a/packages/react-urql/src/hooks/useQuery.spec.ts +++ b/packages/react-urql/src/hooks/useQuery.spec.ts @@ -62,6 +62,7 @@ describe('useQuery', () => { expect(state).toEqual({ fetching: true, stale: false, + hasNext: false, extensions: undefined, error: undefined, data: undefined, @@ -126,6 +127,7 @@ describe('useQuery', () => { fetching: false, stale: false, extensions: undefined, + hasNext: false, error: 1, data: 0, }); diff --git a/packages/react-urql/src/hooks/useQuery.ts b/packages/react-urql/src/hooks/useQuery.ts index 439bbab45c..39ec4018a2 100644 --- a/packages/react-urql/src/hooks/useQuery.ts +++ b/packages/react-urql/src/hooks/useQuery.ts @@ -125,6 +125,8 @@ export interface UseQueryState< data?: Data; /** The {@link OperationResult.error} for the executed query. */ error?: CombinedError; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; /** The {@link OperationResult.extensions} for the executed query. */ extensions?: Record; /** The {@link Operation} that the current state is for. diff --git a/packages/solid-urql/src/createMutation.ts b/packages/solid-urql/src/createMutation.ts index 0e3a86bc35..97b6d3a7b1 100644 --- a/packages/solid-urql/src/createMutation.ts +++ b/packages/solid-urql/src/createMutation.ts @@ -44,6 +44,8 @@ export type CreateMutationState< * last `Operation` that the current state was for. */ operation?: Operation; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; }; /** Triggers {@link createMutation} to execute its GraphQL mutation operation. @@ -140,6 +142,7 @@ export const createMutation = < const initialResult: CreateMutationState = { operation: undefined, fetching: false, + hasNext: false, stale: false, data: undefined, error: undefined, @@ -167,6 +170,7 @@ export const createMutation = < error: result.error, extensions: result.extensions, operation: result.operation, + hasNext: result.hasNext, }); }); }), diff --git a/packages/solid-urql/src/createQuery.ts b/packages/solid-urql/src/createQuery.ts index 09fa22d2e6..4141f7026a 100644 --- a/packages/solid-urql/src/createQuery.ts +++ b/packages/solid-urql/src/createQuery.ts @@ -234,6 +234,7 @@ export const createQuery = < produce(draft => { draft.fetching = false; draft.stale = false; + draft.hasNext = false; }) ); @@ -244,6 +245,7 @@ export const createQuery = < produce(draft => { draft.fetching = true; draft.stale = false; + draft.hasNext = false; }) ); @@ -255,6 +257,7 @@ export const createQuery = < produce(draft => { draft.fetching = false; draft.stale = false; + draft.hasNext = false; }) ); }), @@ -268,6 +271,7 @@ export const createQuery = < draft.error = res.error; draft.operation = res.operation; draft.extensions = res.extensions; + draft.hasNext = res.hasNext; }) ); }); diff --git a/packages/svelte-urql/src/mutationStore.ts b/packages/svelte-urql/src/mutationStore.ts index 6c7c74bf28..8e4b2b56d8 100644 --- a/packages/svelte-urql/src/mutationStore.ts +++ b/packages/svelte-urql/src/mutationStore.ts @@ -107,13 +107,14 @@ export function mutationStore< const subscription = pipe( pipe( args.client.executeRequestOperation(operation), - map(({ stale, data, error, extensions, operation }) => ({ + map(({ stale, data, error, extensions, operation, hasNext }) => ({ fetching: false, stale, data, error, operation, extensions, + hasNext, })) ), scan( diff --git a/packages/svelte-urql/src/queryStore.ts b/packages/svelte-urql/src/queryStore.ts index 646a9f41dc..0c29b74b8d 100644 --- a/packages/svelte-urql/src/queryStore.ts +++ b/packages/svelte-urql/src/queryStore.ts @@ -156,19 +156,29 @@ export function queryStore< fromStore(operation$), switchMap(operation => { return concat>>([ - fromValue({ fetching: true, stale: false }), + fromValue({ fetching: true, stale: false, hasNext: false }), pipe( args.client.executeRequestOperation(operation), - map(({ stale, data, error, extensions, operation }) => ({ - fetching: false, - stale: !!stale, - data, - error, - operation, - extensions, - })) + map( + ({ + stale, + data, + error, + extensions, + operation, + hasNext, + }) => ({ + fetching: false, + stale: !!stale, + data, + error, + operation, + extensions, + hasNext, + }) + ) ), - fromValue({ fetching: false }), + fromValue({ fetching: false, hasNext: false }), ]); }) ); diff --git a/packages/vue-urql/src/useMutation.ts b/packages/vue-urql/src/useMutation.ts index e585678302..15af6982b0 100644 --- a/packages/vue-urql/src/useMutation.ts +++ b/packages/vue-urql/src/useMutation.ts @@ -57,6 +57,8 @@ export interface UseMutationResponse { * last `Operation` that the current state was for. */ operation: Ref | undefined>; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: Ref; /** Triggers {@link useMutation} to execute its GraphQL mutation operation. * * @param variables - variables using which the mutation will be executed. @@ -135,10 +137,8 @@ export function callUseMutation( ): UseMutationResponse { const data: Ref = shallowRef(); - const { fetching, operation, extensions, stale, error } = useRequestState< - T, - V - >(); + const { fetching, operation, extensions, stale, error, hasNext } = + useRequestState(); return { data, @@ -147,6 +147,7 @@ export function callUseMutation( error, operation, extensions, + hasNext, executeMutation( variables: V, context?: Partial @@ -165,6 +166,7 @@ export function callUseMutation( error.value = result.error; operation.value = result.operation; extensions.value = result.extensions; + hasNext.value = result.hasNext; }), filter(result => !result.hasNext), take(1), diff --git a/packages/vue-urql/src/useQuery.ts b/packages/vue-urql/src/useQuery.ts index d8da69b7d0..e49e38baff 100644 --- a/packages/vue-urql/src/useQuery.ts +++ b/packages/vue-urql/src/useQuery.ts @@ -138,6 +138,8 @@ export interface UseQueryState { * documentation on the `pause` option. */ isPaused: Ref; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: Ref; /** Resumes {@link useQuery} if it’s currently paused. * * @remarks @@ -241,10 +243,8 @@ export function callUseQuery( ): UseQueryResponse { const data: Ref = shallowRef(); - const { fetching, operation, extensions, stale, error } = useRequestState< - T, - V - >(); + const { fetching, operation, extensions, stale, error, hasNext } = + useRequestState(); const { isPaused, source, pause, resume, execute, teardown } = useClientState( args, @@ -264,6 +264,7 @@ export function callUseQuery( onEnd(() => { fetching.value = false; stale.value = false; + hasNext.value = false; }), subscribe(res => { data.value = res.data; @@ -272,12 +273,14 @@ export function callUseQuery( error.value = res.error; operation.value = res.operation; extensions.value = res.extensions; + hasNext.value = res.hasNext; }) ).unsubscribe ); } else { fetching.value = false; stale.value = false; + hasNext.value = false; } }, { @@ -321,6 +324,7 @@ export function callUseQuery( extensions, fetching, isPaused, + hasNext, pause, resume, executeQuery(opts?: Partial): UseQueryResponse { diff --git a/packages/vue-urql/src/utils.ts b/packages/vue-urql/src/utils.ts index f7aa49d677..1b0173abde 100644 --- a/packages/vue-urql/src/utils.ts +++ b/packages/vue-urql/src/utils.ts @@ -90,12 +90,14 @@ export const useRequestState = < T = any, V extends AnyVariables = AnyVariables, >() => { + const hasNext: Ref = ref(false); const stale: Ref = ref(false); const fetching: Ref = ref(false); const error: Ref = shallowRef(); const operation: Ref | undefined> = shallowRef(); const extensions: Ref | undefined> = shallowRef(); return { + hasNext, stale, fetching, error,