Improve `useBackgroundQuery` type interface and add type tests #10951

alessbell · 2023-06-05T20:51:35Z

Closes #10878. Improves types for useBackgroundQuery and adds type tests.

Follow-on work to support returning partial data (including representing as DeepPartial<TData> in the response type) will be tackled as part of #10893.

Checklist:

If this PR contains changes to the library itself (not necessary for e.g. docs updates), please include a changeset (see CONTRIBUTING.md)
If this PR is a new feature, please reference an issue where a consensus about the design was reached (not necessary for small changes)
Make sure all of the significant new logic is covered by tests

changeset-bot · 2023-06-05T20:51:39Z

🦋 Changeset detected

Latest commit: dcc6933

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@apollo/client	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions · 2023-06-05T20:53:07Z

size-limit report 📦

Path	Size
dist/apollo-client.min.cjs	36.55 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs"	42.95 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js"	32.44 KB (0%)
import { ApolloProvider } from "dist/react/index.js"	1.3 KB (0%)
import { useQuery } from "dist/react/index.js"	4.34 KB (0%)
import { useLazyQuery } from "dist/react/index.js"	4.66 KB (0%)
import { useMutation } from "dist/react/index.js"	2.57 KB (0%)
import { useSubscription } from "dist/react/index.js"	2.34 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js"	3.45 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js"	2.89 KB (0%)
import { useReadQuery } from "dist/react/index.js"	1.65 KB (0%)
import { useFragment } from "dist/react/index.js"	2.12 KB (0%)

alessbell · 2023-06-05T20:57:45Z

src/react/hooks/__tests__/useBackgroundQuery.test.tsx

@@ -131,6 +135,37 @@ function renderIntegrationTest({
  return { ...rest, query, client: _client, renders };
 }

+interface VariablesCaseData {


Lifted VariablesCaseData/VariablesCaseVariables up to the file scope to make type tests easier to write, a nice pattern borrowed from the useSuspenseQuery tests

alessbell · 2023-06-05T20:58:16Z

src/react/hooks/__tests__/useBackgroundQuery.test.tsx

-        refetch: (
-          variables?: Partial<OperationVariables> | undefined
-        ) => Promise<ApolloQueryResult<Data>>;
+        refetch: RefetchFunction<Data, OperationVariables>;


refetch type is much cleaner now ✨

alessbell · 2023-06-05T20:58:57Z

src/react/hooks/__tests__/useBackgroundQuery.test.tsx

+      expectTypeOf(explicit).not.toEqualTypeOf<VariablesCaseData | undefined>();
+    });
+
+    // TODO: https://github.com/apollographql/apollo-client/issues/10893


The remaining five type tests from useSuspenseQuery have references to returnPartialData and will be completed as part of the work in #10893

alessbell · 2023-06-05T21:04:50Z

src/react/hooks/useSuspenseQuery.ts

@@ -61,8 +61,6 @@ export type SubscribeToMoreFunction<
  TVariables extends OperationVariables
 > = ObservableQueryFields<TData, TVariables>['subscribeToMore'];

-export type Version = 'main' | 'network';


Pretty sure this is the last vestige of all your refactoring work, @jerelmiller - thought I'd zap it ⚡

Good catch! Thanks for removing this!

alessbell · 2023-06-05T21:06:33Z

src/react/hooks/__tests__/useSuspenseQuery.test.tsx

