react-relay 14.0.0 → 15.0.0

package/relay-hooks/prepareEntryPoint_DEPRECATED.js.flow

@@ -4,15 +4,13 @@
  * 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 {OperationType} from '../../relay-runtime/util/RelayRuntimeTypes';
 import type {
   EntryPoint,
   EntryPointComponent,
@@ -42,6 +40,7 @@ function prepareEntryPoint<
 ): void {
   // Start loading the code for the entrypoint
   if (entryPoint.root.getModuleIfRequired() == null) {
+    // $FlowFixMe[unused-promise]
     entryPoint.root.load();
   }
   const preloadProps = entryPoint.getPreloadProps(entryPointParams);
@@ -58,7 +57,7 @@ function prepareEntryPoint<
         environmentProviderOptions,
       );
 
-      preloadedQueries[queryPropName] = preloadQuery(
+      preloadedQueries[queryPropName] = preloadQuery<OperationType, mixed>(
         environment,
         parameters,
         variables,
@@ -77,11 +76,15 @@ function prepareEntryPoint<
       }
       const {entryPoint: nestedEntryPoint, entryPointParams: nestedParams} =
         entryPointDescription;
-      preloadedEntryPoints[entryPointPropName] = prepareEntryPoint(
-        environmentProvider,
-        nestedEntryPoint,
-        nestedParams,
-      );
+      preloadedEntryPoints[entryPointPropName] = prepareEntryPoint<
+        TEntryPointParams,
+        TPreloadedQueries,
+        TPreloadedEntryPoints,
+        TRuntimeProps,
+        TExtraProps,
+        TEntryPointComponent,
+        TEntryPoint,
+      >(environmentProvider, nestedEntryPoint, nestedParams);
     });
   }
 }

package/relay-hooks/react-cache/RelayReactCache.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';
 
 const invariant = require('invariant');

