@apollo/client 3.13.8 → 3.14.0-alpha.0

package/react/hooks/hooks.cjs

@@ -11,6 +11,8 @@ var equal = require('@wry/equality');
 var errors = require('../../errors');
 var core = require('../../core');
 var parser = require('../parser');
+var optimism = require('optimism');
+var tsInvariant = require('ts-invariant');
 var internal = require('../internal');
 var cache = require('../../cache');
 
@@ -34,7 +36,7 @@ var equal__default = /*#__PURE__*/_interopDefaultLegacy(equal);
 function useApolloClient(override) {
     var context$1 = React__namespace.useContext(context.getApolloContext());
     var client = override || context$1.client;
-    globals.invariant(!!client, 58);
+    globals.invariant(!!client, 68);
     return client;
 }
 
@@ -49,7 +51,7 @@ var useSyncExternalStore = realHook$1 ||
             !didWarnUncachedGetSnapshot &&
             value !== getSnapshot()) {
             didWarnUncachedGetSnapshot = true;
-            globalThis.__DEV__ !== false && globals.invariant.error(68);
+            globalThis.__DEV__ !== false && globals.invariant.error(81);
         }
         var _a = React__namespace.useState({
             inst: { value: value, getSnapshot: getSnapshot },
@@ -120,6 +122,41 @@ function useRenderGuard() {
     }, []);
 }
 
+var slot = new optimism.Slot();
+function isMuted(name) {
+    return (slot.getValue() || []).includes(name);
+}
+function muteDeprecations(name) {
+    var args = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        args[_i - 1] = arguments[_i];
+    }
+    return slot.withValue.apply(slot, tslib.__spreadArray([Array.isArray(name) ? name : [name]], args, false));
+}
+function warnRemovedOption(options, name, callSite, recommendation) {
+    if (recommendation === void 0) { recommendation = "Please remove this option."; }
+    warnDeprecated(name, function () {
+        if (name in options) {
+            globalThis.__DEV__ !== false && globals.invariant.warn(91, callSite, name, recommendation);
+        }
+    });
+}
+function warnDeprecated(name, cb) {
+    if (!isMuted(name)) {
+        cb();
+    }
+}
+
+function useWarnRemovedOption(options, name, callSite, recommendation) {
+    "use no memo";
+    if (recommendation === void 0) { recommendation = "Please remove this option."; }
+    var didWarn = React__namespace.useRef(false);
+    if (name in options && !didWarn.current) {
+        globalThis.__DEV__ !== false && globals.invariant.warn(67, callSite, name, recommendation);
+        didWarn.current = true;
+    }
+}
+
 var useKey = "use";
 var realHook = React__namespace[useKey];
 var __use = realHook ||
@@ -148,10 +185,16 @@ function noop() { }
 var lastWatchOptions = Symbol();
 function useQuery(query, options) {
     if (options === void 0) { options = Object.create(null); }
-    return wrapHook("useQuery",
-    useQuery_, useApolloClient(options && options.client))(query, options);
+    return wrapHook("useQuery", useQuery_, useApolloClient(options && options.client))(query, options);
 }
 function useQuery_(query, options) {
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(options, "canonizeResults", "useQuery");
+        useWarnRemovedOption(options, "partialRefetch", "useQuery");
+        useWarnRemovedOption(options, "defaultOptions", "useQuery", "Pass the options directly to the hook instead.");
+        useWarnRemovedOption(options, "onCompleted", "useQuery", "If your `onCompleted` callback sets local state, switch to use derived state using `data` returned from the hook instead. Use `useEffect` to perform side-effects as a result of updates to `data`.");
+        useWarnRemovedOption(options, "onError", "useQuery", "If your `onError` callback sets local state, switch to use derived state using `data`, `error` or `errors` returned from the hook instead. Use `useEffect` if you need to perform side-effects as a result of updates to `data`, `error` or `errors`.");
+    }
     var _a = useQueryInternals(query, options), result = _a.result, obsQueryFields = _a.obsQueryFields;
     return React__namespace.useMemo(function () { return (tslib.__assign(tslib.__assign({}, result), obsQueryFields)); }, [result, obsQueryFields]);
 }
