Skip to content

Commit c9b6e74

Browse files
jscriptcoderjscriptcoder
committed
wip: Add token to MetaMask
1 parent 40c9847 commit c9b6e74

File tree

6 files changed

+57
-8
lines changed

6 files changed

+57
-8
lines changed

‎src/app.config.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
export const apiConfig = {
2-
tokensUrl: 'https://tokens.coingecko.com/uniswap/all.json',
2+
// tokensUrl: 'https://tokens.coingecko.com/uniswap/all.json',
33
// tokensUrl: 'https://raw.githubusercontent.com/compound-finance/token-list/master/compound.tokenlist.json',
4+
tokensUrl: 'https://static.optimism.io/optimism.tokenlist.json',
45
}
56

67
export const inputConfig = {

‎src/components/AddToken/AddToken.svelte

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<div class="tooltip" data-tip="Add token to MetaMask wallet">
2+
<button>
3+
<img src="/metamask.svg" width="16" alt="Metamask" />
4+
</button>
5+
</div>

‎src/components/AddToken/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default } from './AddToken.svelte'

‎src/components/Swap/Swap.svelte

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
import type { Token } from '../../libs/token/types'
44
import SwitchToken from './SwitchToken.svelte'
55
import { network } from '../../stores/network'
6-
import { errorToast } from '../NotificationToast'
7-
import { type Chain, formatUnits, type SendTransactionParameters } from 'viem'
6+
import { type Chain, formatUnits } from 'viem'
87
import Settings, { type SettingItems } from './Settings.svelte'
98
import { getPrice, getQuote } from '../../libs/api/0x'
109
import approveAllowance from '../../libs/token/approveAllowance'
@@ -62,7 +61,7 @@
6261
hasPrice = true
6362
} catch (err) {
6463
console.error(err)
65-
notifyError(err, 'There was an error fetching the price')
64+
notifyError(err, 'There was an error fetching the price.')
6665
} finally {
6766
gettingPrice = false
6867
}
@@ -110,7 +109,7 @@
110109
console.log('Swap tx hash:', swapTxHash)
111110
} catch (err) {
112111
console.error(err)
113-
notifyError(err, 'There was an error trading the tokens')
112+
notifyError(err, 'There was an error trading the tokens.')
114113
} finally {
115114
trading = false
116115
}

‎src/components/Swap/TokenAmount.svelte

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import { formatUnits, parseUnits, type Address } from 'viem'
2+
import { formatUnits, parseUnits, type Address, zeroAddress } from 'viem'
33
import type { Token } from '../../libs/token/types'
44
import TokenSelector from './TokenSelector.svelte'
55
import { debounce } from 'debounce'
@@ -13,6 +13,7 @@
1313
import type { FetchBalanceResult } from '@wagmi/core'
1414
import { truncateString } from '../../libs/utils/truncateString'
1515
import notifyError from '../utils/notifyError'
16+
import AddToken from '../AddToken'
1617
1718
export let token: Token
1819
export let amount: bigint
@@ -32,6 +33,9 @@
3233
? `${truncateString(tokenBalanceResult.formatted, 8)} ${tokenBalanceResult.symbol}`
3334
: ''
3435
36+
// We are dealing with ERC20 tokens if there is address and it's not the zero address
37+
$: isERC20 = token?.address && token.address !== zeroAddress
38+
3539
function onTokenSelect(_token: Token) {
3640
token = _token
3741
@@ -79,7 +83,12 @@
7983
<TokenSelector value={token} onSelect={onTokenSelect} disableValue={disableToken} />
8084
<div class="flex flex-col relative">
8185
{#if balance}
82-
<div class="balance">Balance: {balance}</div>
86+
<div class="balance">
87+
{#if isERC20}
88+
<AddToken />
89+
{/if}
90+
<span>Balance: {balance}</span>
91+
</div>
8392
{/if}
8493

8594
<input
@@ -111,7 +120,10 @@
111120
@apply absolute
112121
text-sm
113122
top-[-1rem]
114-
right-0;
123+
right-0
124+
flex
125+
items-center
126+
space-x-2;
115127
}
116128
117129
.TokenAmount {

‎static/metamask.svg

Lines changed: 31 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)