Adopt conditional type for useRefetchableFragment related functions

Reviewed By: panagosg7

Differential Revision: D51774148

fbshipit-source-id: 1e76ea0f4cad928d6bef3f0d1a40994aa9b8544b

Author: SamChou19815

packages/react-relay/relay-hooks/experimental/useRefetchableFragmentInternal_EXPERIMENTAL.js

@@ -55,16 +55,13 @@ export type RefetchFn<
 //    /nullable/.
 //  - Or, expects /a subset/ of the query variables if the provided key type is
 //    /non-null/.
-// prettier-ignore
 export type RefetchFnDynamic<
   TQuery: OperationType,
-  TKey: ?{ +$data?: mixed, ... },
+  TKey: ?{+$data?: mixed, ...},
   TOptions = Options,
-> = $Call<
-  & (( { +$data?: mixed, ... }) => RefetchFnInexact<TQuery, TOptions>)
-  & ((?{ +$data?: mixed, ... }) => RefetchFnExact<TQuery, TOptions>),
-  TKey
->;
+> = [TKey] extends [{+$data?: mixed, ...}]
+  ? RefetchFnInexact<TQuery, TOptions>
+  : RefetchFnExact<TQuery, TOptions>;
 
 export type ReturnType<
   TQuery: OperationType,
@@ -353,6 +350,7 @@ function useRefetchableFragmentNode<
   return {
     fragmentData,
     fragmentRef,
+    // $FlowFixMe[incompatible-return] RefetchFn not compatible with RefetchFnDynamic
     refetch,
   };
 }

packages/react-relay/relay-hooks/useBlockingPaginationFragment.js

@@ -34,15 +34,12 @@ const {
 } = require('relay-runtime');
 
 type RefetchVariables<TVariables, TKey> =
