From 7965b4ba42be3be860f4b8fe6e04e850c25835ec Mon Sep 17 00:00:00 2001
From: o-az <omaraziz.dev@proton.me>
Date: Sun, 8 Mar 2026 22:41:04 -0700
Subject: [PATCH 1/4] chore: update wagmi `.connect` to `.mutate`

---
 src/components/ConnectWallet.tsx                     | 2 +-
 src/components/guides/Demo.tsx                       | 4 ++--
 src/components/guides/EmbedPasskeys.tsx              | 4 ++--
 src/components/guides/steps/wallet/ConnectWallet.tsx | 2 +-
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/ConnectWallet.tsx b/src/components/ConnectWallet.tsx
index 3b121866..a3831718 100644
--- a/src/components/ConnectWallet.tsx
+++ b/src/components/ConnectWallet.tsx
@@ -27,7 +27,7 @@ export function ConnectWallet({ showAddChain = true }: { showAddChain?: boolean
             variant="default"
             className="flex items-center gap-1.5"
             key={connector.id}
-            onClick={() => connect.connect({ connector })}
+            onClick={() => connect.mutate({ connector })}
           >
             {connector.icon ? (
               <img className="size-5" src={connector.icon} alt={connector.name} />
diff --git a/src/components/guides/Demo.tsx b/src/components/guides/Demo.tsx
index ac2ebb2e..0b202493 100644
--- a/src/components/guides/Demo.tsx
+++ b/src/components/guides/Demo.tsx
@@ -377,7 +377,7 @@ export function Login() {
           <Button
             variant="accent"
             className="font-normal text-[14px] -tracking-[2%]"
-            onClick={() => connect.connect({ connector })}
+            onClick={() => connect.mutate({ connector })}
             type="button"
           >
             Sign in
@@ -386,7 +386,7 @@ export function Login() {
             variant="default"
             className="font-normal text-[14px] -tracking-[2%]"
             onClick={() =>
-              connect.connect({
+              connect.mutate({
                 connector,
                 capabilities: {
                   label: 'Tempo Docs',
diff --git a/src/components/guides/EmbedPasskeys.tsx b/src/components/guides/EmbedPasskeys.tsx
index a11585b0..4526c5c3 100644
--- a/src/components/guides/EmbedPasskeys.tsx
+++ b/src/components/guides/EmbedPasskeys.tsx
@@ -37,7 +37,7 @@ export function SignInButtons() {
         variant="accent"
         onClick={async () => {
           await disconnect.disconnectAsync().catch(() => {})
-          connect.connect({
+          connect.mutate({
             connector,
             capabilities: {
               label: 'Tempo Docs',
@@ -53,7 +53,7 @@ export function SignInButtons() {
         variant="default"
         onClick={async () => {
           await disconnect.disconnectAsync().catch(() => {})
-          connect.connect({ connector })
+          connect.mutate({ connector })
         }}
         type="button"
       >
diff --git a/src/components/guides/steps/wallet/ConnectWallet.tsx b/src/components/guides/steps/wallet/ConnectWallet.tsx
index 4567db6c..df614ab2 100644
--- a/src/components/guides/steps/wallet/ConnectWallet.tsx
+++ b/src/components/guides/steps/wallet/ConnectWallet.tsx
@@ -55,7 +55,7 @@ export function ConnectWallet(props: DemoStepProps) {
               variant="default"
               className="flex items-center gap-1.5"
               key={conn.id}
-              onClick={() => connect.connect({ connector: conn })}
+              onClick={() => connect.mutate({ connector: conn })}
             >
               {conn.icon ? <img className="size-5" src={conn.icon} alt={conn.name} /> : <div />}
               {conn.name}

From 1e2dd2caabdf5403a6d0a33c9e35f11ba75240a6 Mon Sep 17 00:00:00 2001
From: o-az <omaraziz.dev@proton.me>
Date: Sun, 8 Mar 2026 22:42:13 -0700
Subject: [PATCH 2/4] chore: update wagmi `.connect` to `.mutate` in mdx

---
 src/pages/guide/use-accounts/connect-to-wallets.mdx | 2 +-
 src/pages/guide/use-accounts/embed-passkeys.mdx     | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/guide/use-accounts/connect-to-wallets.mdx b/src/pages/guide/use-accounts/connect-to-wallets.mdx
index f950a0dd..bd8d424d 100644
--- a/src/pages/guide/use-accounts/connect-to-wallets.mdx
+++ b/src/pages/guide/use-accounts/connect-to-wallets.mdx
@@ -89,7 +89,7 @@ export function Connect() {
       {connectors.map((connector) => (
         <button
           key={connector.id}
-          onClick={() => connect.connect({ connector })}
+          onClick={() => connect.mutate({ connector })}
           type="button"
         >
           {connector.name}
diff --git a/src/pages/guide/use-accounts/embed-passkeys.mdx b/src/pages/guide/use-accounts/embed-passkeys.mdx
index e7097bc4..78f24d46 100644
--- a/src/pages/guide/use-accounts/embed-passkeys.mdx
+++ b/src/pages/guide/use-accounts/embed-passkeys.mdx
@@ -109,7 +109,7 @@ export function Example() {
     <div>
       <button
         onClick={() =>
-          connect.connect({
+          connect.mutate({
             connector,
             capabilities: { type: 'sign-up' },
           })
@@ -118,7 +118,7 @@ export function Example() {
         Sign up
       </button>
 
-      <button onClick={() => connect.connect({ connector })}>
+      <button onClick={() => connect.mutate({ connector })}>
         Sign in
       </button>
     </div>
@@ -187,7 +187,7 @@ export function Example() {
     <div>
       <button
         onClick={() =>
-          connect.connect({
+          connect.mutate({
             connector,
             capabilities: { type: 'sign-up' },
           })
@@ -196,7 +196,7 @@ export function Example() {
         Sign up
       </button>
 
-      <button onClick={() => connect.connect({ connector })}>
+      <button onClick={() => connect.mutate({ connector })}>
         Sign in
       </button>
     </div>

From 680875944ccf683b8ee910295291cf99ee79ed16 Mon Sep 17 00:00:00 2001
From: o-az <omaraziz.dev@proton.me>
Date: Sun, 8 Mar 2026 22:46:42 -0700
Subject: [PATCH 3/4] chore: update wagmi `.disconnect` to `.mutate`

---
 src/components/guides/Demo.tsx                       | 6 +++---
 src/components/guides/EmbedPasskeys.tsx              | 6 +++---
 src/components/guides/steps/wallet/ConnectWallet.tsx | 2 +-
 src/pages/guide/use-accounts/connect-to-wallets.mdx  | 4 ++--
 src/pages/guide/use-accounts/embed-passkeys.mdx      | 2 +-
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/components/guides/Demo.tsx b/src/components/guides/Demo.tsx
index 0b202493..ed51e694 100644
--- a/src/components/guides/Demo.tsx
+++ b/src/components/guides/Demo.tsx
@@ -107,8 +107,8 @@ export function Container(
   const connections = useConnections()
   const disconnect = useDisconnect()
   const restart = React.useCallback(() => {
-    disconnect.disconnect()
-  }, [disconnect.disconnect, disconnect])
+    disconnect.mutate()
+  }, [disconnect.mutate, disconnect])
 
   const balanceAddress = React.useMemo(() => {
     if (props.footerVariant !== 'balances') return address
@@ -434,7 +434,7 @@ export function Logout() {
         variant="destructive"
         className="font-normal text-[14px] -tracking-[2%]"
         onClick={() => {
-          disconnect.disconnect({ connector })
+          disconnect.mutate({ connector })
           trackButtonClick('Sign out', 'destructive')
         }}
         type="button"
diff --git a/src/components/guides/EmbedPasskeys.tsx b/src/components/guides/EmbedPasskeys.tsx
index 4526c5c3..2119af8d 100644
--- a/src/components/guides/EmbedPasskeys.tsx
+++ b/src/components/guides/EmbedPasskeys.tsx
@@ -11,7 +11,7 @@ export function EmbedPasskeys() {
   if (account.address)
     return (
       <div className="flex items-center gap-2">
-        <Button onClick={() => disconnect.disconnect()} variant="destructive">
+        <Button onClick={() => disconnect.mutate()} variant="destructive">
           Sign out
         </Button>
       </div>
@@ -36,7 +36,7 @@ export function SignInButtons() {
       <Button
         variant="accent"
         onClick={async () => {
-          await disconnect.disconnectAsync().catch(() => {})
+          await disconnect.mutateAsync().catch(() => {})
           connect.mutate({
             connector,
             capabilities: {
@@ -52,7 +52,7 @@ export function SignInButtons() {
       <Button
         variant="default"
         onClick={async () => {
-          await disconnect.disconnectAsync().catch(() => {})
+          await disconnect.mutateAsync().catch(() => {})
           connect.mutate({ connector })
         }}
         type="button"
diff --git a/src/components/guides/steps/wallet/ConnectWallet.tsx b/src/components/guides/steps/wallet/ConnectWallet.tsx
index df614ab2..b82f6bef 100644
--- a/src/components/guides/steps/wallet/ConnectWallet.tsx
+++ b/src/components/guides/steps/wallet/ConnectWallet.tsx
@@ -84,7 +84,7 @@ export function ConnectWallet(props: DemoStepProps) {
           <Button
             variant="destructive"
             className="font-normal text-[14px] -tracking-[2%]"
-            onClick={() => disconnect.disconnect({ connector: walletConnector })}
+            onClick={() => disconnect.mutate({ connector: walletConnector })}
             type="button"
           >
             Disconnect
diff --git a/src/pages/guide/use-accounts/connect-to-wallets.mdx b/src/pages/guide/use-accounts/connect-to-wallets.mdx
index bd8d424d..03a59db8 100644
--- a/src/pages/guide/use-accounts/connect-to-wallets.mdx
+++ b/src/pages/guide/use-accounts/connect-to-wallets.mdx
@@ -152,7 +152,7 @@ export function Account() {
       <div>
         {account.address?.slice(0, 6)}...{account.address?.slice(-4)}
       </div>
-      <button onClick={() => disconnect.disconnect()}>
+      <button onClick={() => disconnect.mutate()}>
         Sign out
       </button>
     </div>
@@ -212,7 +212,7 @@ export function Account() {
       <div>
         {account.address?.slice(0, 6)}...{account.address?.slice(-4)}
       </div>
-      <button onClick={() => disconnect.disconnect()}>
+      <button onClick={() => disconnect.mutate()}>
         Sign out
       </button>
 
diff --git a/src/pages/guide/use-accounts/embed-passkeys.mdx b/src/pages/guide/use-accounts/embed-passkeys.mdx
index 78f24d46..bea26900 100644
--- a/src/pages/guide/use-accounts/embed-passkeys.mdx
+++ b/src/pages/guide/use-accounts/embed-passkeys.mdx
@@ -179,7 +179,7 @@ export function Example() {
     return ( // [!code ++]
       <div> {/* [!code ++] */}
         <div>{account.address.slice(0, 6)}...{account.address.slice(-4)}</div> {/* [!code ++] */}
-        <button onClick={() => disconnect.disconnect()}>Sign out</button> {/* [!code ++] */}
+        <button onClick={() => disconnect.mutate()}>Sign out</button> {/* [!code ++] */}
       </div> {/* [!code ++] */}
     ) // [!code ++]
 

From bea59fd8694dd91b62bd4e3e49b99687d19123e8 Mon Sep 17 00:00:00 2001
From: o-az <omaraziz.dev@proton.me>
Date: Sun, 8 Mar 2026 23:37:21 -0700
Subject: [PATCH 4/4] fix: line highlight

---
 src/pages/guide/use-accounts/embed-passkeys.mdx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/guide/use-accounts/embed-passkeys.mdx b/src/pages/guide/use-accounts/embed-passkeys.mdx
index bea26900..4cb35f0b 100644
--- a/src/pages/guide/use-accounts/embed-passkeys.mdx
+++ b/src/pages/guide/use-accounts/embed-passkeys.mdx
@@ -180,7 +180,7 @@ export function Example() {
       <div> {/* [!code ++] */}
         <div>{account.address.slice(0, 6)}...{account.address.slice(-4)}</div> {/* [!code ++] */}
         <button onClick={() => disconnect.mutate()}>Sign out</button> {/* [!code ++] */}
-      </div> {/* [!code ++] */}
+      </div> // [!code ++]
     ) // [!code ++]
 
   return (
@@ -262,7 +262,7 @@ export function Example() {
   const disconnect = useDisconnect()
 
   if (connect.isPending) // [!code ++]
-    return <div>Check prompt...</div> {/* [!code ++] */}
+    return <div>Check prompt...</div> // [!code ++]
   return (/* ... */)
 }
 ```
@@ -290,7 +290,7 @@ export function Example() {
   const disconnect = useDisconnect()
 
   if (connect.error) // [!code ++]
-    return <div>Error: {connect.error.message}</div> {/* [!code ++] */}
+    return <div>Error: {connect.error.message}</div> // [!code ++]
   return (/* ... */)
 }
 ```