react-relay 20.1.0 → 21.0.0

package/relay-hooks/useRefetchableFragmentInternal.js.flow

@@ -46,7 +46,7 @@ const {
 const warning = require('warning');
 
 export type RefetchFn<
-  TQuery: OperationType,
+  TQuery extends OperationType,
   TOptions = Options,
 > = RefetchFnExact<TQuery, TOptions>;
 
@@ -56,20 +56,20 @@ export type RefetchFn<
 //  - Or, expects /a subset/ of the query variables if the provided key type is
 //    /non-null/.
 export type RefetchFnDynamic<
-  TQuery: OperationType,
-  TKey: ?{+$data?: mixed, ...},
+  TQuery extends OperationType,
+  TKey extends ?{+$data?: unknown, ...},
   TOptions = Options,
-> = [TKey] extends [{+$data?: mixed, ...}]
+> = [TKey] extends [{+$data?: unknown, ...}]
   ? RefetchFnInexact<TQuery, TOptions>
   : RefetchFnExact<TQuery, TOptions>;
 
 export type ReturnType<
-  TQuery: OperationType,
-  TKey: ?{+$data?: mixed, ...},
+  TQuery extends OperationType,
+  TKey extends ?{+$data?: unknown, ...},
   TOptions = Options,
 > = {
-  fragmentData: mixed,
-  fragmentRef: mixed,
+  fragmentData: unknown,
+  fragmentRef: unknown,
   refetch: RefetchFnDynamic<TQuery, TKey, TOptions>,
 };
 
@@ -89,14 +89,14 @@ type RefetchFnBase<TVars, TOptions> = (
   options?: TOptions,
 ) => Disposable;
 
-type RefetchFnExact<TQuery: OperationType, TOptions = Options> = RefetchFnBase<
-  VariablesOf<TQuery>,
-  TOptions,
->;
+type RefetchFnExact<
+  TQuery extends OperationType,
+  TOptions = Options,
+> = RefetchFnBase<VariablesOf<TQuery>, TOptions>;
 type RefetchFnInexact<
-  TQuery: OperationType,
+  TQuery extends OperationType,
   TOptions = Options,
-> = RefetchFnBase<$ReadOnly<Partial<VariablesOf<TQuery>>>, TOptions>;
+> = RefetchFnBase<Readonly<Partial<VariablesOf<TQuery>>>, TOptions>;
 
 type Action =
   | {
@@ -154,18 +154,18 @@ function reducer(state: RefetchState, action: Action): RefetchState {
       };
     }
     default: {
-      (action.type: empty);
+      action.type as empty;
       throw new Error('useRefetchableFragmentNode: Unexpected action type');
     }
   }
 }
 
 hook useRefetchableFragmentInternal<
-  TQuery: OperationType,
-  TKey: ?{+$data?: mixed, ...},
+  TQuery extends OperationType,
+  TKey extends ?{+$data?: unknown, ...},
 >(
   fragmentNode: ReaderFragment,
-  parentFragmentRef: mixed,
+  parentFragmentRef: unknown,
   componentDisplayName: string,
 ): ReturnType<TQuery, TKey, InternalOptions> {
   const parentEnvironment = useRelayEnvironment();
@@ -184,7 +184,7 @@ hook useRefetchableFragmentInternal<
     refetchEnvironment: null,
     refetchQuery: null,
     renderPolicy: undefined,
-  });
+  } as RefetchState);
   const {
     fetchPolicy,
     mirroredEnvironment,
@@ -206,14 +206,14 @@ hook useRefetchableFragmentInternal<
     TQuery['variables'],
     TQuery['response'],
     TQuery['rawResponse'],
-  >((refetchableRequest: $FlowFixMe));
+  >(refetchableRequest as $FlowFixMe);
 
   let fragmentRef = parentFragmentRef;
   if (shouldReset) {
     dispatch({
-      type: 'reset',
       environment,
       fragmentIdentifier,
+      type: 'reset',
     });
     disposeQuery();
   } else if (refetchQuery != null && queryRef != null) {
@@ -268,7 +268,6 @@ hook useRefetchableFragmentInternal<
         fetchPolicy,
         renderPolicy,
         {
-          error: handleQueryCompleted,
           complete: () => {
             // Validate that the type of the object we got back matches the type
             // of the object already in the store
@@ -282,6 +281,7 @@ hook useRefetchableFragmentInternal<
             }
             handleQueryCompleted();
           },
+          error: handleQueryCompleted,
         },
         queryRef.fetchKey,
         profilerContext,
@@ -350,12 +350,12 @@ hook useRefetchableFragmentInternal<
   return {
     fragmentData,
     fragmentRef,
-    // $FlowFixMe[incompatible-return] RefetchFn not compatible with RefetchFnDynamic
+    // $FlowFixMe[incompatible-type] RefetchFn not compatible with RefetchFnDynamic
     refetch,
   };
 }
 
