Skip to content

Commit b529725

Browse files
jscriptcoderjscriptcoder
committed
wip: i18n
1 parent 66c7fdc commit b529725

File tree

8 files changed

+1027
-33
lines changed

8 files changed

+1027
-33
lines changed

‎package-lock.json

Lines changed: 962 additions & 18 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@
4646
"@web3modal/html": "^2.7.1",
4747
"@zerodevx/svelte-toast": "^0.9.5",
4848
"debounce": "^1.2.1",
49+
"svelte-i18n": "^3.7.4",
4950
"svelte-icons": "^2.1.0",
5051
"viem": "^1.10.14"
5152
}

‎src/app.config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export const tokenSelectorConfig = {
1212
maxDisplay: 12,
1313
}
1414

15-
export const notificarionConfig = {
15+
export const notificationConfig = {
1616
duration: 5000,
1717
}
1818

‎src/components/NotificationToast/Item.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@
4040
<svelte:component this={icon} />
4141
</div>
4242
{/if}
43-
<span class="flex-1">{message}</span>
43+
<span class="flex-1">{@html message}</span>
4444
</div>
4545
<button on:click={close}>✕</button>
4646
</div>

‎src/components/NotificationToast/NotificationToast.svelte

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
notify(message, 'success', closeManually)
2323
}
2424
25-
export function errorToast(message: string, closeManually = true) {
25+
export function errorToast(message: string, closeManually = false) {
2626
notify(message, 'error', closeManually)
2727
}
2828
@@ -38,10 +38,10 @@
3838
<script lang="ts">
3939
import { SvelteToast } from '@zerodevx/svelte-toast'
4040
import type { SvelteToastOptions } from '@zerodevx/svelte-toast/stores'
41-
import { notificarionConfig } from '../../app.config'
41+
import { notificationConfig } from '../../app.config'
4242
4343
const options: SvelteToastOptions = {
44-
duration: notificarionConfig.duration,
44+
duration: notificationConfig.duration,
4545
pausable: false,
4646
}
4747
</script>

‎src/components/Swap/Swap.svelte

Lines changed: 46 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,9 @@
1111
import Loading from '../Loading/Loading.svelte'
1212
import notifyError from '../utils/notifyError'
1313
import getConnectedWallet from '../../libs/utils/getConnectedWallet'
14+
import { errorToast, successToast } from '../NotificationToast'
15+
import type { GetPriceArgs, GetQuoteArgs } from '../../libs/api/types'
16+
import { waitForTransaction } from '@wagmi/core'
1417
1518
let tokenFrom: Token
1619
let amountFrom: bigint
@@ -42,12 +45,16 @@
4245
amountTo = BigInt(0)
4346
4447
try {
45-
const priceData = await getPrice({
48+
const priceArgs: GetPriceArgs = {
4649
chain,
4750
sellToken: from.address,
4851
buyToken: to.address,
4952
sellAmount: amount.toString(),
50-
})
53+
}
54+
55+
console.log('Price arguments:', priceArgs)
56+
57+
const priceData = await getPrice(priceArgs)
5158
5259
console.log('Price data:', priceData)
5360
@@ -73,40 +80,69 @@
7380
trading = true
7481
7582
try {
76-
const quotaData = await getQuote({
83+
// Step 1: Get a quote from 0x API
84+
const quoteArgs: GetQuoteArgs = {
7785
chain: $network,
7886
sellToken: tokenFrom.address,
7987
buyToken: tokenTo.address,
8088
sellAmount: amountTo.toString(),
8189
slippagePercentage: settingItems.slippage.toString(),
82-
})
90+
}
91+
92+
console.log('Quote arguments:', quoteArgs)
93+
94+
const quotaData = await getQuote(quoteArgs)
8395
8496
console.log('Quote data:', quotaData)
8597
86-
// If token has address then it's an ERC20 token
98+
// Step 2: If token has address then it's an ERC20 token
8799
if (tokenFrom.address) {
88-
// Approve the 0x contract to spend the token
89-
const approveTxHash = await approveAllowance({
100+
const approveArgs = {
90101
account: $account.address,
91102
address: tokenFrom.address,
92103
spender: quotaData.allowanceTarget, // contains the address of the 0x contract
93104
amount: amountFrom,
94105
chainId: $network.id,
95-
})
106+
}
107+
108+
console.log('Approve arguments:', approveArgs)
109+
110+
// Approve the 0x contract to spend the token
111+
const approveTxHash = await approveAllowance(approveArgs)
96112
97113
console.log('Approve tx hash:', approveTxHash)
98114
}
99115
100116
const wallet = await getConnectedWallet($network.id)
101-
const swapTxHash = await wallet.sendTransaction({
117+
118+
// Step 3: Send the trading transaction to the chain
119+
const txArgs = {
102120
to: quotaData.to,
103121
data: quotaData.data,
104122
gas: BigInt(quotaData.gas),
105123
gasPrice: BigInt(quotaData.gasPrice),
106124
value: BigInt(quotaData.value),
107-
})
125+
}
126+
127+
console.log('Tx arguments:', txArgs)
128+
129+
const swapTxHash = await wallet.sendTransaction(txArgs)
108130
109131
console.log('Swap tx hash:', swapTxHash)
132+
133+
const explorer = $network.blockExplorers?.default.url
134+
const txUrl = `${explorer}/tx/${swapTxHash}`
135+
successToast(`Trade is on the way. Click <a href="${txUrl}"><b>here</b></a> to view the transaction.`)
136+
137+
// Step 4: Let's wait for the transaction to be mined,
138+
// and find out if it was successful or not
139+
const receipt = await waitForTransaction({ hash: swapTxHash, chainId: $network.id })
140+
141+
console.log('Swap tx receipt:', receipt)
142+
143+
if (receipt.status === 'reverted') {
144+
errorToast(`The trade was reverted. Click <a href="${txUrl}"><b>here</b></b> to view the failed transaction.`)
145+
}
110146
} catch (err) {
111147
console.error(err)
112148
notifyError(err, 'There was an error trading the tokens.')

‎src/i18n/en.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎src/i18n/index.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { addMessages, getLocaleFromNavigator, init } from 'svelte-i18n';
2+
3+
import en from './en.json';
4+
// TODO: import other languages here...
5+
6+
addMessages('en', en);
7+
// TODO: add other languages here...
8+
9+
init({
10+
fallbackLocale: 'en',
11+
initialLocale: getLocaleFromNavigator(),
12+
});

0 commit comments

Comments
 (0)