react-relay 20.1.0 → 21.0.0

package/relay-hooks/__flowtests__/useFragment-flowtest.js.flow

@@ -40,44 +40,44 @@ const usersFragment: useFragmentFlowtest_users$fragment = graphql`
 /* eslint-disable react-hooks/rules-of-hooks */
 
 // Nullability of returned data type is correct
-(useFragment(
+useFragment(
   userFragment,
-  (Any: useFragmentFlowtest_user$key),
-): useFragmentFlowtest_user$data);
-(useFragment(
+  Any as useFragmentFlowtest_user$key,
+) as useFragmentFlowtest_user$data;
+useFragment(
   userFragment,
-  (Any: ?useFragmentFlowtest_user$key),
-): ?useFragmentFlowtest_user$data);
-(useFragment(
+  Any as ?useFragmentFlowtest_user$key,
+) as ?useFragmentFlowtest_user$data;
+useFragment(
   usersFragment,
-  (Any: useFragmentFlowtest_users$key),
-): useFragmentFlowtest_users$data);
-(useFragment(
+  Any as useFragmentFlowtest_users$key,
+) as useFragmentFlowtest_users$data;
+useFragment(
   usersFragment,
-  (Any: ?useFragmentFlowtest_users$key),
-): ?useFragmentFlowtest_users$data);
+  Any as ?useFragmentFlowtest_users$key,
+) as ?useFragmentFlowtest_users$data;
 
-// $FlowExpectedError: can't cast nullable to non-nullable
-(useFragment(
+// $FlowExpectedError[incompatible-type] : can't cast nullable to non-nullable
+useFragment(
   userFragment,
-  (Any: ?useFragmentFlowtest_user$key),
-): useFragmentFlowtest_user$data);
-// $FlowExpectedError: can't cast nullable plural to non-nullable plural
-(useFragment(
+  Any as ?useFragmentFlowtest_user$key,
+) as useFragmentFlowtest_user$data;
+// $FlowExpectedError[incompatible-type] : can't cast nullable plural to non-nullable plural
+useFragment(
   usersFragment,
-  (Any: ?useFragmentFlowtest_users$key),
-): useFragmentFlowtest_users$data);
+  Any as ?useFragmentFlowtest_users$key,
+) as useFragmentFlowtest_users$data;
 
-// $FlowExpectedError: Key should be one of the generated types
+// $FlowExpectedError[incompatible-type] : Key should be one of the generated types
 useFragment(userFragment, 'INVALID_KEY');
 
-// $FlowExpectedError: Key should not be a user provided object
+// $FlowExpectedError[incompatible-type] : Key should not be a user provided object
 useFragment(userFragment, {a: 123});
 
-// $FlowExpectedError: Key should not be an empty object
+// $FlowExpectedError[incompatible-type] : Key should not be an empty object
 useFragment(userFragment, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
-useFragment(userFragment, (Any: useFragmentFlowtest_user$data));
+// $FlowExpectedError[incompatible-type] : Key should be the `<name>$key` type from generated flow
+useFragment(userFragment, Any as useFragmentFlowtest_user$data);
 
 /* eslint-enable react-hooks/rules-of-hooks */

package/relay-hooks/__flowtests__/usePaginationFragment-flowtest.js.flow

@@ -30,8 +30,8 @@ import {
 } from './utils';
 
 type ExpectedReturnType<
-  TRefetchVariables: Variables,
-  TLoadMoreVariables: Variables,
+  TRefetchVariables extends Variables,
+  TLoadMoreVariables extends Variables,
   TFragmentData,
 > = {
   data: TFragmentData,
@@ -48,60 +48,54 @@ type ExpectedReturnType<
 
 // Nullability of returned data type is correct
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
+// $FlowFixMe[incompatible-type]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[react-rule-hook]
-(usePaginationFragment(
+usePaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
-): ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariablesSubset, QueryVariables, NonNullableData>;
 
 // $FlowFixMe[react-rule-hook]
-(usePaginationFragment(
+usePaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NullableData>;
 
-// $FlowExpectedError: can't cast nullable to non-nullable
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type] can't cast nullable to non-nullable
+usePaginationFragment(
   refetchableFragmentInput,
   keyNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>;
 
-// $FlowExpectedError: actual type of returned data is correct
 // $FlowFixMe[react-rule-hook]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type] actual type of returned data is correct
+usePaginationFragment(
   refetchableFragmentInput,
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   keyAnotherNonNullable,
-): ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>);
-// $FlowExpectedError
+) as ExpectedReturnType<QueryVariables, QueryVariablesSubset, NonNullableData>;
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(usePaginationFragment(
+// $FlowFixMe[incompatible-type]
+usePaginationFragment(
   refetchableFragmentInput,
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   keyAnotherNullable,
-): ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>);
+) as ExpectedReturnType<QueryVariables, QueryVariables, NonNullableData>;
 
-// $FlowExpectedError: Key should not be a user provided object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be a user provided object
 usePaginationFragment(refetchableFragmentInput, {abc: 123});
 
-// $FlowExpectedError: Key should not be an empty object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be an empty object
 usePaginationFragment(refetchableFragmentInput, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should be the `<name>$key` type from generated flow
 usePaginationFragment(refetchableFragmentInput, fragmentData);
 
 // Refetch function options:
@@ -113,12 +107,12 @@ const {refetch} = usePaginationFragment(
   refetchableFragmentInput,
   keyNonNullable,
 );
-// $FlowExpectedError: internal option
+// $FlowExpectedError[incompatible-type] : internal option
 refetch(variables, {
   __environment: environment,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 refetch(variables, {
   NON_EXIST: 'NON_EXIST',
 });
@@ -135,17 +129,17 @@ const {loadNext} = usePaginationFragment(
 // Accepts extraVariables
 loadNext(10, {
   // $FlowFixMe[prop-missing]
-  // $FlowFixMe[incompatible-call]
+  // $FlowFixMe[incompatible-type]
   UNSTABLE_extraVariables: extraVariables,
 });
 
 // $FlowFixMe[prop-missing]
 loadNext(10, {
-  // $FlowExpectedError: doesn't accept variables not available in the Flow type
+  // $FlowExpectedError[incompatible-type] : doesn't accept variables not available in the Flow type
   UNSTABLE_extraVariables: invalidVariables,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 loadNext(10, {
   UNSTABLE_foo: invalidVariables,
 });

package/relay-hooks/__flowtests__/useRefetchableFragment-flowtest.js.flow

@@ -32,69 +32,62 @@ import {
 
 // Nullability of returned data type is correct
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
+// $FlowFixMe[incompatible-type]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[react-rule-hook]
-(useRefetchableFragment(refetchableFragmentInput, keyNonNullable): [
+useRefetchableFragment(refetchableFragmentInput, keyNonNullable) as [
   NonNullableData,
   FetchFn<QueryVariablesSubset>,
-]);
+];
 
 // $FlowFixMe[react-rule-hook]
-(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
+useRefetchableFragment(refetchableFragmentInput, keyNullable) as [
   NullableData,
   FetchFn<QueryVariables>,
-]);
+];
 
-// $FlowExpectedError: can't cast nullable to non-nullable
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-cast]
-(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
+// $FlowFixMe[incompatible-type] can't cast nullable to non-nullable
+useRefetchableFragment(refetchableFragmentInput, keyNullable) as [
   NonNullableData,
   FetchFn<QueryVariables>,
-]);
+];
 
-// $FlowExpectedError: refetch requires exact type if key is nullable
 // $FlowFixMe[react-rule-hook]
 // $FlowFixMe[incompatible-exact]
-// $FlowFixMe[prop-missing]
-(useRefetchableFragment(refetchableFragmentInput, keyNullable): [
+// $FlowFixMe[incompatible-type] refetch requires exact type if key is nullable
+useRefetchableFragment(refetchableFragmentInput, keyNullable) as [
   NullableData,
   FetchFn<QueryVariablesSubset>,
-]);
+];
 
-// $FlowExpectedError: actual type of returned data is correct
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-call]
+// $FlowFixMe[incompatible-type]
 // $FlowFixMe[incompatible-exact]
 // $FlowFixMe[prop-missing]
-// $FlowFixMe[incompatible-cast]
-(useRefetchableFragment(refetchableFragmentInput, keyAnotherNonNullable): [
+// $FlowFixMe[incompatible-type] actual type of returned data is correct
+useRefetchableFragment(refetchableFragmentInput, keyAnotherNonNullable) as [
   NonNullableData,
   FetchFn<QueryVariablesSubset>,
-]);
+];
 
-// $FlowExpectedError - incompatible key types
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[incompatible-call]
-(useRefetchableFragment(refetchableFragmentInput, keyAnotherNullable): [
+// $FlowFixMe[incompatible-type]: incompatible key types
+useRefetchableFragment(refetchableFragmentInput, keyAnotherNullable) as [
   NullableData,
   FetchFn<QueryVariables>,
-]);
+];
 
-// $FlowExpectedError: Key should not be a user provided object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be a user provided object
 useRefetchableFragment(refetchableFragmentInput, {abc: 123});
 
-// $FlowExpectedError: Key should not be an empty object
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should not be an empty object
 useRefetchableFragment(refetchableFragmentInput, {});
 
-// $FlowExpectedError: Key should be the `<name>$key` type from generated flow
 // $FlowFixMe[react-rule-hook]
-// $FlowFixMe[prop-missing]
+// $FlowFixMe[incompatible-type] Key should be the `<name>$key` type from generated flow
 useRefetchableFragment(refetchableFragmentInput, fragmentData);
 
 // Refetch function options:
@@ -106,12 +99,12 @@ const [, refetch] = useRefetchableFragment(
   refetchableFragmentInput,
   keyNonNullable,
 );
-// $FlowExpectedError: internal option
+// $FlowExpectedError[incompatible-type] : internal option
 refetch(variables, {
   __environment: environment,
 });
 
-// $FlowExpectedError: doesn't exist
+// $FlowExpectedError[incompatible-type] : doesn't exist
 refetch(variables, {
   NON_EXIST: 'NON_EXIST',
 });

package/relay-hooks/__flowtests__/utils.js.flow

@@ -42,8 +42,8 @@ export type NonNullableData = {
   +count: number,
 };
 export type NullableData = ?NonNullableData;
-export type NonNullablePluralData = $ReadOnlyArray<NonNullableData>;
-export type NullablePluralData = ?$ReadOnlyArray<NonNullableData>;
+export type NonNullablePluralData = ReadonlyArray<NonNullableData>;
+export type NullablePluralData = ?ReadonlyArray<NonNullableData>;
 
 export type AnotherNonNullableData = {
   +name: ?string,
@@ -52,9 +52,9 @@ export type AnotherNonNullableData = {
 
 declare export var keyNonNullable: Example_user$key;
 
-declare export var keyNonNullablePlural: $ReadOnlyArray<Example_user$key>;
+declare export var keyNonNullablePlural: ReadonlyArray<Example_user$key>;
 
-declare export var keyNullablePlural: ?$ReadOnlyArray<Example_user$key>;
+declare export var keyNullablePlural: ?ReadonlyArray<Example_user$key>;
 
 declare export var keyNullable: ?Example_user$key;
 

package/relay-hooks/getConnectionState.js.flow

@@ -19,8 +19,8 @@ const {ConnectionInterface, getValueAtPath} = require('relay-runtime');
 function getConnectionState(
   direction: Direction,
   fragmentNode: ReaderFragment,
-  fragmentData: mixed,
-  connectionPathInFragmentData: $ReadOnlyArray<string | number>,
+  fragmentData: unknown,
+  connectionPathInFragmentData: ReadonlyArray<string | number>,
 ): {
   cursor: ?string,
   hasMore: boolean,
@@ -73,8 +73,8 @@ function getConnectionState(
 
   const cursor =
     direction === 'forward'
-      ? pageInfo[END_CURSOR] ?? null
-      : pageInfo[START_CURSOR] ?? null;
+      ? (pageInfo[END_CURSOR] ?? null)
+      : (pageInfo[START_CURSOR] ?? null);
   invariant(
     cursor === null || typeof cursor === 'string',
     'Relay: Expected page info for connection in fragment `%s` to have a ' +

package/relay-hooks/legacy/FragmentResource.js.flow

@@ -45,8 +45,8 @@ export type FragmentResource = FragmentResourceImpl;
 type FragmentResourceCache = Cache<
   | {
       kind: 'pending',
-      pendingOperations: $ReadOnlyArray<RequestDescriptor>,
-      promise: Promise<mixed>,
+      pendingOperations: ReadonlyArray<RequestDescriptor>,
+      promise: Promise<unknown>,
       result: FragmentResult,
     }
   | {kind: 'done', result: FragmentResult}
@@ -63,11 +63,11 @@ interface IMap<K, V> {
   set(key: K, value: V): IMap<K, V>;
 }
 
-type SingularOrPluralSnapshot = Snapshot | $ReadOnlyArray<Snapshot>;
+type SingularOrPluralSnapshot = Snapshot | ReadonlyArray<Snapshot>;
 
-opaque type FragmentResult: {data: mixed, ...} = {
+opaque type FragmentResult: {data: unknown, ...} = {
   cacheKey: string,
-  data: mixed,
+  data: unknown,
   isMissingData: boolean,
   snapshot: SingularOrPluralSnapshot | null,
   storeEpoch: number,
@@ -97,7 +97,7 @@ function hasMissingClientEdges(snapshot: SingularOrPluralSnapshot): boolean {
 
 function missingLiveResolverFields(
   snapshot: SingularOrPluralSnapshot,
-): ?$ReadOnlyArray<DataID> {
+): ?ReadonlyArray<DataID> {
   if (Array.isArray(snapshot)) {
     return snapshot
       .map(s => s.missingLiveResolverFields)
@@ -217,7 +217,7 @@ class FragmentResourceImpl {
    */
   read(
     fragmentNode: ReaderFragment,
-    fragmentRef: mixed,
+    fragmentRef: unknown,
     componentDisplayName: string,
     fragmentKey?: string,
   ): FragmentResult {
@@ -237,7 +237,7 @@ class FragmentResourceImpl {
    */
   readWithIdentifier(
     fragmentNode: ReaderFragment,
-    fragmentRef: mixed,
+    fragmentRef: unknown,
     fragmentIdentifier: string,
     componentDisplayName: string,
     fragmentKey?: ?string,
@@ -307,7 +307,7 @@ class FragmentResourceImpl {
         !missingLiveResolverFields(cachedValue.result.snapshot)?.length
       ) {
         this._throwOrLogErrorsInSnapshot(
-          // $FlowFixMe[incompatible-call]
+          // $FlowFixMe[incompatible-type]
           cachedValue.result.snapshot,
         );
 
@@ -527,7 +527,7 @@ class FragmentResourceImpl {
   _performClientEdgeQuery(
     queryResource: QueryResource,
     fragmentNode: ReaderFragment,
-    fragmentRef: mixed,
+    fragmentRef: unknown,
     request: ConcreteRequest,
     clientEdgeDestinationID: DataID,
   ): {queryResult: QueryResult, requestDescriptor: RequestDescriptor} {
@@ -568,7 +568,7 @@ class FragmentResourceImpl {
 
   readSpec(
     fragmentNodes: {[string]: ReaderFragment, ...},
-    fragmentRefs: {[string]: mixed, ...},
+    fragmentRefs: {[string]: unknown, ...},
     componentDisplayName: string,
   ): {[string]: FragmentResult, ...} {
     const result: {[string]: FragmentResult} = {};
@@ -804,7 +804,7 @@ class FragmentResourceImpl {
     fragmentResult: FragmentResult,
   ): {
     promise: Promise<void>,
-    pendingOperations: $ReadOnlyArray<RequestDescriptor>,
+    pendingOperations: ReadonlyArray<RequestDescriptor>,
   } | null {
     const pendingOperationsResult = getPendingOperationsForFragment(
       this._environment,
@@ -840,7 +840,7 @@ class FragmentResourceImpl {
 
   _updatePluralSnapshot(
     cacheKey: string,
-    baseSnapshots: $ReadOnlyArray<Snapshot>,
+    baseSnapshots: ReadonlyArray<Snapshot>,
     latestSnapshot: Snapshot,
     idx: number,
     storeEpoch: number,

package/relay-hooks/legacy/useBlockingPaginationFragment.js.flow

@@ -31,7 +31,7 @@ type RefetchVariables<TVariables, TKey> =
   // NOTE: This type ensures that the type of the variables is either:
   //   - nullable if the provided ref type is non-nullable
   //   - non-nullable if the provided ref type is nullable, and the caller need to provide the full set of variables
-  [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+  [+key: TKey] extends [+key: {+$fragmentSpreads: unknown, ...}]
     ? Partial<TVariables>
     : TVariables;
 
@@ -49,7 +49,7 @@ type ReturnType<TVariables, TData, TKey> = {
   // NOTE: This rtpw 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
-  data: [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+  data: [+key: TKey] extends [+key: {+$fragmentSpreads: unknown, ...}]
     ? TData
     : ?TData,
   loadNext: LoadMoreFn<TVariables>,
@@ -60,10 +60,10 @@ type ReturnType<TVariables, TData, TKey> = {
 };
 
 hook useBlockingPaginationFragment<
-  TFragmentType: FragmentType,
-  TVariables: Variables,
+  TFragmentType extends FragmentType,
+  TVariables extends Variables,
   TData,
-  TKey: ?{+$fragmentSpreads: TFragmentType, ...},
+  TKey extends ?{+$fragmentSpreads: TFragmentType, ...},
 >(
   fragmentInput: RefetchableFragment<TFragmentType, TData, TVariables>,
   parentFragmentRef: TKey,
@@ -99,7 +99,7 @@ hook useBlockingPaginationFragment<
       variables: TVariables,
     },
     {
-      +$data: mixed,
+      +$data: unknown,
       ...
     },
   >(fragmentNode, parentFragmentRef, componentDisplayName);
@@ -143,33 +143,34 @@ hook useBlockingPaginationFragment<
       disposeFetchNext();
       disposeFetchPrevious();
       // $FlowFixMe[incompatible-variance]
+      // $FlowFixMe[incompatible-type]
       return refetch(variables, {...options, __environment: undefined});
     },
     [disposeFetchNext, disposeFetchPrevious, refetch],
   );
 
   return {
-    // $FlowFixMe[incompatible-cast]
-    // $FlowFixMe[incompatible-return]
-    data: (fragmentData: TData),
-    loadNext,
-    loadPrevious,
+    // $FlowFixMe[incompatible-type]
+    // $FlowFixMe[incompatible-type]
+    data: fragmentData as TData,
     hasNext,
     hasPrevious,
+    loadNext,
+    loadPrevious,
     refetch: refetchPagination,
   };
 }
 
-hook useLoadMore<TVariables: Variables>(args: {
+hook useLoadMore<TVariables extends Variables>(args: {
   disableStoreUpdates: () => void,
   enableStoreUpdates: () => void,
   ...$Exact<Omit<UseLoadMoreFunctionArgs, 'observer' | 'onReset'>>,
 }): [LoadMoreFn<TVariables>, boolean, () => void] {
   const {disableStoreUpdates, enableStoreUpdates, ...loadMoreArgs} = args;
-  const [requestPromise, setRequestPromise] = useState<null | Promise<mixed>>(
+  const [requestPromise, setRequestPromise] = useState<null | Promise<unknown>>(
     null,
   );
-  const requestPromiseRef = useRef<null | Promise<mixed>>(null);
+  const requestPromiseRef = useRef<null | Promise<unknown>>(null);
   const promiseResolveRef = useRef<null | (() => void)>(null);
 
   const promiseResolve = () => {
@@ -185,6 +186,15 @@ hook useLoadMore<TVariables: Variables>(args: {
 
   const observer = {
     complete: promiseResolve,
+    // TODO: Handle error; we probably don't want to throw an error
+    // and blow away the whole list of items.
+    error: promiseResolve,
+    // NOTE: Since streaming is disallowed with this hook, this means that the
+    // first payload will always contain the entire next page of items,
+    // while subsequent paylaods will contain @defer'd payloads.
+    // This allows us to unsuspend here, on the first payload, and allow
+    // descendant components to suspend on their respective @defer payloads
+    next: promiseResolve,
     // NOTE: loadMore is a no-op if a request is already in flight, so we
     // can safely assume that `start` will only be called once while a
     // request is in flight.
@@ -203,17 +213,6 @@ hook useLoadMore<TVariables: Variables>(args: {
       requestPromiseRef.current = promise;
       setRequestPromise(promise);
     },
-
-    // NOTE: Since streaming is disallowed with this hook, this means that the
-    // first payload will always contain the entire next page of items,
-    // while subsequent paylaods will contain @defer'd payloads.
-    // This allows us to unsuspend here, on the first payload, and allow
-    // descendant components to suspend on their respective @defer payloads
-    next: promiseResolve,
-
-    // TODO: Handle error; we probably don't want to throw an error
-    // and blow away the whole list of items.
-    error: promiseResolve,
   };
   const [loadMore, hasMore, disposeFetch] = useLoadMoreFunction<TVariables>({
     ...loadMoreArgs,

package/relay-hooks/legacy/useFragmentNode.js.flow

@@ -20,15 +20,15 @@ const {useEffect, useState} = require('react');
 const {RelayFeatureFlags, getFragmentIdentifier} = require('relay-runtime');
 const warning = require('warning');
 
-type ReturnType<TFragmentData: mixed> = {
+type ReturnType<TFragmentData extends unknown> = {
   data: TFragmentData,
   disableStoreUpdates: () => void,
   enableStoreUpdates: () => void,
 };
 
-hook useFragmentNode<TFragmentData: mixed>(
+hook useFragmentNode<TFragmentData extends unknown>(
   fragmentNode: ReaderFragment,
-  fragmentRef: mixed,
+  fragmentRef: unknown,
   componentDisplayName: string,
 ): ReturnType<TFragmentData> {
   const environment = useRelayEnvironment();
@@ -123,7 +123,7 @@ hook useFragmentNode<TFragmentData: mixed>(
   }
 
   return {
-    // $FlowFixMe[incompatible-return]
+    // $FlowFixMe[incompatible-type]
     data: fragmentResult.data,
     disableStoreUpdates,
     enableStoreUpdates,