Add common token picker on Add Token screen
All checks were successful
check / check (push) Successful in 14s
All checks were successful
check / check (push) Successful in 14s
Shows the top 25 tokens by market cap as clickable buttons below the contract address input. Clicking a token fills in its contract address automatically.
This commit is contained in:
@@ -384,6 +384,15 @@
|
||||
id="add-token-info"
|
||||
class="text-xs text-muted mb-2 hidden"
|
||||
></div>
|
||||
<div class="mb-2">
|
||||
<label class="block mb-1 text-xs text-muted"
|
||||
>Or pick a common token:</label
|
||||
>
|
||||
<div
|
||||
id="common-token-list"
|
||||
class="flex flex-wrap gap-1"
|
||||
></div>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
id="btn-add-token-confirm"
|
||||
|
||||
@@ -7,7 +7,7 @@ const {
|
||||
formatEther,
|
||||
parseEther,
|
||||
} = require("ethers");
|
||||
const { getTopTokenPrices } = require("../shared/tokens");
|
||||
const { TOKENS, getTopTokenPrices } = require("../shared/tokens");
|
||||
const { encryptWithPassword, decryptWithPassword } = require("../shared/vault");
|
||||
const QRCode = require("qrcode");
|
||||
|
||||
@@ -560,6 +560,18 @@ async function init() {
|
||||
$("add-token-address").value = "";
|
||||
$("add-token-info").classList.add("hidden");
|
||||
hideError("add-token-error");
|
||||
const list = $("common-token-list");
|
||||
list.innerHTML = TOKENS.slice(0, 25)
|
||||
.map(
|
||||
(t) =>
|
||||
`<button class="common-token border border-border px-1 hover:bg-fg hover:text-bg cursor-pointer text-xs" data-address="${t.address}" data-symbol="${t.symbol}" data-decimals="${t.decimals}">${t.symbol}</button>`,
|
||||
)
|
||||
.join("");
|
||||
list.querySelectorAll(".common-token").forEach((btn) => {
|
||||
btn.addEventListener("click", () => {
|
||||
$("add-token-address").value = btn.dataset.address;
|
||||
});
|
||||
});
|
||||
showView("add-token");
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user