react-relay 0.0.0-main-7c06b6c6 → 0.0.0-main-fa48540f
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/ReactRelayContext.js +1 -1
- package/hooks.js +1 -1
- package/index.js +1 -1
- package/legacy.js +1 -1
- package/lib/ReactRelayContainerUtils.js +1 -2
- package/lib/ReactRelayContext.js +2 -3
- package/lib/ReactRelayFragmentContainer.js +37 -68
- package/lib/ReactRelayFragmentMockRenderer.js +1 -3
- package/lib/ReactRelayLocalQueryRenderer.js +17 -30
- package/lib/ReactRelayPaginationContainer.js +63 -161
- package/lib/ReactRelayQueryFetcher.js +26 -70
- package/lib/ReactRelayQueryRenderer.js +36 -90
- package/lib/ReactRelayQueryRendererContext.js +1 -1
- package/lib/ReactRelayRefetchContainer.js +49 -100
- package/lib/ReactRelayTestMocker.js +31 -66
- package/lib/ReactRelayTypes.js +1 -0
- package/lib/RelayContext.js +3 -6
- package/lib/assertFragmentMap.js +2 -4
- package/lib/buildReactRelayContainer.js +6 -22
- package/lib/getRootVariablesForFragments.js +4 -8
- package/lib/hooks.js +2 -18
- package/lib/index.js +2 -25
- package/lib/isRelayEnvironment.js +4 -3
- package/lib/jest-react/enqueueTask.js +4 -8
- package/lib/jest-react/index.js +0 -1
- package/lib/jest-react/internalAct.js +8 -19
- package/lib/legacy.js +1 -7
- package/lib/multi-actor/ActorChange.js +1 -4
- package/lib/multi-actor/index.js +1 -0
- package/lib/multi-actor/useRelayActorEnvironment.js +2 -5
- package/lib/relay-hooks/EntryPointContainer.react.js +8 -13
- package/lib/relay-hooks/EntryPointTypes.flow.js +2 -0
- package/lib/relay-hooks/FragmentResource.js +88 -194
- package/lib/relay-hooks/HooksImplementation.js +1 -4
- package/lib/relay-hooks/InternalLogger.js +1 -1
- package/lib/relay-hooks/LRUCache.js +1 -18
- package/lib/relay-hooks/LazyLoadEntryPointContainer_DEPRECATED.react.js +32 -52
- package/lib/relay-hooks/MatchContainer.js +13 -21
- package/lib/relay-hooks/ProfilerContext.js +2 -1
- package/lib/relay-hooks/QueryResource.js +26 -96
- package/lib/relay-hooks/RelayEnvironmentProvider.js +3 -6
- package/lib/relay-hooks/SuspenseResource.js +7 -30
- package/lib/relay-hooks/loadEntryPoint.js +16 -30
- package/lib/relay-hooks/loadQuery.js +40 -76
- package/lib/relay-hooks/preloadQuery_DEPRECATED.js +9 -33
- package/lib/relay-hooks/prepareEntryPoint_DEPRECATED.js +7 -13
- package/lib/relay-hooks/react-cache/RelayReactCache.js +6 -10
- package/lib/relay-hooks/react-cache/getQueryResultOrFetchQuery_REACT_CACHE.js +23 -77
- package/lib/relay-hooks/react-cache/readFragmentInternal_REACT_CACHE.js +22 -55
- package/lib/relay-hooks/react-cache/useFragmentInternal_REACT_CACHE.js +64 -142
- package/lib/relay-hooks/react-cache/useFragment_REACT_CACHE.js +4 -13
- package/lib/relay-hooks/react-cache/useLazyLoadQuery_REACT_CACHE.js +16 -22
- package/lib/relay-hooks/react-cache/usePaginationFragment_REACT_CACHE.js +57 -79
- package/lib/relay-hooks/react-cache/usePreloadedQuery_REACT_CACHE.js +24 -37
- package/lib/relay-hooks/react-cache/useRefetchableFragmentInternal_REACT_CACHE.js +59 -101
- package/lib/relay-hooks/react-cache/useRefetchableFragment_REACT_CACHE.js +5 -13
- package/lib/relay-hooks/useBlockingPaginationFragment.js +69 -91
- package/lib/relay-hooks/useClientQuery.js +2 -5
- package/lib/relay-hooks/useEntryPointLoader.js +16 -35
- package/lib/relay-hooks/useFetchTrackingRef.js +6 -8
- package/lib/relay-hooks/useFragment.js +7 -17
- package/lib/relay-hooks/useFragmentNode.js +16 -28
- package/lib/relay-hooks/useIsMountedRef.js +3 -4
- package/lib/relay-hooks/useIsOperationNodeActive.js +7 -19
- package/lib/relay-hooks/useIsParentQueryActive.js +2 -5
- package/lib/relay-hooks/useLazyLoadQuery.js +5 -8
- package/lib/relay-hooks/useLazyLoadQueryNode.js +22 -32
- package/lib/relay-hooks/useLoadMoreFunction.js +44 -75
- package/lib/relay-hooks/useMemoOperationDescriptor.js +3 -7
- package/lib/relay-hooks/useMemoVariables.js +5 -8
- package/lib/relay-hooks/useMutation.js +7 -24
- package/lib/relay-hooks/usePaginationFragment.js +56 -76
- package/lib/relay-hooks/usePreloadedQuery.js +12 -24
- package/lib/relay-hooks/useQueryLoader.js +22 -46
- package/lib/relay-hooks/useRefetchableFragment.js +5 -16
- package/lib/relay-hooks/useRefetchableFragmentNode.js +63 -106
- package/lib/relay-hooks/useRelayEnvironment.js +2 -5
- package/lib/relay-hooks/useStaticFragmentNodeWarning.js +1 -3
- package/lib/relay-hooks/useSubscribeToInvalidationState.js +7 -7
- package/lib/relay-hooks/useSubscription.js +5 -9
- package/lib/relay-hooks/useUnsafeRef_DEPRECATED.js +3 -4
- 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 +1 -1
- package/react-relay-legacy.min.js +1 -1
- package/react-relay.js +2 -2
- package/react-relay.min.js +2 -2
- package/relay-hooks/FragmentResource.js.flow +14 -0
package/ReactRelayContext.js
CHANGED
package/hooks.js
CHANGED
package/index.js
CHANGED
package/legacy.js
CHANGED
|
@@ -8,16 +8,15 @@
|
|
|
8
8
|
* @format
|
|
9
9
|
* @oncall relay
|
|
10
10
|
*/
|
|
11
|
+
|
|
11
12
|
'use strict';
|
|
12
13
|
|
|
13
14
|
function getComponentName(component) {
|
|
14
15
|
return component.displayName || component.name || 'Component';
|
|
15
16
|
}
|
|
16
|
-
|
|
17
17
|
function getContainerName(Component) {
|
|
18
18
|
return 'Relay(' + getComponentName(Component) + ')';
|
|
19
19
|
}
|
|
20
|
-
|
|
21
20
|
module.exports = {
|
|
22
21
|
getComponentName: getComponentName,
|
|
23
22
|
getContainerName: getContainerName
|
package/lib/ReactRelayContext.js
CHANGED
|
@@ -8,11 +8,10 @@
|
|
|
8
8
|
* @format
|
|
9
9
|
* @oncall relay
|
|
10
10
|
*/
|
|
11
|
+
|
|
11
12
|
'use strict';
|
|
12
13
|
|
|
13
14
|
var React = require('react');
|
|
14
|
-
|
|
15
15
|
var _require = require('relay-runtime'),
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
createRelayContext = _require.__internal.createRelayContext;
|
|
18
17
|
module.exports = createRelayContext(React);
|
|
@@ -8,39 +8,27 @@
|
|
|
8
8
|
* @format
|
|
9
9
|
* @oncall relay
|
|
10
10
|
*/
|
|
11
|
+
|
|
11
12
|
'use strict';
|
|
12
13
|
|
|
13
14
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
|
|
14
|
-
|
|
15
15
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
16
|
-
|
|
17
16
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
18
|
-
|
|
19
17
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
20
|
-
|
|
21
18
|
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
|
|
22
|
-
|
|
23
19
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
24
|
-
|
|
25
20
|
var _excluded = ["componentRef", "__relayContext", "__rootIsQueryRenderer"];
|
|
26
|
-
|
|
27
21
|
var buildReactRelayContainer = require('./buildReactRelayContainer');
|
|
28
|
-
|
|
29
22
|
var _require = require('./ReactRelayContainerUtils'),
|
|
30
|
-
|
|
31
|
-
|
|
23
|
+
getContainerName = _require.getContainerName;
|
|
32
24
|
var _require2 = require('./RelayContext'),
|
|
33
|
-
|
|
34
|
-
|
|
25
|
+
assertRelayContext = _require2.assertRelayContext;
|
|
35
26
|
var areEqual = require("fbjs/lib/areEqual");
|
|
36
|
-
|
|
37
27
|
var React = require('react');
|
|
38
|
-
|
|
39
28
|
var _require3 = require('relay-runtime'),
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
29
|
+
createFragmentSpecResolver = _require3.createFragmentSpecResolver,
|
|
30
|
+
getDataIDsFromObject = _require3.getDataIDsFromObject,
|
|
31
|
+
isScalarAndEqual = _require3.isScalarAndEqual;
|
|
44
32
|
/**
|
|
45
33
|
* Composes a React component class, returning a new class that intercepts
|
|
46
34
|
* props, resolving them with the provided fragments and subscribing for
|
|
@@ -48,21 +36,19 @@ var _require3 = require('relay-runtime'),
|
|
|
48
36
|
*/
|
|
49
37
|
function createContainerWithFragments(Component, fragments) {
|
|
50
38
|
var _class;
|
|
51
|
-
|
|
52
39
|
var containerName = getContainerName(Component);
|
|
53
40
|
return _class = /*#__PURE__*/function (_React$Component) {
|
|
54
41
|
(0, _inheritsLoose2["default"])(_class, _React$Component);
|
|
55
|
-
|
|
56
42
|
// $FlowFixMe[missing-local-annot]
|
|
43
|
+
|
|
57
44
|
function _class(props) {
|
|
58
45
|
var _props$__rootIsQueryR, _this;
|
|
59
|
-
|
|
60
46
|
_this = _React$Component.call(this, props) || this;
|
|
61
47
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "_handleFragmentDataUpdate", function () {
|
|
62
48
|
var resolverFromThisUpdate = _this.state.resolver;
|
|
63
|
-
|
|
64
49
|
_this.setState(function (updatedState) {
|
|
65
|
-
return (
|
|
50
|
+
return (
|
|
51
|
+
// If this event belongs to the current data source, update.
|
|
66
52
|
// Otherwise we should ignore it.
|
|
67
53
|
resolverFromThisUpdate === updatedState.resolver ? {
|
|
68
54
|
data: updatedState.resolver.resolve(),
|
|
@@ -72,11 +58,11 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
72
58
|
});
|
|
73
59
|
});
|
|
74
60
|
var relayContext = assertRelayContext(props.__relayContext);
|
|
75
|
-
var rootIsQueryRenderer = (_props$__rootIsQueryR = props.__rootIsQueryRenderer) !== null && _props$__rootIsQueryR !== void 0 ? _props$__rootIsQueryR : false;
|
|
61
|
+
var rootIsQueryRenderer = (_props$__rootIsQueryR = props.__rootIsQueryRenderer) !== null && _props$__rootIsQueryR !== void 0 ? _props$__rootIsQueryR : false;
|
|
62
|
+
// Do not provide a subscription/callback here.
|
|
76
63
|
// It is possible for this render to be interrupted or aborted,
|
|
77
64
|
// In which case the subscription would cause a leak.
|
|
78
65
|
// We will add the subscription in componentDidMount().
|
|
79
|
-
|
|
80
66
|
var resolver = createFragmentSpecResolver(relayContext, containerName, fragments, props, rootIsQueryRenderer);
|
|
81
67
|
_this.state = {
|
|
82
68
|
data: resolver.resolve(),
|
|
@@ -87,16 +73,14 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
87
73
|
};
|
|
88
74
|
return _this;
|
|
89
75
|
}
|
|
76
|
+
|
|
90
77
|
/**
|
|
91
78
|
* When new props are received, read data for the new props and subscribe
|
|
92
79
|
* for updates. Props may be the same in which case previous data and
|
|
93
80
|
* subscriptions can be reused.
|
|
94
81
|
*/
|
|
95
|
-
|
|
96
|
-
|
|
97
82
|
_class.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
|
|
98
83
|
var _nextProps$__rootIsQu;
|
|
99
|
-
|
|
100
84
|
// Any props change could impact the query, so we mirror props in state.
|
|
101
85
|
// This is an unusual pattern, but necessary for this container usecase.
|
|
102
86
|
var prevProps = prevState.prevProps;
|
|
@@ -104,12 +88,13 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
104
88
|
var rootIsQueryRenderer = (_nextProps$__rootIsQu = nextProps.__rootIsQueryRenderer) !== null && _nextProps$__rootIsQu !== void 0 ? _nextProps$__rootIsQu : false;
|
|
105
89
|
var prevIDs = getDataIDsFromObject(fragments, prevProps);
|
|
106
90
|
var nextIDs = getDataIDsFromObject(fragments, nextProps);
|
|
107
|
-
var resolver = prevState.resolver;
|
|
91
|
+
var resolver = prevState.resolver;
|
|
92
|
+
|
|
93
|
+
// If the environment has changed or props point to new records then
|
|
108
94
|
// previously fetched data and any pending fetches no longer apply:
|
|
109
95
|
// - Existing references are on the old environment.
|
|
110
96
|
// - Existing references are based on old variables.
|
|
111
97
|
// - Pending fetches are for the previous records.
|
|
112
|
-
|
|
113
98
|
if (prevState.prevPropsContext.environment !== relayContext.environment || !areEqual(prevIDs, nextIDs)) {
|
|
114
99
|
// Do not provide a subscription/callback here.
|
|
115
100
|
// It is possible for this render to be interrupted or aborted,
|
|
@@ -126,7 +111,6 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
126
111
|
} else {
|
|
127
112
|
resolver.setProps(nextProps);
|
|
128
113
|
var data = resolver.resolve();
|
|
129
|
-
|
|
130
114
|
if (data !== prevState.data) {
|
|
131
115
|
return {
|
|
132
116
|
data: data,
|
|
@@ -136,43 +120,33 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
136
120
|
};
|
|
137
121
|
}
|
|
138
122
|
}
|
|
139
|
-
|
|
140
123
|
return null;
|
|
141
124
|
};
|
|
142
|
-
|
|
143
125
|
var _proto = _class.prototype;
|
|
144
|
-
|
|
145
126
|
_proto.componentDidMount = function componentDidMount() {
|
|
146
127
|
this._subscribeToNewResolverAndRerenderIfStoreHasChanged();
|
|
147
128
|
};
|
|
148
|
-
|
|
149
129
|
_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
|
|
150
130
|
if (this.state.resolver !== prevState.resolver) {
|
|
151
131
|
prevState.resolver.dispose();
|
|
152
|
-
|
|
153
132
|
this._subscribeToNewResolverAndRerenderIfStoreHasChanged();
|
|
154
133
|
} else {
|
|
155
134
|
this._rerenderIfStoreHasChanged();
|
|
156
135
|
}
|
|
157
136
|
};
|
|
158
|
-
|
|
159
137
|
_proto.componentWillUnmount = function componentWillUnmount() {
|
|
160
138
|
this.state.resolver.dispose();
|
|
161
139
|
};
|
|
162
|
-
|
|
163
140
|
_proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps, nextState) {
|
|
164
141
|
// Short-circuit if any Relay-related data has changed
|
|
165
142
|
if (nextState.data !== this.state.data) {
|
|
166
143
|
return true;
|
|
167
|
-
}
|
|
144
|
+
}
|
|
145
|
+
// Otherwise, for convenience short-circuit if all non-Relay props
|
|
168
146
|
// are scalar and equal
|
|
169
|
-
|
|
170
|
-
|
|
171
147
|
var keys = Object.keys(nextProps);
|
|
172
|
-
|
|
173
148
|
for (var ii = 0; ii < keys.length; ii++) {
|
|
174
149
|
var key = keys[ii];
|
|
175
|
-
|
|
176
150
|
if (key === '__relayContext') {
|
|
177
151
|
if (nextState.prevPropsContext.environment !== this.state.prevPropsContext.environment) {
|
|
178
152
|
return true;
|
|
@@ -183,69 +157,67 @@ function createContainerWithFragments(Component, fragments) {
|
|
|
183
157
|
}
|
|
184
158
|
}
|
|
185
159
|
}
|
|
186
|
-
|
|
187
160
|
return false;
|
|
188
161
|
}
|
|
162
|
+
|
|
189
163
|
/**
|
|
190
164
|
* Render new data for the existing props/context.
|
|
191
|
-
|
|
192
|
-
;
|
|
193
|
-
|
|
165
|
+
*/;
|
|
194
166
|
_proto._rerenderIfStoreHasChanged = function _rerenderIfStoreHasChanged() {
|
|
195
167
|
var _this$state = this.state,
|
|
196
|
-
|
|
197
|
-
|
|
168
|
+
data = _this$state.data,
|
|
169
|
+
resolver = _this$state.resolver;
|
|
170
|
+
// External values could change between render and commit.
|
|
198
171
|
// Check for this case, even though it requires an extra store read.
|
|
199
|
-
|
|
200
172
|
var maybeNewData = resolver.resolve();
|
|
201
|
-
|
|
202
173
|
if (data !== maybeNewData) {
|
|
203
174
|
this.setState({
|
|
204
175
|
data: maybeNewData
|
|
205
176
|
});
|
|
206
177
|
}
|
|
207
178
|
};
|
|
208
|
-
|
|
209
179
|
_proto._subscribeToNewResolverAndRerenderIfStoreHasChanged = function _subscribeToNewResolverAndRerenderIfStoreHasChanged() {
|
|
210
180
|
var _this$state2 = this.state,
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
var maybeNewData = resolver.resolve();
|
|
181
|
+
data = _this$state2.data,
|
|
182
|
+
resolver = _this$state2.resolver;
|
|
183
|
+
var maybeNewData = resolver.resolve();
|
|
184
|
+
|
|
185
|
+
// Event listeners are only safe to add during the commit phase,
|
|
214
186
|
// So they won't leak if render is interrupted or errors.
|
|
187
|
+
resolver.setCallback(this.props, this._handleFragmentDataUpdate);
|
|
215
188
|
|
|
216
|
-
|
|
189
|
+
// External values could change between render and commit.
|
|
217
190
|
// Check for this case, even though it requires an extra store read.
|
|
218
|
-
|
|
219
191
|
if (data !== maybeNewData) {
|
|
220
192
|
this.setState({
|
|
221
193
|
data: maybeNewData
|
|
222
194
|
});
|
|
223
195
|
}
|
|
224
|
-
}
|
|
225
|
-
;
|
|
196
|
+
}
|
|
226
197
|
|
|
198
|
+
// $FlowFixMe[missing-local-annot]
|
|
199
|
+
;
|
|
227
200
|
_proto.render = function render() {
|
|
228
201
|
// eslint-disable-next-line no-unused-vars
|
|
229
202
|
var _this$props = this.props,
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
203
|
+
componentRef = _this$props.componentRef,
|
|
204
|
+
__relayContext = _this$props.__relayContext,
|
|
205
|
+
__rootIsQueryRenderer = _this$props.__rootIsQueryRenderer,
|
|
206
|
+
props = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, _excluded);
|
|
234
207
|
return React.createElement(Component, (0, _objectSpread2["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), this.state.data), {}, {
|
|
235
208
|
ref: componentRef,
|
|
236
209
|
relay: this.state.relayProp
|
|
237
210
|
}));
|
|
238
211
|
};
|
|
239
|
-
|
|
240
212
|
return _class;
|
|
241
213
|
}(React.Component), (0, _defineProperty2["default"])(_class, "displayName", containerName), _class;
|
|
242
214
|
}
|
|
243
|
-
|
|
244
215
|
function getRelayProp(environment) {
|
|
245
216
|
return {
|
|
246
217
|
environment: environment
|
|
247
218
|
};
|
|
248
219
|
}
|
|
220
|
+
|
|
249
221
|
/**
|
|
250
222
|
* Wrap the basic `createContainer()` function with logic to adapt to the
|
|
251
223
|
* `context.relay.environment` in which it is rendered. Specifically, the
|
|
@@ -253,13 +225,10 @@ function getRelayProp(environment) {
|
|
|
253
225
|
* `fragmentSpec` is memoized once per environment, rather than once per
|
|
254
226
|
* instance of the container constructed/rendered.
|
|
255
227
|
*/
|
|
256
|
-
|
|
257
|
-
|
|
258
228
|
function createContainer(Component, fragmentSpec) {
|
|
259
229
|
// $FlowFixMe[incompatible-return]
|
|
260
230
|
return buildReactRelayContainer(Component, fragmentSpec, createContainerWithFragments);
|
|
261
231
|
}
|
|
262
|
-
|
|
263
232
|
module.exports = {
|
|
264
233
|
createContainer: createContainer
|
|
265
234
|
};
|
|
@@ -8,12 +8,11 @@
|
|
|
8
8
|
* @format
|
|
9
9
|
* @oncall relay
|
|
10
10
|
*/
|
|
11
|
+
|
|
11
12
|
'use strict';
|
|
12
13
|
|
|
13
14
|
var ReactRelayContext = require('./ReactRelayContext');
|
|
14
|
-
|
|
15
15
|
var React = require('react');
|
|
16
|
-
|
|
17
16
|
function ReactRelayFragmentMockRenderer(props) {
|
|
18
17
|
return /*#__PURE__*/React.createElement(ReactRelayContext.Provider, {
|
|
19
18
|
value: {
|
|
@@ -21,5 +20,4 @@ function ReactRelayFragmentMockRenderer(props) {
|
|
|
21
20
|
}
|
|
22
21
|
}, props.render());
|
|
23
22
|
}
|
|
24
|
-
|
|
25
23
|
module.exports = ReactRelayFragmentMockRenderer;
|
|
@@ -8,48 +8,39 @@
|
|
|
8
8
|
* @format
|
|
9
9
|
* @oncall relay
|
|
10
10
|
*/
|
|
11
|
+
|
|
11
12
|
'use strict';
|
|
12
13
|
|
|
13
14
|
var ReactRelayContext = require('./ReactRelayContext');
|
|
14
|
-
|
|
15
15
|
var ReactRelayQueryRendererContext = require('./ReactRelayQueryRendererContext');
|
|
16
|
-
|
|
17
16
|
var areEqual = require("fbjs/lib/areEqual");
|
|
18
|
-
|
|
19
17
|
var React = require('react');
|
|
20
|
-
|
|
21
18
|
var _require = require('relay-runtime'),
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
19
|
+
createOperationDescriptor = _require.createOperationDescriptor,
|
|
20
|
+
deepFreeze = _require.deepFreeze,
|
|
21
|
+
getRequest = _require.getRequest;
|
|
26
22
|
var useLayoutEffect = React.useLayoutEffect,
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
23
|
+
useState = React.useState,
|
|
24
|
+
useRef = React.useRef,
|
|
25
|
+
useMemo = React.useMemo;
|
|
30
26
|
var queryRendererContext = {
|
|
31
27
|
rootIsQueryRenderer: true
|
|
32
28
|
};
|
|
33
|
-
|
|
34
29
|
function useDeepCompare(value) {
|
|
35
30
|
var latestValue = React.useRef(value);
|
|
36
|
-
|
|
37
31
|
if (!areEqual(latestValue.current, value)) {
|
|
38
32
|
if (process.env.NODE_ENV !== "production") {
|
|
39
33
|
deepFreeze(value);
|
|
40
34
|
}
|
|
41
|
-
|
|
42
35
|
latestValue.current = value;
|
|
43
36
|
}
|
|
44
|
-
|
|
45
37
|
return latestValue.current;
|
|
46
38
|
}
|
|
47
|
-
|
|
48
39
|
function ReactRelayLocalQueryRenderer(props) {
|
|
49
40
|
var environment = props.environment,
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
41
|
+
query = props.query,
|
|
42
|
+
variables = props.variables,
|
|
43
|
+
render = props.render;
|
|
53
44
|
var latestVariables = useDeepCompare(variables);
|
|
54
45
|
var operation = useMemo(function () {
|
|
55
46
|
var request = getRequest(query);
|
|
@@ -59,28 +50,27 @@ function ReactRelayLocalQueryRenderer(props) {
|
|
|
59
50
|
return {
|
|
60
51
|
environment: environment
|
|
61
52
|
};
|
|
62
|
-
}, [environment]);
|
|
63
|
-
// because of props change
|
|
53
|
+
}, [environment]);
|
|
64
54
|
|
|
55
|
+
// Use a ref to prevent rendering twice when data changes
|
|
56
|
+
// because of props change
|
|
65
57
|
var dataRef = useRef(null);
|
|
66
|
-
|
|
67
58
|
var _useState = useState(null),
|
|
68
|
-
|
|
69
|
-
|
|
59
|
+
forceUpdate = _useState[1];
|
|
70
60
|
var cleanupFnRef = useRef(null);
|
|
71
61
|
var snapshot = useMemo(function () {
|
|
72
62
|
environment.check(operation);
|
|
73
63
|
var res = environment.lookup(operation.fragment);
|
|
74
|
-
dataRef.current = res.data;
|
|
75
|
-
// and subscribed before the component commits
|
|
64
|
+
dataRef.current = res.data;
|
|
76
65
|
|
|
66
|
+
// Run effects here so that the data can be retained
|
|
67
|
+
// and subscribed before the component commits
|
|
77
68
|
var retainDisposable = environment.retain(operation);
|
|
78
69
|
var subscribeDisposable = environment.subscribe(res, function (newSnapshot) {
|
|
79
70
|
dataRef.current = newSnapshot.data;
|
|
80
71
|
forceUpdate(dataRef.current);
|
|
81
72
|
});
|
|
82
73
|
var disposed = false;
|
|
83
|
-
|
|
84
74
|
function nextCleanupFn() {
|
|
85
75
|
if (!disposed) {
|
|
86
76
|
disposed = true;
|
|
@@ -89,11 +79,9 @@ function ReactRelayLocalQueryRenderer(props) {
|
|
|
89
79
|
subscribeDisposable.dispose();
|
|
90
80
|
}
|
|
91
81
|
}
|
|
92
|
-
|
|
93
82
|
if (cleanupFnRef.current) {
|
|
94
83
|
cleanupFnRef.current();
|
|
95
84
|
}
|
|
96
|
-
|
|
97
85
|
cleanupFnRef.current = nextCleanupFn;
|
|
98
86
|
return res;
|
|
99
87
|
}, [environment, operation]);
|
|
@@ -111,5 +99,4 @@ function ReactRelayLocalQueryRenderer(props) {
|
|
|
111
99
|
props: dataRef.current
|
|
112
100
|
})));
|
|
113
101
|
}
|
|
114
|
-
|
|
115
102
|
module.exports = ReactRelayLocalQueryRenderer;
|