react-relay 16.2.0 → 17.0.0
Sign up to get free protection for your applications and to get access to all the features.
- package/ReactRelayContext.js +1 -1
- package/ReactRelayFragmentContainer.js.flow +8 -6
- package/ReactRelayLocalQueryRenderer.js.flow +4 -1
- package/ReactRelayPaginationContainer.js.flow +2 -0
- package/ReactRelayQueryRenderer.js.flow +1 -1
- package/buildReactRelayContainer.js.flow +5 -3
- package/getRootVariablesForFragments.js.flow +1 -0
- package/hooks.js +1 -1
- package/index.js +1 -1
- package/legacy.js +1 -1
- package/lib/ReactRelayFragmentContainer.js +2 -2
- package/lib/buildReactRelayContainer.js +3 -3
- package/lib/relay-hooks/legacy/FragmentResource.js +14 -16
- package/lib/relay-hooks/{experimental/readFragmentInternal_EXPERIMENTAL.js → readFragmentInternal.js} +7 -5
- package/lib/relay-hooks/useFragment.js +3 -13
- package/lib/relay-hooks/{experimental/useFragmentInternal_EXPERIMENTAL.js → useFragmentInternal.js} +9 -7
- package/lib/relay-hooks/useLazyLoadQueryNode.js +2 -13
- package/lib/relay-hooks/usePaginationFragment.js +17 -13
- package/lib/relay-hooks/useRefetchableFragment.js +3 -12
- package/lib/relay-hooks/{experimental/useRefetchableFragmentInternal_EXPERIMENTAL.js → useRefetchableFragmentInternal.js} +7 -7
- package/multi-actor/useRelayActorEnvironment.js.flow +1 -1
- package/package.json +2 -2
- package/react-relay-hooks.js +2 -2
- package/react-relay-hooks.min.js +2 -2
- package/react-relay-legacy.js +2 -2
- package/react-relay-legacy.min.js +2 -2
- package/react-relay.js +2 -2
- package/react-relay.min.js +2 -2
- package/relay-hooks/EntryPointTypes.flow.js.flow +14 -13
- package/relay-hooks/LazyLoadEntryPointContainer_DEPRECATED.react.js.flow +14 -1
- package/relay-hooks/__flowtests__/useBlockingPaginationFragment-flowtest.js.flow +21 -0
- package/relay-hooks/__flowtests__/usePaginationFragment-flowtest.js.flow +19 -0
- package/relay-hooks/__flowtests__/useRefetchableFragment-flowtest.js.flow +22 -0
- package/relay-hooks/legacy/FragmentResource.js.flow +13 -16
- package/relay-hooks/legacy/useBlockingPaginationFragment.js.flow +2 -2
- package/relay-hooks/legacy/useFragmentNode.js.flow +1 -1
- package/relay-hooks/legacy/useRefetchableFragmentNode.js.flow +2 -2
- package/relay-hooks/loadQuery.js.flow +9 -8
- package/relay-hooks/{experimental/readFragmentInternal_EXPERIMENTAL.js.flow → readFragmentInternal.js.flow} +6 -4
- package/relay-hooks/useClientQuery.js.flow +1 -1
- package/relay-hooks/useEntryPointLoader.js.flow +1 -1
- package/relay-hooks/useFetchTrackingRef.js.flow +1 -1
- package/relay-hooks/useFragment.js.flow +8 -20
- package/relay-hooks/{experimental/useFragmentInternal_EXPERIMENTAL.js.flow → useFragmentInternal.js.flow} +14 -5
- package/relay-hooks/useIsMountedRef.js.flow +1 -1
- package/relay-hooks/useIsOperationNodeActive.js.flow +1 -1
- package/relay-hooks/useIsParentQueryActive.js.flow +5 -2
- package/relay-hooks/useLazyLoadQuery.js.flow +3 -2
- package/relay-hooks/useLazyLoadQueryNode.js.flow +3 -19
- package/relay-hooks/useLoadMoreFunction.js.flow +1 -1
- package/relay-hooks/useMemoOperationDescriptor.js.flow +1 -1
- package/relay-hooks/useMemoVariables.js.flow +1 -1
- package/relay-hooks/useMutation.js.flow +1 -1
- package/relay-hooks/usePaginationFragment.js.flow +62 -50
- package/relay-hooks/usePreloadedQuery.js.flow +2 -1
- package/relay-hooks/useQueryLoader.js.flow +2 -5
- package/relay-hooks/useRefetchableFragment.js.flow +7 -37
- package/relay-hooks/{experimental/useRefetchableFragmentInternal_EXPERIMENTAL.js.flow → useRefetchableFragmentInternal.js.flow} +11 -11
- package/relay-hooks/useRelayEnvironment.js.flow +1 -1
- package/relay-hooks/useStaticFragmentNodeWarning.js.flow +3 -1
- package/relay-hooks/useSubscribeToInvalidationState.js.flow +1 -1
- package/relay-hooks/useSubscription.js.flow +1 -1
- package/relay-hooks/useUnsafeRef_DEPRECATED.js.flow +1 -1
- package/lib/relay-hooks/HooksImplementation.js +0 -15
- package/lib/relay-hooks/experimental/useFragment_EXPERIMENTAL.js +0 -26
- package/lib/relay-hooks/experimental/usePaginationFragment_EXPERIMENTAL.js +0 -127
- package/lib/relay-hooks/experimental/useRefetchableFragment_EXPERIMENTAL.js +0 -23
- package/relay-hooks/HooksImplementation.js.flow +0 -45
- package/relay-hooks/experimental/useFragment_EXPERIMENTAL.js.flow +0 -72
- package/relay-hooks/experimental/usePaginationFragment_EXPERIMENTAL.js.flow +0 -161
- package/relay-hooks/experimental/useRefetchableFragment_EXPERIMENTAL.js.flow +0 -49
@@ -206,11 +206,9 @@ class FragmentResourceImpl {
|
|
206
206
|
constructor(environment: IEnvironment) {
|
207
207
|
this._environment = environment;
|
208
208
|
this._cache = LRUCache.create(CACHE_CAPACITY);
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
);
|
213
|
-
}
|
209
|
+
this._clientEdgeQueryResultsCache = new ClientEdgeQueryResultsCache(
|
210
|
+
environment,
|
211
|
+
);
|
214
212
|
}
|
215
213
|
|
216
214
|
/**
|
@@ -397,7 +395,6 @@ class FragmentResourceImpl {
|
|
397
395
|
// First, initiate a query for any client edges that were missing data:
|
398
396
|
let clientEdgeRequests: ?Array<RequestDescriptor> = null;
|
399
397
|
if (
|
400
|
-
RelayFeatureFlags.ENABLE_CLIENT_EDGES &&
|
401
398
|
fragmentNode.metadata?.hasClientEdges === true &&
|
402
399
|
hasMissingClientEdges(snapshot)
|
403
400
|
) {
|
@@ -432,7 +429,7 @@ class FragmentResourceImpl {
|
|
432
429
|
);
|
433
430
|
}
|
434
431
|
let clientEdgePromises: Array<Promise<void>> = [];
|
435
|
-
if (
|
432
|
+
if (clientEdgeRequests) {
|
436
433
|
clientEdgePromises = clientEdgeRequests
|
437
434
|
.map(request => getPromiseForActiveRequest(this._environment, request))
|
438
435
|
.filter(Boolean);
|
@@ -567,6 +564,7 @@ class FragmentResourceImpl {
|
|
567
564
|
s.missingRequiredFields,
|
568
565
|
s.relayResolverErrors,
|
569
566
|
s.errorResponseFields,
|
567
|
+
s.selector.node.metadata?.throwOnFieldError ?? false,
|
570
568
|
);
|
571
569
|
});
|
572
570
|
} else {
|
@@ -575,6 +573,7 @@ class FragmentResourceImpl {
|
|
575
573
|
snapshot.missingRequiredFields,
|
576
574
|
snapshot.relayResolverErrors,
|
577
575
|
snapshot.errorResponseFields,
|
576
|
+
snapshot.selector.node.metadata?.throwOnFieldError ?? false,
|
578
577
|
);
|
579
578
|
}
|
580
579
|
}
|
@@ -672,15 +671,13 @@ class FragmentResourceImpl {
|
|
672
671
|
);
|
673
672
|
}
|
674
673
|
|
675
|
-
|
676
|
-
|
677
|
-
|
678
|
-
|
679
|
-
|
680
|
-
|
681
|
-
|
682
|
-
});
|
683
|
-
}
|
674
|
+
const clientEdgeQueryResults =
|
675
|
+
this._clientEdgeQueryResultsCache?.get(cacheKey) ?? undefined;
|
676
|
+
if (clientEdgeQueryResults?.length) {
|
677
|
+
const queryResource = getQueryResourceForEnvironment(this._environment);
|
678
|
+
clientEdgeQueryResults.forEach(queryResult => {
|
679
|
+
disposables.push(queryResource.retain(queryResult));
|
680
|
+
});
|
684
681
|
}
|
685
682
|
|
686
683
|
return {
|
@@ -65,7 +65,7 @@ type ReturnType<TVariables, TData, TKey> = {
|
|
65
65
|
refetch: RefetchFn<TVariables, TKey>,
|
66
66
|
};
|
67
67
|
|
68
|
-
|
68
|
+
hook useBlockingPaginationFragment<
|
69
69
|
TFragmentType: FragmentType,
|
70
70
|
TVariables: Variables,
|
71
71
|
TData,
|
@@ -166,7 +166,7 @@ function useBlockingPaginationFragment<
|
|
166
166
|
};
|
167
167
|
}
|
168
168
|
|
169
|
-
|
169
|
+
hook useLoadMore<TVariables: Variables>(args: {
|
170
170
|
disableStoreUpdates: () => void,
|
171
171
|
enableStoreUpdates: () => void,
|
172
172
|
...$Exact<
|
@@ -26,7 +26,7 @@ type ReturnType<TFragmentData: mixed> = {
|
|
26
26
|
enableStoreUpdates: () => void,
|
27
27
|
};
|
28
28
|
|
29
|
-
|
29
|
+
hook useFragmentNode<TFragmentData: mixed>(
|
30
30
|
fragmentNode: ReaderFragment,
|
31
31
|
fragmentRef: mixed,
|
32
32
|
componentDisplayName: string,
|
@@ -162,7 +162,7 @@ function reducer(state: RefetchState, action: Action): RefetchState {
|
|
162
162
|
}
|
163
163
|
}
|
164
164
|
|
165
|
-
|
165
|
+
hook useRefetchableFragmentNode<
|
166
166
|
TQuery: OperationType,
|
167
167
|
TKey: ?{+$data?: mixed, ...},
|
168
168
|
>(
|
@@ -367,7 +367,7 @@ function useRefetchableFragmentNode<
|
|
367
367
|
};
|
368
368
|
}
|
369
369
|
|
370
|
-
|
370
|
+
hook useRefetchFunction<TQuery: OperationType>(
|
371
371
|
componentDisplayName: string,
|
372
372
|
dispatch: (
|
373
373
|
| {
|
@@ -46,7 +46,7 @@ const warning = require('warning');
|
|
46
46
|
let RenderDispatcher = null;
|
47
47
|
let fetchKey = 100001;
|
48
48
|
|
49
|
-
|
49
|
+
hook useTrackLoadQueryInRender() {
|
50
50
|
if (RenderDispatcher === null) {
|
51
51
|
// Flow does not know of React internals (rightly so), but we need to
|
52
52
|
// ensure here that this function isn't called inside render.
|
@@ -57,13 +57,14 @@ function useTrackLoadQueryInRender() {
|
|
57
57
|
}
|
58
58
|
}
|
59
59
|
|
60
|
-
type QueryType<T> =
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
60
|
+
type QueryType<T> =
|
61
|
+
T extends Query<infer V, infer D, infer RR>
|
62
|
+
? {
|
63
|
+
variables: V,
|
64
|
+
response: D,
|
65
|
+
rawResponse?: $NonMaybeType<RR>,
|
66
|
+
} // $FlowFixMe[deprecated-type]
|
67
|
+
: $Call<<T>(PreloadableConcreteRequest<T>) => T, T>;
|
67
68
|
|
68
69
|
declare function loadQuery<
|
69
70
|
T,
|
@@ -11,7 +11,7 @@
|
|
11
11
|
|
12
12
|
'use strict';
|
13
13
|
|
14
|
-
import type {QueryResult} from '
|
14
|
+
import type {QueryResult} from './QueryResource';
|
15
15
|
import type {
|
16
16
|
CacheConfig,
|
17
17
|
FetchPolicy,
|
@@ -23,7 +23,7 @@ import type {
|
|
23
23
|
} from 'relay-runtime';
|
24
24
|
import type {MissingClientEdgeRequestInfo} from 'relay-runtime/store/RelayStoreTypes';
|
25
25
|
|
26
|
-
const {getQueryResourceForEnvironment} = require('
|
26
|
+
const {getQueryResourceForEnvironment} = require('./QueryResource');
|
27
27
|
const invariant = require('invariant');
|
28
28
|
const {
|
29
29
|
__internal: {fetchQuery: fetchQueryInternal},
|
@@ -88,6 +88,7 @@ function handlePotentialSnapshotErrorsForState(
|
|
88
88
|
state.snapshot.missingRequiredFields,
|
89
89
|
state.snapshot.relayResolverErrors,
|
90
90
|
state.snapshot.errorResponseFields,
|
91
|
+
state.snapshot.selector.node.metadata?.throwOnFieldError ?? false,
|
91
92
|
);
|
92
93
|
} else if (state.kind === 'plural') {
|
93
94
|
for (const snapshot of state.snapshots) {
|
@@ -96,6 +97,7 @@ function handlePotentialSnapshotErrorsForState(
|
|
96
97
|
snapshot.missingRequiredFields,
|
97
98
|
snapshot.relayResolverErrors,
|
98
99
|
snapshot.errorResponseFields,
|
100
|
+
snapshot.selector.node.metadata?.throwOnFieldError ?? false,
|
99
101
|
);
|
100
102
|
}
|
101
103
|
}
|
@@ -159,7 +161,7 @@ function getFragmentState(
|
|
159
161
|
}
|
160
162
|
|
161
163
|
// fragmentNode cannot change during the lifetime of the component, though fragmentRef may change.
|
162
|
-
function
|
164
|
+
function readFragmentInternal(
|
163
165
|
environment: IEnvironment,
|
164
166
|
fragmentNode: ReaderFragment,
|
165
167
|
fragmentRef: mixed,
|
@@ -297,4 +299,4 @@ function readFragmentInternal_EXPERIMENTAL(
|
|
297
299
|
return {data, clientEdgeQueries};
|
298
300
|
}
|
299
301
|
|
300
|
-
module.exports =
|
302
|
+
module.exports = readFragmentInternal;
|
@@ -20,7 +20,7 @@ const useLazyLoadQuery = require('./useLazyLoadQuery');
|
|
20
20
|
* These queries are consist of queries for client-only data,
|
21
21
|
* schematized via local schema extensions and/or Relay resolvers.
|
22
22
|
*/
|
23
|
-
|
23
|
+
hook useClientQuery<TVariables: Variables, TData, TRawResponse>(
|
24
24
|
gqlQuery: ClientQuery<TVariables, TData, TRawResponse>,
|
25
25
|
variables: TVariables,
|
26
26
|
options?: {
|
@@ -50,7 +50,7 @@ type NullEntryPointReference = {
|
|
50
50
|
};
|
51
51
|
const initialNullEntryPointReferenceState = {kind: 'NullEntryPointReference'};
|
52
52
|
|
53
|
-
|
53
|
+
hook useLoadEntryPoint<
|
54
54
|
TEntryPointParams: {...},
|
55
55
|
TPreloadedQueries: {...},
|
56
56
|
TPreloadedEntryPoints: {...},
|
@@ -28,7 +28,7 @@ const {useCallback, useEffect} = require('react');
|
|
28
28
|
* The additional functions returned by this Hook can be used to mutate
|
29
29
|
* the ref.
|
30
30
|
*/
|
31
|
-
|
31
|
+
hook useFetchTrackingRef(): {
|
32
32
|
isFetchingRef: {current: ?boolean, ...},
|
33
33
|
startFetch: Subscription => void,
|
34
34
|
disposeFetch: () => void,
|
@@ -13,9 +13,8 @@
|
|
13
13
|
|
14
14
|
import type {Fragment, FragmentType, GraphQLTaggedNode} from 'relay-runtime';
|
15
15
|
|
16
|
-
const HooksImplementation = require('./HooksImplementation');
|
17
|
-
const useFragmentNode = require('./legacy/useFragmentNode');
|
18
16
|
const {useTrackLoadQueryInRender} = require('./loadQuery');
|
17
|
+
const useFragmentInternal = require('./useFragmentInternal');
|
19
18
|
const useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
|
20
19
|
const {useDebugValue} = require('react');
|
21
20
|
const {getFragment} = require('relay-runtime');
|
@@ -26,54 +25,43 @@ type HasSpread<TFragmentType> = {
|
|
26
25
|
};
|
27
26
|
|
28
27
|
// if the key is non-nullable, return non-nullable value
|
29
|
-
declare
|
28
|
+
declare hook useFragment<TFragmentType: FragmentType, TData>(
|
30
29
|
fragment: Fragment<TFragmentType, TData>,
|
31
30
|
key: HasSpread<TFragmentType>,
|
32
31
|
): TData;
|
33
32
|
|
34
33
|
// if the key is nullable, return nullable value
|
35
|
-
declare
|
34
|
+
declare hook useFragment<TFragmentType: FragmentType, TData>(
|
36
35
|
fragment: Fragment<TFragmentType, TData>,
|
37
36
|
key: ?HasSpread<TFragmentType>,
|
38
37
|
): ?TData;
|
39
38
|
|
40
39
|
// if the key is a non-nullable array of keys, return non-nullable array
|
41
|
-
declare
|
40
|
+
declare hook useFragment<TFragmentType: FragmentType, TData>(
|
42
41
|
fragment: Fragment<TFragmentType, TData>,
|
43
42
|
key: $ReadOnlyArray<HasSpread<TFragmentType>>,
|
44
43
|
): TData;
|
45
44
|
|
46
45
|
// if the key is a nullable array of keys, return nullable array
|
47
|
-
declare
|
46
|
+
declare hook useFragment<TFragmentType: FragmentType, TData>(
|
48
47
|
fragment: Fragment<TFragmentType, TData>,
|
49
48
|
key: ?$ReadOnlyArray<HasSpread<TFragmentType>>,
|
50
49
|
): ?TData;
|
51
50
|
|
52
|
-
|
51
|
+
hook useFragment(fragment: GraphQLTaggedNode, key: mixed): mixed {
|
53
52
|
// We need to use this hook in order to be able to track if
|
54
53
|
// loadQuery was called during render
|
55
54
|
useTrackLoadQueryInRender();
|
56
55
|
|
57
56
|
const fragmentNode = getFragment(fragment);
|
58
57
|
useStaticFragmentNodeWarning(fragmentNode, 'first argument of useFragment()');
|
59
|
-
const
|
58
|
+
const data = useFragmentInternal(fragmentNode, key, 'useFragment()');
|
60
59
|
if (__DEV__) {
|
61
60
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
61
|
+
// $FlowFixMe[react-rule-hook]
|
62
62
|
useDebugValue({fragment: fragmentNode.name, data});
|
63
63
|
}
|
64
64
|
return data;
|
65
65
|
}
|
66
66
|
|
67
|
-
function useFragment(fragment: GraphQLTaggedNode, key: mixed): mixed {
|
68
|
-
const impl = HooksImplementation.get();
|
69
|
-
if (impl) {
|
70
|
-
// $FlowFixMe This is safe because impl.useFragment has the type of useFragment...
|
71
|
-
return impl.useFragment(fragment, key);
|
72
|
-
// (i.e. type declared above, but not the supertype used in this function definition)
|
73
|
-
} else {
|
74
|
-
// eslint-disable-next-line react-hooks/rules-of-hooks
|
75
|
-
return useFragment_LEGACY(fragment, key);
|
76
|
-
}
|
77
|
-
}
|
78
|
-
|
79
67
|
module.exports = useFragment;
|
@@ -11,7 +11,7 @@
|
|
11
11
|
|
12
12
|
'use strict';
|
13
13
|
|
14
|
-
import type {QueryResult} from '
|
14
|
+
import type {QueryResult} from './QueryResource';
|
15
15
|
import type {
|
16
16
|
CacheConfig,
|
17
17
|
FetchPolicy,
|
@@ -26,8 +26,8 @@ import type {
|
|
26
26
|
MissingLiveResolverField,
|
27
27
|
} from 'relay-runtime/store/RelayStoreTypes';
|
28
28
|
|
29
|
-
const {getQueryResourceForEnvironment} = require('
|
30
|
-
const useRelayEnvironment = require('
|
29
|
+
const {getQueryResourceForEnvironment} = require('./QueryResource');
|
30
|
+
const useRelayEnvironment = require('./useRelayEnvironment');
|
31
31
|
const invariant = require('invariant');
|
32
32
|
const {useDebugValue, useEffect, useMemo, useRef, useState} = require('react');
|
33
33
|
const {
|
@@ -118,6 +118,7 @@ function handlePotentialSnapshotErrorsForState(
|
|
118
118
|
state.snapshot.missingRequiredFields,
|
119
119
|
state.snapshot.relayResolverErrors,
|
120
120
|
state.snapshot.errorResponseFields,
|
121
|
+
state.snapshot.selector.node.metadata?.throwOnFieldError ?? false,
|
121
122
|
);
|
122
123
|
} else if (state.kind === 'plural') {
|
123
124
|
for (const snapshot of state.snapshots) {
|
@@ -126,6 +127,7 @@ function handlePotentialSnapshotErrorsForState(
|
|
126
127
|
snapshot.missingRequiredFields,
|
127
128
|
snapshot.relayResolverErrors,
|
128
129
|
snapshot.errorResponseFields,
|
130
|
+
snapshot.selector.node.metadata?.throwOnFieldError ?? false,
|
129
131
|
);
|
130
132
|
}
|
131
133
|
}
|
@@ -360,7 +362,7 @@ function getFragmentState(
|
|
360
362
|
}
|
361
363
|
|
362
364
|
// fragmentNode cannot change during the lifetime of the component, though fragmentRef may change.
|
363
|
-
|
365
|
+
hook useFragmentInternal(
|
364
366
|
fragmentNode: ReaderFragment,
|
365
367
|
fragmentRef: mixed,
|
366
368
|
hookDisplayName: string,
|
@@ -466,6 +468,7 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
466
468
|
// a static (constant) property of the fragment. In practice, this effect will
|
467
469
|
// always or never run for a given invocation of this hook.
|
468
470
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
471
|
+
// $FlowFixMe[react-rule-hook]
|
469
472
|
const [clientEdgeQueries, activeRequestPromises] = useMemo(() => {
|
470
473
|
const missingClientEdges = getMissingClientEdges(state);
|
471
474
|
// eslint-disable-next-line no-shadow
|
@@ -496,6 +499,7 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
496
499
|
|
497
500
|
// See above note
|
498
501
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
502
|
+
// $FlowFixMe[react-rule-hook]
|
499
503
|
useEffect(() => {
|
500
504
|
const QueryResource = getQueryResourceForEnvironment(environment);
|
501
505
|
if (clientEdgeQueries?.length) {
|
@@ -528,8 +532,10 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
528
532
|
// We only suspend when the component is first trying to mount or changing
|
529
533
|
// selectors, not if data becomes missing later:
|
530
534
|
if (
|
535
|
+
RelayFeatureFlags.ENABLE_RELAY_OPERATION_TRACKER_SUSPENSE ||
|
531
536
|
environment !== previousEnvironment ||
|
532
537
|
!committedFragmentSelectorRef.current ||
|
538
|
+
// $FlowFixMe[react-rule-unsafe-ref]
|
533
539
|
!areEqualSelectors(committedFragmentSelectorRef.current, fragmentSelector)
|
534
540
|
) {
|
535
541
|
invariant(fragmentSelector != null, 'refinement, see invariants above');
|
@@ -589,6 +595,7 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
589
595
|
state = updatedState;
|
590
596
|
}
|
591
597
|
}
|
598
|
+
// $FlowFixMe[react-rule-unsafe-ref]
|
592
599
|
hasPendingStateChanges.current = false;
|
593
600
|
}
|
594
601
|
|
@@ -601,6 +608,7 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
601
608
|
// for a particular useFragment invocation site
|
602
609
|
const fragmentRefIsNullish = fragmentRef == null; // for less sensitive memoization
|
603
610
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
611
|
+
// $FlowFixMe[react-rule-hook]
|
604
612
|
data = useMemo(() => {
|
605
613
|
if (state.kind === 'bailout') {
|
606
614
|
// Bailout state can happen if the fragmentRef is a plural array that is empty or has no
|
@@ -651,10 +659,11 @@ function useFragmentInternal_EXPERIMENTAL(
|
|
651
659
|
|
652
660
|
if (__DEV__) {
|
653
661
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
662
|
+
// $FlowFixMe[react-rule-hook]
|
654
663
|
useDebugValue({fragment: fragmentNode.name, data});
|
655
664
|
}
|
656
665
|
|
657
666
|
return data;
|
658
667
|
}
|
659
668
|
|
660
|
-
module.exports =
|
669
|
+
module.exports = useFragmentInternal;
|
@@ -17,9 +17,12 @@ const useIsOperationNodeActive = require('./useIsOperationNodeActive');
|
|
17
17
|
const useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
|
18
18
|
const {getFragment} = require('relay-runtime');
|
19
19
|
|
20
|
-
|
20
|
+
hook useIsParentQueryActive<
|
21
21
|
TKey: ?{+$data?: mixed, +$fragmentSpreads: FragmentType, ...},
|
22
|
-
>(
|
22
|
+
>(
|
23
|
+
fragmentInput: GraphQLTaggedNode,
|
24
|
+
fragmentRef: TKey,
|
25
|
+
): boolean {
|
23
26
|
const fragmentNode = getFragment(fragmentInput);
|
24
27
|
useStaticFragmentNodeWarning(
|
25
28
|
fragmentNode,
|
@@ -30,7 +30,7 @@ const {
|
|
30
30
|
// This separate type export is only needed as long as we are injecting
|
31
31
|
// a separate hooks implementation in ./HooksImplementation -- it can
|
32
32
|
// be removed after we stop doing that.
|
33
|
-
export type UseLazyLoadQueryHookType = <TVariables: Variables, TData>(
|
33
|
+
export type UseLazyLoadQueryHookType = hook <TVariables: Variables, TData>(
|
34
34
|
gqlQuery: Query<TVariables, TData>,
|
35
35
|
variables: TVariables,
|
36
36
|
options?: {
|
@@ -41,7 +41,7 @@ export type UseLazyLoadQueryHookType = <TVariables: Variables, TData>(
|
|
41
41
|
},
|
42
42
|
) => TData;
|
43
43
|
|
44
|
-
|
44
|
+
hook useLazyLoadQuery<TVariables: Variables, TData>(
|
45
45
|
gqlQuery: Query<TVariables, TData>,
|
46
46
|
variables: TVariables,
|
47
47
|
options?: {
|
@@ -75,4 +75,5 @@ function useLazyLoadQuery<TVariables: Variables, TData>(
|
|
75
75
|
return data;
|
76
76
|
}
|
77
77
|
|
78
|
+
// $FlowFixMe[react-rule-hook-incompatible]
|
78
79
|
module.exports = (useLazyLoadQuery: UseLazyLoadQueryHookType);
|
@@ -19,22 +19,20 @@ import type {
|
|
19
19
|
OperationType,
|
20
20
|
RenderPolicy,
|
21
21
|
} from 'relay-runtime';
|
22
|
-
import type {ReaderFragment} from 'relay-runtime/util/ReaderNode';
|
23
22
|
|
24
|
-
const HooksImplementation = require('./HooksImplementation');
|
25
|
-
const useFragmentNode = require('./legacy/useFragmentNode');
|
26
23
|
const ProfilerContext = require('./ProfilerContext');
|
27
24
|
const {
|
28
25
|
getQueryCacheIdentifier,
|
29
26
|
getQueryResourceForEnvironment,
|
30
27
|
} = require('./QueryResource');
|
31
28
|
const useFetchTrackingRef = require('./useFetchTrackingRef');
|
29
|
+
const useFragmentInternal = require('./useFragmentInternal');
|
32
30
|
const useRelayEnvironment = require('./useRelayEnvironment');
|
33
31
|
const React = require('react');
|
34
32
|
|
35
33
|
const {useContext, useEffect, useState, useRef} = React;
|
36
34
|
|
37
|
-
|
35
|
+
hook useLazyLoadQueryNode<TQuery: OperationType>({
|
38
36
|
query,
|
39
37
|
componentDisplayName,
|
40
38
|
fetchObservable,
|
@@ -127,7 +125,7 @@ function useLazyLoadQueryNode<TQuery: OperationType>({
|
|
127
125
|
});
|
128
126
|
|
129
127
|
const {fragmentNode, fragmentRef} = preparedQueryResult;
|
130
|
-
const data =
|
128
|
+
const data = useFragmentInternal(
|
131
129
|
fragmentNode,
|
132
130
|
fragmentRef,
|
133
131
|
componentDisplayName,
|
@@ -135,18 +133,4 @@ function useLazyLoadQueryNode<TQuery: OperationType>({
|
|
135
133
|
return data;
|
136
134
|
}
|
137
135
|
|
138
|
-
function useFragmentNodeImpl(
|
139
|
-
fragment: ReaderFragment,
|
140
|
-
key: mixed,
|
141
|
-
componentDisplayName: string,
|
142
|
-
): mixed {
|
143
|
-
const impl = HooksImplementation.get();
|
144
|
-
if (impl && impl.useFragment__internal) {
|
145
|
-
return impl.useFragment__internal(fragment, key, componentDisplayName);
|
146
|
-
} else {
|
147
|
-
const {data} = useFragmentNode<mixed>(fragment, key, componentDisplayName);
|
148
|
-
return data;
|
149
|
-
}
|
150
|
-
}
|
151
|
-
|
152
136
|
module.exports = useLazyLoadQueryNode;
|
@@ -61,7 +61,7 @@ export type UseLoadMoreFunctionArgs = {
|
|
61
61
|
onReset: () => void,
|
62
62
|
};
|
63
63
|
|
64
|
-
|
64
|
+
hook useLoadMoreFunction<TVariables: Variables>(
|
65
65
|
args: UseLoadMoreFunctionArgs,
|
66
66
|
): [LoadMoreFn<TVariables>, boolean, () => void] {
|
67
67
|
const {
|
@@ -24,7 +24,7 @@ const {createOperationDescriptor, getRequest} = require('relay-runtime');
|
|
24
24
|
|
25
25
|
const {useMemo} = React;
|
26
26
|
|
27
|
-
|
27
|
+
hook useMemoOperationDescriptor(
|
28
28
|
gqlQuery: GraphQLTaggedNode,
|
29
29
|
variables: Variables,
|
30
30
|
cacheConfig?: ?CacheConfig,
|
@@ -21,7 +21,7 @@ const {useState} = require('react');
|
|
21
21
|
* This is useful when a `variables` object is used as a value in a depencency
|
22
22
|
* array as it might often be constructed during render.
|
23
23
|
*/
|
24
|
-
|
24
|
+
hook useMemoVariables<TVariables: Variables | null>(
|
25
25
|
variables: TVariables,
|
26
26
|
): TVariables {
|
27
27
|
const [mirroredVariables, setMirroredVariables] = useState(variables);
|
@@ -64,7 +64,7 @@ type UseMutationConfigInternal<TVariables, TData, TRawResponse> = {
|
|
64
64
|
variables: TVariables,
|
65
65
|
};
|
66
66
|
|
67
|
-
|
67
|
+
hook useMutation<TVariables: Variables, TData, TRawResponse = {...}>(
|
68
68
|
mutation: Mutation<TVariables, TData, TRawResponse>,
|
69
69
|
commitMutationFn?: (
|
70
70
|
environment: IEnvironment,
|