ethereum-optimism · krofax · Jan 22, 2025 · Oct 8, 2024 · Oct 8, 2024 · Oct 8, 2024
diff --git a/pages/builders/app-developers/transactions/estimates.mdx b/pages/builders/app-developers/transactions/estimates.mdx
@@ -25,7 +25,7 @@ Steps are provided here for reference and convenience, but you can use the same
 
 A transaction's execution gas fee is exactly the same fee that you would pay for the same transaction on Ethereum.
 This fee is equal to the amount of gas used by the transaction multiplied by the gas price attached to the transaction.
-Refer to the guide on [Transaction Fees on OP Mainnet](./fees#execution-gas-fee) for more information about the execution gas fee.
+Refer to the guide on [Transaction Fees on OP Mainnet](./fees#execution-gasfee) for more information about the execution gas fee.
 
 When estimating the execution gas fee for a transaction, you'll need to know the gas limit and the [max fee per gas](https://ethereum.org/en/developers/docs/gas/#maxfee) for the transaction.
 Your transaction fee will then be the product of these two values.

@@ -1,34 +1,26 @@
 ---
 title: Tracing Deposits and Withdrawals
 lang: en-US
-description: Learn how to use the Optimism SDK to trace deposits and withdrawals between L1 and L2.
+description: Learn how to use the viem library to trace deposits and withdrawals between L1 and L2.
 ---
 
 import { Callout, Steps } from 'nextra/components'
-import { WipCallout } from '@/components/WipCallout'
-
-<WipCallout />
-# Tracing Deposits and Withdrawals
 
 
+# Tracing Deposits and Withdrawals
 
-In this tutorial, you'll learn how to use the [Optimism SDK](https://sdk.optimism.io) to trace a [Standard Bridge](../bridging/standard-bridge) deposit or withdrawal between L1 and L2.
+In this tutorial, you'll learn how to use the [viem](https://viem.sh) library to trace a [Standard Bridge](../bridging/standard-bridge) deposit or withdrawal between L1 and L2.
 You'll specifically learn how to determine the status of a deposit or withdrawal and how to retrieve the transaction receipt for the executed transaction on L1 (for withdrawals) or L2 (for deposits).
 
-<Callout>
-Check out the tutorial on [Bridging ERC-20 Tokens With the Optimism SDK](./cross-dom-bridge-erc20) to learn how to create deposits and withdrawals.
-You can also check out the tutorial on [Viewing Deposits and Withdrawals by Address](./sdk-view-txns) to find deposits and withdrawals to trace.
-</Callout>
-
 ## Dependencies
 
 *   [node](https://nodejs.org/en/)
 *   [pnpm](https://pnpm.io/installation)
 
 ## Create a Demo Project
 
-You're going to use the Optimism SDK for this tutorial.
-Since the Optimism SDK is a [Node.js](https://nodejs.org/en/) library, you'll need to create a Node.js project to use it.
+You're going to use the viem library for this tutorial.
+Since viem is a [Node.js](https://nodejs.org/en/) library, you'll need to create a Node.js project to use it.
 
 <Steps>
 
@@ -45,185 +37,136 @@
 pnpm init
 ```
 
-{<h3>Install the Optimism SDK</h3>}
-
-```bash
-pnpm add @eth-optimism/sdk
-```
-
-{<h3>Install ethers.js</h3>}
+{<h3>Install viem and ethers.js</h3>}
 
 ```bash
-pnpm add ethers@^5
+pnpm add viem 
 ```
-
 </Steps>
 
-
 ## Add RPC URLs to Your Environment
 
-You'll be using the `getMessageReceipt` function from the Optimism SDK during this tutorial.
-This function use event queries to retrieve the receipt for a deposit or withdrawal.
+You'll be using the `getTransactionReceipt` function from the viem library during this tutorial. This function use event queries to retrieve the receipt for a deposit or withdrawal.
 Since this function uses large event queries, you'll need to use an RPC provider like [Alchemy](https://alchemy.com) that supports indexed event queries.
 Grab an L1 and L2 RPC URL for Sepolia and OP Sepolia, respectively.
 
 ```bash
-export L1_RPC_URL=... # Sepolia RPC URL
-export L2_RPC_URL=... # OP Sepolia RPC URL
+export L1_RPC_URL="https://rpc.ankr.com/eth_sepolia"
+export L2_RPC_URL="https://sepolia.optimism.io"
 ```
 
-<Callout>
-The Optimism SDK may be updated in the future to use a different method of retrieving deposits and withdrawals under the hood that does not require indexed event queries.
-This tutorial will be updated to reflect those changes if and when they occur.
-</Callout>
-
 ## Start the Node REPL
-
-You're going to use the Node REPL to interact with the Optimism SDK.
-To start the Node REPL run the following command in your terminal:
+You're going to use the Node REPL to interact with viem. To start the Node REPL, run the following command in your terminal:
 
 ```bash
 node
 ```
-
-This will bring up a Node REPL prompt that allows you to run javascript code.
+This will bring up a Node REPL prompt that allows you to run JavaScript code.
 
 ## Import Dependencies
 
 You need to import some dependencies into your Node REPL session.
 
-<Steps>
-
-{<h3>Import the Optimism SDK</h3>}
+{<h3>Import viem</h3>}
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L3 hash=26b2fdb17dd6c8326a54ec51f0769528
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L3 hash=bd7f8fbfa5194b8ec30d6a1e584837ae
 ```
 
-{<h3>Import ethers.js</h3>}
-
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L4 hash=69a65ef97862612e4978b8563e6dbe3a
-```
-
-</Steps>
-
 ## Set Session Variables
-
-You'll need a few variables throughout this tutorial.
-Let's set those up now.
+You'll need a few variables throughout this tutorial. Let's set those up now.
 
 <Steps>
-
 {<h3>Import RPC URLs</h3>}
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L10-L11 hash=02141d8cb077764665c61fc48e18ed04
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L9-L10 hash=0badc18f525e56b36406e7be8ad1104e
 ```
 
 {<h3>Set the deposit to trace</h3>}
 
-You'll be tracing a specific deposit in this tutorial.
-Deposit tracing is generally based on the transaction hash of the transaction that triggered the deposit.
-You can replace this transaction hash with your own if you'd like.
+You'll be tracing a specific deposit in this tutorial. Deposit tracing is generally based on the transaction hash of the transaction that triggered the deposit. You can replace this transaction hash with your own if you'd like.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L14 hash=a874f1ce83255bb233539f7a188ea1d3
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L13 hash=367c797c3e9746addedf43857f789eeb
 ```
 
 {<h3>Set the withdrawal to trace</h3>}
 
-You'll also be tracing a specific withdrawal in this tutorial.
-Like with deposits, withdrawal tracing is generally based on the transaction hash of the transaction that triggered the withdrawal.
-You can replace this transaction hash with your own if you'd like.
+You'll also be tracing a specific withdrawal in this tutorial. Like with deposits, withdrawal tracing is generally based on the transaction hash of the transaction that triggered the withdrawal. You can replace this transaction hash with your own if you'd like.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L15 hash=6c5af039dfa0217810295dfaf82ef7c1
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L14 hash=545d1eed00ad0a235e2c79c8a87efd30
 ```
 
 {<h3>Create the RPC providers</h3>}
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L17-L18 hash=e86efaea1d4adde679ca66911080dc28
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L16-L25 hash=b44b43868a421156320884045294f7ca
 ```
-
 </Steps>
 
-## Create the CrossDomainMessenger
-
-The Optimism SDK exports a `CrossChainMessenger` class that makes it easy to interact with the Standard Bridge contracts.
-
-Create an instance of the `CrossChainMessenger` class:
-
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L20-L25 hash=158c6888c82bdc2f07c37c3edb3a9a6a
-```
-
 ## Trace a Deposit
-
-You can use the `CrossChainMessenger` instance to trace a deposit.
+You can use viem to trace a deposit.
 
 <Steps>
-
 {<h3>Get the deposit status</h3>}
 
-It's often useful to know the status of a deposit.
-Deposits can have a number of statuses depending on where the deposit is within its lifecycle.
-Refer to the [Optimism SDK documentation](https://sdk.optimism.io/enums/messagestatus) for a full list of potential deposit statuses.
+You can query for the deposit status using the transaction hash of the deposit.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L28-L29 hash=11aa5fe48d79feea140691842bf5213c
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L28-L29 hash=1c546e5f36d33c0709f865843449073d
 ```
 
 {<h3>Get the deposit transaction receipt</h3>}
 
-You can also use the `CrossChainMessenger` instance to get the transaction receipt for the L2 transaction that executes and completes the deposit.
-Note that this function will also return the message status of the deposit and is therefore an alternative to the previous function.
-The result of this function is an object with a `messageStatus` property and a `transactionReceipt` property that is identical to the result of the `ethers` function `getTransactionReceipt`.
+Retrieve the transaction receipt for the deposit using the viem client.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L32-L33 hash=42ce77ccd7c2c7c9b447ac534c0daa4f
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L32-L33 hash=7edb6da67c87b3f5738ccc6aee3ba41d
 ```
 
 {<h3>Parse deposit logs</h3>}
 
-Like any other transaction receipt, the deposit transaction receipt contains logs that can be parsed to get additional information about the deposit.
-You can iterate through these logs and parse them just as you would parse any other receipt.
-For instance, you may wish to search for `Mint` events to determine the amount of tokens that were minted as a result of the deposit.
+Parse the logs from the deposit receipt for more detailed information.
+
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L35-L38 hash=984c08d1c0bc06932389d95e8d0b1c12
+```
 
 {<h3>Get the deposit transaction</h3>}
 
-Once you have the transaction receipt, you can directly query for the actual L2 transaction that executed the deposit.
+You can directly query for the L2 transaction that executed the deposit.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L36-L37 hash=13bdc82e94c80eb3c29bf4430b15e456
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L41-L42 hash=6d21745010ed82b60681ecb86b0ce99f
 ```
-
 </Steps>
 
 ## Trace a Withdrawal
-
-You can also use the `CrossChainMessenger` instance to trace a withdrawal.
+You can use viem's functions to trace a withdrawal.
 
 <Steps>
-
 {<h3>Get the withdrawal status</h3>}
 
-Like deposits, withdrawals can have a number of statuses depending on where the withdrawal is within its lifecycle.
-Refer to the [Optimism SDK documentation](https://sdk.optimism.io/enums/messagestatus) for a full list of potential withdrawal statuses.
+Like deposits, withdrawals can have multiple statuses depending on where they are in the process.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L40-L41 hash=24ef2259ff96107ff31bfb8f02a4150a
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L45-L46 hash=5b6da897415978c20691dff09f27f139
 ```
-
 {<h3>Get the withdrawal transaction receipt</h3>}
 
-You can also use the `CrossChainMessenger` instance to get the transaction receipt for the L1 transaction that executes and completes the withdrawal.
-The result of this function is an object with a `messageStatus` property and a `transactionReceipt` property that is identical to the result of the `ethers` function `getTransactionReceipt`.
+Retrieve the L1 transaction receipt for the withdrawal.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L44-L45 hash=e2e9688e7c3cb81740c73f921808cc3e
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L49-L50 hash=a8727db53f18639ab5e7e27f962a3783
 ```
 
 {<h3>Parse withdrawal logs</h3>}
 
-Like any other transaction receipt, the withdrawal transaction receipt contains logs that can be parsed to get additional information about the withdrawal.
-You can iterate through these logs and parse them just as you would parse any other receipt.
-For instance, you may wish to search for `Burn` events to determine the amount of tokens that were burned as a result of the withdrawal.
+Parse the logs from the withdrawal receipt to get more details.
+
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L52-L55 hash=91d31964daa5ce53cf4e61b25b6fade6
+```
 
 {<h3>Get the withdrawal transaction</h3>}
 
-Once you have the transaction receipt, you can directly query for the actual L1 transaction that executed the withdrawal.
+Directly query for the L1 transaction that executed the withdrawal.
 
-```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L48-L49 hash=c138a32f8c1e3c887f19d9bc7e87c73b
+```js file=<rootDir>/public/tutorials/sdk-trace-txns.js#L58-L59 hash=626e0ec238266d05c295056f80f0a6da
 ```
+</Steps> 
 
-</Steps>
+## Next Steps
+
+*   Check out the tutorial on [Bridging ERC-20 Tokens With the Optimism SDK](./cross-dom-bridge-erc20) to learn how to create deposits and withdrawals.
+*   You can also check out the tutorial on [Viewing Deposits and Withdrawals by Address](./sdk-view-txns) to find deposits and withdrawals to trace.
@@ -1,51 +1,61 @@
 (async () => {
 
-const optimism = require("@eth-optimism/sdk")
-const ethers = require("ethers")
+  const { createPublicClient, http } = require('viem');
 
 // Need to use Alchemy or something here because the getDepositsByAddress and
 // getWithdrawalsByAddress functions use a large block range that the public RPC doesn't support
 // because it uses Ankr. Maybe the SDK should be updated to use smaller block ranges depending
 // on the RPC but that's a separate issue.
-const l1RpcUrl = process.env.L1_RPC_URL
-const l2RpcUrl = process.env.L2_RPC_URL
+const l1RpcUrl = process.env.L1_RPC_URL;
+const l2RpcUrl = process.env.L2_RPC_URL;
 
 // Docs CI wallet, will have deposits and withdrawals.
-const deposit = '0x5896d6e4a47b465e0d925723bab838c62ef53468139a5e9ba501efd70f90cccb'
-const withdrawal = '0x18b8b4022b8d9e380fd89417a2e897adadf31e4f41ca17442870bf89ad024f42'
+const depositHash = '0x5896d6e4a47b465e0d925723bab838c62ef53468139a5e9ba501efd70f90cccb'
+const withdrawalHash = '0x18b8b4022b8d9e380fd89417a2e897adadf31e4f41ca17442870bf89ad024f42'
 
-const l1Provider = new ethers.providers.StaticJsonRpcProvider(l1RpcUrl)
-const l2Provider = new ethers.providers.StaticJsonRpcProvider(l2RpcUrl)
+const l1Client = createPublicClient({
+  chain: optimism,
+  transport: http(l1RpcUrl),
+});
 
-const messenger = new optimism.CrossChainMessenger({
-  l1ChainId: 11155111, // 11155111 for Sepolia, 1 for Ethereum
-  l2ChainId: 11155420, // 11155420 for OP Sepolia, 10 for OP Mainnet
-  l1SignerOrProvider: l1Provider,
-  l2SignerOrProvider: l2Provider,
-})
+
+const l2Client = createPublicClient({
+  chain: optimismSepolia,
+  transport: http(l2RpcUrl),
+});
 
 console.log('Grabbing deposit status...')
-const depositStatus = await messenger.getMessageStatus(deposit)
-console.log(depositStatus)
+const depositStatus = await l2Client.getTransactionReceipt({ hash: depositHash });
+console.log(depositStatus);
 
 console.log('Grabbing deposit receipt...')
-const depositReceipt = await messenger.getMessageReceipt(deposit)
-console.log(depositReceipt)
+const depositReceipt = await l2Client.getTransaction({ hash: depositHash });
+console.log(depositReceipt);
+
+const depositLogs = depositReceipt.logs;
+depositLogs.forEach(log => {
+  console.log(log);
+});
 
 console.log('Grabbing deposit txn...')
-const depositTx = await l2Provider.getTransaction(depositReceipt.transactionReceipt.transactionHash)
-console.log(depositTx)
+const depositTransaction = await l2Client.getTransaction({ hash: depositHash });
+console.log(depositTransaction);
 
 console.log('Grabbing withdrawal status...')
-const withdrawalStatus = await messenger.getMessageStatus(withdrawal)
-console.log(withdrawalStatus)
+const withdrawalStatus = await l1Client.getTransactionReceipt({ hash: withdrawalHash });
+console.log(withdrawalStatus);
 
 console.log('Grabbing withdrawal receipt...')
-const withdrawalReceipt = await messenger.getMessageReceipt(withdrawal)
-console.log(withdrawalReceipt)
+const withdrawalReceipt = await l1Client.getTransaction({ hash: withdrawalHash });
+console.log(withdrawalReceipt);
+
+const withdrawalLogs = withdrawalReceipt.logs;
+withdrawalLogs.forEach(log => {
+  console.log(log);
+});
 
 console.log('Grabbing withdrawal txn...')
-const withdrawalTx = await l1Provider.getTransaction(withdrawalReceipt.transactionReceipt.transactionHash)
-console.log(withdrawalTx)
+const withdrawalTransaction = await l1Client.getTransaction({ hash: withdrawalHash });
+console.log(withdrawalTransaction);
 
 })()