react-relay 14.0.0 → 15.0.0

package/relay-hooks/react-cache/useFragmentInternal_REACT_CACHE.js.flow

@@ -5,14 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @flow strict-local
- * @emails oncall+relay
  * @format
+ * @oncall relay
  */
 
-// flowlint ambiguous-object-type:error
-
 'use strict';
 
+import type {QueryResult} from '../QueryResource';
 import type {
   CacheConfig,
   FetchPolicy,
@@ -22,13 +21,17 @@ import type {
   SelectorData,
   Snapshot,
 } from 'relay-runtime';
-import type {MissingClientEdgeRequestInfo} from 'relay-runtime/store/RelayStoreTypes';
+import type {
+  MissingClientEdgeRequestInfo,
+  MissingLiveResolverField,
+} from 'relay-runtime/store/RelayStoreTypes';
 
+const {getQueryResourceForEnvironment} = require('../QueryResource');
 const useRelayEnvironment = require('../useRelayEnvironment');
-const getQueryResultOrFetchQuery = require('./getQueryResultOrFetchQuery_REACT_CACHE');
 const invariant = require('invariant');
 const {useDebugValue, useEffect, useMemo, useRef, useState} = require('react');
 const {
+  __internal: {fetchQuery: fetchQueryInternal},
   areEqualSelectors,
   createOperationDescriptor,
   getPendingOperationsForFragment,
@@ -39,18 +42,17 @@ const {
 } = require('relay-runtime');
 const warning = require('warning');
 
-type FragmentQueryOptions = {|
+type FragmentQueryOptions = {
   fetchPolicy?: FetchPolicy,
   networkCacheConfig?: ?CacheConfig,
-|};
+};
 
 type FragmentState = $ReadOnly<
-  | {|kind: 'bailout'|}
-  | {|kind: 'singular', snapshot: Snapshot, epoch: number|}
-  | {|kind: 'plural', snapshots: $ReadOnlyArray<Snapshot>, epoch: number|},
+  | {kind: 'bailout'}
+  | {kind: 'singular', snapshot: Snapshot, epoch: number}
+  | {kind: 'plural', snapshots: $ReadOnlyArray<Snapshot>, epoch: number},
 >;
 
-type StateUpdater<T> = (T | (T => T)) => void;
 type StateUpdaterFunction<T> = ((T) => T) => void;
 
 function isMissingData(state: FragmentState): boolean {
@@ -71,7 +73,7 @@ function getMissingClientEdges(
   } else if (state.kind === 'singular') {
     return state.snapshot.missingClientEdges ?? null;
   } else {
-    let edges = null;
+    let edges: null | Array<MissingClientEdgeRequestInfo> = null;
     for (const snapshot of state.snapshots) {
       if (snapshot.missingClientEdges) {
         edges = edges ?? [];
@@ -84,6 +86,27 @@ function getMissingClientEdges(
   }
 }
 
+function getSuspendingLiveResolver(
+  state: FragmentState,
+): $ReadOnlyArray<MissingLiveResolverField> | null {
+  if (state.kind === 'bailout') {
+    return null;
+  } else if (state.kind === 'singular') {
+    return state.snapshot.missingLiveResolverFields ?? null;
+  } else {
+    let missingFields: null | Array<MissingLiveResolverField> = null;
+    for (const snapshot of state.snapshots) {
+      if (snapshot.missingLiveResolverFields) {
+        missingFields = missingFields ?? [];
+        for (const edge of snapshot.missingLiveResolverFields) {
+          missingFields.push(edge);
+        }
+      }
+    }
+    return missingFields;
+  }
+}
+
 function handlePotentialSnapshotErrorsForState(
   environment: IEnvironment,
   state: FragmentState,
@@ -190,7 +213,7 @@ function handleMissingClientEdge(
   parentFragmentRef: mixed,
   missingClientEdgeRequestInfo: MissingClientEdgeRequestInfo,
   queryOptions?: FragmentQueryOptions,
-): () => () => void {
+): QueryResult {
   const originalVariables = getVariablesFromFragment(
     parentFragmentNode,
     parentFragmentRef,
@@ -206,16 +229,14 @@ function handleMissingClientEdge(
   );
   // This may suspend. We don't need to do anything with the results; all we're
   // doing here is started the query if needed and retaining and releasing it
-  // according to the component mount/suspense cycle; getQueryResultOrFetchQuery
+  // according to the component mount/suspense cycle; QueryResource
   // already handles this by itself.
-  const [_, effect] = getQueryResultOrFetchQuery(
-    environment,
+  const QueryResource = getQueryResourceForEnvironment(environment);
+  return QueryResource.prepare(
     queryOperationDescriptor,
-    {
-      fetchPolicy: queryOptions?.fetchPolicy,
-    },
+    fetchQueryInternal(environment, queryOperationDescriptor),
+    queryOptions?.fetchPolicy,
   );
-  return effect;
 }
 
 function subscribeToSnapshot(
@@ -227,11 +248,22 @@ function subscribeToSnapshot(
     return () => {};
   } else if (state.kind === 'singular') {
     const disposable = environment.subscribe(state.snapshot, latestSnapshot => {
-      setState(_ => ({
-        kind: 'singular',
-        snapshot: latestSnapshot,
-        epoch: environment.getStore().getEpoch(),
-      }));
+      setState(prevState => {
+        // In theory a setState from a subscription could be batched together
+        // with a setState to change the fragment selector. Guard against this
+        // by bailing out of the state update if the selector has changed.
+        if (
+          prevState.kind !== 'singular' ||
+          prevState.snapshot.selector !== latestSnapshot.selector
+        ) {
+          return prevState;
+        }
+        return {
+          kind: 'singular',
+          snapshot: latestSnapshot,
+          epoch: environment.getStore().getEpoch(),
+        };
+      });
     });
     return () => {
       disposable.dispose();
@@ -239,12 +271,17 @@ function subscribeToSnapshot(
   } else {
     const disposables = state.snapshots.map((snapshot, index) =>
       environment.subscribe(snapshot, latestSnapshot => {
-        setState(existing => {
-          invariant(
-            existing.kind === 'plural',
-            'Cannot go from singular to plural or from bailout to plural.',
-          );
-          const updated = [...existing.snapshots];
+        setState(prevState => {
+          // In theory a setState from a subscription could be batched together
+          // with a setState to change the fragment selector. Guard against this
+          // by bailing out of the state update if the selector has changed.
+          if (
+            prevState.kind !== 'plural' ||
+            prevState.snapshots[index]?.selector !== latestSnapshot.selector
+          ) {
+            return prevState;
+          }
+          const updated = [...prevState.snapshots];
           updated[index] = latestSnapshot;
           return {
             kind: 'plural',
@@ -265,11 +302,12 @@ function subscribeToSnapshot(
 function getFragmentState(
   environment: IEnvironment,
   fragmentSelector: ?ReaderSelector,
-  isPlural: boolean,
 ): FragmentState {
   if (fragmentSelector == null) {
     return {kind: 'bailout'};
   } else if (fragmentSelector.kind === 'PluralReaderSelector') {
+    // Note that if fragmentRef is an empty array, fragmentSelector will be null so we'll hit the above case.
+    // Null is returned by getSelector if fragmentRef has no non-null items.
     return {
       kind: 'plural',
       snapshots: fragmentSelector.selectors.map(s => environment.lookup(s)),
@@ -345,29 +383,17 @@ function useFragmentInternal_REACT_CACHE(
   );
 
   const environment = useRelayEnvironment();
-  const [rawState, setState] = useState<FragmentState>(() =>
-    getFragmentState(environment, fragmentSelector, isPlural),
+  const [_state, setState] = useState<FragmentState>(() =>
+    getFragmentState(environment, fragmentSelector),
   );
-  // On second look this separate rawState may not be needed at all, it can just be
-  // put into getFragmentState. Exception: can we properly handle the case where the
-  // fragmentRef goes from non-null to null?
-  const stateFromRawState = (state: FragmentState) => {
-    if (fragmentRef == null) {
-      return {kind: 'bailout'};
-    } else if (state.kind === 'plural' && state.snapshots.length === 0) {
-      return {kind: 'bailout'};
-    } else {
-      return state;
-    }
-  };
-  let state = stateFromRawState(rawState);
+  let state = _state;
 
   // This copy of the state we only update when something requires us to
   // unsubscribe and re-subscribe, namely a changed environment or
   // fragment selector.
-  const [rawSubscribedState, setSubscribedState] = useState(state);
+  const [_subscribedState, setSubscribedState] = useState(state);
   // FIXME since this is used as an effect dependency, it needs to be memoized.
-  let subscribedState = stateFromRawState(rawSubscribedState);
+  let subscribedState = _subscribedState;
 
   const [previousFragmentSelector, setPreviousFragmentSelector] =
     useState(fragmentSelector);
@@ -379,9 +405,7 @@ function useFragmentInternal_REACT_CACHE(
     // Enqueue setState to record the new selector and state
     setPreviousFragmentSelector(fragmentSelector);
     setPreviousEnvironment(environment);
-    const newState = stateFromRawState(
-      getFragmentState(environment, fragmentSelector, isPlural),
-    );
+    const newState = getFragmentState(environment, fragmentSelector);
     setState(newState);
     setSubscribedState(newState); // This causes us to form a new subscription
     // But render with the latest state w/o waiting for the setState. Otherwise
@@ -391,6 +415,17 @@ function useFragmentInternal_REACT_CACHE(
     subscribedState = newState;
   }
 
+  // The purpose of this is to detect whether we have ever committed, because we
+  // don't suspend on store updates, only when the component either is first trying
+  // to mount or when the our selector changes. The selector change in particular is
+  // how we suspend for pagination and refetech. Also, fragment selector can be null
+  // or undefined, so we use false as a special value to distinguish from all fragment
+  // selectors; false means that the component hasn't mounted yet.
+  const committedFragmentSelectorRef = useRef<false | ?ReaderSelector>(false);
+  useEffect(() => {
+    committedFragmentSelectorRef.current = fragmentSelector;
+  }, [fragmentSelector]);
+
   // Handle the queries for any missing client edges; this may suspend.
   // FIXME handle client edges in parallel.
   if (fragmentNode.metadata?.hasClientEdges === true) {
@@ -398,14 +433,14 @@ function useFragmentInternal_REACT_CACHE(
     // a static (constant) property of the fragment. In practice, this effect will
     // always or never run for a given invocation of this hook.
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    const effects = useMemo(() => {
+    const clientEdgeQueries = useMemo(() => {
       const missingClientEdges = getMissingClientEdges(state);
       // eslint-disable-next-line no-shadow
-      let effects;
+      let clientEdgeQueries;
       if (missingClientEdges?.length) {
-        effects = [];
+        clientEdgeQueries = ([]: Array<QueryResult>);
         for (const edge of missingClientEdges) {
-          effects.push(
+          clientEdgeQueries.push(
             handleMissingClientEdge(
               environment,
               fragmentNode,
@@ -416,41 +451,59 @@ function useFragmentInternal_REACT_CACHE(
           );
         }
       }
-      return effects;
+      return clientEdgeQueries;
     }, [state, environment, fragmentNode, fragmentRef, queryOptions]);
 
     // See above note
     // eslint-disable-next-line react-hooks/rules-of-hooks
     useEffect(() => {
-      if (effects?.length) {
-        const cleanups = [];
-        for (const effect of effects) {
-          cleanups.push(effect());
+      const QueryResource = getQueryResourceForEnvironment(environment);
+      if (clientEdgeQueries?.length) {
+        const disposables = [];
+        for (const query of clientEdgeQueries) {
+          disposables.push(QueryResource.retain(query));
         }
         return () => {
-          for (const cleanup of cleanups) {
-            cleanup();
+          for (const disposable of disposables) {
+            disposable.dispose();
           }
         };
       }
-    }, [effects]);
+    }, [environment, clientEdgeQueries]);
   }
 
   if (isMissingData(state)) {
+    // Suspend if a Live Resolver within this fragment is in a suspended state:
+    const suspendingLiveResolvers = getSuspendingLiveResolver(state);
+    if (suspendingLiveResolvers != null && suspendingLiveResolvers.length > 0) {
+      throw Promise.all(
+        suspendingLiveResolvers.map(({liveStateID}) => {
+          // $FlowFixMe[prop-missing] This is expected to be a LiveResolverStore
+          return environment.getStore().getLiveResolverPromise(liveStateID);
+        }),
+      );
+    }
     // Suspend if an active operation bears on this fragment, either the
-    // fragment's owner or some other mutation etc. that could affect it:
-    invariant(fragmentSelector != null, 'refinement, see invariants above');
-    const fragmentOwner =
-      fragmentSelector.kind === 'PluralReaderSelector'
-        ? fragmentSelector.selectors[0].owner
-        : fragmentSelector.owner;
-    const pendingOperationsResult = getPendingOperationsForFragment(
-      environment,
-      fragmentNode,
-      fragmentOwner,
-    );
-    if (pendingOperationsResult) {
-      throw pendingOperationsResult.promise;
+    // fragment's owner or some other mutation etc. that could affect it.
+    // We only suspend when the component is first trying to mount or changing
+    // selectors, not if data becomes missing later:
+    if (
+      !committedFragmentSelectorRef.current ||
+      !areEqualSelectors(committedFragmentSelectorRef.current, fragmentSelector)
+    ) {
+      invariant(fragmentSelector != null, 'refinement, see invariants above');
+      const fragmentOwner =
+        fragmentSelector.kind === 'PluralReaderSelector'
+          ? fragmentSelector.selectors[0].owner
+          : fragmentSelector.owner;
+      const pendingOperationsResult = getPendingOperationsForFragment(
+        environment,
+        fragmentNode,
+        fragmentOwner,
+      );
+      if (pendingOperationsResult) {
+        throw pendingOperationsResult.promise;
+      }
     }
     // Report required fields only if we're not suspending, since that means
     // they're missing even though we are out of options for possibly fetching them:
@@ -475,23 +528,7 @@ function useFragmentInternal_REACT_CACHE(
       }
       currentState = updatedState;
     }
-    return subscribeToSnapshot(environment, currentState, updater => {
-      setState(latestState => {
-        if (
-          latestState.snapshot?.selector !== currentState.snapshot?.selector
-        ) {
-          // Ignore updates to the subscription if it's for a previous fragment selector
-          // than the latest one to be rendered. This can happen if the store is updated
-          // after we re-render with a new fragmentRef prop but before the effect fires
-          // in which we unsubscribe to the old one and subscribe to the new one.
-          // (NB: it's safe to compare the selectors by reference because the selector
-          // is recycled into new snapshots.)
-          return latestState;
-        } else {
-          return updater(latestState);
-        }
-      });
-    });
+    return subscribeToSnapshot(environment, currentState, setState);
   }, [environment, subscribedState]);
 
   let data: ?SelectorData | Array<?SelectorData>;
@@ -501,10 +538,13 @@ function useFragmentInternal_REACT_CACHE(
     //
     // Note that isPlural is a constant property of the fragment and does not change
     // for a particular useFragment invocation site
+    const fragmentRefIsNullish = fragmentRef == null; // for less sensitive memoization
     // eslint-disable-next-line react-hooks/rules-of-hooks
     data = useMemo(() => {
       if (state.kind === 'bailout') {
-        return [];
+        // Bailout state can happen if the fragmentRef is a plural array that is empty or has no
+        // non-null entries. In that case, the compatible behavior is to return [] instead of null.
+        return fragmentRefIsNullish ? null : [];
       } else {
         invariant(
           state.kind === 'plural',
@@ -512,7 +552,7 @@ function useFragmentInternal_REACT_CACHE(
         );
         return state.snapshots.map(s => s.data);
       }
-    }, [state]);
+    }, [state, fragmentRefIsNullish]);
   } else if (state.kind === 'bailout') {
     // This case doesn't allocate a new object so it doesn't have to be memoized
     data = null;

package/relay-hooks/react-cache/useFragment_REACT_CACHE.js.flow

@@ -4,13 +4,11 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @emails oncall+relay
  * @flow strict-local
  * @format
+ * @oncall relay
  */
 
-// flowlint ambiguous-object-type:error
-
 'use strict';
 
 import type {Fragment, FragmentType, GraphQLTaggedNode} from 'relay-runtime';

package/relay-hooks/react-cache/useLazyLoadQuery_REACT_CACHE.js.flow

@@ -5,12 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @flow strict-local
- * @emails oncall+relay
  * @format
+ * @oncall relay
  */
 
-// flowlint ambiguous-object-type:error
-
 'use strict';
 
 import type {
@@ -31,12 +29,12 @@ const {useEffect} = require('react');
 function useLazyLoadQuery_REACT_CACHE<TVariables: Variables, TData>(
   gqlQuery: Query<TVariables, TData>,
   variables: TVariables,
-  options?: {|
+  options?: {
     fetchKey?: string | number,
     fetchPolicy?: FetchPolicy,
     networkCacheConfig?: CacheConfig,
     UNSTABLE_renderPolicy?: RenderPolicy,
-  |},
+  },
 ): TData {
   useTrackLoadQueryInRender();
   const environment = useRelayEnvironment();

package/relay-hooks/react-cache/usePaginationFragment_REACT_CACHE.js.flow

@@ -0,0 +1,190 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ * @oncall relay
+ */
+
+'use strict';
+
+import type {LoadMoreFn, UseLoadMoreFunctionArgs} from '../useLoadMoreFunction';
+import type {Options} from './useRefetchableFragmentInternal_REACT_CACHE';
+import type {RefetchFnDynamic} from './useRefetchableFragmentInternal_REACT_CACHE';
+import type {
+  FragmentType,
+  GraphQLResponse,
+  GraphQLTaggedNode,
+  Observer,
+  OperationType,
+  Variables,
+} from 'relay-runtime';
+import type {VariablesOf} from 'relay-runtime/util/RelayRuntimeTypes';
+
+const useLoadMoreFunction = require('../useLoadMoreFunction');
+const useRelayEnvironment = require('../useRelayEnvironment');
+const useStaticFragmentNodeWarning = require('../useStaticFragmentNodeWarning');
+const useRefetchableFragmentInternal = require('./useRefetchableFragmentInternal_REACT_CACHE');
+const {useCallback, useDebugValue, useState} = require('react');
+const {
+  getFragment,
+  getFragmentIdentifier,
+  getPaginationMetadata,
+} = require('relay-runtime');
+
+export type ReturnType<TQuery: OperationType, TKey, TFragmentData> = {
+  data: TFragmentData,
+  loadNext: LoadMoreFn<TQuery['variables']>,
+  loadPrevious: LoadMoreFn<TQuery['variables']>,
+  hasNext: boolean,
+  hasPrevious: boolean,
+  isLoadingNext: boolean,
+  isLoadingPrevious: boolean,
+  refetch: RefetchFnDynamic<TQuery, TKey>,
+};
+
+function usePaginationFragment<
+  TQuery: OperationType,
+  TKey: ?{+$data?: mixed, +$fragmentSpreads: FragmentType, ...},
+>(
+  fragmentInput: GraphQLTaggedNode,
+  parentFragmentRef: TKey,
+): ReturnType<
+  TQuery,
+  TKey,
+  // NOTE: This $Call ensures that the type of the returned data is either:
+  //   - nullable if the provided ref type is nullable
+  //   - non-nullable if the provided ref type is non-nullable
+  // prettier-ignore
+  $Call<
+    & (<TFragmentData>( { +$data?: TFragmentData, ... }) =>  TFragmentData)
+    & (<TFragmentData>(?{ +$data?: TFragmentData, ... }) => ?TFragmentData),
+    TKey,
+  >,
+> {
+  const fragmentNode = getFragment(fragmentInput);
+  useStaticFragmentNodeWarning(
+    fragmentNode,
+    'first argument of usePaginationFragment()',
+  );
+  const componentDisplayName = 'usePaginationFragment()';
+
+  const {
+    connectionPathInFragmentData,
+    paginationRequest,
+    paginationMetadata,
+    identifierField,
+  } = getPaginationMetadata(fragmentNode, componentDisplayName);
+
+  const {fragmentData, fragmentRef, refetch} = useRefetchableFragmentInternal<
+    TQuery,
+    TKey,
+  >(fragmentNode, parentFragmentRef, componentDisplayName);
+  const fragmentIdentifier = getFragmentIdentifier(fragmentNode, fragmentRef);
+
+  // Backward pagination
+  const [loadPrevious, hasPrevious, isLoadingPrevious, disposeFetchPrevious] =
+    useLoadMore<TQuery['variables']>({
+      componentDisplayName,
+      connectionPathInFragmentData,
+      direction: 'backward',
+      fragmentData,
+      fragmentIdentifier,
+      fragmentNode,
+      fragmentRef,
+      identifierField,
+      paginationMetadata,
+      paginationRequest,
+    });
+
+  // Forward pagination
+  const [loadNext, hasNext, isLoadingNext, disposeFetchNext] = useLoadMore<
+    TQuery['variables'],
+  >({
+    componentDisplayName,
+    connectionPathInFragmentData,
+    direction: 'forward',
+    fragmentData,
+    fragmentIdentifier,
+    fragmentNode,
+    fragmentRef,
+    identifierField,
+    paginationMetadata,
+    paginationRequest,
+  });
+
+  const refetchPagination: RefetchFnDynamic<TQuery, TKey> = useCallback(
+    (variables: VariablesOf<TQuery>, options: void | Options) => {
+      disposeFetchNext();
+      disposeFetchPrevious();
+      return refetch(variables, {...options, __environment: undefined});
+    },
+    [disposeFetchNext, disposeFetchPrevious, refetch],
+  );
+
+  if (__DEV__) {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    useDebugValue({
+      fragment: fragmentNode.name,
+      data: fragmentData,
+      hasNext,
+      isLoadingNext,
+      hasPrevious,
+      isLoadingPrevious,
+    });
+  }
+  return {
+    data: fragmentData,
+    loadNext,
+    loadPrevious,
+    hasNext,
+    hasPrevious,
+    isLoadingNext,
+    isLoadingPrevious,
+    refetch: refetchPagination,
+  };
+}
+
+function useLoadMore<TVariables: Variables>(
+  args: $Diff<
+    UseLoadMoreFunctionArgs,
+    {
+      observer: Observer<GraphQLResponse>,
+      onReset: () => void,
+      ...
+    },
+  >,
+): [LoadMoreFn<TVariables>, boolean, boolean, () => void] {
+  const environment = useRelayEnvironment();
+  const [isLoadingMore, reallySetIsLoadingMore] = useState(false);
+  // Schedule this update since it must be observed by components at the same
+  // batch as when hasNext changes. hasNext is read from the store and store
+  // updates are scheduled, so this must be scheduled too.
+  const setIsLoadingMore = (value: boolean) => {
+    const schedule = environment.getScheduler()?.schedule;
+    if (schedule) {
+      schedule(() => {
+        reallySetIsLoadingMore(value);
+      });
+    } else {
+      reallySetIsLoadingMore(value);
+    }
+  };
+  const observer = {
+    start: () => setIsLoadingMore(true),
+    complete: () => setIsLoadingMore(false),
+    error: () => setIsLoadingMore(false),
+  };
+  const handleReset = () => setIsLoadingMore(false);
+  const [loadMore, hasMore, disposeFetch] = useLoadMoreFunction<TVariables>({
+    ...args,
+    observer,
+    onReset: handleReset,
+  });
+  return [loadMore, hasMore, isLoadingMore, disposeFetch];
+}
+
+module.exports = usePaginationFragment;

package/relay-hooks/react-cache/usePreloadedQuery_REACT_CACHE.js.flow

@@ -5,12 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @flow strict-local
- * @emails oncall+relay
  * @format
+ * @oncall relay
  */
 
-// flowlint ambiguous-object-type:error
-
 'use strict';
 
 import type {PreloadedQuery} from '../EntryPointTypes.flow';
@@ -35,9 +33,9 @@ const warning = require('warning');
 function usePreloadedQuery_REACT_CACHE<TQuery: OperationType>(
   gqlQuery: GraphQLTaggedNode,
   preloadedQuery: PreloadedQuery<TQuery>,
-  options?: {|
+  options?: {
     UNSTABLE_renderPolicy?: RenderPolicy,
-  |},
+  },
 ): TQuery['response'] {
   const environment = useRelayEnvironment();
 
@@ -124,7 +122,6 @@ function usePreloadedQuery_REACT_CACHE<TQuery: OperationType>(
 
   // Read the query's root fragment -- this may suspend.
   const {fragmentNode, fragmentRef} = queryResult;
-  // $FlowExpectedError[incompatible-return] Is this a fixable incompatible-return?
   const data = useFragmentInternal(
     fragmentNode,
     fragmentRef,