react-relay 16.2.0 → 18.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ReactRelayContainerUtils.js.flow +2 -2
- package/ReactRelayContext.js +1 -1
- package/ReactRelayContext.js.flow +1 -1
- package/ReactRelayFragmentContainer.js.flow +10 -8
- package/ReactRelayLocalQueryRenderer.js.flow +4 -1
- package/ReactRelayPaginationContainer.js.flow +4 -2
- package/ReactRelayQueryRenderer.js.flow +2 -2
- package/ReactRelayQueryRendererContext.js.flow +1 -1
- package/ReactRelayRefetchContainer.js.flow +2 -2
- package/ReactRelayTypes.js.flow +45 -18
- package/__flowtests__/ReactRelayFragmentContainer-flowtest.js.flow +2 -2
- package/buildReactRelayContainer.js.flow +10 -8
- 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/loadEntryPoint.js +8 -5
- package/lib/relay-hooks/loadQuery.js +2 -14
- package/lib/relay-hooks/{experimental/readFragmentInternal_EXPERIMENTAL.js → readFragmentInternal.js} +7 -5
- package/lib/relay-hooks/useEntryPointLoader.js +5 -8
- package/lib/relay-hooks/useFragment.js +7 -20
- package/lib/relay-hooks/useFragmentInternal.js +13 -0
- package/lib/relay-hooks/{experimental/useFragmentInternal_EXPERIMENTAL.js → useFragmentInternal_CURRENT.js} +12 -18
- package/lib/relay-hooks/useFragmentInternal_EXPERIMENTAL.js +520 -0
- package/lib/relay-hooks/useLazyLoadQuery.js +2 -5
- package/lib/relay-hooks/useLazyLoadQueryNode.js +2 -13
- package/lib/relay-hooks/usePaginationFragment.js +17 -13
- package/lib/relay-hooks/usePreloadedQuery.js +6 -9
- package/lib/relay-hooks/useQueryLoader.js +1 -3
- package/lib/relay-hooks/useRefetchableFragment.js +3 -12
- package/lib/relay-hooks/{experimental/useRefetchableFragmentInternal_EXPERIMENTAL.js → useRefetchableFragmentInternal.js} +7 -7
- package/multi-actor/ActorChange.js.flow +1 -1
- package/multi-actor/useRelayActorEnvironment.js.flow +1 -1
- package/package.json +3 -3
- 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 +49 -25
- package/relay-hooks/LazyLoadEntryPointContainer_DEPRECATED.react.js.flow +22 -5
- package/relay-hooks/MatchContainer.js.flow +1 -1
- package/relay-hooks/ProfilerContext.js.flow +1 -1
- package/relay-hooks/__flowtests__/EntryPointTypes/ExtractQueryTypes-flowtest.js.flow +43 -0
- 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/loadEntryPoint.js.flow +10 -4
- package/relay-hooks/loadQuery.js.flow +10 -33
- package/relay-hooks/prepareEntryPoint_DEPRECATED.js.flow +4 -1
- 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 +4 -5
- package/relay-hooks/useFetchTrackingRef.js.flow +1 -1
- package/relay-hooks/useFragment.js.flow +8 -25
- package/relay-hooks/useFragmentInternal.js.flow +45 -0
- package/relay-hooks/{experimental/useFragmentInternal_EXPERIMENTAL.js.flow → useFragmentInternal_CURRENT.js.flow} +14 -5
- package/relay-hooks/useFragmentInternal_EXPERIMENTAL.js.flow +764 -0
- 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 -7
- 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 -6
- package/relay-hooks/useQueryLoader.js.flow +3 -7
- 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
|
@@ -11,11 +11,11 @@
|
|
|
11
11
|
|
|
12
12
|
'use strict';
|
|
13
13
|
|
|
14
|
-
function getComponentName(component: React
|
|
14
|
+
function getComponentName(component: React.ComponentType<any>): string {
|
|
15
15
|
return component.displayName || component.name || 'Component';
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
function getContainerName(Component: React
|
|
18
|
+
function getContainerName(Component: React.ComponentType<any>): string {
|
|
19
19
|
return 'Relay(' + getComponentName(Component) + ')';
|
|
20
20
|
}
|
|
21
21
|
|
package/ReactRelayContext.js
CHANGED
|
@@ -51,7 +51,7 @@ function createContainerWithFragments<
|
|
|
51
51
|
Component: TComponent,
|
|
52
52
|
fragments: FragmentMap,
|
|
53
53
|
): React.ComponentType<
|
|
54
|
-
$RelayProps<React
|
|
54
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayProp>,
|
|
55
55
|
> {
|
|
56
56
|
const containerName = getContainerName(Component);
|
|
57
57
|
|
|
@@ -242,12 +242,14 @@ function createContainerWithFragments<
|
|
|
242
242
|
// eslint-disable-next-line no-unused-vars
|
|
243
243
|
const {componentRef, __relayContext, __rootIsQueryRenderer, ...props} =
|
|
244
244
|
this.props;
|
|
245
|
-
return
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
245
|
+
return (
|
|
246
|
+
<Component
|
|
247
|
+
{...props}
|
|
248
|
+
{...this.state.data}
|
|
249
|
+
ref={componentRef}
|
|
250
|
+
relay={this.state.relayProp}
|
|
251
|
+
/>
|
|
252
|
+
);
|
|
251
253
|
}
|
|
252
254
|
};
|
|
253
255
|
}
|
|
@@ -273,7 +275,7 @@ function createContainer<
|
|
|
273
275
|
Component: TComponent,
|
|
274
276
|
fragmentSpec: GeneratedNodeMap,
|
|
275
277
|
): React.AbstractComponent<
|
|
276
|
-
$RelayProps<React
|
|
278
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayProp>,
|
|
277
279
|
Instance,
|
|
278
280
|
> {
|
|
279
281
|
// $FlowFixMe[incompatible-return]
|
|
@@ -40,14 +40,17 @@ const queryRendererContext: ReactRelayQueryRendererContextType = {
|
|
|
40
40
|
rootIsQueryRenderer: true,
|
|
41
41
|
};
|
|
42
42
|
|
|
43
|
-
|
|
43
|
+
hook useDeepCompare<T: {...}>(value: T): T {
|
|
44
44
|
const latestValue = React.useRef(value);
|
|
45
|
+
// $FlowFixMe[react-rule-unsafe-ref]
|
|
45
46
|
if (!areEqual(latestValue.current, value)) {
|
|
46
47
|
if (__DEV__) {
|
|
47
48
|
deepFreeze(value);
|
|
48
49
|
}
|
|
50
|
+
// $FlowFixMe[react-rule-unsafe-ref]
|
|
49
51
|
latestValue.current = value;
|
|
50
52
|
}
|
|
53
|
+
// $FlowFixMe[react-rule-unsafe-ref]
|
|
51
54
|
return latestValue.current;
|
|
52
55
|
}
|
|
53
56
|
|
|
@@ -325,7 +325,7 @@ function createContainerWithFragments<
|
|
|
325
325
|
fragments: FragmentMap,
|
|
326
326
|
connectionConfig: ConnectionConfig,
|
|
327
327
|
): React.ComponentType<
|
|
328
|
-
$RelayProps<React
|
|
328
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayPaginationProp>,
|
|
329
329
|
> {
|
|
330
330
|
const componentName = getComponentName(Component);
|
|
331
331
|
const containerName = getContainerName(Component);
|
|
@@ -595,7 +595,9 @@ function createContainerWithFragments<
|
|
|
595
595
|
PAGE_INFO,
|
|
596
596
|
connectionData,
|
|
597
597
|
);
|
|
598
|
+
// $FlowFixMe[invalid-computed-prop]
|
|
598
599
|
const edges = connectionData[EDGES];
|
|
600
|
+
// $FlowFixMe[invalid-computed-prop]
|
|
599
601
|
const pageInfo = connectionData[PAGE_INFO];
|
|
600
602
|
if (edges == null || pageInfo == null) {
|
|
601
603
|
return null;
|
|
@@ -940,7 +942,7 @@ function createContainer<Props: {...}, TComponent: React.ComponentType<Props>>(
|
|
|
940
942
|
fragmentSpec: GeneratedNodeMap,
|
|
941
943
|
connectionConfig: ConnectionConfig,
|
|
942
944
|
): React.ComponentType<
|
|
943
|
-
$RelayProps<React
|
|
945
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayPaginationProp>,
|
|
944
946
|
> {
|
|
945
947
|
// $FlowFixMe[incompatible-return]
|
|
946
948
|
return buildReactRelayContainer(
|
|
@@ -263,7 +263,7 @@ class ReactRelayQueryRenderer extends React.Component<Props, State> {
|
|
|
263
263
|
});
|
|
264
264
|
};
|
|
265
265
|
|
|
266
|
-
render(): React.
|
|
266
|
+
render(): React.MixedElement {
|
|
267
267
|
const {renderProps, relayContext} = this.state;
|
|
268
268
|
// Note that the root fragment results in `renderProps.props` is already
|
|
269
269
|
// frozen by the store; this call is to freeze the renderProps object and
|
|
@@ -378,7 +378,7 @@ function fetchQueryAndComputeStateFromProps(
|
|
|
378
378
|
requestCacheKey: ?string,
|
|
379
379
|
): Partial<State> {
|
|
380
380
|
const {environment, query, variables, cacheConfig} = props;
|
|
381
|
-
const genericEnvironment =
|
|
381
|
+
const genericEnvironment: IEnvironment = environment;
|
|
382
382
|
if (query) {
|
|
383
383
|
const request = getRequest(query);
|
|
384
384
|
const operation = createOperationDescriptor(
|
|
@@ -16,4 +16,4 @@ export type ReactRelayQueryRendererContext = {rootIsQueryRenderer: boolean};
|
|
|
16
16
|
|
|
17
17
|
module.exports = (React.createContext({
|
|
18
18
|
rootIsQueryRenderer: false,
|
|
19
|
-
}): React
|
|
19
|
+
}): React.Context<ReactRelayQueryRendererContext | null>);
|
|
@@ -75,7 +75,7 @@ function createContainerWithFragments<
|
|
|
75
75
|
fragments: FragmentMap,
|
|
76
76
|
taggedNode: GraphQLTaggedNode,
|
|
77
77
|
): React.ComponentType<
|
|
78
|
-
$RelayProps<React
|
|
78
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayRefetchProp>,
|
|
79
79
|
> {
|
|
80
80
|
const containerName = getContainerName(Component);
|
|
81
81
|
|
|
@@ -491,7 +491,7 @@ function createContainer<Props: {...}, TComponent: React.ComponentType<Props>>(
|
|
|
491
491
|
fragmentSpec: GeneratedNodeMap,
|
|
492
492
|
taggedNode: GraphQLTaggedNode,
|
|
493
493
|
): React.ComponentType<
|
|
494
|
-
$RelayProps<React
|
|
494
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayRefetchProp>,
|
|
495
495
|
> {
|
|
496
496
|
// $FlowFixMe[incompatible-return]
|
|
497
497
|
return buildReactRelayContainer(
|
package/ReactRelayTypes.js.flow
CHANGED
|
@@ -103,28 +103,55 @@ export type $FragmentRef<T> = {
|
|
|
103
103
|
*/
|
|
104
104
|
// prettier-ignore
|
|
105
105
|
// $FlowFixMe[extra-type-arg] xplat redux flow type error
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
$Diff<Props, { relay: RelayPropT | void, ... }>,
|
|
109
|
-
& (<T: { +$fragmentType: empty, ... }>( T) => T)
|
|
110
|
-
& (<T: { +$fragmentType: empty, ... }>(?T) => ?T)
|
|
111
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>( T ) => $FragmentRef<T> )
|
|
112
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>(? T ) => ? $FragmentRef<T> )
|
|
113
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>( $ReadOnlyArray< T>) => $ReadOnlyArray< $FragmentRef<T>>)
|
|
114
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>(?$ReadOnlyArray< T>) => ?$ReadOnlyArray< $FragmentRef<T>>)
|
|
115
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>( $ReadOnlyArray<?T>) => $ReadOnlyArray<?$FragmentRef<T>>)
|
|
116
|
-
& (<TFragmentType: FragmentType, T: { +$fragmentType: TFragmentType, ... }>(?$ReadOnlyArray<?T>) => ?$ReadOnlyArray<?$FragmentRef<T>>)
|
|
117
|
-
& (<T>(T) => T),
|
|
106
|
+
export type $RelayProps<Props, RelayPropT = RelayProp> = MapRelayProps<
|
|
107
|
+
$Diff<Props, {relay: RelayPropT | void, ...}>,
|
|
118
108
|
>;
|
|
119
109
|
|
|
120
|
-
|
|
121
|
-
|
|
110
|
+
type MapRelayProps<Props> = {[K in keyof Props]: MapRelayProp<Props[K]>};
|
|
111
|
+
type MapRelayProp<T> = [+t: T] extends [+t: {+$fragmentType: empty, ...}]
|
|
112
|
+
? T
|
|
113
|
+
: [+t: T] extends [+t: ?{+$fragmentType: empty, ...}]
|
|
114
|
+
? ?T
|
|
115
|
+
: [+t: T] extends [+t: {+$fragmentType: FragmentType, ...}]
|
|
116
|
+
? $FragmentRef<T>
|
|
117
|
+
: [+t: T] extends [+t: ?{+$fragmentType: FragmentType, ...}]
|
|
118
|
+
? ?$FragmentRef<$NonMaybeType<T>>
|
|
119
|
+
: [+t: T] extends [
|
|
120
|
+
+t: $ReadOnlyArray<
|
|
121
|
+
infer V extends {+$fragmentType: FragmentType, ...},
|
|
122
|
+
>,
|
|
123
|
+
]
|
|
124
|
+
? $ReadOnlyArray<$FragmentRef<V>>
|
|
125
|
+
: [+t: T] extends [
|
|
126
|
+
+t: ?$ReadOnlyArray<
|
|
127
|
+
infer V extends {+$fragmentType: FragmentType, ...},
|
|
128
|
+
>,
|
|
129
|
+
]
|
|
130
|
+
? ?$ReadOnlyArray<$FragmentRef<V>>
|
|
131
|
+
: [+t: T] extends [
|
|
132
|
+
+t: $ReadOnlyArray<?infer V extends {
|
|
133
|
+
+$fragmentType: FragmentType,
|
|
134
|
+
...
|
|
135
|
+
}>,
|
|
136
|
+
]
|
|
137
|
+
? $ReadOnlyArray<?$FragmentRef<$NonMaybeType<V>>>
|
|
138
|
+
: [+t: T] extends [
|
|
139
|
+
+t: ?$ReadOnlyArray<?infer V extends {
|
|
140
|
+
+$fragmentType: FragmentType,
|
|
141
|
+
...
|
|
142
|
+
}>,
|
|
143
|
+
]
|
|
144
|
+
? ?$ReadOnlyArray<?$FragmentRef<$NonMaybeType<V>>>
|
|
145
|
+
: T;
|
|
146
|
+
|
|
147
|
+
export type RelayFragmentContainer<TComponent> = React.ComponentType<
|
|
148
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayProp>,
|
|
122
149
|
>;
|
|
123
150
|
|
|
124
|
-
export type RelayPaginationContainer<TComponent> = React
|
|
125
|
-
$RelayProps<React
|
|
151
|
+
export type RelayPaginationContainer<TComponent> = React.ComponentType<
|
|
152
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayPaginationProp>,
|
|
126
153
|
>;
|
|
127
154
|
|
|
128
|
-
export type RelayRefetchContainer<TComponent> = React
|
|
129
|
-
$RelayProps<React
|
|
155
|
+
export type RelayRefetchContainer<TComponent> = React.ComponentType<
|
|
156
|
+
$RelayProps<React.ElementConfig<TComponent>, RelayRefetchProp>,
|
|
130
157
|
>;
|
|
@@ -50,7 +50,7 @@ class BarComponent extends React.Component<{
|
|
|
50
50
|
getNum(): number {
|
|
51
51
|
return 42;
|
|
52
52
|
}
|
|
53
|
-
render(): React.
|
|
53
|
+
render(): React.MixedElement {
|
|
54
54
|
const reqLen = this.props.requiredProp.length;
|
|
55
55
|
const optionalProp = this.props.optionalProp;
|
|
56
56
|
|
|
@@ -137,7 +137,7 @@ module.exports = {
|
|
|
137
137
|
/** $FlowExpectedError: Bar `getNum` gives number, but `getString` assumes string **/
|
|
138
138
|
return bad ? 'not good' : ok;
|
|
139
139
|
}
|
|
140
|
-
render(): React.
|
|
140
|
+
render(): React.MixedElement {
|
|
141
141
|
return (
|
|
142
142
|
<Bar
|
|
143
143
|
componentRef={(ref: empty) => {
|
|
@@ -28,15 +28,15 @@ const {getFragment} = require('relay-runtime');
|
|
|
28
28
|
const {useContext} = React;
|
|
29
29
|
|
|
30
30
|
type ContainerCreator = (
|
|
31
|
-
Component: React
|
|
31
|
+
Component: React.ComponentType<any>,
|
|
32
32
|
fragments: FragmentMap,
|
|
33
|
-
) => React
|
|
33
|
+
) => React.ComponentType<any>;
|
|
34
34
|
|
|
35
35
|
/**
|
|
36
36
|
* Helper to create the Relay HOCs with ref forwarding, setting the displayName
|
|
37
37
|
* and reading the React context.
|
|
38
38
|
*/
|
|
39
|
-
function buildReactRelayContainer<TBase: React
|
|
39
|
+
function buildReactRelayContainer<TBase: React.ComponentType<any>>(
|
|
40
40
|
ComponentClass: TBase,
|
|
41
41
|
fragmentSpec: GeneratedNodeMap,
|
|
42
42
|
createContainerWithFragments: ContainerCreator,
|
|
@@ -52,12 +52,13 @@ function buildReactRelayContainer<TBase: React$ComponentType<any>>(
|
|
|
52
52
|
const Container = createContainerWithFragments(ComponentClass, fragments);
|
|
53
53
|
Container.displayName = containerName;
|
|
54
54
|
|
|
55
|
-
function
|
|
55
|
+
function ForwardRef(
|
|
56
56
|
props: any,
|
|
57
57
|
ref:
|
|
58
|
-
| ((null | React
|
|
59
|
-
| {-current: null | React
|
|
58
|
+
| ((null | React.ElementRef<TBase>) => mixed)
|
|
59
|
+
| {-current: null | React.ElementRef<TBase>, ...},
|
|
60
60
|
) {
|
|
61
|
+
// $FlowFixMe[react-rule-hook]
|
|
61
62
|
const context = useContext(ReactRelayContext);
|
|
62
63
|
invariant(
|
|
63
64
|
context != null,
|
|
@@ -66,6 +67,7 @@ function buildReactRelayContainer<TBase: React$ComponentType<any>>(
|
|
|
66
67
|
containerName,
|
|
67
68
|
containerName,
|
|
68
69
|
);
|
|
70
|
+
// $FlowFixMe[react-rule-hook]
|
|
69
71
|
const queryRendererContext = useContext(ReactRelayQueryRendererContext);
|
|
70
72
|
|
|
71
73
|
return (
|
|
@@ -79,8 +81,8 @@ function buildReactRelayContainer<TBase: React$ComponentType<any>>(
|
|
|
79
81
|
/>
|
|
80
82
|
);
|
|
81
83
|
}
|
|
82
|
-
|
|
83
|
-
const ForwardContainer = React.forwardRef(
|
|
84
|
+
ForwardRef.displayName = containerName;
|
|
85
|
+
const ForwardContainer = React.forwardRef(ForwardRef);
|
|
84
86
|
|
|
85
87
|
if (__DEV__) {
|
|
86
88
|
// Used by RelayModernTestUtils
|
|
@@ -25,6 +25,7 @@ function getRootVariablesForFragments<TProps: {...}>(
|
|
|
25
25
|
// should all point to the same owner
|
|
26
26
|
Object.keys(fragments).forEach(key => {
|
|
27
27
|
const fragmentNode = fragments[key];
|
|
28
|
+
// $FlowFixMe[invalid-computed-prop]
|
|
28
29
|
const fragmentRef = props[key];
|
|
29
30
|
const selector = getSelector(fragmentNode, fragmentRef);
|
|
30
31
|
const fragmentOwnerVariables =
|
package/hooks.js
CHANGED
package/index.js
CHANGED
package/legacy.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
|
-
var
|
|
4
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
5
5
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
6
6
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
7
7
|
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
|
|
@@ -141,7 +141,7 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
141
141
|
__relayContext = _this$props.__relayContext,
|
|
142
142
|
__rootIsQueryRenderer = _this$props.__rootIsQueryRenderer,
|
|
143
143
|
props = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, _excluded);
|
|
144
|
-
return React.createElement(Component, (0,
|
|
144
|
+
return /*#__PURE__*/React.createElement(Component, (0, _extends2["default"])({}, props, this.state.data, {
|
|
145
145
|
ref: componentRef,
|
|
146
146
|
relay: this.state.relayProp
|
|
147
147
|
}));
|
|
@@ -22,7 +22,7 @@ function buildReactRelayContainer(ComponentClass, fragmentSpec, createContainerW
|
|
|
22
22
|
}
|
|
23
23
|
var Container = createContainerWithFragments(ComponentClass, fragments);
|
|
24
24
|
Container.displayName = containerName;
|
|
25
|
-
function
|
|
25
|
+
function ForwardRef(props, ref) {
|
|
26
26
|
var _queryRendererContext;
|
|
27
27
|
var context = useContext(ReactRelayContext);
|
|
28
28
|
!(context != null) ? process.env.NODE_ENV !== "production" ? invariant(false, '`%s` tried to render a context that was not valid this means that ' + '`%s` was rendered outside of a query renderer.', containerName, containerName) : invariant(false) : void 0;
|
|
@@ -33,8 +33,8 @@ function buildReactRelayContainer(ComponentClass, fragmentSpec, createContainerW
|
|
|
33
33
|
componentRef: props.componentRef || ref
|
|
34
34
|
}));
|
|
35
35
|
}
|
|
36
|
-
|
|
37
|
-
var ForwardContainer = React.forwardRef(
|
|
36
|
+
ForwardRef.displayName = containerName;
|
|
37
|
+
var ForwardContainer = React.forwardRef(ForwardRef);
|
|
38
38
|
if (process.env.NODE_ENV !== "production") {
|
|
39
39
|
ForwardContainer.__ComponentClass = ComponentClass;
|
|
40
40
|
ForwardContainer.displayName = containerName;
|
|
@@ -131,9 +131,7 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
131
131
|
function FragmentResourceImpl(environment) {
|
|
132
132
|
this._environment = environment;
|
|
133
133
|
this._cache = LRUCache.create(CACHE_CAPACITY);
|
|
134
|
-
|
|
135
|
-
this._clientEdgeQueryResultsCache = new ClientEdgeQueryResultsCache(environment);
|
|
136
|
-
}
|
|
134
|
+
this._clientEdgeQueryResultsCache = new ClientEdgeQueryResultsCache(environment);
|
|
137
135
|
}
|
|
138
136
|
var _proto2 = FragmentResourceImpl.prototype;
|
|
139
137
|
_proto2.read = function read(fragmentNode, fragmentRef, componentDisplayName, fragmentKey) {
|
|
@@ -216,7 +214,7 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
216
214
|
return fragmentResult;
|
|
217
215
|
}
|
|
218
216
|
var clientEdgeRequests = null;
|
|
219
|
-
if (
|
|
217
|
+
if (((_fragmentNode$metadat2 = fragmentNode.metadata) === null || _fragmentNode$metadat2 === void 0 ? void 0 : _fragmentNode$metadat2.hasClientEdges) === true && hasMissingClientEdges(snapshot)) {
|
|
220
218
|
clientEdgeRequests = [];
|
|
221
219
|
var queryResource = getQueryResourceForEnvironment(this._environment);
|
|
222
220
|
var queryResults = [];
|
|
@@ -237,7 +235,7 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
237
235
|
this._clientEdgeQueryResultsCache.recordQueryResults(fragmentIdentifier, queryResults);
|
|
238
236
|
}
|
|
239
237
|
var clientEdgePromises = [];
|
|
240
|
-
if (
|
|
238
|
+
if (clientEdgeRequests) {
|
|
241
239
|
clientEdgePromises = clientEdgeRequests.map(function (request) {
|
|
242
240
|
return getPromiseForActiveRequest(_this3._environment, request);
|
|
243
241
|
}).filter(Boolean);
|
|
@@ -311,10 +309,12 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
311
309
|
var _this4 = this;
|
|
312
310
|
if (Array.isArray(snapshot)) {
|
|
313
311
|
snapshot.forEach(function (s) {
|
|
314
|
-
|
|
312
|
+
var _s$selector$node$meta, _s$selector$node$meta2;
|
|
313
|
+
handlePotentialSnapshotErrors(_this4._environment, s.missingRequiredFields, s.relayResolverErrors, s.errorResponseFields, (_s$selector$node$meta = (_s$selector$node$meta2 = s.selector.node.metadata) === null || _s$selector$node$meta2 === void 0 ? void 0 : _s$selector$node$meta2.throwOnFieldError) !== null && _s$selector$node$meta !== void 0 ? _s$selector$node$meta : false);
|
|
315
314
|
});
|
|
316
315
|
} else {
|
|
317
|
-
|
|
316
|
+
var _snapshot$selector$no, _snapshot$selector$no2;
|
|
317
|
+
handlePotentialSnapshotErrors(this._environment, snapshot.missingRequiredFields, snapshot.relayResolverErrors, snapshot.errorResponseFields, (_snapshot$selector$no = (_snapshot$selector$no2 = snapshot.selector.node.metadata) === null || _snapshot$selector$no2 === void 0 ? void 0 : _snapshot$selector$no2.throwOnFieldError) !== null && _snapshot$selector$no !== void 0 ? _snapshot$selector$no : false);
|
|
318
318
|
}
|
|
319
319
|
};
|
|
320
320
|
_proto2.readSpec = function readSpec(fragmentNodes, fragmentRefs, componentDisplayName) {
|
|
@@ -326,6 +326,7 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
326
326
|
};
|
|
327
327
|
_proto2.subscribe = function subscribe(fragmentResult, callback) {
|
|
328
328
|
var _this5 = this;
|
|
329
|
+
var _this$_clientEdgeQuer, _this$_clientEdgeQuer2;
|
|
329
330
|
var environment = this._environment;
|
|
330
331
|
var cacheKey = fragmentResult.cacheKey;
|
|
331
332
|
var renderedSnapshot = fragmentResult.snapshot;
|
|
@@ -370,15 +371,12 @@ var FragmentResourceImpl = /*#__PURE__*/function () {
|
|
|
370
371
|
callback();
|
|
371
372
|
}));
|
|
372
373
|
}
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
var
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
disposables.push(queryResource.retain(queryResult));
|
|
380
|
-
});
|
|
381
|
-
}
|
|
374
|
+
var clientEdgeQueryResults = (_this$_clientEdgeQuer = (_this$_clientEdgeQuer2 = this._clientEdgeQueryResultsCache) === null || _this$_clientEdgeQuer2 === void 0 ? void 0 : _this$_clientEdgeQuer2.get(cacheKey)) !== null && _this$_clientEdgeQuer !== void 0 ? _this$_clientEdgeQuer : undefined;
|
|
375
|
+
if (clientEdgeQueryResults !== null && clientEdgeQueryResults !== void 0 && clientEdgeQueryResults.length) {
|
|
376
|
+
var queryResource = getQueryResourceForEnvironment(this._environment);
|
|
377
|
+
clientEdgeQueryResults.forEach(function (queryResult) {
|
|
378
|
+
disposables.push(queryResource.retain(queryResult));
|
|
379
|
+
});
|
|
382
380
|
}
|
|
383
381
|
return {
|
|
384
382
|
dispose: function dispose() {
|
|
@@ -16,11 +16,14 @@ function loadEntryPoint(environmentProvider, entryPoint, entryPointParams) {
|
|
|
16
16
|
if (queries != null) {
|
|
17
17
|
var queriesPropNames = Object.keys(queries);
|
|
18
18
|
queriesPropNames.forEach(function (queryPropName) {
|
|
19
|
-
var
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
var query = queries[queryPropName];
|
|
20
|
+
if (query == null) {
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
var environmentProviderOptions = query.environmentProviderOptions,
|
|
24
|
+
options = query.options,
|
|
25
|
+
parameters = query.parameters,
|
|
26
|
+
variables = query.variables;
|
|
24
27
|
var environment = environmentProvider.getEnvironment(environmentProviderOptions);
|
|
25
28
|
preloadedQueries[queryPropName] = loadQuery(environment, parameters, variables, {
|
|
26
29
|
fetchPolicy: options === null || options === void 0 ? void 0 : options.fetchPolicy,
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
4
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
5
5
|
var invariant = require('invariant');
|
|
6
|
-
var React = require('react');
|
|
7
6
|
var _require = require('relay-runtime'),
|
|
8
7
|
fetchQueryDeduped = _require.__internal.fetchQueryDeduped,
|
|
9
8
|
Observable = _require.Observable,
|
|
@@ -13,19 +12,9 @@ var _require = require('relay-runtime'),
|
|
|
13
12
|
createOperationDescriptor = _require.createOperationDescriptor,
|
|
14
13
|
getRequest = _require.getRequest,
|
|
15
14
|
getRequestIdentifier = _require.getRequestIdentifier;
|
|
16
|
-
var warning = require("fbjs/lib/warning");
|
|
17
|
-
var RenderDispatcher = null;
|
|
18
15
|
var fetchKey = 100001;
|
|
19
|
-
function useTrackLoadQueryInRender() {
|
|
20
|
-
if (RenderDispatcher === null) {
|
|
21
|
-
var _React$__SECRET_INTER, _React$__SECRET_INTER2;
|
|
22
|
-
RenderDispatcher = (_React$__SECRET_INTER = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === null || _React$__SECRET_INTER === void 0 ? void 0 : (_React$__SECRET_INTER2 = _React$__SECRET_INTER.ReactCurrentDispatcher) === null || _React$__SECRET_INTER2 === void 0 ? void 0 : _React$__SECRET_INTER2.current;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
16
|
function loadQuery(environment, preloadableRequest, variables, options, environmentProviderOptions) {
|
|
26
|
-
var
|
|
27
|
-
var CurrentDispatcher = (_React$__SECRET_INTER3 = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === null || _React$__SECRET_INTER3 === void 0 ? void 0 : (_React$__SECRET_INTER4 = _React$__SECRET_INTER3.ReactCurrentDispatcher) === null || _React$__SECRET_INTER4 === void 0 ? void 0 : _React$__SECRET_INTER4.current;
|
|
28
|
-
process.env.NODE_ENV !== "production" ? warning(RenderDispatcher == null || CurrentDispatcher !== RenderDispatcher, 'Relay: `%s` should not be called inside a React render function.', (_options$__nameForWar = options === null || options === void 0 ? void 0 : options.__nameForWarning) !== null && _options$__nameForWar !== void 0 ? _options$__nameForWar : 'loadQuery') : void 0;
|
|
17
|
+
var _options$fetchPolicy;
|
|
29
18
|
fetchKey++;
|
|
30
19
|
var fetchPolicy = (_options$fetchPolicy = options === null || options === void 0 ? void 0 : options.fetchPolicy) !== null && _options$fetchPolicy !== void 0 ? _options$fetchPolicy : 'store-or-network';
|
|
31
20
|
var networkCacheConfig = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, options === null || options === void 0 ? void 0 : options.networkCacheConfig), {}, {
|
|
@@ -201,6 +190,5 @@ function loadQuery(environment, preloadableRequest, variables, options, environm
|
|
|
201
190
|
};
|
|
202
191
|
}
|
|
203
192
|
module.exports = {
|
|
204
|
-
loadQuery: loadQuery
|
|
205
|
-
useTrackLoadQueryInRender: useTrackLoadQueryInRender
|
|
193
|
+
loadQuery: loadQuery
|
|
206
194
|
};
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
4
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
5
5
|
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
|
|
6
|
-
var _require = require('
|
|
6
|
+
var _require = require('./QueryResource'),
|
|
7
7
|
getQueryResourceForEnvironment = _require.getQueryResourceForEnvironment;
|
|
8
8
|
var invariant = require('invariant');
|
|
9
9
|
var _require2 = require('relay-runtime'),
|
|
@@ -66,14 +66,16 @@ function getMissingClientEdges(state) {
|
|
|
66
66
|
}
|
|
67
67
|
function handlePotentialSnapshotErrorsForState(environment, state) {
|
|
68
68
|
if (state.kind === 'singular') {
|
|
69
|
-
|
|
69
|
+
var _state$snapshot$selec, _state$snapshot$selec2;
|
|
70
|
+
handlePotentialSnapshotErrors(environment, state.snapshot.missingRequiredFields, state.snapshot.relayResolverErrors, state.snapshot.errorResponseFields, (_state$snapshot$selec = (_state$snapshot$selec2 = state.snapshot.selector.node.metadata) === null || _state$snapshot$selec2 === void 0 ? void 0 : _state$snapshot$selec2.throwOnFieldError) !== null && _state$snapshot$selec !== void 0 ? _state$snapshot$selec : false);
|
|
70
71
|
} else if (state.kind === 'plural') {
|
|
71
72
|
var _iterator3 = (0, _createForOfIteratorHelper2["default"])(state.snapshots),
|
|
72
73
|
_step3;
|
|
73
74
|
try {
|
|
74
75
|
for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
|
|
76
|
+
var _snapshot$selector$no, _snapshot$selector$no2;
|
|
75
77
|
var snapshot = _step3.value;
|
|
76
|
-
handlePotentialSnapshotErrors(environment, snapshot.missingRequiredFields, snapshot.relayResolverErrors, snapshot.errorResponseFields);
|
|
78
|
+
handlePotentialSnapshotErrors(environment, snapshot.missingRequiredFields, snapshot.relayResolverErrors, snapshot.errorResponseFields, (_snapshot$selector$no = (_snapshot$selector$no2 = snapshot.selector.node.metadata) === null || _snapshot$selector$no2 === void 0 ? void 0 : _snapshot$selector$no2.throwOnFieldError) !== null && _snapshot$selector$no !== void 0 ? _snapshot$selector$no : false);
|
|
77
79
|
}
|
|
78
80
|
} catch (err) {
|
|
79
81
|
_iterator3.e(err);
|
|
@@ -118,7 +120,7 @@ function getFragmentState(environment, fragmentSelector) {
|
|
|
118
120
|
};
|
|
119
121
|
}
|
|
120
122
|
}
|
|
121
|
-
function
|
|
123
|
+
function readFragmentInternal(environment, fragmentNode, fragmentRef, hookDisplayName, queryOptions, fragmentKey) {
|
|
122
124
|
var _fragmentNode$metadat, _fragmentNode$metadat2;
|
|
123
125
|
var fragmentSelector = getSelector(fragmentNode, fragmentRef);
|
|
124
126
|
var isPlural = (fragmentNode === null || fragmentNode === void 0 ? void 0 : (_fragmentNode$metadat = fragmentNode.metadata) === null || _fragmentNode$metadat === void 0 ? void 0 : _fragmentNode$metadat.plural) === true;
|
|
@@ -179,4 +181,4 @@ function readFragmentInternal_EXPERIMENTAL(environment, fragmentNode, fragmentRe
|
|
|
179
181
|
clientEdgeQueries: clientEdgeQueries
|
|
180
182
|
};
|
|
181
183
|
}
|
|
182
|
-
module.exports =
|
|
184
|
+
module.exports = readFragmentInternal;
|
|
@@ -3,20 +3,17 @@
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
4
4
|
var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
|
|
5
5
|
var loadEntryPoint = require('./loadEntryPoint');
|
|
6
|
-
var _require = require('./loadQuery'),
|
|
7
|
-
useTrackLoadQueryInRender = _require.useTrackLoadQueryInRender;
|
|
8
6
|
var useIsMountedRef = require('./useIsMountedRef');
|
|
9
|
-
var
|
|
10
|
-
useCallback =
|
|
11
|
-
useEffect =
|
|
12
|
-
useRef =
|
|
13
|
-
useState =
|
|
7
|
+
var _require = require('react'),
|
|
8
|
+
useCallback = _require.useCallback,
|
|
9
|
+
useEffect = _require.useEffect,
|
|
10
|
+
useRef = _require.useRef,
|
|
11
|
+
useState = _require.useState;
|
|
14
12
|
var initialNullEntryPointReferenceState = {
|
|
15
13
|
kind: 'NullEntryPointReference'
|
|
16
14
|
};
|
|
17
15
|
function useLoadEntryPoint(environmentProvider, entryPoint, options) {
|
|
18
16
|
var _options$TEST_ONLY__i, _options$TEST_ONLY__i2, _options$TEST_ONLY__i3, _options$TEST_ONLY__i4;
|
|
19
|
-
useTrackLoadQueryInRender();
|
|
20
17
|
var initialEntryPointReferenceInternal = (_options$TEST_ONLY__i = options === null || options === void 0 ? void 0 : (_options$TEST_ONLY__i2 = options.TEST_ONLY__initialEntryPointData) === null || _options$TEST_ONLY__i2 === void 0 ? void 0 : _options$TEST_ONLY__i2.entryPointReference) !== null && _options$TEST_ONLY__i !== void 0 ? _options$TEST_ONLY__i : initialNullEntryPointReferenceState;
|
|
21
18
|
var initialEntryPointParamsInternal = (_options$TEST_ONLY__i3 = options === null || options === void 0 ? void 0 : (_options$TEST_ONLY__i4 = options.TEST_ONLY__initialEntryPointData) === null || _options$TEST_ONLY__i4 === void 0 ? void 0 : _options$TEST_ONLY__i4.entryPointParams) !== null && _options$TEST_ONLY__i3 !== void 0 ? _options$TEST_ONLY__i3 : null;
|
|
22
19
|
var isMountedRef = useIsMountedRef();
|
|
@@ -1,20 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
var useFragmentNode = require('./legacy/useFragmentNode');
|
|
5
|
-
var _require = require('./loadQuery'),
|
|
6
|
-
useTrackLoadQueryInRender = _require.useTrackLoadQueryInRender;
|
|
3
|
+
var useFragmentInternal = require('./useFragmentInternal');
|
|
7
4
|
var useStaticFragmentNodeWarning = require('./useStaticFragmentNodeWarning');
|
|
8
|
-
var
|
|
9
|
-
useDebugValue =
|
|
10
|
-
var
|
|
11
|
-
getFragment =
|
|
12
|
-
function
|
|
13
|
-
useTrackLoadQueryInRender();
|
|
5
|
+
var _require = require('react'),
|
|
6
|
+
useDebugValue = _require.useDebugValue;
|
|
7
|
+
var _require2 = require('relay-runtime'),
|
|
8
|
+
getFragment = _require2.getFragment;
|
|
9
|
+
function useFragment(fragment, key) {
|
|
14
10
|
var fragmentNode = getFragment(fragment);
|
|
15
11
|
useStaticFragmentNodeWarning(fragmentNode, 'first argument of useFragment()');
|
|
16
|
-
var
|
|
17
|
-
data = _useFragmentNode.data;
|
|
12
|
+
var data = useFragmentInternal(fragmentNode, key, 'useFragment()');
|
|
18
13
|
if (process.env.NODE_ENV !== "production") {
|
|
19
14
|
useDebugValue({
|
|
20
15
|
fragment: fragmentNode.name,
|
|
@@ -23,12 +18,4 @@ function useFragment_LEGACY(fragment, key) {
|
|
|
23
18
|
}
|
|
24
19
|
return data;
|
|
25
20
|
}
|
|
26
|
-
function useFragment(fragment, key) {
|
|
27
|
-
var impl = HooksImplementation.get();
|
|
28
|
-
if (impl) {
|
|
29
|
-
return impl.useFragment(fragment, key);
|
|
30
|
-
} else {
|
|
31
|
-
return useFragment_LEGACY(fragment, key);
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
21
|
module.exports = useFragment;
|