react-relay 18.1.0 → 19.0.0

package/lib/relay-hooks/useFragmentInternal_EXPERIMENTAL.js

@@ -7,6 +7,7 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 var _require = require('./QueryResource'),
   getQueryResourceForEnvironment = _require.getQueryResourceForEnvironment;
 var useRelayEnvironment = require('./useRelayEnvironment');
+var useRelayLoggingContext = require('./useRelayLoggingContext');
 var invariant = require('invariant');
 var _require2 = require('react'),
   useDebugValue = _require2.useDebugValue,
@@ -114,16 +115,16 @@ function getSuspendingLiveResolver(state) {
     return missingFields;
   }
 }
-function handlePotentialSnapshotErrorsForState(environment, state) {
+function handlePotentialSnapshotErrorsForState(environment, state, loggingContext) {
   if (state.kind === 'singular') {
-    handlePotentialSnapshotErrors(environment, state.snapshot.errorResponseFields);
+    handlePotentialSnapshotErrors(environment, state.snapshot.fieldErrors, loggingContext);
   } else if (state.kind === 'plural') {
     var _iterator5 = (0, _createForOfIteratorHelper2["default"])(state.snapshots),
       _step5;
     try {
       for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
         var snapshot = _step5.value;
-        handlePotentialSnapshotErrors(environment, snapshot.errorResponseFields);
+        handlePotentialSnapshotErrors(environment, snapshot.fieldErrors, loggingContext);
       }
     } catch (err) {
       _iterator5.e(err);
@@ -150,7 +151,7 @@ function handleMissedUpdates(environment, state) {
       missingLiveResolverFields: currentSnapshot.missingLiveResolverFields,
       seenRecords: currentSnapshot.seenRecords,
       selector: currentSnapshot.selector,
-      errorResponseFields: currentSnapshot.errorResponseFields
+      fieldErrors: currentSnapshot.fieldErrors
     };
     return [updatedData !== state.snapshot.data, {
       kind: 'singular',
@@ -173,7 +174,7 @@ function handleMissedUpdates(environment, state) {
         missingLiveResolverFields: _currentSnapshot.missingLiveResolverFields,
         seenRecords: _currentSnapshot.seenRecords,
         selector: _currentSnapshot.selector,
-        errorResponseFields: _currentSnapshot.errorResponseFields
+        fieldErrors: _currentSnapshot.fieldErrors
       };
       if (_updatedData !== snapshot.data) {
         didMissUpdates = true;
@@ -324,6 +325,10 @@ function useFragmentInternal_EXPERIMENTAL(fragmentNode, fragmentRef, hookDisplay
   }
   !(fragmentRef == null || isPlural && Array.isArray(fragmentRef) && fragmentRef.length === 0 || fragmentSelector != null) ? process.env.NODE_ENV !== "production" ? invariant(false, 'Relay: Expected to receive an object where `...%s` was spread, ' + 'but the fragment reference was not found`. This is most ' + 'likely the result of:\n' + "- Forgetting to spread `%s` in `%s`'s parent's fragment.\n" + '- Conditionally fetching `%s` but unconditionally passing %s prop ' + 'to `%s`. If the parent fragment only fetches the fragment conditionally ' + '- with e.g. `@include`, `@skip`, or inside a `... on SomeType { }` ' + 'spread  - then the fragment reference will not exist. ' + 'In this case, pass `null` if the conditions for evaluating the ' + 'fragment are not met (e.g. if the `@include(if)` value is false.)', fragmentNode.name, fragmentNode.name, hookDisplayName, fragmentNode.name, hookDisplayName) : invariant(false) : void 0;
   var environment = useRelayEnvironment();
+  var loggerContext;
+  if (RelayFeatureFlags.ENABLE_UI_CONTEXT_ON_RELAY_LOGGER) {
+    loggerContext = useRelayLoggingContext();
+  }
   var _useState = useState(function () {
       return getFragmentState(environment, fragmentSelector);
     }),
@@ -401,8 +406,7 @@ function useFragmentInternal_EXPERIMENTAL(fragmentNode, fragmentRef, hookDisplay
   if (isMissingData(state)) {
     var suspendingLiveResolvers = getSuspendingLiveResolver(state);
     if (suspendingLiveResolvers != null && suspendingLiveResolvers.length > 0) {
-      throw Promise.all(suspendingLiveResolvers.map(function (_ref) {
-        var liveStateID = _ref.liveStateID;
+      throw Promise.all(suspendingLiveResolvers.map(function (liveStateID) {
         return environment.getStore().getLiveResolverPromise(liveStateID);
       }));
     }
@@ -415,7 +419,7 @@ function useFragmentInternal_EXPERIMENTAL(fragmentNode, fragmentRef, hookDisplay
       }
     }
   }
-  handlePotentialSnapshotErrorsForState(environment, state);
+  handlePotentialSnapshotErrorsForState(environment, state, loggerContext);
   var storeSubscriptionRef = useRef(null);
   useEffect(function () {
     var storeSubscription = storeSubscriptionRef.current;

package/lib/relay-hooks/useLoadMoreFunction.js

@@ -71,6 +71,7 @@ function useLoadMoreFunction_CURRENT(args) {
       disposeFetch();
     };
   }, [disposeFetch]);
+  var isRequestInvalid = fragmentData == null || isParentQueryActive;
   var loadMore = useCallback(function (count, options) {
     var onComplete = options === null || options === void 0 ? void 0 : options.onComplete;
     if (isMountedRef.current !== true) {
@@ -80,7 +81,7 @@ function useLoadMoreFunction_CURRENT(args) {
       };
     }
     var fragmentSelector = getSelector(fragmentNode, fragmentRef);
-    if (isFetchingRef.current === true || fragmentData == null || isParentQueryActive) {
+    if (isFetchingRef.current === true || isRequestInvalid) {
       if (fragmentSelector == null) {
         process.env.NODE_ENV !== "production" ? warning(false, 'Relay: Unexpected fetch while using a null fragment ref ' + 'for fragment `%s` in `%s`. When fetching more items, we expect ' + "initial fragment data to be non-null. Please make sure you're " + 'passing a valid fragment ref to `%s` before paginating.', fragmentNode.name, componentDisplayName, componentDisplayName) : void 0;
       }
@@ -125,7 +126,7 @@ function useLoadMoreFunction_CURRENT(args) {
     return {
       dispose: disposeFetch
     };
-  }, [environment, identifierValue, direction, cursor, startFetch, disposeFetch, completeFetch, isFetchingRef, isParentQueryActive, fragmentData, fragmentNode.name, fragmentRef, componentDisplayName]);
+  }, [environment, identifierValue, direction, cursor, startFetch, disposeFetch, completeFetch, isFetchingRef, isRequestInvalid, fragmentNode.name, fragmentRef, componentDisplayName]);
   return [loadMore, hasMore, disposeFetch];
 }
 module.exports = useLoadMoreFunction;

package/lib/relay-hooks/useLoadMoreFunction_EXPERIMENTAL.js

@@ -62,6 +62,7 @@ function useLoadMoreFunction_EXPERIMENTAL(args) {
   var _getConnectionState = getConnectionState(direction, fragmentNode, fragmentData, connectionPathInFragmentData),
     cursor = _getConnectionState.cursor,
     hasMore = _getConnectionState.hasMore;
+  var isRequestInvalid = fragmentData == null || isParentQueryActive;
   var isMountedRef = useIsMountedRef();
   var loadMore = useCallback(function (count, options) {
     var onComplete = options === null || options === void 0 ? void 0 : options.onComplete;
@@ -72,7 +73,7 @@ function useLoadMoreFunction_EXPERIMENTAL(args) {
       };
     }
     var fragmentSelector = getSelector(fragmentNode, fragmentRef);
-    if (fetchStatusRef.current.kind === 'fetching' || fragmentData == null || isParentQueryActive) {
+    if (fetchStatusRef.current.kind === 'fetching' || isRequestInvalid) {
       if (fragmentSelector == null) {
         process.env.NODE_ENV !== "production" ? warning(false, 'Relay: Unexpected fetch while using a null fragment ref ' + 'for fragment `%s` in `%s`. When fetching more items, we expect ' + "initial fragment data to be non-null. Please make sure you're " + 'passing a valid fragment ref to `%s` before paginating.', fragmentNode.name, componentDisplayName, componentDisplayName) : void 0;
       }
@@ -124,7 +125,7 @@ function useLoadMoreFunction_EXPERIMENTAL(args) {
     return {
       dispose: function dispose() {}
     };
-  }, [environment, identifierValue, direction, cursor, isParentQueryActive, fragmentData, fragmentNode.name, fragmentRef, componentDisplayName]);
+  }, [environment, identifierValue, direction, cursor, isRequestInvalid, fragmentNode.name, fragmentRef, componentDisplayName]);
   return [loadMore, hasMore, forceDisposeFn];
 }
 module.exports = useLoadMoreFunction_EXPERIMENTAL;

package/lib/relay-hooks/usePaginationFragment.js

@@ -11,6 +11,7 @@ var _require = require('react'),
   useDebugValue = _require.useDebugValue,
   useState = _require.useState;
 var _require2 = require('relay-runtime'),
+  RelayFeatureFlags = _require2.RelayFeatureFlags,
   getFragment = _require2.getFragment,
   getFragmentIdentifier = _require2.getFragmentIdentifier,
   getPaginationMetadata = _require2.getPaginationMetadata;
@@ -110,7 +111,10 @@ function useLoadMore(args) {
     },
     error: function error() {
       return setIsLoadingMore(false);
-    }
+    },
+    unsubscribe: RelayFeatureFlags.ENABLE_USE_PAGINATION_IS_LOADING_FIX ? function () {
+      return setIsLoadingMore(false);
+    } : undefined
   };
   var handleReset = function handleReset() {
     return setIsLoadingMore(false);

package/lib/relay-hooks/usePrefetchableForwardPaginationFragment.js

@@ -0,0 +1,228 @@
+'use strict';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var useFragment = require('./useFragment');
+var useLoadMoreFunction = require('./useLoadMoreFunction');
+var useRefetchableFragmentInternal = require('./useRefetchableFragmentInternal');
+var useRelayEnvironment = require('./useRelayEnvironment');
+var useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
+var invariant = require('invariant');
+var _require = require('react'),
+  useCallback = _require.useCallback,
+  useDebugValue = _require.useDebugValue,
+  useEffect = _require.useEffect,
+  useLayoutEffect = _require.useLayoutEffect,
+  useMemo = _require.useMemo,
+  useRef = _require.useRef,
+  useState = _require.useState;
+var _require2 = require('relay-runtime'),
+  getFragment = _require2.getFragment,
+  getFragmentIdentifier = _require2.getFragmentIdentifier,
+  getPaginationMetadata = _require2.getPaginationMetadata;
+var _require3 = require('relay-runtime'),
+  ConnectionInterface = _require3.ConnectionInterface,
+  RelayFeatureFlags = _require3.RelayFeatureFlags,
+  getSelector = _require3.getSelector,
+  getValueAtPath = _require3.getValueAtPath;
+function usePrefetchableForwardPaginationFragment(fragmentInput, parentFragmentRef, bufferSize, initialSize, prefetchingLoadMoreOptions) {
+  var _fragmentInput$metada, _fragmentInput$metada2;
+  var minimalFetchSize = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;
+  var disablePrefetching = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
+  var fragmentNode = getFragment(fragmentInput);
+  useStaticFragmentNodeWarning(fragmentNode, 'first argument of usePrefetchableForwardPaginationFragment()');
+  var componentDisplayName = 'usePrefetchableForwardPaginationFragment()';
+  var _getPaginationMetadat = getPaginationMetadata(fragmentNode, componentDisplayName),
+    connectionPathInFragmentData = _getPaginationMetadat.connectionPathInFragmentData,
+    paginationRequest = _getPaginationMetadat.paginationRequest,
+    paginationMetadata = _getPaginationMetadat.paginationMetadata;
+  var _useRefetchableFragme = useRefetchableFragmentInternal(fragmentNode, parentFragmentRef, componentDisplayName),
+    fragmentData = _useRefetchableFragme.fragmentData,
+    fragmentRef = _useRefetchableFragme.fragmentRef,
+    refetch = _useRefetchableFragme.refetch;
+  var fragmentIdentifier = getFragmentIdentifier(fragmentNode, fragmentRef);
+  var edgeKeys = useMemo(function () {
+    var connection = getValueAtPath(fragmentData, connectionPathInFragmentData);
+    if (connection == null) {
+      return null;
+    }
+    var _ConnectionInterface$ = ConnectionInterface.get(),
+      EDGES = _ConnectionInterface$.EDGES;
+    return connection[EDGES];
+  }, [connectionPathInFragmentData, fragmentData]);
+  var sourceSize = edgeKeys == null ? -1 : edgeKeys.length;
+  var _useState = useState(initialSize != null ? initialSize : sourceSize),
+    _numInUse = _useState[0],
+    setNumInUse = _useState[1];
+  var numInUse = _numInUse;
+  if (_numInUse === -1 && sourceSize !== -1) {
+    numInUse = initialSize != null ? initialSize : sourceSize;
+    setNumInUse(numInUse);
+  }
+  var environment = useRelayEnvironment();
+  var _useState2 = useState(false),
+    isLoadingMore = _useState2[0],
+    reallySetIsLoadingMore = _useState2[1];
+  var _useState3 = useState(false),
+    isRefetching = _useState3[0],
+    setIsRefetching = _useState3[1];
+  var availableSizeRef = useRef(0);
+  var setIsLoadingMore = useCallback(function (value) {
+    var _environment$getSched;
+    var schedule = (_environment$getSched = environment.getScheduler()) === null || _environment$getSched === void 0 ? void 0 : _environment$getSched.schedule;
+    if (schedule) {
+      schedule(function () {
+        reallySetIsLoadingMore(value);
+      });
+    } else {
+      reallySetIsLoadingMore(value);
+    }
+  }, [environment]);
+  var isLoadingMoreRef = useRef(false);
+  var observer = useMemo(function () {
+    function setIsLoadingFalse() {
+      isLoadingMoreRef.current = false;
+      setIsLoadingMore(false);
+    }
+    return {
+      start: function start() {
+        isLoadingMoreRef.current = true;
+        reallySetIsLoadingMore(true);
+      },
+      complete: setIsLoadingFalse,
+      error: setIsLoadingFalse,
+      unsubscribe: RelayFeatureFlags.ENABLE_USE_PAGINATION_IS_LOADING_FIX ? setIsLoadingFalse : undefined
+    };
+  }, [setIsLoadingMore]);
+  var handleReset = useCallback(function () {
+    if (!isRefetching) {
+      var _environment$getSched2;
+      var schedule = (_environment$getSched2 = environment.getScheduler()) === null || _environment$getSched2 === void 0 ? void 0 : _environment$getSched2.schedule;
+      if (schedule) {
+        schedule(function () {
+          setNumInUse(-1);
+        });
+      } else {
+        setNumInUse(-1);
+      }
+    }
+    isLoadingMoreRef.current = false;
+    setIsLoadingMore(false);
+  }, [environment, isRefetching, setIsLoadingMore]);
+  var _useLoadMoreFunction = useLoadMoreFunction({
+      componentDisplayName: componentDisplayName,
+      connectionPathInFragmentData: connectionPathInFragmentData,
+      direction: 'forward',
+      fragmentData: fragmentData,
+      fragmentIdentifier: fragmentIdentifier,
+      fragmentNode: fragmentNode,
+      fragmentRef: fragmentRef,
+      paginationMetadata: paginationMetadata,
+      paginationRequest: paginationRequest,
+      observer: observer,
+      onReset: handleReset
+    }),
+    loadMore = _useLoadMoreFunction[0],
+    hasNext = _useLoadMoreFunction[1],
+    disposeFetchNext = _useLoadMoreFunction[2];
+  useLayoutEffect(function () {
+    availableSizeRef.current = sourceSize - numInUse;
+  }, [numInUse, sourceSize]);
+  var prefetchingUNSTABLE_extraVariables = prefetchingLoadMoreOptions === null || prefetchingLoadMoreOptions === void 0 ? void 0 : prefetchingLoadMoreOptions.UNSTABLE_extraVariables;
+  var prefetchingOnComplete = prefetchingLoadMoreOptions === null || prefetchingLoadMoreOptions === void 0 ? void 0 : prefetchingLoadMoreOptions.onComplete;
+  var showMore = useCallback(function (numToAdd, options) {
+    if (!isLoadingMoreRef.current || availableSizeRef.current >= 0) {
+      availableSizeRef.current -= numToAdd;
+      setNumInUse(function (lastNumInUse) {
+        return lastNumInUse + numToAdd;
+      });
+      if (!isLoadingMoreRef.current && availableSizeRef.current < 0) {
+        loadMore(Math.max(minimalFetchSize, Math.min(numToAdd, bufferSize - availableSizeRef.current)), options !== null && options !== void 0 ? options : {
+          onComplete: prefetchingOnComplete,
+          UNSTABLE_extraVariables: typeof prefetchingUNSTABLE_extraVariables === 'function' ? prefetchingUNSTABLE_extraVariables({
+            hasNext: hasNext,
+            data: fragmentData,
+            getServerEdges: function getServerEdges() {
+              var selector = getSelector(edgesFragment, edgeKeys);
+              if (selector == null) {
+                return [];
+              }
+              !(selector.kind === 'PluralReaderSelector') ? process.env.NODE_ENV !== "production" ? invariant(false, 'Expected a plural selector') : invariant(false) : void 0;
+              return selector.selectors.map(function (sel) {
+                return environment.lookup(sel).data;
+              });
+            }
+          }) : prefetchingUNSTABLE_extraVariables
+        });
+      }
+    }
+  }, [bufferSize, loadMore, minimalFetchSize, edgeKeys, fragmentData, prefetchingUNSTABLE_extraVariables, prefetchingOnComplete]);
+  var edgesFragment = (_fragmentInput$metada = fragmentInput.metadata) === null || _fragmentInput$metada === void 0 ? void 0 : (_fragmentInput$metada2 = _fragmentInput$metada.refetch) === null || _fragmentInput$metada2 === void 0 ? void 0 : _fragmentInput$metada2.edgesFragment;
+  !(edgesFragment != null) ? process.env.NODE_ENV !== "production" ? invariant(false, 'usePrefetchableForwardPaginationFragment: Expected the edge fragment to be defined, ' + 'please make sure you have added `prefetchable_pagination: true`  to `@connection`') : invariant(false) : void 0;
+  useEffect(function () {
+    if (!isLoadingMoreRef.current && !isLoadingMore && !isRefetching && !disablePrefetching && hasNext && (sourceSize - numInUse < bufferSize || numInUse > sourceSize)) {
+      var onComplete = prefetchingOnComplete;
+      loadMore(Math.max(bufferSize - Math.max(sourceSize - numInUse, 0), numInUse - sourceSize, minimalFetchSize), {
+        onComplete: onComplete,
+        UNSTABLE_extraVariables: typeof prefetchingUNSTABLE_extraVariables === 'function' ? prefetchingUNSTABLE_extraVariables({
+          hasNext: hasNext,
+          data: fragmentData,
+          getServerEdges: function getServerEdges() {
+            var selector = getSelector(edgesFragment, edgeKeys);
+            if (selector == null) {
+              return [];
+            }
+            !(selector.kind === 'PluralReaderSelector') ? process.env.NODE_ENV !== "production" ? invariant(false, 'Expected a plural selector') : invariant(false) : void 0;
+            return selector.selectors.map(function (sel) {
+              return environment.lookup(sel).data;
+            });
+          }
+        }) : prefetchingUNSTABLE_extraVariables
+      });
+    }
+  }, [hasNext, bufferSize, isRefetching, loadMore, numInUse, prefetchingUNSTABLE_extraVariables, prefetchingOnComplete, sourceSize, edgeKeys, isLoadingMore, minimalFetchSize, environment, edgesFragment]);
+  var realNumInUse = Math.min(numInUse, sourceSize);
+  var derivedEdgeKeys = useMemo(function () {
+    var _edgeKeys$slice;
+    return (_edgeKeys$slice = edgeKeys === null || edgeKeys === void 0 ? void 0 : edgeKeys.slice(0, realNumInUse)) !== null && _edgeKeys$slice !== void 0 ? _edgeKeys$slice : [];
+  }, [edgeKeys, realNumInUse]);
+  var edges = useFragment(edgesFragment, derivedEdgeKeys);
+  var refetchPagination = useCallback(function (variables, options) {
+    disposeFetchNext();
+    setIsRefetching(true);
+    return refetch(variables, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, options), {}, {
+      onComplete: function onComplete(maybeError) {
+        var _environment$getSched3, _options$onComplete;
+        var schedule = (_environment$getSched3 = environment.getScheduler()) === null || _environment$getSched3 === void 0 ? void 0 : _environment$getSched3.schedule;
+        if (schedule) {
+          schedule(function () {
+            setIsRefetching(false);
+            setNumInUse(-1);
+          });
+        } else {
+          setIsRefetching(false);
+          setNumInUse(-1);
+        }
+        options === null || options === void 0 ? void 0 : (_options$onComplete = options.onComplete) === null || _options$onComplete === void 0 ? void 0 : _options$onComplete.call(options, maybeError);
+      },
+      __environment: undefined
+    }));
+  }, [disposeFetchNext, environment, refetch]);
+  if (process.env.NODE_ENV !== "production") {
+    useDebugValue({
+      fragment: fragmentNode.name,
+      data: fragmentData,
+      hasNext: hasNext,
+      isLoadingNext: isLoadingMore
+    });
+  }
+  return {
+    edges: edges,
+    data: fragmentData,
+    loadNext: showMore,
+    hasNext: hasNext || sourceSize > numInUse,
+    isLoadingNext: isLoadingMore && numInUse > sourceSize,
+    refetch: refetchPagination
+  };
+}
+module.exports = usePrefetchableForwardPaginationFragment;

package/lib/relay-hooks/usePrefetchableForwardPaginationFragment_EXPERIMENTAL.js

@@ -0,0 +1,227 @@
+'use strict';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var useFragment = require('./useFragment');
+var useLoadMoreFunction = require('./useLoadMoreFunction');
+var useRefetchableFragmentInternal = require('./useRefetchableFragmentInternal');
+var useRelayEnvironment = require('./useRelayEnvironment');
+var useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
+var invariant = require('invariant');
+var _require = require('react'),
+  useCallback = _require.useCallback,
+  useDebugValue = _require.useDebugValue,
+  useEffect = _require.useEffect,
+  useLayoutEffect = _require.useLayoutEffect,
+  useMemo = _require.useMemo,
+  useRef = _require.useRef,
+  useState = _require.useState;
+var _require2 = require('relay-runtime'),
+  getFragment = _require2.getFragment,
+  getFragmentIdentifier = _require2.getFragmentIdentifier,
+  getPaginationMetadata = _require2.getPaginationMetadata;
+var _require3 = require('relay-runtime'),
+  ConnectionInterface = _require3.ConnectionInterface,
+  RelayFeatureFlags = _require3.RelayFeatureFlags,
+  getSelector = _require3.getSelector,
+  getValueAtPath = _require3.getValueAtPath;
+function usePrefetchableForwardPaginationFragment_EXPERIMENTAL(fragmentInput, parentFragmentRef, bufferSize, initialSize, prefetchingLoadMoreOptions) {
+  var _fragmentInput$metada, _fragmentInput$metada2;
+  var minimalFetchSize = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;
+  var fragmentNode = getFragment(fragmentInput);
+  useStaticFragmentNodeWarning(fragmentNode, 'first argument of usePrefetchableForwardPaginationFragment_EXPERIMENTAL()');
+  var componentDisplayName = 'usePrefetchableForwardPaginationFragment_EXPERIMENTAL()';
+  var _getPaginationMetadat = getPaginationMetadata(fragmentNode, componentDisplayName),
+    connectionPathInFragmentData = _getPaginationMetadat.connectionPathInFragmentData,
+    paginationRequest = _getPaginationMetadat.paginationRequest,
+    paginationMetadata = _getPaginationMetadat.paginationMetadata;
+  var _useRefetchableFragme = useRefetchableFragmentInternal(fragmentNode, parentFragmentRef, componentDisplayName),
+    fragmentData = _useRefetchableFragme.fragmentData,
+    fragmentRef = _useRefetchableFragme.fragmentRef,
+    refetch = _useRefetchableFragme.refetch;
+  var fragmentIdentifier = getFragmentIdentifier(fragmentNode, fragmentRef);
+  var edgeKeys = useMemo(function () {
+    var connection = getValueAtPath(fragmentData, connectionPathInFragmentData);
+    if (connection == null) {
+      return null;
+    }
+    var _ConnectionInterface$ = ConnectionInterface.get(),
+      EDGES = _ConnectionInterface$.EDGES;
+    return connection[EDGES];
+  }, [connectionPathInFragmentData, fragmentData]);
+  var sourceSize = edgeKeys == null ? -1 : edgeKeys.length;
+  var _useState = useState(initialSize != null ? initialSize : sourceSize),
+    _numInUse = _useState[0],
+    setNumInUse = _useState[1];
+  var numInUse = _numInUse;
+  if (_numInUse === -1 && sourceSize !== -1) {
+    numInUse = initialSize != null ? initialSize : sourceSize;
+    setNumInUse(numInUse);
+  }
+  var environment = useRelayEnvironment();
+  var _useState2 = useState(false),
+    isLoadingMore = _useState2[0],
+    reallySetIsLoadingMore = _useState2[1];
+  var _useState3 = useState(false),
+    isRefetching = _useState3[0],
+    setIsRefetching = _useState3[1];
+  var availableSizeRef = useRef(0);
+  var setIsLoadingMore = useCallback(function (value) {
+    var _environment$getSched;
+    var schedule = (_environment$getSched = environment.getScheduler()) === null || _environment$getSched === void 0 ? void 0 : _environment$getSched.schedule;
+    if (schedule) {
+      schedule(function () {
+        reallySetIsLoadingMore(value);
+      });
+    } else {
+      reallySetIsLoadingMore(value);
+    }
+  }, [environment]);
+  var isLoadingMoreRef = useRef(false);
+  var observer = useMemo(function () {
+    function setIsLoadingFalse() {
+      isLoadingMoreRef.current = false;
+      setIsLoadingMore(false);
+    }
+    return {
+      start: function start() {
+        isLoadingMoreRef.current = true;
+        reallySetIsLoadingMore(true);
+      },
+      complete: setIsLoadingFalse,
+      error: setIsLoadingFalse,
+      unsubscribe: RelayFeatureFlags.ENABLE_USE_PAGINATION_IS_LOADING_FIX ? setIsLoadingFalse : undefined
+    };
+  }, [setIsLoadingMore]);
+  var handleReset = useCallback(function () {
+    if (!isRefetching) {
+      var _environment$getSched2;
+      var schedule = (_environment$getSched2 = environment.getScheduler()) === null || _environment$getSched2 === void 0 ? void 0 : _environment$getSched2.schedule;
+      if (schedule) {
+        schedule(function () {
+          setNumInUse(-1);
+        });
+      } else {
+        setNumInUse(-1);
+      }
+    }
+    isLoadingMoreRef.current = false;
+    setIsLoadingMore(false);
+  }, [environment, isRefetching, setIsLoadingMore]);
+  var _useLoadMoreFunction = useLoadMoreFunction({
+      componentDisplayName: componentDisplayName,
+      connectionPathInFragmentData: connectionPathInFragmentData,
+      direction: 'forward',
+      fragmentData: fragmentData,
+      fragmentIdentifier: fragmentIdentifier,
+      fragmentNode: fragmentNode,
+      fragmentRef: fragmentRef,
+      paginationMetadata: paginationMetadata,
+      paginationRequest: paginationRequest,
+      observer: observer,
+      onReset: handleReset
+    }),
+    loadMore = _useLoadMoreFunction[0],
+    hasNext = _useLoadMoreFunction[1],
+    disposeFetchNext = _useLoadMoreFunction[2];
+  useLayoutEffect(function () {
+    availableSizeRef.current = sourceSize - numInUse;
+  }, [numInUse, sourceSize]);
+  var prefetchingUNSTABLE_extraVariables = prefetchingLoadMoreOptions === null || prefetchingLoadMoreOptions === void 0 ? void 0 : prefetchingLoadMoreOptions.UNSTABLE_extraVariables;
+  var prefetchingOnComplete = prefetchingLoadMoreOptions === null || prefetchingLoadMoreOptions === void 0 ? void 0 : prefetchingLoadMoreOptions.onComplete;
+  var showMore = useCallback(function (numToAdd, options) {
+    if (!isLoadingMoreRef.current || availableSizeRef.current >= 0) {
+      availableSizeRef.current -= numToAdd;
+      setNumInUse(function (lastNumInUse) {
+        return lastNumInUse + numToAdd;
+      });
+      if (!isLoadingMoreRef.current && availableSizeRef.current < 0) {
+        loadMore(Math.max(minimalFetchSize, Math.min(numToAdd, bufferSize - availableSizeRef.current)), options !== null && options !== void 0 ? options : {
+          onComplete: prefetchingOnComplete,
+          UNSTABLE_extraVariables: typeof prefetchingUNSTABLE_extraVariables === 'function' ? prefetchingUNSTABLE_extraVariables({
+            hasNext: hasNext,
+            data: fragmentData,
+            getServerEdges: function getServerEdges() {
+              var selector = getSelector(edgesFragment, edgeKeys);
+              if (selector == null) {
+                return [];
+              }
+              !(selector.kind === 'PluralReaderSelector') ? process.env.NODE_ENV !== "production" ? invariant(false, 'Expected a plural selector') : invariant(false) : void 0;
+              return selector.selectors.map(function (sel) {
+                return environment.lookup(sel).data;
+              });
+            }
+          }) : prefetchingUNSTABLE_extraVariables
+        });
+      }
+    }
+  }, [bufferSize, loadMore, minimalFetchSize, edgeKeys, fragmentData, prefetchingUNSTABLE_extraVariables, prefetchingOnComplete]);
+  var edgesFragment = (_fragmentInput$metada = fragmentInput.metadata) === null || _fragmentInput$metada === void 0 ? void 0 : (_fragmentInput$metada2 = _fragmentInput$metada.refetch) === null || _fragmentInput$metada2 === void 0 ? void 0 : _fragmentInput$metada2.edgesFragment;
+  !(edgesFragment != null) ? process.env.NODE_ENV !== "production" ? invariant(false, 'usePrefetchableForwardPaginationFragment_EXPERIMENTAL: Expected the edge fragment to be defined, ' + 'please make sure you have added `prefetchable_pagination: true`  to `@connection`') : invariant(false) : void 0;
+  useEffect(function () {
+    if (!isLoadingMoreRef.current && !isLoadingMore && !isRefetching && hasNext && (sourceSize - numInUse < bufferSize || numInUse > sourceSize)) {
+      var onComplete = prefetchingOnComplete;
+      loadMore(Math.max(bufferSize - Math.max(sourceSize - numInUse, 0), numInUse - sourceSize, minimalFetchSize), {
+        onComplete: onComplete,
+        UNSTABLE_extraVariables: typeof prefetchingUNSTABLE_extraVariables === 'function' ? prefetchingUNSTABLE_extraVariables({
+          hasNext: hasNext,
+          data: fragmentData,
+          getServerEdges: function getServerEdges() {
+            var selector = getSelector(edgesFragment, edgeKeys);
+            if (selector == null) {
+              return [];
+            }
+            !(selector.kind === 'PluralReaderSelector') ? process.env.NODE_ENV !== "production" ? invariant(false, 'Expected a plural selector') : invariant(false) : void 0;
+            return selector.selectors.map(function (sel) {
+              return environment.lookup(sel).data;
+            });
+          }
+        }) : prefetchingUNSTABLE_extraVariables
+      });
+    }
+  }, [hasNext, bufferSize, isRefetching, loadMore, numInUse, prefetchingUNSTABLE_extraVariables, prefetchingOnComplete, sourceSize, edgeKeys, isLoadingMore, minimalFetchSize, environment, edgesFragment]);
+  var realNumInUse = Math.min(numInUse, sourceSize);
+  var derivedEdgeKeys = useMemo(function () {
+    var _edgeKeys$slice;
+    return (_edgeKeys$slice = edgeKeys === null || edgeKeys === void 0 ? void 0 : edgeKeys.slice(0, realNumInUse)) !== null && _edgeKeys$slice !== void 0 ? _edgeKeys$slice : [];
+  }, [edgeKeys, realNumInUse]);
+  var edges = useFragment(edgesFragment, derivedEdgeKeys);
+  var refetchPagination = useCallback(function (variables, options) {
+    disposeFetchNext();
+    setIsRefetching(true);
+    return refetch(variables, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, options), {}, {
+      onComplete: function onComplete(maybeError) {
+        var _environment$getSched3, _options$onComplete;
+        var schedule = (_environment$getSched3 = environment.getScheduler()) === null || _environment$getSched3 === void 0 ? void 0 : _environment$getSched3.schedule;
+        if (schedule) {
+          schedule(function () {
+            setIsRefetching(false);
+            setNumInUse(-1);
+          });
+        } else {
+          setIsRefetching(false);
+          setNumInUse(-1);
+        }
+        options === null || options === void 0 ? void 0 : (_options$onComplete = options.onComplete) === null || _options$onComplete === void 0 ? void 0 : _options$onComplete.call(options, maybeError);
+      },
+      __environment: undefined
+    }));
+  }, [disposeFetchNext, environment, refetch]);
+  if (process.env.NODE_ENV !== "production") {
+    useDebugValue({
+      fragment: fragmentNode.name,
+      data: fragmentData,
+      hasNext: hasNext,
+      isLoadingNext: isLoadingMore
+    });
+  }
+  return {
+    edges: edges,
+    data: fragmentData,
+    loadNext: showMore,
+    hasNext: hasNext || sourceSize > numInUse,
+    isLoadingNext: isLoadingMore && numInUse > sourceSize,
+    refetch: refetchPagination
+  };
+}
+module.exports = usePrefetchableForwardPaginationFragment_EXPERIMENTAL;

package/lib/relay-hooks/useRefetchableFragmentInternal.js

@@ -55,7 +55,7 @@ function reducer(state, action) {
       }
   }
 }
-function useRefetchableFragmentNode(fragmentNode, parentFragmentRef, componentDisplayName) {
+function useRefetchableFragmentInternal(fragmentNode, parentFragmentRef, componentDisplayName) {
   var parentEnvironment = useRelayEnvironment();
   var _getRefetchMetadata = getRefetchMetadata(fragmentNode, componentDisplayName),
     refetchableRequest = _getRefetchMetadata.refetchableRequest,
@@ -226,7 +226,7 @@ if (process.env.NODE_ENV !== "production") {
       }
     },
     checkSameIDAfterRefetch: function checkSameIDAfterRefetch(previousIDAndTypename, refetchedFragmentRef, fragmentNode, componentDisplayName) {
-      if (previousIDAndTypename == null) {
+      if (previousIDAndTypename == null || refetchedFragmentRef == null) {
         return;
       }
       var _require6 = require('relay-runtime'),
@@ -238,4 +238,4 @@ if (process.env.NODE_ENV !== "production") {
     }
   };
 }
-module.exports = useRefetchableFragmentNode;
+module.exports = useRefetchableFragmentInternal;

package/lib/relay-hooks/useRelayLoggingContext.js

@@ -0,0 +1,9 @@
+'use strict';
+
+var ReactRelayLoggingContext = require('./../ReactRelayLoggingContext');
+var _require = require('react'),
+  useContext = _require.useContext;
+function useRelayLoggingContext() {
+  return useContext(ReactRelayLoggingContext);
+}
+module.exports = useRelayLoggingContext;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-relay",
   "description": "A framework for building GraphQL-driven React applications.",
-  "version": "18.1.0",
+  "version": "19.0.0",
   "keywords": [
     "graphql",
     "relay",
@@ -20,10 +20,10 @@
     "fbjs": "^3.0.2",
     "invariant": "^2.2.4",
     "nullthrows": "^1.1.1",
-    "relay-runtime": "18.1.0"
+    "relay-runtime": "19.0.0"
   },
   "peerDependencies": {
-    "react": "^16.9.0 || ^17 || ^18"
+    "react": "^16.9.0 || ^17 || ^18 || ^19"
   },
   "directories": {
     "": "./"