@apollo/client 3.6.0-beta.9 → 3.6.0

package/react/hooks/hooks.cjs

@@ -6,16 +6,13 @@ var globals = require('../../utilities/globals');
 var react = require('react');
 var context = require('../context');
 var tslib = require('tslib');
-var equal = require('@wry/equality');
 var errors = require('../../errors');
+var index_js = require('use-sync-external-store/shim/index.js');
+var equality = require('@wry/equality');
 var core = require('../../core');
 var parser = require('../parser');
 var utilities = require('../../utilities');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
-
-var equal__default = /*#__PURE__*/_interopDefaultLegacy(equal);
-
 function useApolloClient(override) {
     var context$1 = react.useContext(context.getApolloContext());
     var client = override || context$1.client;
@@ -25,26 +22,9 @@ function useApolloClient(override) {
     return client;
 }
 
-function useNormalizedOptions(optionsOrFunction) {
-    var optionsRef = react.useRef();
-    var options = optionsRef.current || Object.create(null);
-    if (typeof optionsOrFunction === "function") {
-        var newOptions = optionsOrFunction(options);
-        if (newOptions !== options) {
-            Object.assign(options, newOptions, newOptions.variables && {
-                variables: tslib.__assign(tslib.__assign({}, options.variables), newOptions.variables),
-            });
-        }
-    }
-    else if (optionsOrFunction && !equal__default(optionsOrFunction, options)) {
-        options = optionsOrFunction;
-    }
-    return optionsRef.current = options;
-}
-
 var hasOwnProperty = Object.prototype.hasOwnProperty;
-function useQuery(query, optionsOrFunction) {
-    var options = useNormalizedOptions(optionsOrFunction);
+function useQuery(query, options) {
+    if (options === void 0) { options = Object.create(null); }
     return useInternalState(useApolloClient(options.client), query).useQuery(options);
 }
 function useInternalState(client, query) {
@@ -65,118 +45,31 @@ var InternalState = (function () {
     function InternalState(client, query) {
         this.client = client;
         this.query = query;
+        this.ssrDisabledResult = utilities.maybeDeepFreeze({
+            loading: true,
+            data: void 0,
+            error: void 0,
+            networkStatus: core.NetworkStatus.loading,
+        });
+        this.skipStandbyResult = utilities.maybeDeepFreeze({
+            loading: false,
+            data: void 0,
+            error: void 0,
+            networkStatus: core.NetworkStatus.ready,
+        });
         this.toQueryResultCache = new (utilities.canUseWeakMap ? WeakMap : Map)();
         parser.verifyDocumentType(query, parser.DocumentType.Query);
     }
     InternalState.prototype.forceUpdate = function () {
     };
     InternalState.prototype.useQuery = function (options) {
+        var _this = this;
+        this.renderPromises = react.useContext(context.getApolloContext()).renderPromises;
         this.useOptions(options);
         var obsQuery = this.useObservableQuery();
-        this.useSubscriptionEffect(obsQuery);
-        var result = this.getCurrentResult();
-        this.unsafeHandlePartialRefetch(result);
-        return this.toQueryResult(result);
-    };
-    InternalState.prototype.useOptions = function (options) {
-        this.renderPromises = react.useContext(context.getApolloContext()).renderPromises;
-        var watchQueryOptions = this.createWatchQueryOptions(this.queryHookOptions = options);
-        if (!equal.equal(watchQueryOptions, this.watchQueryOptions)) {
-            this.watchQueryOptions = watchQueryOptions;
-        }
-        this.ssrDisabled = !!(options && (options.ssr === false ||
-            options.skip));
-        this.onCompleted = options
-            && options.onCompleted
-            || InternalState.prototype.onCompleted;
-        this.onError = options
-            && options.onError
-            || InternalState.prototype.onError;
-    };
-    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 otherOptions = tslib.__rest(_a, ["skip", "ssr", "onCompleted", "onError", "displayName"]);
-        var watchQueryOptions = Object.assign(otherOptions, { query: this.query });
-        if (skip) {
-            watchQueryOptions.fetchPolicy = 'standby';
-        }
-        else if (((_b = watchQueryOptions.context) === null || _b === void 0 ? void 0 : _b.renderPromises) &&
-            (watchQueryOptions.fetchPolicy === 'network-only' ||
-                watchQueryOptions.fetchPolicy === 'cache-and-network')) {
-            watchQueryOptions.fetchPolicy = 'cache-first';
-        }
-        else if (!watchQueryOptions.fetchPolicy) {
-            var defaultOptions = this.client.defaultOptions.watchQuery;
-            watchQueryOptions.fetchPolicy =
-                defaultOptions && defaultOptions.fetchPolicy || 'cache-first';
-        }
-        if (!watchQueryOptions.variables) {
-            watchQueryOptions.variables = {};
-        }
-        return watchQueryOptions;
-    };
-    InternalState.prototype.onCompleted = function (data) { };
-    InternalState.prototype.onError = function (error) { };
-    InternalState.prototype.useObservableQuery = function () {
-        var _this = this;
-        var obsQuery = this.observable =
-            this.renderPromises
-                && this.renderPromises.getSSRObservable(this.watchQueryOptions)
-                || this.observable
-                || this.client.watchQuery(this.watchQueryOptions);
-        this.obsQueryFields = react.useMemo(function () { return ({
-            refetch: obsQuery.refetch.bind(obsQuery),
-            fetchMore: obsQuery.fetchMore.bind(obsQuery),
-            updateQuery: obsQuery.updateQuery.bind(obsQuery),
-            startPolling: obsQuery.startPolling.bind(obsQuery),
-            stopPolling: obsQuery.stopPolling.bind(obsQuery),
-            subscribeToMore: obsQuery.subscribeToMore.bind(obsQuery),
-        }); }, [obsQuery]);
-        if (this.renderPromises) {
-            this.renderPromises.registerSSRObservable(obsQuery);
-            if (!this.ssrDisabled && obsQuery.getCurrentResult().loading) {
-                this.renderPromises.addQueryPromise({
-                    getOptions: function () { return obsQuery.options; },
-                    fetchData: function () { return new Promise(function (resolve) {
-                        var sub = obsQuery.subscribe({
-                            next: function (result) {
-                                if (!result.loading) {
-                                    resolve();
-                                    sub.unsubscribe();
-                                }
-                            },
-                            error: function () {
-                                resolve();
-                                sub.unsubscribe();
-                            },
-                            complete: function () {
-                                resolve();
-                            },
-                        });
-                    }); },
-                }, function () { return null; });
-                obsQuery.setOptions(this.watchQueryOptions).catch(function () { });
-            }
-        }
-        var prevOptionsRef = react.useRef({
-            watchQueryOptions: this.watchQueryOptions,
-        });
-        react.useEffect(function () {
-            if (_this.renderPromises) ;
-            else if (_this.watchQueryOptions !== prevOptionsRef.current.watchQueryOptions) {
-                obsQuery.setOptions(_this.watchQueryOptions).catch(function () { });
-                prevOptionsRef.current.watchQueryOptions = _this.watchQueryOptions;
-                _this.setResult(obsQuery.getCurrentResult());
-            }
-        }, [obsQuery, this.watchQueryOptions]);
-        return obsQuery;
-    };
-    InternalState.prototype.useSubscriptionEffect = function (obsQuery) {
-        var _this = this;
-        react.useEffect(function () {
+        var result = index_js.useSyncExternalStore(react.useCallback(function () {
             if (_this.renderPromises) {
-                return;
+                return function () { };
             }
             var onNext = function () {
                 var previousResult = _this.result;
@@ -184,7 +77,7 @@ var InternalState = (function () {
                 if (previousResult &&
                     previousResult.loading === result.loading &&
                     previousResult.networkStatus === result.networkStatus &&
-                    equal.equal(previousResult.data, result.data)) {
+                    equality.equal(previousResult.data, result.data)) {
                     return;
                 }
                 _this.setResult(result);
@@ -205,7 +98,7 @@ var InternalState = (function () {
                 var previousResult = _this.result;
                 if (!previousResult ||
                     (previousResult && previousResult.loading) ||
-                    !equal.equal(error, previousResult.error)) {
+                    !equality.equal(error, previousResult.error)) {
                     _this.setResult({
                         data: (previousResult && previousResult.data),
                         error: error,
@@ -220,7 +113,117 @@ var InternalState = (function () {
             obsQuery,
             this.renderPromises,
             this.client.disableNetworkFetches,
-        ]);
+        ]), function () { return _this.getCurrentResult(); });
+        this.unsafeHandlePartialRefetch(result);
+        return this.toQueryResult(result);
+    };
+    InternalState.prototype.useOptions = function (options) {
+        var _a;
+        var watchQueryOptions = this.createWatchQueryOptions(this.queryHookOptions = options);
+        var currentWatchQueryOptions = this.watchQueryOptions;
+        var resolveFetchBlockingPromise;
+        if (!equality.equal(watchQueryOptions, currentWatchQueryOptions)) {
+            this.watchQueryOptions = watchQueryOptions;
+            if (currentWatchQueryOptions && this.observable) {
+                this.observable.reobserve(tslib.__assign({ fetchBlockingPromise: new Promise(function (resolve) {
+                        resolveFetchBlockingPromise = resolve;
+                    }) }, watchQueryOptions));
+                this.previousData = ((_a = this.result) === null || _a === void 0 ? void 0 : _a.data) || this.previousData;
+                this.result = void 0;
+            }
+        }
+        useUnblockFetchEffect(this.renderPromises, resolveFetchBlockingPromise);
+        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.result = this.ssrDisabledResult;
+        }
+        else if (this.queryHookOptions.skip ||
+            this.watchQueryOptions.fetchPolicy === 'standby') {
+            this.result = this.skipStandbyResult;
+        }
+        else if (this.result === this.ssrDisabledResult ||
+            this.result === this.skipStandbyResult) {
+            this.result = void 0;
+        }
+    };
+    InternalState.prototype.createWatchQueryOptions = function (_a) {
+        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 });
+        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 (skip) {
+            var _b = watchQueryOptions.initialFetchPolicy, initialFetchPolicy = _b === void 0 ? watchQueryOptions.fetchPolicy : _b;
+            Object.assign(watchQueryOptions, {
+                initialFetchPolicy: initialFetchPolicy,
+                fetchPolicy: 'standby',
+            });
+        }
+        if (!watchQueryOptions.variables) {
+            watchQueryOptions.variables = {};
+        }
+        return watchQueryOptions;
+    };
+    InternalState.prototype.onCompleted = function (data) { };
+    InternalState.prototype.onError = function (error) { };
+    InternalState.prototype.useObservableQuery = function () {
+        var resolveFetchBlockingPromise;
+        var obsQuery = this.observable =
+            this.renderPromises
+                && this.renderPromises.getSSRObservable(this.watchQueryOptions)
+                || this.observable
+                || this.client.watchQuery(tslib.__assign({ fetchBlockingPromise: new Promise(function (resolve) {
+                        resolveFetchBlockingPromise = resolve;
+                    }) }, this.watchQueryOptions));
+        useUnblockFetchEffect(this.renderPromises, resolveFetchBlockingPromise);
+        this.obsQueryFields = react.useMemo(function () { return ({
+            refetch: obsQuery.refetch.bind(obsQuery),
+            reobserve: obsQuery.reobserve.bind(obsQuery),
+            fetchMore: obsQuery.fetchMore.bind(obsQuery),
+            updateQuery: obsQuery.updateQuery.bind(obsQuery),
+            startPolling: obsQuery.startPolling.bind(obsQuery),
+            stopPolling: obsQuery.stopPolling.bind(obsQuery),
+            subscribeToMore: obsQuery.subscribeToMore.bind(obsQuery),
+        }); }, [obsQuery]);
+        if (this.renderPromises) {
+            this.renderPromises.registerSSRObservable(obsQuery);
+            var ssrAllowed = !(this.queryHookOptions.ssr === false ||
+                this.queryHookOptions.skip);
+            if (ssrAllowed && obsQuery.getCurrentResult().loading) {
+                this.renderPromises.addObservableQueryPromise(obsQuery);
+            }
+        }
+        return obsQuery;
     };
     InternalState.prototype.setResult = function (nextResult) {
         var previousResult = this.result;
@@ -242,30 +245,10 @@ var InternalState = (function () {
         }
     };
     InternalState.prototype.getCurrentResult = function () {
-        var result = this.result;
-        if (!result) {
-            result = this.result = this.observable.getCurrentResult();
-            this.handleErrorOrCompleted(result);
-        }
-        if ((this.renderPromises || this.client.disableNetworkFetches) &&
-            this.queryHookOptions.ssr === false) {
-            result = {
-                loading: true,
-                data: void 0,
-                error: void 0,
-                networkStatus: core.NetworkStatus.loading,
-            };
+        if (!this.result) {
+            this.handleErrorOrCompleted(this.result = this.observable.getCurrentResult());
         }
-        else if (this.queryHookOptions.skip ||
-            this.queryHookOptions.fetchPolicy === 'standby') {
-            result = {
-                loading: false,
-                data: void 0,
-                error: void 0,
-                networkStatus: core.NetworkStatus.ready,
-            };
-        }
-        return result;
+        return this.result;
     };
     InternalState.prototype.toQueryResult = function (result) {
         var queryResult = this.toQueryResultCache.get(result);
@@ -293,34 +276,52 @@ var InternalState = (function () {
     };
     return InternalState;
 }());
+function useUnblockFetchEffect(renderPromises, resolveFetchBlockingPromise) {
+    if (resolveFetchBlockingPromise) {
+        if (renderPromises) {
+            resolveFetchBlockingPromise(true);
+        }
+        else {
+            setTimeout(function () { return resolveFetchBlockingPromise(false); }, 5000);
+        }
+    }
+    react.useEffect(function () {
+        if (resolveFetchBlockingPromise) {
+            resolveFetchBlockingPromise(true);
+        }
+    }, [resolveFetchBlockingPromise]);
+}
 
 var EAGER_METHODS = [
     'refetch',
+    'reobserve',
     'fetchMore',
     'updateQuery',
     'startPolling',
     'subscribeToMore',
 ];
-function useLazyQuery(query, optionsOrFunction) {
-    var options = useNormalizedOptions(optionsOrFunction);
-    var _a = react.useState({
-        called: false,
-    }), execution = _a[0], setExecution = _a[1];
-    var result = useQuery(query, tslib.__assign(tslib.__assign(tslib.__assign({}, options), execution.options), { fetchPolicy: execution.called ? options === null || options === void 0 ? void 0 : options.fetchPolicy : 'standby', skip: undefined }));
-    if (!execution.called) {
-        result = tslib.__assign(tslib.__assign({}, result), { loading: false, data: void 0, error: void 0, called: false });
-    }
+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 useQueryResult = internalState.useQuery(tslib.__assign(tslib.__assign(tslib.__assign({}, options), execOptionsRef.current), { skip: !execOptionsRef.current }));
+    var result = Object.assign(useQueryResult, {
+        called: !!execOptionsRef.current,
+    });
     var eagerMethods = react.useMemo(function () {
         var eagerMethods = {};
         var _loop_1 = function (key) {
             var method = result[key];
             eagerMethods[key] = function () {
-                var args = [];
-                for (var _i = 0; _i < arguments.length; _i++) {
-                    args[_i] = arguments[_i];
+                if (!execOptionsRef.current) {
+                    execOptionsRef.current = Object.create(null);
+                    internalState.forceUpdate();
                 }
-                setExecution(function (execution) { return (tslib.__assign(tslib.__assign({}, execution), { called: true })); });
-                return method.apply(void 0, args);
+                return method.apply(this, arguments);
             };
         };
         for (var _i = 0, EAGER_METHODS_1 = EAGER_METHODS; _i < EAGER_METHODS_1.length; _i++) {
@@ -329,15 +330,24 @@ function useLazyQuery(query, optionsOrFunction) {
         }
         return eagerMethods;
     }, []);
-    result.error = result.error || void 0;
     Object.assign(result, eagerMethods);
     var execute = react.useCallback(function (executeOptions) {
-        setExecution({ called: true, options: executeOptions });
-        var promise = result.refetch(executeOptions === null || executeOptions === void 0 ? void 0 : executeOptions.variables).then(function (result1) {
-            var result2 = tslib.__assign(tslib.__assign({}, result), { data: result1.data, error: result1.error, called: true, loading: false });
-            Object.assign(result2, eagerMethods);
-            return result2;
-        });
+        var promise = result.reobserve(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();
         promise.catch(function () { });
         return promise;
     }, []);
@@ -393,7 +403,7 @@ function useMutation(mutation, options) {
                     error: error,
                     client: client,
                 };
-                if (ref.current.isMounted && !equal.equal(ref.current.result, result_1)) {
+                if (ref.current.isMounted && !equality.equal(ref.current.result, result_1)) {
                     setResult(ref.current.result = result_1);
                 }
             }
@@ -411,7 +421,7 @@ function useMutation(mutation, options) {
                     called: true,
                     client: client,
                 };
-                if (!equal.equal(ref.current.result, result_2)) {
+                if (!equality.equal(ref.current.result, result_2)) {
                     setResult(ref.current.result = result_2);
                 }
             }
@@ -426,9 +436,12 @@ function useMutation(mutation, options) {
     var reset = react.useCallback(function () {
         setResult({ called: false, loading: false, client: client });
     }, []);
-    react.useEffect(function () { return function () {
-        ref.current.isMounted = false;
-    }; }, []);
+    react.useEffect(function () {
+        ref.current.isMounted = true;
+        return function () {
+            ref.current.isMounted = false;
+        };
+    }, []);
     return [execute, tslib.__assign({ reset: reset }, result)];
 }
 
@@ -474,7 +487,7 @@ function useSubscription(subscription, options) {
             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) ||
-            !equal.equal(options === null || options === void 0 ? void 0 : options.variables, (_d = ref.current.options) === null || _d === void 0 ? void 0 : _d.variables))) {
+            !equality.equal(options === null || options === void 0 ? void 0 : options.variables, (_d = ref.current.options) === null || _d === void 0 ? void 0 : _d.variables))) {
             setResult({
                 loading: true,
                 data: void 0,