Skip to content

Commit 1e8190a

Browse files
[Docs] Add frontend/backend tabs for transaction sending examples (#7670)
1 parent aac187a commit 1e8190a

File tree

1 file changed

+41
-5
lines changed
  • apps/portal/src/app/transactions

1 file changed

+41
-5
lines changed

apps/portal/src/app/transactions/page.mdx

Lines changed: 41 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -146,20 +146,56 @@ Send, monitor, and manage transactions. Send transactions from user or server wa
146146

147147
### Send a Transaction
148148

149-
Send a transaction from a [user wallet](/connect/wallet/sign-in-methods/configure) or [server wallet](/connect/wallet/server) using the [`sendTransaction`](/references/typescript/v5/sendTransaction) function.
149+
Send a transaction from a [user wallet](/connect/wallet/sign-in-methods/configure) from the frontend, or [server wallet](/connect/wallet/server) from the backend.
150150

151-
The `account` parameter is the wallet that will be used to send the transaction. You can get an account object from a user wallet or a server wallet.
151+
<Tabs defaultValue="frontend">
152+
<TabsList>
153+
<TabsTrigger value="frontend">Frontend</TabsTrigger>
154+
<TabsTrigger value="backend">Backend</TabsTrigger>
155+
</TabsList>
156+
157+
<TabsContent value="frontend">
158+
On the frontend, you can use the [`sendTransaction`](/references/typescript/v5/sendTransaction) function to send a transaction from user wallets. The `account` parameter is the wallet that will be used to send the transaction. You can get an account object from a user wallet or a server wallet.
152159

153160
```typescript
154161
import { sendTransaction } from "thirdweb";
155162

163+
// connect user wallet
164+
const wallet = inAppWallet();
165+
const account = await wallet.connect({ client });
166+
167+
// send transaction
156168
const { transactionHash } = await sendTransaction({
157-
account: wallet.getAccount(),
169+
account,
158170
transaction,
159171
});
160172

161173
console.log("transaction sent", transactionHash);
162174
```
175+
</TabsContent>
176+
177+
<TabsContent value="backend">
178+
On the backend, you can use the server wallet to enqueue a transaction. Enqueued transactions is recommended to not block your server. You can then monitor the transaction status using the [transaction monitor](/transactions/monitor) API.
179+
180+
```typescript
181+
import { Engine } from "thirdweb";
182+
183+
// get a server wallet
184+
const wallet = Engine.serverWallet({
185+
client,
186+
address: "0x...",
187+
});
188+
189+
// enqueue a transaction
190+
const { transactionId } = await wallet.enqueueTransaction({
191+
transaction,
192+
simulate: true, // optional, if you want to simulate the transaction before enqueuing it
193+
});
194+
195+
console.log("transaction enqueued", transactionId);
196+
```
197+
</TabsContent>
198+
</Tabs>
163199

164200
</TabsContent>
165201

@@ -434,8 +470,8 @@ Send, monitor, and manage transactions. Send transactions from user or server wa
434470
{
435471
try {
436472
var contract = await ThirdwebManager.Instance.GetContract(
437-
address: "contract-address",
438-
chainId: 1,
473+
address: "contract-address",
474+
chainId: 1,
439475
abi: "optional-abi"
440476
);
441477

0 commit comments

Comments
 (0)