react-relay 14.0.0 → 15.0.0

package/relay-hooks/FragmentResource.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 {Cache} from './LRUCache';
@@ -31,8 +29,8 @@ const {getQueryResourceForEnvironment} = require('./QueryResource');
 const SuspenseResource = require('./SuspenseResource');
 const invariant = require('invariant');
 const {
-  RelayFeatureFlags,
   __internal: {fetchQuery, getPromiseForActiveRequest},
+  RelayFeatureFlags,
   createOperationDescriptor,
   getFragmentIdentifier,
   getPendingOperationsForFragment,
@@ -46,13 +44,13 @@ const {
 export type FragmentResource = FragmentResourceImpl;
 
 type FragmentResourceCache = Cache<
-  | {|
+  | {
       kind: 'pending',
       pendingOperations: $ReadOnlyArray<RequestDescriptor>,
       promise: Promise<mixed>,
       result: FragmentResult,
-    |}
-  | {|kind: 'done', result: FragmentResult|},
+    }
+  | {kind: 'done', result: FragmentResult},
 >;
 
 const WEAKMAP_SUPPORTED = typeof WeakMap === 'function';
@@ -63,13 +61,13 @@ interface IMap<K, V> {
 
 type SingularOrPluralSnapshot = Snapshot | $ReadOnlyArray<Snapshot>;
 
-opaque type FragmentResult: {data: mixed, ...} = {|
+opaque type FragmentResult: {data: mixed, ...} = {
   cacheKey: string,
   data: mixed,
   isMissingData: boolean,
   snapshot: SingularOrPluralSnapshot | null,
   storeEpoch: number,
-|};
+};
 
 // TODO: Fix to not rely on LRU. If the number of active fragments exceeds this
 // capacity, readSpec() will fail to find cached entries and break object
@@ -77,7 +75,7 @@ opaque type FragmentResult: {data: mixed, ...} = {|
 const CACHE_CAPACITY = 1000000;
 
 // this is frozen so that users don't accidentally push data into the array
-const CONSTANT_READONLY_EMPTY_ARRAY = Object.freeze([]);
+const CONSTANT_READONLY_EMPTY_ARRAY: Array<$FlowFixMe> = Object.freeze([]);
 
 function isMissingData(snapshot: SingularOrPluralSnapshot): boolean {
   if (Array.isArray(snapshot)) {
@@ -178,7 +176,7 @@ class ClientEdgeQueryResultsCache {
     }
   }
 
-  _retain(id: string) {
+  _retain(id: string): {dispose: () => void} {
     const retainCount = (this._retainCounts.get(id) ?? 0) + 1;
     this._retainCounts.set(id, retainCount);
     return {
@@ -306,9 +304,23 @@ class FragmentResourceImpl {
         cachedValue.result.snapshot &&
         !missingLiveResolverFields(cachedValue.result.snapshot)?.length
       ) {
-        this._handlePotentialSnapshotErrorsInSnapshot(
+        this._throwOrLogErrorsInSnapshot(
+          // $FlowFixMe[incompatible-call]
           cachedValue.result.snapshot,
         );
+
+        // This cache gets populated directly whenever the store notifies us of
+        // an update. That mechanism does not check for missing data, or
+        // in-flight requests.
+        if (cachedValue.result.isMissingData) {
+          environment.__log({
+            name: 'fragmentresource.missing_data',
+            data: cachedValue.result.data,
+            fragment: fragmentNode,
+            isRelayHooks: true,
+            cached: true,
+          });
+        }
         return cachedValue.result;
       }
     }
@@ -347,7 +359,7 @@ class FragmentResourceImpl {
       storeEpoch,
     );
     if (!fragmentResult.isMissingData) {
-      this._handlePotentialSnapshotErrorsInSnapshot(snapshot);
+      this._throwOrLogErrorsInSnapshot(snapshot);
 
       this._cache.set(fragmentIdentifier, {
         kind: 'done',
@@ -471,7 +483,19 @@ class FragmentResourceImpl {
       }
     }
 
-    this._handlePotentialSnapshotErrorsInSnapshot(snapshot);
+    this._throwOrLogErrorsInSnapshot(snapshot);
+
+    // At this point, there's nothing we can do. We don't have all the expected
+    // data, but there's no indication the missing data will be fulfilled. So we
+    // choose to return potentially non-typesafe data. The data returned here
+    // might not match the generated types for this fragment/operation.
+    environment.__log({
+      name: 'fragmentresource.missing_data',
+      data: fragmentResult.data,
+      fragment: fragmentNode,
+      isRelayHooks: true,
+      cached: false,
+    });
     return getFragmentResult(fragmentIdentifier, snapshot, storeEpoch);
   }
 
@@ -481,7 +505,7 @@ class FragmentResourceImpl {
     fragmentRef: mixed,
     request: ConcreteRequest,
     clientEdgeDestinationID: DataID,
-  ) {
+  ): {queryResult: QueryResult, requestDescriptor: RequestDescriptor} {
     const originalVariables = getVariablesFromFragment(
       fragmentNode,
       fragmentRef,
@@ -507,7 +531,7 @@ class FragmentResourceImpl {
     };
   }
 
-  _handlePotentialSnapshotErrorsInSnapshot(snapshot: SingularOrPluralSnapshot) {
+  _throwOrLogErrorsInSnapshot(snapshot: SingularOrPluralSnapshot) {
     if (Array.isArray(snapshot)) {
       snapshot.forEach(s => {
         handlePotentialSnapshotErrors(
@@ -716,10 +740,10 @@ class FragmentResourceImpl {
     fragmentNode: ReaderFragment,
     fragmentOwner: RequestDescriptor,
     fragmentResult: FragmentResult,
-  ): {|
+  ): {
     promise: Promise<void>,
     pendingOperations: $ReadOnlyArray<RequestDescriptor>,
-  |} | null {
+  } | null {
     const pendingOperationsResult = getPendingOperationsForFragment(
       this._environment,
       fragmentNode,
@@ -738,7 +762,7 @@ class FragmentResourceImpl {
       .then(() => {
         this._cache.delete(cacheKey);
       })
-      .catch((error: Error) => {
+      .catch<void>((error: Error) => {
         this._cache.delete(cacheKey);
       });
     // $FlowExpectedError[prop-missing] Expando to annotate Promises.

package/relay-hooks/HooksImplementation.js.flow

@@ -4,26 +4,24 @@
  * 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
  */
 
 'use strict';
 
-// flowlint ambiguous-object-type:error
-
 import typeof useFragment from './useFragment';
-import type {UseLazyLoadQueryHookType} from './useLazyLoadQuery';
-import type {UsePreloadedQueryHookType} from './usePreloadedQuery';
+import type {UsePaginationFragmentType} from './usePaginationFragment';
+import type {UseRefetchableFragmentType} from './useRefetchableFragment';
 
 const warning = require('warning');
 
-type HooksImplementation = {|
+type HooksImplementation = {
   useFragment: useFragment,
-  useLazyLoadQuery: UseLazyLoadQueryHookType,
-  usePreloadedQuery: UsePreloadedQueryHookType,
-|};
+  usePaginationFragment: UsePaginationFragmentType,
+  useRefetchableFragment: UseRefetchableFragmentType,
+};
 
 let implementation: HooksImplementation | null = null;
 

package/relay-hooks/InternalLogger.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';
 
 type LogEvent = (eventData: string) => void;

package/relay-hooks/LRUCache.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/LazyLoadEntryPointContainer_DEPRECATED.react.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,
@@ -27,13 +25,13 @@ const React = require('react');
 const {useContext, useEffect, useMemo} = require('react');
 const {stableCopy} = require('relay-runtime');
 
-type PreloadedEntryPoint<TEntryPointComponent> = $ReadOnly<{|
+type PreloadedEntryPoint<TEntryPointComponent> = $ReadOnly<{
   entryPoints: React.ElementConfig<TEntryPointComponent>['entryPoints'],
   extraProps: React.ElementConfig<TEntryPointComponent>['extraProps'],
   getComponent: () => TEntryPointComponent,
   queries: React.ElementConfig<TEntryPointComponent>['queries'],
   rootModuleID: string,
-|}>;
+}>;
 
 type EntryPointContainerProps<
   TEntryPointParams,
@@ -42,7 +40,7 @@ type EntryPointContainerProps<
   TRuntimeProps,
   TExtraProps,
 > = $ReadOnly<
-  $ReadOnly<{|
+  $ReadOnly<{
     entryPoint: EntryPoint<
       TEntryPointParams,
       EntryPointComponent<
@@ -55,7 +53,7 @@ type EntryPointContainerProps<
     entryPointParams: TEntryPointParams,
     environmentProvider?: IEnvironmentProvider<EnvironmentProviderOptions>,
     props: TRuntimeProps,
-  |}>,
+  }>,
 >;
 
 function stableStringify(value: mixed): string {
@@ -99,7 +97,10 @@ function prepareEntryPoint<
         environmentProviderOptions,
       );
 
-      preloadedQueries[queryPropName] = preloadQuery_DEPRECATED(
+      preloadedQueries[queryPropName] = preloadQuery_DEPRECATED<
+        OperationType,
+        mixed,
+      >(
         environment,
         parameters,
         variables,
@@ -118,11 +119,15 @@ function prepareEntryPoint<
       }
       const {entryPoint: nestedEntryPoint, entryPointParams: nestedParams} =
         entryPointDescription;
-      preloadedEntryPoints[entryPointPropName] = prepareEntryPoint(
-        environmentProvider,
-        nestedEntryPoint,
-        nestedParams,
-      );
+      preloadedEntryPoints[entryPointPropName] = prepareEntryPoint<
+        _,
+        {...},
+        {...},
+        {...},
+        mixed,
+        EntryPointComponent<{...}, {...}, {...}, mixed>,
+        _,
+      >(environmentProvider, nestedEntryPoint, nestedParams);
     });
   }
   return {

package/relay-hooks/MatchContainer.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';
 
 const React = require('react');
@@ -87,7 +85,7 @@ const {useMemo} = React;
 
 // Note: this type is intentionally non-exact, it is expected that the
 // object may contain sibling fields.
-type TypenameOnlyPointer = {|+__typename: string|};
+type TypenameOnlyPointer = {+__typename: string};
 export type MatchPointer = {
   +__fragmentPropName?: ?string,
   +__module_component?: mixed,
@@ -95,12 +93,12 @@ export type MatchPointer = {
   ...
 };
 
-export type MatchContainerProps<TProps: {...}, TFallback: React.Node> = {|
+export type MatchContainerProps<TProps: {...}, TFallback: React.Node> = {
   +fallback?: ?TFallback,
   +loader: (module: mixed) => React.AbstractComponent<TProps>,
   +match: ?MatchPointer | ?TypenameOnlyPointer,
   +props?: TProps,
-|};
+};
 
 function MatchContainer<TProps: {...}, TFallback: React.Node | null>({
   fallback,
@@ -150,11 +148,11 @@ function MatchContainer<TProps: {...}, TFallback: React.Node | null>({
     // output of subscriptions already has a stable identity.
     if (__fragmentPropName != null && __id != null && __fragments != null) {
       const fragProps: {
-        [string]: {|
+        [string]: {
           __fragmentOwner: $FlowFixMe,
           __fragments: $FlowFixMe,
           __id: string,
-        |},
+        },
       } = {};
       fragProps[__fragmentPropName] = {__id, __fragments, __fragmentOwner};
       return fragProps;

package/relay-hooks/ProfilerContext.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
-
 // This contextual profiler can be used to wrap a react sub-tree. It will bind
 // the RelayProfiler during the render phase of these components. Allows
 // collecting metrics for a specific part of your application.

package/relay-hooks/QueryResource.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 {Cache} from './LRUCache';
@@ -37,11 +35,12 @@ const warning = require('warning');
 
 const CACHE_CAPACITY = 1000;
 const DEFAULT_FETCH_POLICY = 'store-or-network';
+const DEFAULT_LIVE_FETCH_POLICY = 'store-and-network';
 
 export type QueryResource = QueryResourceImpl;
 
 type QueryResourceCache = Cache<QueryResourceCacheEntry>;
-type QueryResourceCacheEntry = {|
+type QueryResourceCacheEntry = {
   +id: number,
   +cacheIdentifier: string,
   +operationAvailability: ?OperationAvailability,
@@ -56,17 +55,17 @@ type QueryResourceCacheEntry = {|
   temporaryRetain(environment: IEnvironment): Disposable,
   permanentRetain(environment: IEnvironment): Disposable,
   releaseTemporaryRetain(): void,
-|};
+};
 export opaque type QueryResult: {
   fragmentNode: ReaderFragment,
   fragmentRef: mixed,
   ...
-} = {|
+} = {
   cacheIdentifier: string,
   fragmentNode: ReaderFragment,
   fragmentRef: mixed,
   operation: OperationDescriptor,
-|};
+};
 
 const WEAKMAP_SUPPORTED = typeof WeakMap === 'function';
 interface IMap<K, V> {
@@ -85,7 +84,11 @@ function getQueryCacheIdentifier(
   maybeRenderPolicy: ?RenderPolicy,
   cacheBreaker?: ?string | ?number,
 ): string {
-  const fetchPolicy = maybeFetchPolicy ?? DEFAULT_FETCH_POLICY;
+  const fetchPolicy =
+    maybeFetchPolicy ??
+    (operationIsLiveQuery(operation)
+      ? DEFAULT_LIVE_FETCH_POLICY
+      : DEFAULT_FETCH_POLICY);
   const renderPolicy =
     maybeRenderPolicy ?? environment.UNSTABLE_getDefaultRenderPolicy();
   const cacheIdentifier = `${fetchPolicy}-${renderPolicy}-${operation.request.identifier}`;
@@ -145,7 +148,18 @@ function createCacheEntry(
     };
   });
 
-  const cacheEntry = {
+  const cacheEntry: {
+    cacheIdentifier: string,
+    getValue(): QueryResult | Promise<void> | Error,
+    id: number,
+    operationAvailability: ?OperationAvailability,
+    permanentRetain(environment: IEnvironment): Disposable,
+    processedPayloadsCount: number,
+    releaseTemporaryRetain(): void,
+    setNetworkSubscription(subscription: ?Subscription): void,
+    setValue(val: QueryResult | Promise<void> | Error): void,
+    temporaryRetain(environment: IEnvironment): Disposable,
+  } = {
     cacheIdentifier,
     id: nextID++,
     processedPayloadsCount: 0,
@@ -227,7 +241,11 @@ class QueryResourceImpl {
     profilerContext: mixed,
   ): QueryResult {
     const environment = this._environment;
-    const fetchPolicy = maybeFetchPolicy ?? DEFAULT_FETCH_POLICY;
+    const fetchPolicy =
+      maybeFetchPolicy ??
+      (operationIsLiveQuery(operation)
+        ? DEFAULT_LIVE_FETCH_POLICY
+        : DEFAULT_FETCH_POLICY);
     const renderPolicy =
       maybeRenderPolicy ?? environment.UNSTABLE_getDefaultRenderPolicy();
 
@@ -527,7 +545,7 @@ class QueryResourceImpl {
 
       let cacheEntry = this._cache.get(cacheIdentifier);
       if (!cacheEntry) {
-        const networkPromise = new Promise(resolve => {
+        const networkPromise = new Promise<void>(resolve => {
           resolveNetworkPromise = resolve;
         });
 

package/relay-hooks/RelayEnvironmentProvider.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 {IEnvironment} from 'relay-runtime';
@@ -19,18 +17,18 @@ import type {
   IActorEnvironment,
 } from 'relay-runtime/multi-actor-environment';
 
+const ReactRelayContext = require('./../ReactRelayContext');
 const React = require('react');
-const ReactRelayContext = require('react-relay/ReactRelayContext');
 
 const {useMemo} = React;
 
-type Props = $ReadOnly<{|
+type Props = $ReadOnly<{
   children: React.Node,
   environment: IEnvironment,
   getEnvironmentForActor?: ?(
     actorIdentifier: ActorIdentifier,
   ) => IActorEnvironment,
-|}>;
+}>;
 
 function RelayEnvironmentProvider(props: Props): React.Node {
   const {children, environment, getEnvironmentForActor} = props;

package/relay-hooks/SuspenseResource.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 {Disposable, IEnvironment} from 'relay-runtime';

package/relay-hooks/__flowtests__/EntryPointTypes/EntryPointElementConfig-flowtest.js.flow

@@ -4,11 +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
  */
 
+/* eslint-disable no-unused-vars */
+
 'use strict';
 
 import type {
@@ -17,15 +19,15 @@ import type {
   EntryPointProps,
 } from '../../EntryPointTypes.flow';
 
-type MyComponentOtherProps = $ReadOnly<{|
+type MyComponentOtherProps = $ReadOnly<{
   foo: string,
-|}>;
+}>;
 
 type MyComponentProps = EntryPointProps<{}, {}, MyComponentOtherProps, {}>;
 
 const MyComponent = (_props: MyComponentProps) => null;
 
-type PreloadParams = $ReadOnly<{||}>;
+type PreloadParams = $ReadOnly<{}>;
 
 type MyComponentEntryPointType = EntryPoint<PreloadParams, typeof MyComponent>;
 

package/relay-hooks/__flowtests__/EntryPointTypes/NestedEntrypoints-flowtest.js.flow

@@ -4,19 +4,19 @@
  * 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
  */
 
 'use strict';
 
-import type {JSResourceReference} from 'JSResourceReference';
 import type {
   EntryPoint,
   EntryPointProps,
   PreloadedEntryPoint,
 } from '../../EntryPointTypes.flow';
+import type {JSResourceReference} from 'JSResourceReference';
 
 declare function mockJSResource<TModule>(
   module: TModule,
@@ -27,9 +27,9 @@ type NestedEntrypointComponentProps = EntryPointProps<{}>;
 const NestedEntrypointComponent = (_props: NestedEntrypointComponentProps) =>
   null;
 
-type NestedEntrypointPreloadParams = $ReadOnly<{|
+type NestedEntrypointPreloadParams = $ReadOnly<{
   subEntrypointPreloadParam: string,
-|}>;
+}>;
 
 type NestedEntryPointType = EntryPoint<
   NestedEntrypointPreloadParams,

package/relay-hooks/__flowtests__/__generated__/useFragmentFlowtest_user.graphql.js.flow

@@ -4,7 +4,9 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<8a8e68a3fde4da3f77546ac4952f2635>>
+ * @oncall relay
+ *
+ * @generated SignedSource<<fef9e96f393a59b2e761b70b1c3ddc50>>
  * @flow
  * @lightSyntaxTransform
  * @nogrep

package/relay-hooks/__flowtests__/__generated__/useFragmentFlowtest_users.graphql.js.flow

@@ -4,7 +4,9 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<0b4a6e76a104111de9ddd4dd9abe667c>>
+ * @oncall relay
+ *
+ * @generated SignedSource<<1bd343735be9917826ee3203cf6756c4>>
  * @flow
  * @lightSyntaxTransform
  * @nogrep