Skip to content

Commit ffe0598

Browse files
tolgahan-arikantolgahan-arikan
authored
Update sequence and ethers packages, fix block explorer urls (#43)
1 parent 9aaeb70 commit ffe0598

8 files changed

+750
-1158
lines changed

‎package.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -14,16 +14,16 @@
1414
"clear:vite:cache": "rm -rf node_modules/.vite/"
1515
},
1616
"dependencies": {
17-
"@0xsequence/design-system": "1.6.3",
18-
"@0xsequence/indexer": "1.10.11",
19-
"@0xsequence/network": "1.10.11",
20-
"@0xsequence/waas": "1.10.11",
17+
"@0xsequence/design-system": "1.7.6",
18+
"@0xsequence/indexer": "2.0.0",
19+
"@0xsequence/network": "2.0.0",
20+
"@0xsequence/waas": "2.0.0",
2121
"@react-oauth/google": "^0.11.1",
2222
"@stytch/react": "^18.1.0",
2323
"@stytch/vanilla-js": "^4.13.2",
2424
"@vanilla-extract/css": "^1.12.0",
2525
"axios": "^1.6.0",
26-
"ethers": "5.7.2",
26+
"ethers": "6.13.2",
2727
"framer-motion": "^10.16.4",
2828
"react": "^18.2.0",
2929
"react-apple-login": "^1.1.6",

‎pnpm-lock.yaml

+592-1,037
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/views/CallContractsView.tsx

+34-40
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,11 @@
1+
import { Box, Text, Button, TextInput, Spinner } from '@0xsequence/design-system'
2+
import { SetStateAction, useEffect, useState } from 'react'
3+
import { sequence } from '../../main'
4+
import { delayedEncode, FeeOption, isSentTransactionResponse, Network } from '@0xsequence/waas'
5+
import { checkTransactionFeeOptions, TransactionFeeOptions } from './TransactionFeeOptions.tsx'
6+
import { findSupportedNetwork } from '@0xsequence/network'
17

2-
import { Box, Text, Button, TextInput, Spinner } from "@0xsequence/design-system"
3-
import { SetStateAction, useState } from "react"
4-
import { sequence } from "../../main"
5-
import {
6-
delayedEncode,
7-
FeeOption,
8-
isSentTransactionResponse,
9-
Network,
10-
} from "@0xsequence/waas"
11-
import { checkTransactionFeeOptions, TransactionFeeOptions } from "./TransactionFeeOptions.tsx";
12-
13-
export function CallContractsView(props: {network?: Network}) {
8+
export function CallContractsView(props: { network?: Network }) {
149
const [contractAddress, setContractAddress] = useState<string>('')
1510
const [contractAbi, setContractAbi] = useState<string>('')
1611
const [contractMethod, setContractMethod] = useState<string>('')
@@ -24,15 +19,28 @@ export function CallContractsView(props: {network?: Network}) {
2419
const [feeQuote, setFeeQuote] = useState<string>()
2520
const [feeSponsored, setFeeSponsored] = useState<boolean>(false)
2621

22+
const [blockExplorerURL, setBlockExplorerURL] = useState<string>('')
23+
24+
useEffect(() => {
25+
if (props.network) {
26+
const networkConfig = findSupportedNetwork(props.network.name)
27+
if (networkConfig?.blockExplorer?.rootUrl) {
28+
setBlockExplorerURL(networkConfig.blockExplorer?.rootUrl)
29+
}
30+
}
31+
}, [props.network])
32+
2733
const checkFeeOptions = async () => {
2834
const resp = await checkTransactionFeeOptions({
29-
transactions: [delayedEncode({
30-
to: contractAddress,
31-
abi: contractAbi,
32-
func: contractMethod,
33-
args: JSON.parse(contractMethodArgs),
34-
value: "0"
35-
})],
35+
transactions: [
36+
delayedEncode({
37+
to: contractAddress,
38+
abi: contractAbi,
39+
func: contractMethod,
40+
args: JSON.parse(contractMethodArgs),
41+
value: '0'
42+
})
43+
],
3644
network: props.network
3745
})
3846

@@ -132,44 +140,30 @@ export function CallContractsView(props: {network?: Network}) {
132140
/>
133141
</Box>
134142

135-
<TransactionFeeOptions feeOptions={feeOptions} onSelected={setFeeOption}/>
136-
{ feeSponsored && (
143+
<TransactionFeeOptions feeOptions={feeOptions} onSelected={setFeeOption} />
144+
{feeSponsored && (
137145
<Box marginTop="5">
138146
<Text variant="normal" fontWeight="bold">
139147
Fee options: Tx Sponsored!
140148
</Text>
141149
</Box>
142150
)}
143151

144-
{sendTransactionError && (
145-
<Box marginTop="3">
146-
Transaction failed: {sendTransactionError}
147-
</Box>
148-
)}
152+
{sendTransactionError && <Box marginTop="3">Transaction failed: {sendTransactionError}</Box>}
149153
{!inProgress ? (
150154
<Box>
151155
<Button
152156
marginTop="5"
153157
marginRight="2"
154158
label="Check fee options"
155-
disabled={
156-
contractAddress === '' &&
157-
contractAbi === '' &&
158-
contractMethod === '' &&
159-
contractMethodArgs === ''
160-
}
159+
disabled={contractAddress === '' && contractAbi === '' && contractMethod === '' && contractMethodArgs === ''}
161160
onClick={() => checkFeeOptions()}
162161
/>
163162
<Button
164163
marginTop="5"
165164
label="Call contract"
166-
disabled={
167-
contractAddress === '' &&
168-
contractAbi === '' &&
169-
contractMethod === '' &&
170-
contractMethodArgs === ''
171-
}
172-
onClick={() => callContract() }
165+
disabled={contractAddress === '' && contractAbi === '' && contractMethod === '' && contractMethodArgs === ''}
166+
onClick={() => callContract()}
173167
/>
174168
</Box>
175169
) : (
@@ -183,7 +177,7 @@ export function CallContractsView(props: {network?: Network}) {
183177
Send native token transaction hash:
184178
</Text>
185179
<br />
186-
<a href={`https://polygonscan.com/tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
180+
<a href={`${blockExplorerURL}tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
187181
{transactionHash}
188182
</a>
189183
</Box>

‎src/components/views/SendERC1155View.tsx

+15-3
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { sequence } from '../../main'
55
import { erc1155, FeeOption, isSentTransactionResponse, Network } from '@0xsequence/waas'
66
import { GetTokenBalancesReturn, SequenceIndexer } from '@0xsequence/indexer'
77
import { checkTransactionFeeOptions, TransactionFeeOptions } from './TransactionFeeOptions.tsx'
8+
import { findSupportedNetwork } from '@0xsequence/network'
89

910
const INDEXER_API_KEY = import.meta.env.VITE_SEQUENCE_INDEXER_API_KEY
1011

@@ -89,6 +90,17 @@ export function SendERC1155View(props: { network?: Network }) {
8990
const [feeQuote, setFeeQuote] = useState<string>()
9091
const [feeSponsored, setFeeSponsored] = useState<boolean>(false)
9192

93+
const [blockExplorerURL, setBlockExplorerURL] = useState<string>('')
94+
95+
useEffect(() => {
96+
if (props.network) {
97+
const networkConfig = findSupportedNetwork(props.network.name)
98+
if (networkConfig?.blockExplorer?.rootUrl) {
99+
setBlockExplorerURL(networkConfig.blockExplorer?.rootUrl)
100+
}
101+
}
102+
}, [props.network])
103+
92104
const addTokenEntry = () => {
93105
setTokenEntries([...tokenEntries, { tokenId: '', amount: '' }])
94106
}
@@ -149,7 +161,7 @@ export function SendERC1155View(props: { network?: Network }) {
149161
token: tokenAddress,
150162
values: tokenEntries.map(entry => ({
151163
id: entry.tokenId,
152-
amount: ethers.utils.parseUnits(entry.amount, 0)
164+
amount: ethers.parseUnits(entry.amount, 0)
153165
}))
154166
})
155167
],
@@ -178,7 +190,7 @@ export function SendERC1155View(props: { network?: Network }) {
178190
token: tokenAddress,
179191
values: tokenEntries.map(entry => ({
180192
id: entry.tokenId,
181-
amount: ethers.utils.parseUnits(entry.amount, 0)
193+
amount: ethers.parseUnits(entry.amount, 0)
182194
})),
183195
network: props.network?.id,
184196
transactionsFeeOption: feeOption,
@@ -269,7 +281,7 @@ export function SendERC1155View(props: { network?: Network }) {
269281
<Text variant="normal" color="text100" fontWeight="bold">
270282
Transaction Hash:
271283
</Text>
272-
<a href={`https://polygonscan.com/tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
284+
<a href={`${blockExplorerURL}tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
273285
{transactionHash}
274286
</a>
275287
</Box>

‎src/components/views/SendERC20View.tsx

+21-7
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { ethers } from 'ethers'
44
import { sequence } from '../../main'
55
import { FeeOption, isSentTransactionResponse, Network, erc20 } from '@0xsequence/waas'
66
import { checkTransactionFeeOptions, TransactionFeeOptions } from './TransactionFeeOptions.tsx'
7+
import { findSupportedNetwork } from '@0xsequence/network'
78

89
interface TokenOption {
910
label: string
@@ -34,19 +35,30 @@ export function SendERC20View(props: { network?: Network }) {
3435
const [feeQuote, setFeeQuote] = useState<string>()
3536
const [feeSponsored, setFeeSponsored] = useState<boolean>(false)
3637

38+
const [blockExplorerURL, setBlockExplorerURL] = useState<string>('')
39+
40+
useEffect(() => {
41+
if (props.network) {
42+
const networkConfig = findSupportedNetwork(props.network.name)
43+
if (networkConfig?.blockExplorer?.rootUrl) {
44+
setBlockExplorerURL(networkConfig.blockExplorer?.rootUrl)
45+
}
46+
}
47+
}, [props.network])
48+
3749
useEffect(() => {
3850
fetchTokenBalance(customTokenAddress)
3951
}, [customTokenAddress])
4052

4153
const fetchTokenBalance = async (tokenAddress: string) => {
42-
if (!ethers.utils.isAddress(tokenAddress)) {
54+
if (!ethers.isAddress(tokenAddress)) {
4355
setTokenBalance('---')
4456
return
4557
}
4658

4759
setTokenBalance('...')
4860

49-
const node = new ethers.providers.JsonRpcProvider(`https://nodes.sequence.app/${props.network?.name}`)
61+
const node = new ethers.JsonRpcProvider(`https://nodes.sequence.app/${props.network?.name}`)
5062
const contract = new ethers.Contract(
5163
tokenAddress,
5264
[
@@ -65,7 +77,7 @@ export function SendERC20View(props: { network?: Network }) {
6577
])
6678

6779
setDecimals(decimals)
68-
setTokenBalance(`${ethers.utils.formatUnits(balance, decimals)} ${symbol}`)
80+
setTokenBalance(`${ethers.formatUnits(balance, decimals)} ${symbol}`)
6981
} catch (e) {
7082
setTokenBalance('---')
7183
}
@@ -77,7 +89,7 @@ export function SendERC20View(props: { network?: Network }) {
7789
erc20({
7890
token: customTokenAddress,
7991
to: destinationAddress,
80-
value: ethers.utils.parseUnits(amount, decimals).toString()
92+
value: ethers.parseUnits(amount, decimals).toString()
8193
})
8294
],
8395
network: props.network
@@ -103,7 +115,7 @@ export function SendERC20View(props: { network?: Network }) {
103115
const tx = await sequence.sendERC20({
104116
token: customTokenAddress,
105117
to: destinationAddress,
106-
value: ethers.utils.parseUnits(amount, decimals),
118+
value: ethers.parseUnits(amount, decimals),
107119
network: props.network?.id,
108120
transactionsFeeOption: feeOption,
109121
transactionsFeeQuote: feeQuote
@@ -148,7 +160,9 @@ export function SendERC20View(props: { network?: Network }) {
148160
</Box>
149161

150162
<Box marginTop="3">
151-
<Text variant="normal" color="text100">Token Balance: {tokenBalance}</Text>
163+
<Text variant="normal" color="text100">
164+
Token Balance: {tokenBalance}
165+
</Text>
152166
<Button marginLeft="2" size="xs" label="Fetch" onClick={() => fetchTokenBalance(customTokenAddress)} />
153167
</Box>
154168

@@ -202,7 +216,7 @@ export function SendERC20View(props: { network?: Network }) {
202216
<Text variant="normal" color="text100" fontWeight="bold">
203217
Transaction Hash:
204218
</Text>
205-
<a href={`https://polygonscan.com/tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
219+
<a href={`${blockExplorerURL}tx/${transactionHash}`} target="_blank" rel="noopener noreferrer">
206220
{transactionHash}
207221
</a>
208222
</Box>

0 commit comments

Comments
 (0)