Wrap useQueryRefHandlers in wrapHook. (#11771)

* Wrap `useQueryRefHandlers` in `wrapHook`.

* Clean up Prettier, Size-limit, and Api-Extractor

---------

Co-authored-by: phryneas <phryneas@users.noreply.github.com>

.api-reports/api-report-react_internal.md

@@ -1936,6 +1936,17 @@ type UseFragmentResult<TData> = {
 // @public
 function useQuery<TData = any, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: QueryHookOptions<NoInfer<TData>, NoInfer<TVariables>>): QueryResult<TData, TVariables>;
 
+// Warning: (ae-forgotten-export) The symbol "UseQueryRefHandlersResult" needs to be exported by the entry point index.d.ts
+//
+// @public
+function useQueryRefHandlers<TData = unknown, TVariables extends OperationVariables = OperationVariables>(queryRef: QueryReference<TData, TVariables>): UseQueryRefHandlersResult<TData, TVariables>;
+
+// @public (undocumented)
+interface UseQueryRefHandlersResult<TData = unknown, TVariables extends OperationVariables = OperationVariables> {
+    fetchMore: FetchMoreFunction<TData, TVariables>;
+    refetch: RefetchFunction<TData, TVariables>;
+}
+
 // Warning: (ae-forgotten-export) The symbol "UseReadQueryResult" needs to be exported by the entry point index.d.ts
 //
 // @public (undocumented)
@@ -2056,6 +2067,10 @@ interface WrappableHooks {
     //
     // (undocumented)
     useQuery: typeof useQuery;
+    // Warning: (ae-forgotten-export) The symbol "useQueryRefHandlers" needs to be exported by the entry point index.d.ts
+    //
+    // (undocumented)
+    useQueryRefHandlers: typeof useQueryRefHandlers;
     // Warning: (ae-forgotten-export) The symbol "useReadQuery" needs to be exported by the entry point index.d.ts
     //
     // (undocumented)

.changeset/kind-foxes-float.md

@@ -0,0 +1,5 @@
+---
+"@apollo/client": patch
+---
+
+Wrap `useQueryRefHandlers` in `wrapHook`.

.size-limits.json

@@ -1,4 +1,4 @@
 {
-  "dist/apollo-client.min.cjs": 39530,
+  "dist/apollo-client.min.cjs": 39538,
   "import { ApolloClient, InMemoryCache, HttpLink } from \"dist/index.js\" (production)": 32809
 }

src/react/hooks/internal/wrapHook.ts

@@ -4,6 +4,7 @@ import type {
   useBackgroundQuery,
   useReadQuery,
   useFragment,
+  useQueryRefHandlers,
 } from "../index.js";
 import type { QueryManager } from "../../../core/QueryManager.js";
 import type { ApolloClient } from "../../../core/ApolloClient.js";
@@ -17,6 +18,7 @@ interface WrappableHooks {
   useBackgroundQuery: typeof useBackgroundQuery;
   useReadQuery: typeof useReadQuery;
   useFragment: typeof useFragment;
+  useQueryRefHandlers: typeof useQueryRefHandlers;
 }
 
 /**

src/react/hooks/useQueryRefHandlers.ts

@@ -5,10 +5,15 @@ import {
   updateWrappedQueryRef,
   wrapQueryRef,
 } from "../internal/index.js";
-import type { QueryReference } from "../internal/index.js";
+import type {
+  InternalQueryReference,
+  QueryReference,
+} from "../internal/index.js";
 import type { OperationVariables } from "../../core/types.js";
 import type { RefetchFunction, FetchMoreFunction } from "./useSuspenseQuery.js";
 import type { FetchMoreQueryOptions } from "../../core/watchQueryOptions.js";
+import { useApolloClient } from "./useApolloClient.js";
+import { wrapHook } from "./internal/index.js";
 
 export interface UseQueryRefHandlersResult<
   TData = unknown,
@@ -44,6 +49,34 @@ export function useQueryRefHandlers<
   TVariables extends OperationVariables = OperationVariables,
 >(
   queryRef: QueryReference<TData, TVariables>
+): UseQueryRefHandlersResult<TData, TVariables> {
+  const unwrapped = unwrapQueryRef(
+    queryRef
+  ) satisfies InternalQueryReference<TData> as /*
+    by all rules of this codebase, this should never be undefined
+    but if `queryRef` is a transported object, it cannot have a
+    `QUERY_REFERENCE_SYMBOL` symbol property, so the call above
+    will return `undefined` and we want that represented in the type
+    */ InternalQueryReference<TData> | undefined;
+
+  return wrapHook(
+    "useQueryRefHandlers",
+    _useQueryRefHandlers,
+    unwrapped ?
+      unwrapped["observable"]
+      // in the case of a "transported" queryRef object, we need to use the
+      // client that's available to us at the current position in the React tree
+      // that ApolloClient will then have the job to recreate a real queryRef from
+      // the transported object
+    : useApolloClient()
+  )(queryRef);
+}
+
+function _useQueryRefHandlers<
+  TData = unknown,
+  TVariables extends OperationVariables = OperationVariables,
+>(
+  queryRef: QueryReference<TData, TVariables>
 ): UseQueryRefHandlersResult<TData, TVariables> {
   const [previousQueryRef, setPreviousQueryRef] = React.useState(queryRef);
   const [wrappedQueryRef, setWrappedQueryRef] = React.useState(queryRef);