wagmi-extended 1.1.6 → 1.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +27 -4
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -111,6 +111,11 @@ Example:
|
|
|
111
111
|
function MyTransactionComponent() {
|
|
112
112
|
const { writeContractAsync, isPending, errorMessage } = useContractWriteX({
|
|
113
113
|
queriesToInvalidate: [["userBalance"], ["userActivity"]],
|
|
114
|
+
{
|
|
115
|
+
// use calbacks here in writeContractAsync or in useContractWriteX
|
|
116
|
+
onSuccess: (txHash) => console.log("Transaction successful:", txHash),
|
|
117
|
+
onError: (error) => console.error("Transaction error:", error),
|
|
118
|
+
}
|
|
114
119
|
});
|
|
115
120
|
|
|
116
121
|
const handleWrite = async () => {
|
|
@@ -120,10 +125,6 @@ const handleWrite = async () => {
|
|
|
120
125
|
abi: [], // Provide your contract ABI
|
|
121
126
|
functionName: "executeFunction",
|
|
122
127
|
args: [/* function arguments */],
|
|
123
|
-
}, {
|
|
124
|
-
// use calbacks here in writeContractAsync or in useContractWriteX
|
|
125
|
-
onSuccess: (txHash) => console.log("Transaction successful:", txHash),
|
|
126
|
-
onError: (error) => console.error("Transaction error:", error),
|
|
127
128
|
});
|
|
128
129
|
console.log("Received txHash:", txHash);
|
|
129
130
|
} catch (err) {
|
|
@@ -142,6 +143,28 @@ return (
|
|
|
142
143
|
}
|
|
143
144
|
```
|
|
144
145
|
|
|
146
|
+
**Important:** To ensure transaction receipts are awaited correctly, **all settings and callbacks must be passed inside the hook itself**, not inside `mutate` or `mutateAsync` calls.
|
|
147
|
+
|
|
148
|
+
Example of correct usage:
|
|
149
|
+
|
|
150
|
+
```ts
|
|
151
|
+
const { writeContractAsync } = useContractWriteX({
|
|
152
|
+
queriesToInvalidate: [["userBalance"]],
|
|
153
|
+
onSuccess: (txHash) => console.log("Tx success:", txHash),
|
|
154
|
+
onError: (err) => console.error("Tx error:", err),
|
|
155
|
+
});
|
|
156
|
+
```
|
|
157
|
+
|
|
158
|
+
**Avoid passing callbacks like this:**
|
|
159
|
+
|
|
160
|
+
```ts
|
|
161
|
+
await writeContractAsync(config, {
|
|
162
|
+
onSuccess: () => {}, // ❌ This will NOT guarantee receipt handling!
|
|
163
|
+
});
|
|
164
|
+
```
|
|
165
|
+
|
|
166
|
+
This design ensures that `wagmi-extended` can properly track and wait for the transaction receipt, giving your app reliable post-transaction state.
|
|
167
|
+
|
|
145
168
|
### useSendTransactionX Hook
|
|
146
169
|
|
|
147
170
|
The `useSendTransactionX` hook wraps the transaction-sending functionality from Wagmi with additional features like `receipt` waiting, `logging` control, and `query invalidation` after receipt is successfully fetched.
|