From a12edba5a8048a46e0682cdfb29cd741c6f30f77 Mon Sep 17 00:00:00 2001
From: Lenz Weber-Tronic <lorenz.weber-tronic@apollographql.com>
Date: Thu, 20 Jun 2024 13:54:22 +0200
Subject: [PATCH] `useMutation`: use `useIsomorphicLayoutEffect` instead of
 `useLayoutEffect`

---
 .changeset/clean-icons-sparkle.md | 5 +++++
 .size-limits.json                 | 2 +-
 src/react/hooks/useMutation.ts    | 3 ++-
 3 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/clean-icons-sparkle.md

diff --git a/.changeset/clean-icons-sparkle.md b/.changeset/clean-icons-sparkle.md
new file mode 100644
index 00000000000..15ff01dbf8d
--- /dev/null
+++ b/.changeset/clean-icons-sparkle.md
@@ -0,0 +1,5 @@
+---
+"@apollo/client": patch
+---
+
+`useMutation`: use `useIsomorphicLayoutEffect` instead of `useLayoutEffect`
diff --git a/.size-limits.json b/.size-limits.json
index 5c28672b1f7..4db1f2681bf 100644
--- a/.size-limits.json
+++ b/.size-limits.json
@@ -1,4 +1,4 @@
 {
-  "dist/apollo-client.min.cjs": 39561,
+  "dist/apollo-client.min.cjs": 39579,
   "import { ApolloClient, InMemoryCache, HttpLink } from \"dist/index.js\" (production)": 32821
 }
diff --git a/src/react/hooks/useMutation.ts b/src/react/hooks/useMutation.ts
index 65f0820e015..ea0f47ddc6c 100644
--- a/src/react/hooks/useMutation.ts
+++ b/src/react/hooks/useMutation.ts
@@ -20,6 +20,7 @@ import { equal } from "@wry/equality";
 import { DocumentType, verifyDocumentType } from "../parser/index.js";
 import { ApolloError } from "../../errors/index.js";
 import { useApolloClient } from "./useApolloClient.js";
+import { useIsomorphicLayoutEffect } from "./internal/useIsomorphicLayoutEffect.js";
 
 /**
  *
@@ -99,7 +100,7 @@ export function useMutation<
     options,
   });
 
-  React.useLayoutEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     Object.assign(ref.current, { client, options, mutation });
   });