@apollo/client 3.6.1 → 3.6.4

package/react/hooks/hooks.cjs

@@ -3,18 +3,31 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var globals = require('../../utilities/globals');
-var react = require('react');
+var React = require('react');
 var context = require('../context');
 var tslib = require('tslib');
-var errors = require('../../errors');
-var index_js = require('use-sync-external-store/shim/index.js');
+var utilities = require('../../utilities');
 var equality = require('@wry/equality');
 var core = require('../../core');
+var errors = require('../../errors');
 var parser = require('../parser');
-var utilities = require('../../utilities');
+
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        for (var k in e) {
+            n[k] = e[k];
+        }
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
 function useApolloClient(override) {
-    var context$1 = react.useContext(context.getApolloContext());
+    var context$1 = React.useContext(context.getApolloContext());
     var client = override || context$1.client;
     __DEV__ ? globals.invariant(!!client, 'Could not find "client" in the context or passed in as an option. ' +
         'Wrap the root component in an <ApolloProvider>, or pass an ApolloClient ' +
@@ -22,20 +35,65 @@ function useApolloClient(override) {
     return client;
 }
 
+var didWarnUncachedGetSnapshot = false;
+var uSESKey = "useSyncExternalStore";
+var realHook = React__namespace[uSESKey];
+var useSyncExternalStore = realHook || (function (subscribe, getSnapshot, getServerSnapshot) {
+    var value = getSnapshot();
+    if (__DEV__ &&
+        !didWarnUncachedGetSnapshot &&
+        value !== getSnapshot()) {
+        didWarnUncachedGetSnapshot = true;
+        __DEV__ && globals.invariant.error('The result of getSnapshot should be cached to avoid an infinite loop');
+    }
+    var _a = React__namespace.useState({ inst: { value: value, getSnapshot: getSnapshot } }), inst = _a[0].inst, forceUpdate = _a[1];
+    if (utilities.canUseLayoutEffect) {
+        React__namespace.useLayoutEffect(function () {
+            Object.assign(inst, { value: value, getSnapshot: getSnapshot });
+            if (checkIfSnapshotChanged(inst)) {
+                forceUpdate({ inst: inst });
+            }
+        }, [subscribe, value, getSnapshot]);
+    }
+    else {
+        Object.assign(inst, { value: value, getSnapshot: getSnapshot });
+    }
+    React__namespace.useEffect(function () {
+        if (checkIfSnapshotChanged(inst)) {
+            forceUpdate({ inst: inst });
+        }
+        return subscribe(function handleStoreChange() {
+            if (checkIfSnapshotChanged(inst)) {
+                forceUpdate({ inst: inst });
+            }
+        });
+    }, [subscribe]);
+    return value;
+});
+function checkIfSnapshotChanged(_a) {
+    var value = _a.value, getSnapshot = _a.getSnapshot;
+    try {
+        return value !== getSnapshot();
+    }
+    catch (_b) {
+        return true;
+    }
+}
+
 var hasOwnProperty = Object.prototype.hasOwnProperty;
 function useQuery(query, options) {
     if (options === void 0) { options = Object.create(null); }
     return useInternalState(useApolloClient(options.client), query).useQuery(options);
 }
 function useInternalState(client, query) {
-    var stateRef = react.useRef();
+    var stateRef = React.useRef();
     if (!stateRef.current ||
         client !== stateRef.current.client ||
         query !== stateRef.current.query) {
         stateRef.current = new InternalState(client, query);
     }
     var state = stateRef.current;
-    var _a = react.useState(0); _a[0]; var setTick = _a[1];
+    var _a = React.useState(0); _a[0]; var setTick = _a[1];
     state.forceUpdate = function () {
         setTick(function (tick) { return tick + 1; });
     };
@@ -45,6 +103,8 @@ var InternalState = (function () {
     function InternalState(client, query) {
         this.client = client;
         this.query = query;
+        this.asyncResolveFns = new Set();
+        this.optionsToIgnoreOnce = new (utilities.canUseWeakSet ? WeakSet : Set)();
         this.ssrDisabledResult = utilities.maybeDeepFreeze({
             loading: true,
             data: void 0,
@@ -61,13 +121,22 @@ var InternalState = (function () {
         parser.verifyDocumentType(query, parser.DocumentType.Query);
     }
     InternalState.prototype.forceUpdate = function () {
+        __DEV__ && globals.invariant.warn("Calling default no-op implementation of InternalState#forceUpdate");
+    };
+    InternalState.prototype.asyncUpdate = function () {
+        var _this = this;
+        return new Promise(function (resolve) {
+            _this.asyncResolveFns.add(resolve);
+            _this.optionsToIgnoreOnce.add(_this.watchQueryOptions);
+            _this.forceUpdate();
+        });
     };
     InternalState.prototype.useQuery = function (options) {
         var _this = this;
-        this.renderPromises = react.useContext(context.getApolloContext()).renderPromises;
+        this.renderPromises = React.useContext(context.getApolloContext()).renderPromises;
         this.useOptions(options);
         var obsQuery = this.useObservableQuery();
-        var result = index_js.useSyncExternalStore(react.useCallback(function () {
+        var result = useSyncExternalStore(React.useCallback(function () {
             if (_this.renderPromises) {
                 return function () { };
             }
@@ -113,17 +182,24 @@ var InternalState = (function () {
             obsQuery,
             this.renderPromises,
             this.client.disableNetworkFetches,
-        ]), function () { return _this.getCurrentResult(); });
+        ]), function () { return _this.getCurrentResult(); }, function () { return _this.getCurrentResult(); });
         this.unsafeHandlePartialRefetch(result);
-        return this.toQueryResult(result);
+        var queryResult = this.toQueryResult(result);
+        if (!queryResult.loading && this.asyncResolveFns.size) {
+            this.asyncResolveFns.forEach(function (resolve) { return resolve(queryResult); });
+            this.asyncResolveFns.clear();
+        }
+        return queryResult;
     };
     InternalState.prototype.useOptions = function (options) {
         var _a;
         var watchQueryOptions = this.createWatchQueryOptions(this.queryHookOptions = options);
         var currentWatchQueryOptions = this.watchQueryOptions;
-        if (!equality.equal(watchQueryOptions, currentWatchQueryOptions)) {
+        if (this.optionsToIgnoreOnce.has(currentWatchQueryOptions) ||
+            !equality.equal(watchQueryOptions, currentWatchQueryOptions)) {
             this.watchQueryOptions = watchQueryOptions;
             if (currentWatchQueryOptions && this.observable) {
+                this.optionsToIgnoreOnce.delete(currentWatchQueryOptions);
                 this.observable.reobserve(watchQueryOptions);
                 this.previousData = ((_a = this.result) === null || _a === void 0 ? void 0 : _a.data) || this.previousData;
                 this.result = void 0;
@@ -132,7 +208,8 @@ var InternalState = (function () {
         this.onCompleted = options.onCompleted || InternalState.prototype.onCompleted;
         this.onError = options.onError || InternalState.prototype.onError;
         if ((this.renderPromises || this.client.disableNetworkFetches) &&
-            this.queryHookOptions.ssr === false) {
+            this.queryHookOptions.ssr === false &&
+            !this.queryHookOptions.skip) {
             this.result = this.ssrDisabledResult;
         }
         else if (this.queryHookOptions.skip ||
@@ -145,51 +222,38 @@ var InternalState = (function () {
         }
     };
     InternalState.prototype.createWatchQueryOptions = function (_a) {
+        var _b;
         if (_a === void 0) { _a = {}; }
-        var skip = _a.skip; _a.ssr; _a.onCompleted; _a.onError; _a.displayName; var defaultOptions = _a.defaultOptions, otherOptions = tslib.__rest(_a, ["skip", "ssr", "onCompleted", "onError", "displayName", "defaultOptions"]);
-        var toMerge = [];
-        var globalDefaults = this.client.defaultOptions.watchQuery;
-        if (globalDefaults)
-            toMerge.push(globalDefaults);
-        if (defaultOptions)
-            toMerge.push(defaultOptions);
-        var latestOptions = this.observable && this.observable.options;
-        if (latestOptions && toMerge.length) {
-            var defaults_1 = toMerge.reduce(core.mergeOptions, Object.create(null));
-            toMerge.length = 1;
-            toMerge[0] = defaults_1;
-            Object.keys(defaults_1).forEach(function (defaultOptionName) {
-                var currentOptionValue = latestOptions[defaultOptionName];
-                if (hasOwnProperty.call(latestOptions, defaultOptionName) &&
-                    !equality.equal(defaults_1[defaultOptionName], currentOptionValue)) {
-                    defaults_1[defaultOptionName] = defaultOptionName === "variables"
-                        ? tslib.__assign(tslib.__assign({}, defaults_1.variables), currentOptionValue) : currentOptionValue;
-                }
-            });
-        }
-        toMerge.push(otherOptions);
-        var merged = toMerge.reduce(core.mergeOptions, Object.create(null));
-        var watchQueryOptions = Object.assign(merged, { query: this.query });
+        var skip = _a.skip; _a.ssr; _a.onCompleted; _a.onError; _a.displayName; _a.defaultOptions; var otherOptions = tslib.__rest(_a, ["skip", "ssr", "onCompleted", "onError", "displayName", "defaultOptions"]);
+        var watchQueryOptions = Object.assign(otherOptions, { query: this.query });
         if (this.renderPromises &&
             (watchQueryOptions.fetchPolicy === 'network-only' ||
                 watchQueryOptions.fetchPolicy === 'cache-and-network')) {
             watchQueryOptions.fetchPolicy = 'cache-first';
         }
-        else if (!watchQueryOptions.fetchPolicy) {
-            watchQueryOptions.fetchPolicy = 'cache-first';
+        if (!watchQueryOptions.variables) {
+            watchQueryOptions.variables = {};
         }
         if (skip) {
-            var _b = watchQueryOptions.initialFetchPolicy, initialFetchPolicy = _b === void 0 ? watchQueryOptions.fetchPolicy : _b;
+            var _c = watchQueryOptions.fetchPolicy, fetchPolicy = _c === void 0 ? this.getDefaultFetchPolicy() : _c, _d = watchQueryOptions.initialFetchPolicy, initialFetchPolicy = _d === void 0 ? fetchPolicy : _d;
             Object.assign(watchQueryOptions, {
                 initialFetchPolicy: initialFetchPolicy,
                 fetchPolicy: 'standby',
             });
         }
-        if (!watchQueryOptions.variables) {
-            watchQueryOptions.variables = {};
+        else if (!watchQueryOptions.fetchPolicy) {
+            watchQueryOptions.fetchPolicy =
+                ((_b = this.observable) === null || _b === void 0 ? void 0 : _b.options.initialFetchPolicy) ||
+                    this.getDefaultFetchPolicy();
         }
         return watchQueryOptions;
     };
+    InternalState.prototype.getDefaultFetchPolicy = function () {
+        var _a, _b;
+        return (((_a = this.queryHookOptions.defaultOptions) === null || _a === void 0 ? void 0 : _a.fetchPolicy) ||
+            ((_b = this.client.defaultOptions.watchQuery) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
+            "cache-first");
+    };
     InternalState.prototype.onCompleted = function (data) { };
     InternalState.prototype.onError = function (error) { };
     InternalState.prototype.useObservableQuery = function () {
@@ -197,8 +261,8 @@ var InternalState = (function () {
             this.renderPromises
                 && this.renderPromises.getSSRObservable(this.watchQueryOptions)
                 || this.observable
-                || this.client.watchQuery(tslib.__assign({}, this.watchQueryOptions));
-        this.obsQueryFields = react.useMemo(function () { return ({
+                || this.client.watchQuery(core.mergeOptions(this.queryHookOptions.defaultOptions, this.watchQueryOptions));
+        this.obsQueryFields = React.useMemo(function () { return ({
             refetch: obsQuery.refetch.bind(obsQuery),
             reobserve: obsQuery.reobserve.bind(obsQuery),
             fetchMore: obsQuery.fetchMore.bind(obsQuery),
@@ -207,11 +271,11 @@ var InternalState = (function () {
             stopPolling: obsQuery.stopPolling.bind(obsQuery),
             subscribeToMore: obsQuery.subscribeToMore.bind(obsQuery),
         }); }, [obsQuery]);
-        if (this.renderPromises) {
+        var ssrAllowed = !(this.queryHookOptions.ssr === false ||
+            this.queryHookOptions.skip);
+        if (this.renderPromises && ssrAllowed) {
             this.renderPromises.registerSSRObservable(obsQuery);
-            var ssrAllowed = !(this.queryHookOptions.ssr === false ||
-                this.queryHookOptions.skip);
-            if (ssrAllowed && obsQuery.getCurrentResult().loading) {
+            if (obsQuery.getCurrentResult().loading) {
                 this.renderPromises.addObservableQueryPromise(obsQuery);
             }
         }
@@ -279,17 +343,14 @@ var EAGER_METHODS = [
 ];
 function useLazyQuery(query, options) {
     var internalState = useInternalState(useApolloClient(options && options.client), query);
-    var execOptionsRef = react.useRef();
-    var defaultOptions = internalState.client.defaultOptions.watchQuery;
-    var initialFetchPolicy = (options && options.fetchPolicy) ||
-        (execOptionsRef.current && execOptionsRef.current.fetchPolicy) ||
-        (defaultOptions && defaultOptions.fetchPolicy) ||
-        "cache-first";
+    var execOptionsRef = React.useRef();
     var useQueryResult = internalState.useQuery(tslib.__assign(tslib.__assign(tslib.__assign({}, options), execOptionsRef.current), { skip: !execOptionsRef.current }));
+    var initialFetchPolicy = useQueryResult.observable.options.initialFetchPolicy ||
+        internalState.getDefaultFetchPolicy();
     var result = Object.assign(useQueryResult, {
         called: !!execOptionsRef.current,
     });
-    var eagerMethods = react.useMemo(function () {
+    var eagerMethods = React.useMemo(function () {
         var eagerMethods = {};
         var _loop_1 = function (key) {
             var method = result[key];
@@ -308,23 +369,13 @@ function useLazyQuery(query, options) {
         return eagerMethods;
     }, []);
     Object.assign(result, eagerMethods);
-    var execute = react.useCallback(function (executeOptions) {
-        var promise = result.reobserve(execOptionsRef.current = executeOptions ? tslib.__assign(tslib.__assign({}, executeOptions), { fetchPolicy: executeOptions.fetchPolicy || initialFetchPolicy }) : {
+    var execute = React.useCallback(function (executeOptions) {
+        execOptionsRef.current = executeOptions ? tslib.__assign(tslib.__assign({}, executeOptions), { fetchPolicy: executeOptions.fetchPolicy || initialFetchPolicy }) : {
             fetchPolicy: initialFetchPolicy,
-        }).then(function (apolloQueryResult) {
-            apolloQueryResult = apolloQueryResult || internalState["getCurrentResult"]();
-            if (apolloQueryResult.error ||
-                utilities.isNonEmptyArray(apolloQueryResult.errors)) {
-                var _a = result.observable.options.errorPolicy, errorPolicy = _a === void 0 ? "none" : _a;
-                if (errorPolicy === "none") {
-                    throw apolloQueryResult.error || new errors.ApolloError({
-                        graphQLErrors: apolloQueryResult.errors,
-                    });
-                }
-            }
-            return internalState.toQueryResult(apolloQueryResult);
-        }).then(function (queryResult) { return Object.assign(queryResult, eagerMethods); });
-        internalState.forceUpdate();
+        };
+        var promise = internalState
+            .asyncUpdate()
+            .then(function (queryResult) { return Object.assign(queryResult, eagerMethods); });
         promise.catch(function () { });
         return promise;
     }, []);
@@ -334,12 +385,12 @@ function useLazyQuery(query, options) {
 function useMutation(mutation, options) {
     var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
     parser.verifyDocumentType(mutation, parser.DocumentType.Mutation);
-    var _a = react.useState({
+    var _a = React.useState({
         called: false,
         loading: false,
         client: client,
     }), result = _a[0], setResult = _a[1];
-    var ref = react.useRef({
+    var ref = React.useRef({
         result: result,
         mutationId: 0,
         isMounted: true,
@@ -350,7 +401,7 @@ function useMutation(mutation, options) {
     {
         Object.assign(ref.current, { client: client, options: options, mutation: mutation });
     }
-    var execute = react.useCallback(function (executeOptions) {
+    var execute = React.useCallback(function (executeOptions) {
         if (executeOptions === void 0) { executeOptions = {}; }
         var _a = ref.current, client = _a.client, options = _a.options, mutation = _a.mutation;
         var baseOptions = tslib.__assign(tslib.__assign({}, options), { mutation: mutation });
@@ -410,10 +461,10 @@ function useMutation(mutation, options) {
             throw error;
         });
     }, []);
-    var reset = react.useCallback(function () {
+    var reset = React.useCallback(function () {
         setResult({ called: false, loading: false, client: client });
     }, []);
-    react.useEffect(function () {
+    React.useEffect(function () {
         ref.current.isMounted = true;
         return function () {
             ref.current.isMounted = false;
@@ -425,13 +476,13 @@ function useMutation(mutation, options) {
 function useSubscription(subscription, options) {
     var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
     parser.verifyDocumentType(subscription, parser.DocumentType.Subscription);
-    var _a = react.useState({
+    var _a = React.useState({
         loading: !(options === null || options === void 0 ? void 0 : options.skip),
         error: void 0,
         data: void 0,
         variables: options === null || options === void 0 ? void 0 : options.variables,
     }), result = _a[0], setResult = _a[1];
-    var _b = react.useState(function () {
+    var _b = React.useState(function () {
         if (options === null || options === void 0 ? void 0 : options.skip) {
             return null;
         }
@@ -442,15 +493,21 @@ function useSubscription(subscription, options) {
             context: options === null || options === void 0 ? void 0 : options.context,
         });
     }), observable = _b[0], setObservable = _b[1];
-    var ref = react.useRef({ client: client, subscription: subscription, options: options });
-    react.useEffect(function () {
+    var canResetObservableRef = React.useRef(false);
+    React.useEffect(function () {
+        return function () {
+            canResetObservableRef.current = true;
+        };
+    }, []);
+    var ref = React.useRef({ client: client, subscription: subscription, options: options });
+    React.useEffect(function () {
         var _a, _b, _c, _d;
         var shouldResubscribe = options === null || options === void 0 ? void 0 : options.shouldResubscribe;
         if (typeof shouldResubscribe === 'function') {
             shouldResubscribe = !!shouldResubscribe(options);
         }
         if (options === null || options === void 0 ? void 0 : options.skip) {
-            if (!(options === null || options === void 0 ? void 0 : options.skip) !== !((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.skip)) {
+            if (!(options === null || options === void 0 ? void 0 : options.skip) !== !((_a = ref.current.options) === null || _a === void 0 ? void 0 : _a.skip) || canResetObservableRef.current) {
                 setResult({
                     loading: false,
                     data: void 0,
@@ -458,13 +515,16 @@ function useSubscription(subscription, options) {
                     variables: options === null || options === void 0 ? void 0 : options.variables,
                 });
                 setObservable(null);
+                canResetObservableRef.current = false;
             }
         }
-        else if (shouldResubscribe !== false && (client !== ref.current.client ||
-            subscription !== ref.current.subscription ||
-            (options === null || options === void 0 ? void 0 : options.fetchPolicy) !== ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
-            !(options === null || options === void 0 ? void 0 : options.skip) !== !((_c = ref.current.options) === null || _c === void 0 ? void 0 : _c.skip) ||
-            !equality.equal(options === null || options === void 0 ? void 0 : options.variables, (_d = ref.current.options) === null || _d === void 0 ? void 0 : _d.variables))) {
+        else if ((shouldResubscribe !== false &&
+            (client !== ref.current.client ||
+                subscription !== ref.current.subscription ||
+                (options === null || options === void 0 ? void 0 : options.fetchPolicy) !== ((_b = ref.current.options) === null || _b === void 0 ? void 0 : _b.fetchPolicy) ||
+                !(options === null || options === void 0 ? void 0 : options.skip) !== !((_c = ref.current.options) === null || _c === void 0 ? void 0 : _c.skip) ||
+                !equality.equal(options === null || options === void 0 ? void 0 : options.variables, (_d = ref.current.options) === null || _d === void 0 ? void 0 : _d.variables))) ||
+            canResetObservableRef.current) {
             setResult({
                 loading: true,
                 data: void 0,
@@ -477,10 +537,11 @@ function useSubscription(subscription, options) {
                 fetchPolicy: options === null || options === void 0 ? void 0 : options.fetchPolicy,
                 context: options === null || options === void 0 ? void 0 : options.context,
             }));
+            canResetObservableRef.current = false;
         }
         Object.assign(ref.current, { client: client, subscription: subscription, options: options });
-    }, [client, subscription, options]);
-    react.useEffect(function () {
+    }, [client, subscription, options, canResetObservableRef.current]);
+    React.useEffect(function () {
         if (!observable) {
             return;
         }
@@ -521,8 +582,8 @@ function useSubscription(subscription, options) {
 
 function useReactiveVar(rv) {
     var value = rv();
-    var setValue = react.useState(value)[1];
-    react.useEffect(function () {
+    var setValue = React.useState(value)[1];
+    React.useEffect(function () {
         var probablySameValue = rv();
         if (value !== probablySameValue) {
             setValue(probablySameValue);