package/relay-hooks/react-cache/getQueryResultOrFetchQuery_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 {
@@ -27,17 +25,17 @@ const SuspenseResource = require('../SuspenseResource');
 const {getCacheForType, getCacheSignal} = require('./RelayReactCache');
 const invariant = require('invariant');
 const {
-  RelayFeatureFlags,
   __internal: {fetchQuery: fetchQueryInternal},
+  RelayFeatureFlags,
 } = require('relay-runtime');
 const warning = require('warning');
 
 type QueryCacheCommitable = () => () => void;
 
-type QueryResult = {|
+type QueryResult = {
   fragmentNode: ReaderFragment,
   fragmentRef: mixed,
-|};
+};
 
 // Note that the status of a cache entry will be 'resolved' when partial
 // rendering is allowed, even if a fetch is ongoing. The pending status
@@ -49,34 +47,42 @@ type QueryResult = {|
 // before any components have mounted. It is unused when Legacy Timeouts
 // mode is off.
 type QueryCacheEntryStatus =
-  | {|
+  | {
       status: 'resolved',
       result: QueryResult,
-    |}
-  | {|
+    }
+  | {
       status: 'pending',
       promise: Promise<void>,
-    |}
-  | {|
+    }
+  | {
       status: 'rejected',
       error: Error,
-    |};
+    };
 
-type QueryCacheEntry = {|
+type QueryCacheEntry = {
   ...QueryCacheEntryStatus,
   onCommit: QueryCacheCommitable,
   suspenseResource: SuspenseResource | null,
-|};
+};
 
 const DEFAULT_FETCH_POLICY = 'store-or-network';
 
+const WEAKMAP_SUPPORTED = typeof WeakMap === 'function';
+
+interface IMap<K, V> {
+  delete(key: K): boolean;
+  get(key: K): V | void;
+  set(key: K, value: V): IMap<K, V>;
+}
+
 type QueryCacheKey = string;
 
 class QueryCache {
-  _map: Map<IEnvironment, Map<QueryCacheKey, QueryCacheEntry>>;
+  _map: IMap<IEnvironment, Map<QueryCacheKey, QueryCacheEntry>>;
 
   constructor() {
-    this._map = new Map();
+    this._map = WEAKMAP_SUPPORTED ? new WeakMap() : new Map();
   }
 
   get(environment: IEnvironment, key: QueryCacheKey): QueryCacheEntry | void {
@@ -121,7 +127,7 @@ const noopOnCommit = () => {
   return () => undefined;
 };
 
-const noopPromise = new Promise(() => {});
+const noopPromise = new Promise<void>(() => {});
 
 function getQueryCacheKey(
   operation: OperationDescriptor,
@@ -160,12 +166,12 @@ function makeInitialCacheEntry() {
 function getQueryResultOrFetchQuery_REACT_CACHE(
   environment: IEnvironment,
   queryOperationDescriptor: OperationDescriptor,
-  options?: {|
+  options?: {
     fetchPolicy?: FetchPolicy,
     renderPolicy?: RenderPolicy,
     fetchKey?: ?string | ?number,
     fetchObservable?: Observable<GraphQLResponse>,
-  |},
+  },
 ): [QueryResult, QueryCacheCommitable] {
   const fetchPolicy = options?.fetchPolicy ?? DEFAULT_FETCH_POLICY;
   const renderPolicy =
@@ -369,7 +375,7 @@ function executeOperationAndKeepUpToDate(
   customFetchObservable?: Observable<GraphQLResponse>,
 ) {
   let resolvePromise;
-  const promise = new Promise(r => {
+  const promise = new Promise<void>(r => {
     resolvePromise = r;
   });
   // $FlowExpectedError[prop-missing] Expando to annotate Promises.

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

@@ -0,0 +1,297 @@
+/**
+ * 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 {QueryResult} from '../QueryResource';
+import type {
+  CacheConfig,
+  FetchPolicy,
+  IEnvironment,
+  ReaderFragment,
+  ReaderSelector,
+  SelectorData,
+  Snapshot,
+} from 'relay-runtime';
+import type {MissingClientEdgeRequestInfo} from 'relay-runtime/store/RelayStoreTypes';
+
+const {getQueryResourceForEnvironment} = require('../QueryResource');
+const invariant = require('invariant');
+const {
+  __internal: {fetchQuery: fetchQueryInternal},
+  createOperationDescriptor,
+  getPendingOperationsForFragment,
+  getSelector,
+  getVariablesFromFragment,
+  handlePotentialSnapshotErrors,
+} = require('relay-runtime');
+const warning = require('warning');
+
+type FragmentQueryOptions = {
+  fetchPolicy?: FetchPolicy,
+  networkCacheConfig?: ?CacheConfig,
+};
+
+type FragmentState = $ReadOnly<
+  | {kind: 'bailout'}
+  | {kind: 'singular', snapshot: Snapshot, epoch: number}
+  | {kind: 'plural', snapshots: $ReadOnlyArray<Snapshot>, epoch: number},
+>;
+
+function isMissingData(state: FragmentState): boolean {
+  if (state.kind === 'bailout') {
+    return false;
+  } else if (state.kind === 'singular') {
+    return state.snapshot.isMissingData;
+  } else {
+    return state.snapshots.some(s => s.isMissingData);
+  }
+}
+
+function getMissingClientEdges(
+  state: FragmentState,
+): $ReadOnlyArray<MissingClientEdgeRequestInfo> | null {
+  if (state.kind === 'bailout') {
+    return null;
+  } else if (state.kind === 'singular') {
+    return state.snapshot.missingClientEdges ?? null;
+  } else {
+    let edges: null | Array<MissingClientEdgeRequestInfo> = null;
+    for (const snapshot of state.snapshots) {
+      if (snapshot.missingClientEdges) {
+        edges = edges ?? [];
+        for (const edge of snapshot.missingClientEdges) {
+          edges.push(edge);
+        }
+      }
+    }
+    return edges;
+  }
+}
+
+function handlePotentialSnapshotErrorsForState(
+  environment: IEnvironment,
+  state: FragmentState,
+): void {
+  if (state.kind === 'singular') {
+    handlePotentialSnapshotErrors(
+      environment,
+      state.snapshot.missingRequiredFields,
+      state.snapshot.relayResolverErrors,
+    );
+  } else if (state.kind === 'plural') {
+    for (const snapshot of state.snapshots) {
+      handlePotentialSnapshotErrors(
+        environment,
+        snapshot.missingRequiredFields,
+        snapshot.relayResolverErrors,
+      );
+    }
+  }
+}
+
+function handleMissingClientEdge(
+  environment: IEnvironment,
+  parentFragmentNode: ReaderFragment,
+  parentFragmentRef: mixed,
+  missingClientEdgeRequestInfo: MissingClientEdgeRequestInfo,
+  queryOptions?: FragmentQueryOptions,
+): QueryResult {
+  const originalVariables = getVariablesFromFragment(
+    parentFragmentNode,
+    parentFragmentRef,
+  );
+  const variables = {
+    ...originalVariables,
+    id: missingClientEdgeRequestInfo.clientEdgeDestinationID, // TODO should be a reserved name
+  };
+  const queryOperationDescriptor = createOperationDescriptor(
+    missingClientEdgeRequestInfo.request,
+    variables,
+    queryOptions?.networkCacheConfig,
+  );
+  // 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; QueryResource
+  // already handles this by itself.
+  const QueryResource = getQueryResourceForEnvironment(environment);
+  return QueryResource.prepare(
+    queryOperationDescriptor,
+    fetchQueryInternal(environment, queryOperationDescriptor),
+    queryOptions?.fetchPolicy,
+  );
+}
+
+function getFragmentState(
+  environment: IEnvironment,
+  fragmentSelector: ?ReaderSelector,
+): FragmentState {
+  if (fragmentSelector == null) {
+    return {kind: 'bailout'};
+  } else if (fragmentSelector.kind === 'PluralReaderSelector') {
+    if (fragmentSelector.selectors.length === 0) {
+      return {kind: 'bailout'};
+    } else {
+      return {
+        kind: 'plural',
+        snapshots: fragmentSelector.selectors.map(s => environment.lookup(s)),
+        epoch: environment.getStore().getEpoch(),
+      };
+    }
+  } else {
+    return {
+      kind: 'singular',
+      snapshot: environment.lookup(fragmentSelector),
+      epoch: environment.getStore().getEpoch(),
+    };
+  }
+}
+
+// fragmentNode cannot change during the lifetime of the component, though fragmentRef may change.
+function readFragmentInternal_REACT_CACHE(
+  environment: IEnvironment,
+  fragmentNode: ReaderFragment,
+  fragmentRef: mixed,
+  hookDisplayName: string,
+  queryOptions?: FragmentQueryOptions,
+  fragmentKey?: string,
+): {
+  +data: ?SelectorData | Array<?SelectorData>,
+  +clientEdgeQueries: ?Array<QueryResult>,
+} {
+  const fragmentSelector = getSelector(fragmentNode, fragmentRef);
+  const isPlural = fragmentNode?.metadata?.plural === true;
+
+  if (isPlural) {
+    invariant(
+      fragmentRef == null || Array.isArray(fragmentRef),
+      'Relay: Expected fragment pointer%s for fragment `%s` to be ' +
+        'an array, instead got `%s`. Remove `@relay(plural: true)` ' +
+        'from fragment `%s` to allow the prop to be an object.',
+      fragmentKey != null ? ` for key \`${fragmentKey}\`` : '',
+      fragmentNode.name,
+      typeof fragmentRef,
+      fragmentNode.name,
+    );
+  } else {
+    invariant(
+      !Array.isArray(fragmentRef),
+      'Relay: Expected fragment pointer%s for fragment `%s` not to be ' +
+        'an array, instead got `%s`. Add `@relay(plural: true)` ' +
+        'to fragment `%s` to allow the prop to be an array.',
+      fragmentKey != null ? ` for key \`${fragmentKey}\`` : '',
+      fragmentNode.name,
+      typeof fragmentRef,
+      fragmentNode.name,
+    );
+  }
+  invariant(
+    fragmentRef == null ||
+      (isPlural && Array.isArray(fragmentRef) && fragmentRef.length === 0) ||
+      fragmentSelector != null,
+    '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,
+    fragmentKey == null ? 'a fragment reference' : `the \`${fragmentKey}\``,
+    hookDisplayName,
+  );
+
+  const state = getFragmentState(environment, fragmentSelector);
+
+  // Handle the queries for any missing client edges; this may suspend.
+  // FIXME handle client edges in parallel.
+  let clientEdgeQueries = null;
+  if (fragmentNode.metadata?.hasClientEdges === true) {
+    const missingClientEdges = getMissingClientEdges(state);
+    if (missingClientEdges?.length) {
+      clientEdgeQueries = ([]: Array<QueryResult>);
+      for (const edge of missingClientEdges) {
+        clientEdgeQueries.push(
+          handleMissingClientEdge(
+            environment,
+            fragmentNode,
+            fragmentRef,
+            edge,
+            queryOptions,
+          ),
+        );
+      }
+    }
+  }
+
+  if (isMissingData(state)) {
+    // 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;
+    }
+    // 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:
+    handlePotentialSnapshotErrorsForState(environment, state);
+  }
+
+  let data: ?SelectorData | Array<?SelectorData>;
+  if (state.kind === 'bailout') {
+    data = isPlural ? [] : null;
+  } else if (state.kind === 'singular') {
+    data = state.snapshot.data;
+  } else {
+    data = state.snapshots.map(s => s.data);
+  }
+
+  if (__DEV__) {
+    if (
+      fragmentRef != null &&
+      (data === undefined ||
+        (Array.isArray(data) &&
+          data.length > 0 &&
+          data.every(d => d === undefined)))
+    ) {
+      warning(
+        false,
+        'Relay: Expected to have been able to read non-null data for ' +
+          'fragment `%s` declared in ' +
+          '`%s`, since fragment reference was non-null. ' +
+          "Make sure that that `%s`'s parent isn't " +
+          'holding on to and/or passing a fragment reference for data that ' +
+          'has been deleted.',
+        fragmentNode.name,
+        hookDisplayName,
+        hookDisplayName,
+      );
+    }
+  }
+
+  return {data, clientEdgeQueries};
+}
+
+module.exports = readFragmentInternal_REACT_CACHE;