@apollo/client 3.11.4 → 3.11.5

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @apollo/client
 
+## 3.11.5
+
+### Patch Changes
+
+- [#12027](https://github.com/apollographql/apollo-client/pull/12027) [`eb3e21b`](https://github.com/apollographql/apollo-client/commit/eb3e21b9f7fa6a3161705c2c7270129c17b65095) Thanks [@JavaScriptBach](https://github.com/JavaScriptBach)! - Type `MutationResult.reset` as an arrow function
+
+- [#12020](https://github.com/apollographql/apollo-client/pull/12020) [`82d8cb4`](https://github.com/apollographql/apollo-client/commit/82d8cb4255be497748829f12eb25ac87c11ee5e4) Thanks [@jerelmiller](https://github.com/jerelmiller)! - Better conform to Rules of React by avoiding write of ref in render for `useFragment`.
+
 ## 3.11.4
 
 ### Patch Changes

package/apollo-client.cjs

@@ -31,7 +31,7 @@ function _interopNamespace(e) {
 var equal__default = /*#__PURE__*/_interopDefaultLegacy(equal);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-var version = "3.11.4";
+var version = "3.11.5";
 
 function maybe(thunk) {
     try {
@@ -7481,15 +7481,6 @@ function useRenderGuard() {
     }, []);
 }
 
-var INIT = {};
-function useLazyRef(getInitialValue) {
-    var ref = React__namespace.useRef(INIT);
-    if (ref.current === INIT) {
-        ref.current = getInitialValue();
-    }
-    return ref;
-}
-
 var useKey = "use";
 var realHook = React__namespace[useKey];
 var __use = realHook ||
@@ -8193,23 +8184,20 @@ function useFragment(options) {
 }
 function _useFragment(options) {
     var cache = useApolloClient(options.client).cache;
-    var diffOptions = useDeepMemo(function () {
-        var fragment = options.fragment, fragmentName = options.fragmentName, from = options.from, _a = options.optimistic, optimistic = _a === void 0 ? true : _a, rest = tslib.__rest(options, ["fragment", "fragmentName", "from", "optimistic"]);
-        return tslib.__assign(tslib.__assign({}, rest), { returnPartialData: true, id: typeof from === "string" ? from : cache.identify(from), query: cache["getFragmentDoc"](fragment, fragmentName), optimistic: optimistic });
-    }, [options]);
-    var resultRef = useLazyRef(function () {
-        return diffToResult(cache.diff(diffOptions));
-    });
-    var stableOptions = useDeepMemo(function () { return options; }, [options]);
-    React__namespace.useMemo(function () {
-        resultRef.current = diffToResult(cache.diff(diffOptions));
-    }, [diffOptions, cache]);
-    var getSnapshot = React__namespace.useCallback(function () { return resultRef.current; }, []);
+    var from = options.from, rest = tslib.__rest(options, ["from"]);
+    var id = React__namespace.useMemo(function () { return (typeof from === "string" ? from : cache.identify(from)); }, [cache, from]);
+    var resultRef = React__namespace.useRef();
+    var stableOptions = useDeepMemo(function () { return (tslib.__assign(tslib.__assign({}, rest), { from: id })); }, [rest, id]);
+    var currentDiff = React__namespace.useMemo(function () {
+        var fragment = stableOptions.fragment, fragmentName = stableOptions.fragmentName, from = stableOptions.from, _a = stableOptions.optimistic, optimistic = _a === void 0 ? true : _a;
+        return diffToResult(cache.diff(tslib.__assign(tslib.__assign({}, stableOptions), { returnPartialData: true, id: from, query: cache["getFragmentDoc"](fragment, fragmentName), optimistic: optimistic })));
+    }, [stableOptions, cache]);
+    var getSnapshot = React__namespace.useCallback(function () { return resultRef.current || currentDiff; }, [currentDiff]);
     return useSyncExternalStore(React__namespace.useCallback(function (forceUpdate) {
         var lastTimeout = 0;
         var subscription = cache.watchFragment(stableOptions).subscribe({
             next: function (result) {
-                if (equal__default(result, resultRef.current))
+                if (equal__default(result, currentDiff))
                     return;
                 resultRef.current = result;
                 clearTimeout(lastTimeout);
@@ -8217,10 +8205,11 @@ function _useFragment(options) {
             },
         });
         return function () {
+            resultRef.current = void 0;
             subscription.unsubscribe();
             clearTimeout(lastTimeout);
         };
-    }, [cache, stableOptions]), getSnapshot, getSnapshot);
+    }, [cache, stableOptions, currentDiff]), getSnapshot, getSnapshot);
 }
 function diffToResult(diff) {
     var result = {