1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 | 'use strict';
|
12 |
|
13 | var React = require('react');
|
14 |
|
15 | var ReactRelayContext = require('./ReactRelayContext');
|
16 |
|
17 | var useLayoutEffect = React.useLayoutEffect,
|
18 | useState = React.useState,
|
19 | useRef = React.useRef,
|
20 | useMemo = React.useMemo;
|
21 |
|
22 | var _require = require('relay-runtime'),
|
23 | createOperationDescriptor = _require.createOperationDescriptor,
|
24 | deepFreeze = _require.deepFreeze,
|
25 | getRequest = _require.getRequest;
|
26 |
|
27 | var areEqual = require("fbjs/lib/areEqual");
|
28 |
|
29 | function useDeepCompare(value) {
|
30 | var latestValue = React.useRef(value);
|
31 |
|
32 | if (!areEqual(latestValue.current, value)) {
|
33 | if (process.env.NODE_ENV !== "production") {
|
34 | deepFreeze(value);
|
35 | }
|
36 |
|
37 | latestValue.current = value;
|
38 | }
|
39 |
|
40 | return latestValue.current;
|
41 | }
|
42 |
|
43 | function ReactRelayLocalQueryRenderer(props) {
|
44 | var environment = props.environment,
|
45 | query = props.query,
|
46 | variables = props.variables,
|
47 | render = props.render;
|
48 | var latestVariables = useDeepCompare(variables);
|
49 | var operation = useMemo(function () {
|
50 | var request = getRequest(query);
|
51 | return createOperationDescriptor(request, latestVariables);
|
52 | }, [query, latestVariables]);
|
53 | var relayContext = useMemo(function () {
|
54 | return {
|
55 | environment: environment
|
56 | };
|
57 | }, [environment]);
|
58 |
|
59 |
|
60 | var dataRef = useRef(null);
|
61 |
|
62 | var _useState = useState(null),
|
63 | forceUpdate = _useState[1];
|
64 |
|
65 | var cleanupFnRef = useRef(null);
|
66 | var snapshot = useMemo(function () {
|
67 | environment.check(operation);
|
68 | var res = environment.lookup(operation.fragment);
|
69 | dataRef.current = res.data;
|
70 |
|
71 |
|
72 | var retainDisposable = environment.retain(operation);
|
73 | var subscribeDisposable = environment.subscribe(res, function (newSnapshot) {
|
74 | dataRef.current = newSnapshot.data;
|
75 | forceUpdate(dataRef.current);
|
76 | });
|
77 | var disposed = false;
|
78 |
|
79 | function nextCleanupFn() {
|
80 | if (!disposed) {
|
81 | disposed = true;
|
82 | cleanupFnRef.current = null;
|
83 | retainDisposable.dispose();
|
84 | subscribeDisposable.dispose();
|
85 | }
|
86 | }
|
87 |
|
88 | if (cleanupFnRef.current) {
|
89 | cleanupFnRef.current();
|
90 | }
|
91 |
|
92 | cleanupFnRef.current = nextCleanupFn;
|
93 | return res;
|
94 | }, [environment, operation]);
|
95 | useLayoutEffect(function () {
|
96 | var cleanupFn = cleanupFnRef.current;
|
97 | return function () {
|
98 | cleanupFn && cleanupFn();
|
99 | };
|
100 | }, [snapshot]);
|
101 | return React.createElement(ReactRelayContext.Provider, {
|
102 | value: relayContext
|
103 | }, render({
|
104 | props: dataRef.current
|
105 | }));
|
106 | }
|
107 |
|
108 | module.exports = ReactRelayLocalQueryRenderer; |
\ | No newline at end of file |