Add an explicit return type for useReadQuery (#11297)

Author: jerelmiller

.api-reports/api-report-react.md

@@ -2101,11 +2101,17 @@ export function useQuery<TData = any, TVariables extends OperationVariables = Op
 export function useReactiveVar<T>(rv: ReactiveVar<T>): T;
 
 // @public (undocumented)
-export function useReadQuery<TData>(queryRef: QueryReference<TData>): {
+export function useReadQuery<TData>(queryRef: QueryReference<TData>): UseReadQueryResult<TData>;
+
+// @public (undocumented)
+export interface UseReadQueryResult<TData = unknown> {
+    // (undocumented)
     data: TData;
-    networkStatus: NetworkStatus;
+    // (undocumented)
     error: ApolloError | undefined;
-};
+    // (undocumented)
+    networkStatus: NetworkStatus;
+}
 
 // @public (undocumented)
 export function useSubscription<TData = any, TVariables extends OperationVariables = OperationVariables>(subscription: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: SubscriptionHookOptions<NoInfer<TData>, NoInfer<TVariables>>): SubscriptionResult<TData, TVariables>;

.api-reports/api-report-react_hooks.md

@@ -1988,11 +1988,17 @@ export function useQuery<TData = any, TVariables extends OperationVariables = Op
 export function useReactiveVar<T>(rv: ReactiveVar<T>): T;
 
 // @public (undocumented)
-export function useReadQuery<TData>(queryRef: QueryReference<TData>): {
+export function useReadQuery<TData>(queryRef: QueryReference<TData>): UseReadQueryResult<TData>;
+
+// @public (undocumented)
+export interface UseReadQueryResult<TData = unknown> {
+    // (undocumented)
     data: TData;
-    networkStatus: NetworkStatus;
+    // (undocumented)
     error: ApolloError | undefined;
-};
+    // (undocumented)
+    networkStatus: NetworkStatus;
+}
 
 // Warning: (ae-forgotten-export) The symbol "SubscriptionHookOptions" needs to be exported by the entry point index.d.ts
 //

.api-reports/api-report.md

@@ -2742,11 +2742,17 @@ export function useQuery<TData = any, TVariables extends OperationVariables = Op
 export function useReactiveVar<T>(rv: ReactiveVar<T>): T;
 
 // @public (undocumented)
-export function useReadQuery<TData>(queryRef: QueryReference<TData>): {
+export function useReadQuery<TData>(queryRef: QueryReference<TData>): UseReadQueryResult<TData>;
+
+// @public (undocumented)
+export interface UseReadQueryResult<TData = unknown> {
+    // (undocumented)
     data: TData;
-    networkStatus: NetworkStatus;
+    // (undocumented)
     error: ApolloError | undefined;
-};
+    // (undocumented)
+    networkStatus: NetworkStatus;
+}
 
 // @public (undocumented)
 export function useSubscription<TData = any, TVariables extends OperationVariables = OperationVariables>(subscription: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: SubscriptionHookOptions<NoInfer<TData>, NoInfer<TVariables>>): SubscriptionResult<TData, TVariables>;

.changeset/good-experts-repair.md

@@ -0,0 +1,5 @@
+---
+"@apollo/client": patch
+---
+
+Add an explicit return type for the `useReadQuery` hook called `UseReadQueryResult`. Previously the return type of this hook was inferred from the return value.

src/react/hooks/index.ts

@@ -11,6 +11,7 @@ export type { UseSuspenseQueryResult } from "./useSuspenseQuery.js";
 export { useSuspenseQuery } from "./useSuspenseQuery.js";
 export type { UseBackgroundQueryResult } from "./useBackgroundQuery.js";
 export { useBackgroundQuery } from "./useBackgroundQuery.js";
+export type { UseReadQueryResult } from "./useReadQuery.js";
 export { useReadQuery } from "./useReadQuery.js";
 export { skipToken } from "./constants.js";
 export type { SkipToken } from "./constants.js";

src/react/hooks/useReadQuery.ts

@@ -5,8 +5,37 @@ import { __use } from "./internal/index.js";
 import { toApolloError } from "./useSuspenseQuery.js";
 import { invariant } from "../../utilities/globals/index.js";
 import { useSyncExternalStore } from "./useSyncExternalStore.js";
+import type { ApolloError } from "../../errors/index.js";
+import type { NetworkStatus } from "../../core/index.js";
 
-export function useReadQuery<TData>(queryRef: QueryReference<TData>) {
+export interface UseReadQueryResult<TData = unknown> {
+  /**
+   * An object containing the result of your GraphQL query after it completes.
+   *
+   * This value might be `undefined` if a query results in one or more errors
+   * (depending on the query's `errorPolicy`).
+   */
+  data: TData;
+  /**
+   * If the query produces one or more errors, this object contains either an
+   * array of `graphQLErrors` or a single `networkError`. Otherwise, this value
+   * is `undefined`.
+   *
+   * This property can be ignored when using the default `errorPolicy` or an
+   * `errorPolicy` of `none`. The hook will throw the error instead of setting
+   * this property.
+   */
+  error: ApolloError | undefined;
+  /**
+   * A number indicating the current network state of the query's associated
+   * request. {@link https://github.com/apollographql/apollo-client/blob/d96f4578f89b933c281bb775a39503f6cdb59ee8/src/core/networkStatus.ts#L4 | See possible values}.
+   */
+  networkStatus: NetworkStatus;
+}
+
+export function useReadQuery<TData>(
+  queryRef: QueryReference<TData>
+): UseReadQueryResult<TData> {
   const internalQueryRef = unwrapQueryRef(queryRef);
   invariant(
     internalQueryRef.promiseCache,