-hook useRefetchFunction<TQuery: OperationType>(
+hook useRefetchFunction<TQuery extends OperationType>(
   componentDisplayName: string,
   dispatch: (
     | {
@@ -373,13 +373,13 @@ hook useRefetchFunction<TQuery: OperationType>(
       },
   ) => void,
   disposeQuery: () => void,
-  fragmentData: mixed,
+  fragmentData: unknown,
   fragmentIdentifier: string,
   fragmentNode: ReaderFragment,
-  fragmentRefPathInResponse: $ReadOnlyArray<string | number>,
+  fragmentRefPathInResponse: ReadonlyArray<string | number>,
   identifierInfo: ?RefetchableIdentifierInfo,
   loadQuery: LoaderFn<TQuery>,
-  parentFragmentRef: mixed,
+  parentFragmentRef: unknown,
   refetchableRequest: ConcreteRequest,
 ): RefetchFn<TQuery, InternalOptions> {
   const isMountedRef = useIsMountedRef();
@@ -446,7 +446,7 @@ hook useRefetchFunction<TQuery: OperationType>(
       // We fill in any variables not passed by the call to `refetch()` with the
       // variables from the original parent fragment owner.
       const refetchVariables: VariablesOf<TQuery> = {
-        ...(parentVariables: $FlowFixMe),
+        ...(parentVariables as $FlowFixMe),
         ...fragmentVariables,
         ...providedRefetchVariables,
       };
@@ -471,7 +471,7 @@ hook useRefetchFunction<TQuery: OperationType>(
             identifierValue,
           );
         }
-        (refetchVariables: $FlowFixMe)[
+        (refetchVariables as $FlowFixMe)[
           identifierInfo.identifierQueryVariableName
         ] = identifierValue;
       }
@@ -492,18 +492,18 @@ hook useRefetchFunction<TQuery: OperationType>(
       // so that they have been filtered out to include only the
       // variables actually declared in the query.
       loadQuery(refetchQuery.request.variables, {
-        fetchPolicy,
         __environment: refetchEnvironment,
         __nameForWarning: 'refetch',
+        fetchPolicy,
       });
 
       dispatch({
-        type: 'refetch',
         fetchPolicy,
         onComplete,
         refetchEnvironment,
         refetchQuery,
         renderPolicy,
+        type: 'refetch',
       });
       return {dispose: disposeQuery};
     },
@@ -521,33 +521,32 @@ hook useRefetchFunction<TQuery: OperationType>(
 let debugFunctions;
 if (__DEV__) {
   debugFunctions = {
-    getInitialIDAndType(
-      memoRefetchVariables: ?Variables,
-      fragmentRefPathInResponse: $ReadOnlyArray<string | number>,
-      identifierQueryVariableName: ?string,
-      environment: IEnvironment,
-    ): ?DebugIDandTypename {
-      const {Record} = require('relay-runtime');
-      const id = memoRefetchVariables?.[identifierQueryVariableName ?? 'id'];
-      if (
-        fragmentRefPathInResponse.length !== 1 ||
-        fragmentRefPathInResponse[0] !== 'node' ||
-        id == null
-      ) {
-        return null;
+    checkSameIDAfterRefetch(
+      previousIDAndTypename: ?DebugIDandTypename,
+      refetchedFragmentRef: unknown,
+      fragmentNode: ReaderFragment,
+      componentDisplayName: string,
+    ): void {
+      if (previousIDAndTypename == null || refetchedFragmentRef == null) {
+        return;
       }
-      const recordSource = environment.getStore().getSource();
-      const record = recordSource.get(id);
-      const typename = record == null ? null : Record.getType(record);
-      if (typename == null) {
-        return null;
+      const {ID_KEY} = require('relay-runtime');
+      // $FlowExpectedError[incompatible-use]
+      const resultID = refetchedFragmentRef[ID_KEY];
+      if (resultID != null && resultID !== previousIDAndTypename.id) {
+        warning(
+          false,
+          'Relay: Call to `refetch` returned a different id, expected ' +
+            '`%s`, got `%s`, on `%s` in `%s`. ' +
+            'Please make sure the server correctly implements ' +
+            'unique id requirement.',
+          resultID,
+          previousIDAndTypename.id,
+          fragmentNode.name,
+          componentDisplayName,
+        );
       }
-      return {
-        id,
-        typename,
-      };
     },
-
     checkSameTypeAfterRefetch(
       previousIDAndType: ?DebugIDandTypename,
       environment: IEnvironment,
@@ -575,32 +574,31 @@ if (__DEV__) {
         );
       }
     },
-
-    checkSameIDAfterRefetch(
-      previousIDAndTypename: ?DebugIDandTypename,
-      refetchedFragmentRef: mixed,
-      fragmentNode: ReaderFragment,
-      componentDisplayName: string,
-    ): void {
-      if (previousIDAndTypename == null || refetchedFragmentRef == null) {
-        return;
+    getInitialIDAndType(
+      memoRefetchVariables: ?Variables,
+      fragmentRefPathInResponse: ReadonlyArray<string | number>,
+      identifierQueryVariableName: ?string,
+      environment: IEnvironment,
+    ): ?DebugIDandTypename {
+      const {Record} = require('relay-runtime');
+      const id = memoRefetchVariables?.[identifierQueryVariableName ?? 'id'];
+      if (
+        fragmentRefPathInResponse.length !== 1 ||
+        fragmentRefPathInResponse[0] !== 'node' ||
+        id == null
+      ) {
+        return null;
       }
-      const {ID_KEY} = require('relay-runtime');
-      // $FlowExpectedError[incompatible-use]
-      const resultID = refetchedFragmentRef[ID_KEY];
-      if (resultID != null && resultID !== previousIDAndTypename.id) {
-        warning(
-          false,
-          'Relay: Call to `refetch` returned a different id, expected ' +
-            '`%s`, got `%s`, on `%s` in `%s`. ' +
-            'Please make sure the server correctly implements ' +
-            'unique id requirement.',
-          resultID,
-          previousIDAndTypename.id,
-          fragmentNode.name,
-          componentDisplayName,
-        );
+      const recordSource = environment.getStore().getSource();
+      const record = recordSource.get(id);
+      const typename = record == null ? null : Record.getType(record);
+      if (typename == null) {
+        return null;
       }
+      return {
+        id,
+        typename,
+      };
     },
   };
 }

package/relay-hooks/useRelayLoggingContext.js.flow

@@ -14,7 +14,7 @@
 const ReactRelayLoggingContext = require('./../ReactRelayLoggingContext');
 const {useContext} = require('react');
 
-hook useRelayLoggingContext(): mixed | void {
+hook useRelayLoggingContext(): unknown | void {
   return useContext(ReactRelayLoggingContext);
 }
 

package/relay-hooks/useSubscribeToInvalidationState.js.flow

@@ -26,7 +26,7 @@ const {useEffect, useRef} = require('react');
  * The subscription will automatically be disposed on unmount
  */
 hook useSubscribeToInvalidationState(
-  dataIDs: $ReadOnlyArray<DataID>,
+  dataIDs: ReadonlyArray<DataID>,
   callback: () => void,
 ): Disposable {
   const environment = useRelayEnvironment();

package/relay-hooks/useSubscription.js.flow

@@ -41,7 +41,7 @@ hook useSubscription<TVariables, TData, TRawResponse>(
     TVariables,
     TData,
     TRawResponse,
-  > = requestSubscriptionFn ?? (requestSubscription: $FlowFixMe);
+  > = requestSubscriptionFn ?? (requestSubscription as $FlowFixMe);
   const environment = useRelayEnvironment();
   useEffect(() => {
     // $FlowFixMe[method-unbinding] added when improving typing for this parameters

package/rsc-client_EXPERIMENTAL.js

@@ -0,0 +1,10 @@
+/**
+ * Relay v21.0.0
+ *
+ * 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.
+ */
+
+module.exports = require('./lib/rsc-client_EXPERIMENTAL.js');

package/rsc-client_EXPERIMENTAL.js.flow

@@ -0,0 +1,23 @@
+/**
+ * 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 client';
+'use strict';
+
+import type {PreloadedQueryRef} from './relay-hooks/rsc/serverPreloadQuery';
+
+const useQueryFromServer = require('./relay-hooks/rsc/useQueryFromServer');
+
+export type {PreloadedQueryRef};
+
+module.exports = {
+  useQueryFromServer,
+};

package/rsc_EXPERIMENTAL.js

@@ -0,0 +1,10 @@
+/**
+ * Relay v21.0.0
+ *
+ * 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.
+ */
+
+module.exports = require('./lib/rsc_EXPERIMENTAL.js');

package/rsc_EXPERIMENTAL.js.flow

@@ -0,0 +1,90 @@
+/**
+ * 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 {PreloadedQueryRef} from './relay-hooks/rsc/serverPreloadQuery';
+import type {
+  Fragment,
+  FragmentType,
+  IEnvironment,
+  Query,
+  Variables,
+} from 'relay-runtime';
+
+const serverFetchQueryImpl = require('./relay-hooks/rsc/serverFetchQuery');
+const serverPreloadQueryImpl = require('./relay-hooks/rsc/serverPreloadQuery');
+const serverReadFragmentImpl = require('./relay-hooks/rsc/serverReadFragment');
+const invariant = require('invariant');
+const React = require('react');
+
+export type {PreloadedQueryRef};
+
+type HasSpread<TFragmentType> = {+$fragmentSpreads: TFragmentType, ...};
+
+export type ServerEnvironment = {
+  +getEnvironment: () => IEnvironment,
+  +serverFetchQuery: <TVariables extends Variables, TData>(
+    query: Query<TVariables, TData>,
+    variables: TVariables,
+  ) => Promise<TData>,
+  +serverPreloadQuery: <TVariables extends Variables, TData>(
+    query: Query<TVariables, TData>,
+    variables: TVariables,
+  ) => PreloadedQueryRef<TVariables, TData>,
+  +serverReadFragment: <TFragmentType extends FragmentType, TData>(
+    fragment: Fragment<TFragmentType, TData>,
+    fragmentRef:
+      | HasSpread<TFragmentType>
+      | ReadonlyArray<HasSpread<TFragmentType>>,
+  ) => Promise<TData>,
+};
+
+function createServerEnvironment(
+  create: () => IEnvironment,
+): ServerEnvironment {
+  // $FlowFixMe[missing-export] React.cache is available in React 19+
+  const cache = React.cache;
+  invariant(typeof cache === 'function', 'Relay RSC APIs require React 19+');
+  const getEnvironment = cache(create);
+
+  async function serverFetchQuery<TVariables extends Variables, TData>(
+    query: Query<TVariables, TData>,
+    variables: TVariables,
+  ): Promise<TData> {
+    return serverFetchQueryImpl(getEnvironment(), query, variables);
+  }
+
+  function serverPreloadQuery<TVariables extends Variables, TData>(
+    query: Query<TVariables, TData>,
+    variables: TVariables,
+  ): PreloadedQueryRef<TVariables, TData> {
+    return serverPreloadQueryImpl(getEnvironment(), query, variables);
+  }
+
+  async function serverReadFragment<TFragmentType extends FragmentType, TData>(
+    fragment: Fragment<TFragmentType, TData>,
+    fragmentRef:
+      | HasSpread<TFragmentType>
+      | ReadonlyArray<HasSpread<TFragmentType>>,
+  ): Promise<TData> {
+    return serverReadFragmentImpl(getEnvironment(), fragment, fragmentRef);
+  }
+
+  return {
+    getEnvironment,
+    serverFetchQuery,
+    serverPreloadQuery,
+    serverReadFragment,
+  };
+}
+
+module.exports = {createServerEnvironment};