-  // NOTE: This $Call ensures that the type of the variables is either:
+  // 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
-  // prettier-ignore
-  $Call<
-    & (<TFragmentType>( { +$fragmentSpreads: TFragmentType, ... }) => Partial<TVariables>)
-    & (<TFragmentType>(?{ +$fragmentSpreads: TFragmentType, ... }) => TVariables),
-    TKey,
-  >;
+  [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+    ? Partial<TVariables>
+    : TVariables;
 
 type RefetchFnBase<TVars, TOptions> = (
   vars: TVars,
@@ -55,15 +52,12 @@ type RefetchFn<TVariables, TKey, TOptions = Options> = RefetchFnBase<
 >;
 
 type ReturnType<TVariables, TData, TKey> = {
-  // NOTE: This $Call ensures that the type of the returned data is either:
+  // 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
-  // prettier-ignore
-  data: $Call<
-    & (<TFragmentType>( { +$fragmentSpreads: TFragmentType, ... }) =>  TData)
-    & (<TFragmentType>(?{ +$fragmentSpreads: TFragmentType, ... }) => ?TData),
-    TKey,
-  >,
+  data: [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+    ? TData
+    : ?TData,
   loadNext: LoadMoreFn<TVariables>,
   loadPrevious: LoadMoreFn<TVariables>,
   hasNext: boolean,
@@ -162,6 +156,7 @@ function useBlockingPaginationFragment<
 
   return {
     // $FlowFixMe[incompatible-cast]
+    // $FlowFixMe[incompatible-return]
     data: (fragmentData: TData),
     loadNext,
     loadPrevious,

packages/react-relay/relay-hooks/usePaginationFragment.js

@@ -157,15 +157,12 @@ function useLoadMore<TVariables: Variables>(
 }
 
 export type ReturnType<TVariables, TData, TKey> = {
-  // NOTE: This $Call ensures that the type of the returned data is either:
+  // NOTE: This type 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
-  // prettier-ignore
-  data: $Call<
-    & (<TFragmentType>( { +$fragmentSpreads: TFragmentType, ... }) =>  TData)
-    & (<TFragmentType>(?{ +$fragmentSpreads: TFragmentType, ... }) => ?TData),
-    TKey,
-  >,
+  data: [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+    ? TData
+    : ?TData,
   loadNext: LoadMoreFn<TVariables>,
   loadPrevious: LoadMoreFn<TVariables>,
   hasNext: boolean,
@@ -186,6 +183,7 @@ function usePaginationFragment<
 ): ReturnType<TVariables, TData, TKey> {
   const impl = HooksImplementation.get();
   if (impl) {
+    // $FlowExpectedError[incompatible-return] Flow cannot prove that two conditional type satisfy each other
     return impl.usePaginationFragment<TFragmentType, TVariables, TData, TKey>(
       fragmentInput,
       parentFragmentRef,

packages/react-relay/relay-hooks/useRefetchableFragment.js

@@ -25,16 +25,13 @@ const useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
 const {useDebugValue} = require('react');
 const {getFragment} = require('relay-runtime');
 
-type RefetchVariables<TVariables, TKey> =
-  // NOTE: This $Call ensures that the type of the returned variables is either:
+type RefetchVariables<TVariables, TKey: ?{+$fragmentSpreads: mixed, ...}> =
+  // NOTE: This type ensures that the type of the returned variables is either:
   //   - nullable if the provided ref type is nullable
   //   - non-nullable if the provided ref type is non-nullable
-  // prettier-ignore
-  $Call<
-    & (<TFragmentType>( { +$fragmentSpreads: TFragmentType, ... }) => Partial<TVariables>)
-    & (<TFragmentType>(?{ +$fragmentSpreads: TFragmentType, ... }) => TVariables),
-    TKey,
-  >;
+  [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}]
+    ? Partial<TVariables>
+    : TVariables;
 
 type RefetchFnBase<TVars, TOptions> = (
   vars: TVars,
@@ -46,16 +43,15 @@ export type RefetchFn<TVariables, TKey, TOptions = Options> = RefetchFnBase<
   TOptions,
 >;
 
-export type ReturnType<TVariables, TData, TKey> = [
-  // NOTE: This $Call ensures that the type of the returned data is either:
+export type ReturnType<
+  TVariables,
+  TData,
+  TKey: ?{+$fragmentSpreads: mixed, ...},
+> = [
+  // NOTE: This type 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
-  // prettier-ignore
-  $Call<
-    & (<TFragmentType>( { +$fragmentSpreads: TFragmentType, ... }) =>  TData)
-    & (<TFragmentType>(?{ +$fragmentSpreads: TFragmentType, ... }) => ?TData),
-    TKey,
-  >,
+  [+key: TKey] extends [+key: {+$fragmentSpreads: mixed, ...}] ? TData : ?TData,
   RefetchFn<TVariables, TKey>,
 ];
 
@@ -115,6 +111,7 @@ function useRefetchableFragment<
 ): ReturnType<TVariables, TData, TKey> {
   const impl = HooksImplementation.get();
   if (impl) {
+    // $FlowExpectedError[incompatible-return] Flow cannot prove that two conditional type satisfy each other
     return impl.useRefetchableFragment<TFragmentType, TVariables, TData, TKey>(
       fragmentInput,
       parentFragmentRef,

packages/react-relay/relay-hooks/useRefetchableFragmentNode.js

@@ -55,16 +55,13 @@ export type RefetchFn<
 //    /nullable/.
 //  - Or, expects /a subset/ of the query variables if the provided key type is
 //    /non-null/.
-// prettier-ignore
 export type RefetchFnDynamic<
   TQuery: OperationType,
-  TKey: ?{ +$data?: mixed, ... },
+  TKey: ?{+$data?: mixed, ...},
   TOptions = Options,
-> = $Call<
-  & (( { +$data?: mixed, ... }) => RefetchFnInexact<TQuery, TOptions>)
-  & ((?{ +$data?: mixed, ... }) => RefetchFnExact<TQuery, TOptions>),
-  TKey
->;
+> = [TKey] extends [{+$data?: mixed, ...}]
+  ? RefetchFnInexact<TQuery, TOptions>
+  : RefetchFnExact<TQuery, TOptions>;
 
 export type ReturnType<
   TQuery: OperationType,
@@ -363,6 +360,7 @@ function useRefetchableFragmentNode<
   return {
     fragmentData,
     fragmentRef,
+    // $FlowFixMe[incompatible-return] RefetchFn not compatible with RefetchFnDynamic
     refetch,
     disableStoreUpdates,
     enableStoreUpdates,