@@ -6928,17 +6928,17 @@ describe('useSuspenseQuery', () => {
    it('returns TData | undefined with errorPolicy: "all"', () => {
      const { query } = useVariablesQueryCase();

-      const { data: inferred } = useSuspenseQuery<


Found some tests that seemed to have the inferred/explicit labelling flipped and figured I'd include those small fixes in this PR, let me know if these look good to you

Thank you! I noticed that too when adding skip support. Appreciate it!

alessbell · 2023-06-05T21:07:00Z

src/react/hooks/useBackgroundQuery.ts

 import { invariant } from '../../utilities/globals';

 export type UseBackgroundQueryResult<
-  TData = any,
+  TData = unknown,


~~any~~ unknown 🎉

alessbell · 2023-06-05T21:12:36Z

src/react/hooks/useBackgroundQuery.ts

  }
 ];

 export function useBackgroundQuery<
-  TData = any,
+  TData,


These overloads are taken from useSuspenseQuery with the caveat that returnPartialData/refetchWritePolicy are not available in useBackgroundQuery yet (to be added in #10893)

alessbell · 2023-06-05T21:13:44Z

src/react/types/types.ts

@@ -20,6 +20,10 @@ import type {
 } from '../../core';
 import type { SuspenseCache } from '../cache';

+/* QueryReference type */
+
+export type { QueryReference } from '../cache/QueryReference';


This should fix the current import { QueryReference } from "@apollo/client/react/cache/QueryReference"; situation

Ah thank you!

…y-types

jerelmiller

Really great to get this dialed in! Thanks for putting this together!

jerelmiller · 2023-06-08T16:00:05Z

src/react/hooks/useBackgroundQuery.ts

+    SuspenseQueryHookOptions<NoInfer<TData>, NoInfer<TVariables>>,
+    'returnPartialData' | 'refetchWritePolicy'
+  > & {
+    returnPartialData: true;


Since this option is being added in a separate PR and because you have Omit<..., 'returnPartialData'> in this overload, do we need this for this PR? I think you can omit this case for now and add it in #10960

jerelmiller · 2023-06-08T16:02:25Z

src/react/hooks/useSuspenseQuery.ts

@@ -61,8 +61,6 @@ export type SubscribeToMoreFunction<
  TVariables extends OperationVariables
 > = ObservableQueryFields<TData, TVariables>['subscribeToMore'];

-export type Version = 'main' | 'network';


Good catch! Thanks for removing this!

jerelmiller · 2023-06-08T16:02:36Z

src/react/types/types.ts

@@ -20,6 +20,10 @@ import type {
 } from '../../core';
 import type { SuspenseCache } from '../cache';

+/* QueryReference type */
+
+export type { QueryReference } from '../cache/QueryReference';


Ah thank you!

…y-types

alessbell added 2 commits June 1, 2023 14:47

chore: improve type signature of useBackgroundQuery refetch

861639d

chore: improve useBackgroundQuery/useReadQuery types and type tests

243aa17

alessbell added ⛑ TypeScript 🧞‍♂️ enhancement labels Jun 5, 2023

alessbell requested a review from jerelmiller June 5, 2023 20:51

alessbell added 2 commits June 5, 2023 16:54

chore: update code comments

c29a5a4

chore: add changeset

0e0e7e1

alessbell commented Jun 5, 2023

View reviewed changes

chore: fix explicit/inferred references in uSQ test

35550c4

alessbell commented Jun 5, 2023

View reviewed changes

Merge branch 'release-3.8' into issue-10878-improve-useBackgroundQuer…

2cfdf18

…y-types

alessbell mentioned this pull request Jun 7, 2023

Support returnPartialData and refetchWritePolicy in useBackgroundQuery #10960

Merged

3 tasks

jerelmiller approved these changes Jun 8, 2023

View reviewed changes

jerelmiller mentioned this pull request Jun 8, 2023

Add support for skip option to useSuspenseQuery and useBackgroundQuery #10940

Merged

3 tasks

Merge branch 'release-3.8' into issue-10878-improve-useBackgroundQuer…

dcc6933

…y-types

alessbell merged commit 2e833b2 into release-3.8 Jun 9, 2023

alessbell deleted the issue-10878-improve-useBackgroundQuery-types branch June 9, 2023 17:26

github-actions bot mentioned this pull request Jun 9, 2023

Version Packages (beta) #10963

Merged

alessbell mentioned this pull request Jun 9, 2023

[3.8 alpha] Improve useBackgroundQuery types for data and refetch #10878

Closed

5 tasks

github-actions bot locked as resolved and limited conversation to collaborators Jul 10, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improve `useBackgroundQuery` type interface and add type tests #10951

Improve `useBackgroundQuery` type interface and add type tests #10951

alessbell commented Jun 5, 2023

changeset-bot bot commented Jun 5, 2023 •

edited

Loading

github-actions bot commented Jun 5, 2023 •

edited

Loading

alessbell Jun 5, 2023

alessbell Jun 5, 2023

alessbell Jun 5, 2023

alessbell Jun 5, 2023

jerelmiller Jun 8, 2023

alessbell Jun 5, 2023

jerelmiller Jun 8, 2023

alessbell Jun 5, 2023

alessbell Jun 5, 2023

alessbell Jun 5, 2023

jerelmiller Jun 8, 2023

jerelmiller left a comment

jerelmiller Jun 8, 2023

jerelmiller Jun 8, 2023

jerelmiller Jun 8, 2023

Improve useBackgroundQuery type interface and add type tests #10951

Improve useBackgroundQuery type interface and add type tests #10951

Conversation

alessbell commented Jun 5, 2023

Checklist:

changeset-bot bot commented Jun 5, 2023 • edited Loading

🦋 Changeset detected

github-actions bot commented Jun 5, 2023 • edited Loading

size-limit report 📦

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

jerelmiller left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Improve `useBackgroundQuery` type interface and add type tests #10951

Improve `useBackgroundQuery` type interface and add type tests #10951

changeset-bot bot commented Jun 5, 2023 •

edited

Loading

github-actions bot commented Jun 5, 2023 •

edited

Loading