@@ -166,7 +209,9 @@ function useInternalState(client, query, options, renderPromises, makeWatchQuery
             (renderPromises &&
                 renderPromises.getSSRObservable(makeWatchQueryOptions())) ||
                 core.ObservableQuery["inactiveOnCreation"].withValue(!renderPromises, function () {
-                    return client.watchQuery(getObsQueryOptions(void 0, client, options, makeWatchQueryOptions()));
+                    return muteDeprecations("canonizeResults", function () {
+                        return client.watchQuery(getObsQueryOptions(void 0, client, options, makeWatchQueryOptions()));
+                    });
                 }),
             resultData: {
                 previousData: (_a = previous === null || previous === void 0 ? void 0 : previous.resultData.current) === null || _a === void 0 ? void 0 : _a.data,
@@ -433,7 +478,16 @@ var skipStandbyResult = utilities.maybeDeepFreeze({
 function bindObservableMethods(observable) {
     return {
         refetch: observable.refetch.bind(observable),
-        reobserve: observable.reobserve.bind(observable),
+        reobserve: function () {
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i] = arguments[_i];
+            }
+            if (globalThis.__DEV__ !== false) {
+                globalThis.__DEV__ !== false && globals.invariant.warn(73);
+            }
+            return observable.reobserve.apply(observable, args);
+        },
         fetchMore: observable.fetchMore.bind(observable),
         updateQuery: observable.updateQuery.bind(observable),
         startPolling: observable.startPolling.bind(observable),
@@ -442,6 +496,101 @@ function bindObservableMethods(observable) {
     };
 }
 
+var version = "3.14.0-alpha.0";
+
+function maybe(thunk) {
+    try {
+        return thunk();
+    }
+    catch (_a) { }
+}
+
+var global$1 = (maybe(function () { return globalThis; }) ||
+    maybe(function () { return window; }) ||
+    maybe(function () { return self; }) ||
+    maybe(function () { return global; }) ||
+maybe(function () {
+    return maybe.constructor("return this")();
+}));
+
+var prefixCounts = new Map();
+function makeUniqueId(prefix) {
+    var count = prefixCounts.get(prefix) || 1;
+    prefixCounts.set(prefix, count + 1);
+    return "".concat(prefix, ":").concat(count, ":").concat(Math.random().toString(36).slice(2));
+}
+
+function stringifyForDisplay(value, space) {
+    if (space === void 0) { space = 0; }
+    var undefId = makeUniqueId("stringifyForDisplay");
+    return JSON.stringify(value, function (key, value) {
+        return value === void 0 ? undefId : value;
+    }, space)
+        .split(JSON.stringify(undefId))
+        .join("<undefined>");
+}
+
+function wrap(fn) {
+    return function (message) {
+        var args = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            args[_i - 1] = arguments[_i];
+        }
+        if (typeof message === "number") {
+            var arg0 = message;
+            message = getHandledErrorMsg(arg0);
+            if (!message) {
+                message = getFallbackErrorMsg(arg0, args);
+                args = [];
+            }
+        }
+        fn.apply(void 0, [message].concat(args));
+    };
+}
+var invariant = Object.assign(function invariant(condition, message) {
+    var args = [];
+    for (var _i = 2; _i < arguments.length; _i++) {
+        args[_i - 2] = arguments[_i];
+    }
+    if (!condition) {
+        tsInvariant.invariant(condition, getHandledErrorMsg(message, args) || getFallbackErrorMsg(message, args));
+    }
+}, {
+    debug: wrap(tsInvariant.invariant.debug),
+    log: wrap(tsInvariant.invariant.log),
+    warn: wrap(tsInvariant.invariant.warn),
+    error: wrap(tsInvariant.invariant.error),
+});
+var ApolloErrorMessageHandler = Symbol.for("ApolloErrorMessageHandler_" + version);
+function stringify(arg) {
+    if (typeof arg == "string") {
+        return arg;
+    }
+    try {
+        return stringifyForDisplay(arg, 2).slice(0, 1000);
+    }
+    catch (_a) {
+        return "<non-serializable>";
+    }
+}
+function getHandledErrorMsg(message, messageArgs) {
+    if (messageArgs === void 0) { messageArgs = []; }
+    if (!message)
+        return;
+    return (global$1[ApolloErrorMessageHandler] &&
+        global$1[ApolloErrorMessageHandler](message, messageArgs.map(stringify)));
+}
+function getFallbackErrorMsg(message, messageArgs) {
+    if (messageArgs === void 0) { messageArgs = []; }
+    if (!message)
+        return;
+    return "An error occurred! For more details, see the full error text at https://go.apollo.dev/c/err#".concat(encodeURIComponent(JSON.stringify({
+        version: version,
+        message: message,
+        args: messageArgs.map(stringify),
+    })));
+}
+
 var EAGER_METHODS = [
     "refetch",
     "reobserve",
@@ -451,8 +600,40 @@ var EAGER_METHODS = [
     "stopPolling",
     "subscribeToMore",
 ];
+var REMOVED_EXECUTE_OPTIONS = [
+    "initialFetchPolicy",
+    "onCompleted",
+    "onError",
+    "defaultOptions",
+    "partialRefetch",
+    "canonizeResults",
+];
+var DEPRECATED_EXECUTE_OPTIONS = [
+    "query",
+    "ssr",
+    "client",
+    "fetchPolicy",
+    "nextFetchPolicy",
+    "refetchWritePolicy",
+    "errorPolicy",
+    "pollInterval",
+    "notifyOnNetworkStatusChange",
+    "returnPartialData",
+    "skipPollAttempt",
+];
 function useLazyQuery(query, options) {
     var _a;
+    if (globalThis.__DEV__ !== false) {
+        var warnOpts = options || {};
+        useWarnRemovedOption(warnOpts, "canonizeResults", "useLazyQuery");
+        useWarnRemovedOption(warnOpts, "variables", "useLazyQuery", "Pass all `variables` to the returned `execute` function instead.");
+        useWarnRemovedOption(warnOpts, "context", "useLazyQuery", "Pass `context` to the returned `execute` function instead.");
+        useWarnRemovedOption(warnOpts, "onCompleted", "useLazyQuery", "If your `onCompleted` callback sets local state, switch to use derived state using `data` returned from the hook instead. Use `useEffect` to perform side-effects as a result of updates to `data`.");
+        useWarnRemovedOption(warnOpts, "onError", "useLazyQuery", "If your `onError` callback sets local state, switch to use derived state using `data`, `error` or `errors` returned from the hook instead. Use `useEffect` if you need to perform side-effects as a result of updates to `data`, `error` or `errors`.");
+        useWarnRemovedOption(warnOpts, "defaultOptions", "useLazyQuery", "Pass the options directly to the hook instead.");
+        useWarnRemovedOption(warnOpts, "initialFetchPolicy", "useLazyQuery", "Use the `fetchPolicy` option instead.");
+        useWarnRemovedOption(warnOpts, "partialRefetch", "useLazyQuery");
+    }
     var execOptionsRef = React__namespace.useRef(void 0);
     var optionsRef = React__namespace.useRef(void 0);
     var queryRef = React__namespace.useRef(void 0);
@@ -470,6 +651,11 @@ function useLazyQuery(query, options) {
         var _loop_1 = function (key) {
             var method = obsQueryFields[key];
             eagerMethods[key] = function () {
+                if (globalThis.__DEV__ !== false) {
+                    if (key === "reobserve") {
+                        globalThis.__DEV__ !== false && invariant.warn(69);
+                    }
+                }
                 if (!execOptionsRef.current) {
                     execOptionsRef.current = Object.create(null);
                     forceUpdateState();
@@ -485,7 +671,28 @@ function useLazyQuery(query, options) {
     }, [forceUpdateState, obsQueryFields]);
     var called = !!execOptionsRef.current;
     var result = React__namespace.useMemo(function () { return (tslib.__assign(tslib.__assign(tslib.__assign({}, useQueryResult), eagerMethods), { called: called })); }, [useQueryResult, eagerMethods, called]);
+    var calledDuringRender = useRenderGuard();
+    var warnRef = React__namespace.useRef(new Set());
     var execute = React__namespace.useCallback(function (executeOptions) {
+        if (globalThis.__DEV__ !== false) {
+            if (calledDuringRender()) {
+                globalThis.__DEV__ !== false && invariant.warn(70);
+            }
+            for (var _i = 0, REMOVED_EXECUTE_OPTIONS_1 = REMOVED_EXECUTE_OPTIONS; _i < REMOVED_EXECUTE_OPTIONS_1.length; _i++) {
+                var name_1 = REMOVED_EXECUTE_OPTIONS_1[_i];
+                if (!warnRef.current.has(name_1)) {
+                    warnRemovedOption(executeOptions || {}, name_1, "useLazyQuery.execute");
+                    warnRef.current.add(name_1);
+                }
+            }
+            for (var _a = 0, DEPRECATED_EXECUTE_OPTIONS_1 = DEPRECATED_EXECUTE_OPTIONS; _a < DEPRECATED_EXECUTE_OPTIONS_1.length; _a++) {
+                var name_2 = DEPRECATED_EXECUTE_OPTIONS_1[_a];
+                if (!warnRef.current.has(name_2)) {
+                    warnRemovedOption(executeOptions || {}, name_2, "useLazyQuery.execute", "Please pass the option to the `useLazyQuery` hook instead.");
+                    warnRef.current.add(name_2);
+                }
+            }
+        }
         execOptionsRef.current =
             executeOptions ? tslib.__assign(tslib.__assign({}, executeOptions), { fetchPolicy: executeOptions.fetchPolicy || initialFetchPolicy }) : {
                 fetchPolicy: initialFetchPolicy,
@@ -495,6 +702,7 @@ function useLazyQuery(query, options) {
         promise.catch(function () { });
         return promise;
     }, [
+        calledDuringRender,
         client,
         document,
         eagerMethods,
@@ -538,6 +746,9 @@ function executeQuery(resultData, observable, client, currentQuery, options, onQ
 }
 
 function useMutation(mutation, options) {
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(options || {}, "ignoreResults", "useMutation", "If you don't want to synchronize component state with the mutation, please use the `useApolloClient` hook to get the client instance and call `client.mutate` directly.");
+    }
     var client = useApolloClient(options === null || options === void 0 ? void 0 : options.client);
     parser.verifyDocumentType(mutation, parser.DocumentType.Mutation);
     var _a = React__namespace.useState({
@@ -656,10 +867,10 @@ function useSubscription(subscription, options) {
     if (!hasIssuedDeprecationWarningRef.current) {
         hasIssuedDeprecationWarningRef.current = true;
         if (options.onSubscriptionData) {
-            globalThis.__DEV__ !== false && globals.invariant.warn(options.onData ? 61 : 62);
+            globalThis.__DEV__ !== false && globals.invariant.warn(options.onData ? 74 : 75);
         }
         if (options.onSubscriptionComplete) {
-            globalThis.__DEV__ !== false && globals.invariant.warn(options.onComplete ? 63 : 64);
+            globalThis.__DEV__ !== false && globals.invariant.warn(options.onComplete ? 76 : 77);
         }
     }
     var skip = options.skip, fetchPolicy = options.fetchPolicy, errorPolicy = options.errorPolicy, shouldResubscribe = options.shouldResubscribe, context = options.context, extensions = options.extensions, ignoreResults = options.ignoreResults;
@@ -780,7 +991,7 @@ function useSubscription(subscription, options) {
             : fallbackResult;
     }, function () { return fallbackResult; });
     var restart = React__namespace.useCallback(function () {
-        globals.invariant(!optionsRef.current.skip, 65);
+        globals.invariant(!optionsRef.current.skip, 78);
         setObservable(recreateRef.current());
     }, [optionsRef, recreateRef]);
     return React__namespace.useMemo(function () { return (tslib.__assign(tslib.__assign({}, ret), { restart: restart })); }, [ret, restart]);
@@ -828,6 +1039,9 @@ function useFragment(options) {
     useFragment_, useApolloClient(options.client))(options);
 }
 function useFragment_(options) {
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(options, "canonizeResults", "useFragment");
+    }
     var client = useApolloClient(options.client);
     var cache = client.cache;
     var from = options.from, rest = tslib.__rest(options, ["from"]);
@@ -848,7 +1062,9 @@ function useFragment_(options) {
             };
         }
         var cache = client.cache;
-        var diff = cache.diff(tslib.__assign(tslib.__assign({}, stableOptions), { returnPartialData: true, id: from, query: cache["getFragmentDoc"](fragment, fragmentName), optimistic: optimistic }));
+        var diff = muteDeprecations("canonizeResults", function () {
+            return cache.diff(tslib.__assign(tslib.__assign({}, stableOptions), { returnPartialData: true, id: from, query: cache["getFragmentDoc"](fragment, fragmentName), optimistic: optimistic }));
+        });
         return {
             result: diffToResult(tslib.__assign(tslib.__assign({}, diff), { result: client["queryManager"].maskFragment({
                     fragment: fragment,
@@ -860,17 +1076,19 @@ function useFragment_(options) {
     var getSnapshot = React__namespace.useCallback(function () { return diff.result; }, [diff]);
     return useSyncExternalStore(React__namespace.useCallback(function (forceUpdate) {
         var lastTimeout = 0;
-        var subscription = stableOptions.from === null ?
-            null
-            : client.watchFragment(stableOptions).subscribe({
-                next: function (result) {
-                    if (equal__default(result, diff.result))
-                        return;
-                    diff.result = result;
-                    clearTimeout(lastTimeout);
-                    lastTimeout = setTimeout(forceUpdate);
-                },
-            });
+        var subscription = muteDeprecations("canonizeResults", function () {
+            return stableOptions.from === null ?
+                null
+                : client.watchFragment(stableOptions).subscribe({
+                    next: function (result) {
+                        if (equal__default(result, diff.result))
+                            return;
+                        diff.result = result;
+                        clearTimeout(lastTimeout);
+                        lastTimeout = setTimeout(forceUpdate);
+                    },
+                });
+        });
         return function () {
             subscription === null || subscription === void 0 ? void 0 : subscription.unsubscribe();
             clearTimeout(lastTimeout);
@@ -896,6 +1114,9 @@ function useSuspenseQuery(query, options) {
     useSuspenseQuery_, useApolloClient(typeof options === "object" ? options.client : undefined))(query, options);
 }
 function useSuspenseQuery_(query, options) {
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(typeof options === "symbol" ? {} : options, "canonizeResults", "useSuspenseQuery");
+    }
     var client = useApolloClient(options.client);
     var suspenseCache = internal.getSuspenseCache(client);
     var watchQueryOptions = useWatchQueryOptions({
@@ -909,8 +1130,10 @@ function useSuspenseQuery_(query, options) {
         query,
         cache.canonicalStringify(variables)
     ], [].concat(queryKey), true);
-    var queryRef = suspenseCache.getQueryRef(cacheKey, function () {
-        return client.watchQuery(watchQueryOptions);
+    var queryRef = muteDeprecations("canonizeResults", function () {
+        return suspenseCache.getQueryRef(cacheKey, function () {
+            return client.watchQuery(watchQueryOptions);
+        });
     });
     var _b = React__namespace.useState([queryRef.key, queryRef.promise]), current = _b[0], setPromise = _b[1];
     if (current[0] !== queryRef.key) {
@@ -979,11 +1202,11 @@ function validateFetchPolicy(fetchPolicy) {
         "no-cache",
         "cache-and-network",
     ];
-    globals.invariant(supportedFetchPolicies.includes(fetchPolicy), 66, fetchPolicy);
+    globals.invariant(supportedFetchPolicies.includes(fetchPolicy), 79, fetchPolicy);
 }
 function validatePartialDataReturn(fetchPolicy, returnPartialData) {
     if (fetchPolicy === "no-cache" && returnPartialData) {
-        globalThis.__DEV__ !== false && globals.invariant.warn(67);
+        globalThis.__DEV__ !== false && globals.invariant.warn(80);
     }
 }
 function toApolloError(result) {
@@ -1018,6 +1241,9 @@ function useBackgroundQuery(query, options) {
     useBackgroundQuery_, useApolloClient(typeof options === "object" ? options.client : undefined))(query, options);
 }
 function useBackgroundQuery_(query, options) {
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(typeof options === "symbol" ? {} : options, "canonizeResults", "useBackgroundQuery");
+    }
     var client = useApolloClient(options.client);
     var suspenseCache = internal.getSuspenseCache(client);
     var watchQueryOptions = useWatchQueryOptions({ client: client, query: query, options: options });
@@ -1029,8 +1255,10 @@ function useBackgroundQuery_(query, options) {
         query,
         cache.canonicalStringify(variables)
     ], [].concat(queryKey), true);
-    var queryRef = suspenseCache.getQueryRef(cacheKey, function () {
-        return client.watchQuery(watchQueryOptions);
+    var queryRef = muteDeprecations("canonizeResults", function () {
+        return suspenseCache.getQueryRef(cacheKey, function () {
+            return client.watchQuery(watchQueryOptions);
+        });
     });
     var _b = React__namespace.useState(internal.wrapQueryRef(queryRef)), wrappedQueryRef = _b[0], setWrappedQueryRef = _b[1];
     if (internal.unwrapQueryRef(wrappedQueryRef) !== queryRef) {
@@ -1112,6 +1340,9 @@ function useSuspenseFragment_(options) {
 
 function useLoadableQuery(query, options) {
     if (options === void 0) { options = Object.create(null); }
+    if (globalThis.__DEV__ !== false) {
+        useWarnRemovedOption(options, "canonizeResults", "useLoadableQuery");
+    }
     var client = useApolloClient(options.client);
     var suspenseCache = internal.getSuspenseCache(client);
     var watchQueryOptions = useWatchQueryOptions({ client: client, query: query, options: options });
@@ -1145,14 +1376,16 @@ function useLoadableQuery(query, options) {
         for (var _i = 0; _i < arguments.length; _i++) {
             args[_i] = arguments[_i];
         }
-        globals.invariant(!calledDuringRender(), 59);
+        globals.invariant(!calledDuringRender(), 71);
         var variables = args[0];
         var cacheKey = tslib.__spreadArray([
             query,
             cache.canonicalStringify(variables)
         ], [].concat(queryKey), true);
-        var queryRef = suspenseCache.getQueryRef(cacheKey, function () {
-            return client.watchQuery(tslib.__assign(tslib.__assign({}, watchQueryOptions), { variables: variables }));
+        var queryRef = muteDeprecations("canonizeResults", function () {
+            return suspenseCache.getQueryRef(cacheKey, function () {
+                return client.watchQuery(tslib.__assign(tslib.__assign({}, watchQueryOptions), { variables: variables }));
+            });
         });
         setQueryRef(internal.wrapQueryRef(queryRef));
     }, [
@@ -1164,7 +1397,7 @@ function useLoadableQuery(query, options) {
         client,
     ]);
     var subscribeToMore = React__namespace.useCallback(function (options) {
-        globals.invariant(internalQueryRef, 60);
+        globals.invariant(internalQueryRef, 72);
         return internalQueryRef.observable.subscribeToMore(
         options);
     }, [internalQueryRef]);