Compare commits
52 Commits
fix/55-swa
...
005b97cdab
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
005b97cdab | ||
|
|
0d110914a7 | ||
|
|
612df5cfca | ||
|
|
eba962b271 | ||
| 3b6b18d168 | |||
| 33ae5784e2 | |||
| cd30d94040 | |||
| 62bb54556c | |||
| 8e1856415a | |||
| 9444b06b52 | |||
| c2fdb3e0c1 | |||
|
|
9de7791553 | ||
|
|
ef2f862d23 | ||
| a655c546b7 | |||
| 0e68279037 | |||
| 2bb7fc5786 | |||
|
|
4157732f4b | ||
| e8ede7010a | |||
|
|
0c1150ac4d | ||
| a2fbb0e30d | |||
| 72a4dd3382 | |||
|
|
d3d9f9a8b0 | ||
| 24464ffe33 | |||
| 34c66d19c4 | |||
| e09904147b | |||
|
|
b02a1d3a55 | ||
|
|
9a7aa1f4fc | ||
| 9788db95f2 | |||
|
|
9981be6986 | ||
| 16f9e98b25 | |||
| bbf5945ff1 | |||
|
|
607d2349b0 | ||
|
|
3c2d553070 | ||
|
|
55346b484b | ||
|
|
93565c7196 | ||
|
|
71ef08fe85 | ||
|
|
8d230aceb6 | ||
| 6031c3e76c | |||
|
|
436fe22296 | ||
| 82a7db63b5 | |||
| 676109860a | |||
| 7c53c48cb1 | |||
| 4d9a8a49b9 | |||
|
|
996003fd79 | ||
|
|
2c9a34aff6 | ||
|
|
173d75c57a | ||
|
|
3daba279d2 | ||
|
|
70a8ac6f99 | ||
|
|
68bd909345 | ||
|
|
91c3b4e394 | ||
|
|
41794f8bf5 | ||
|
|
ca78da2e07 |
1
.gitignore
vendored
1
.gitignore
vendored
@@ -25,3 +25,4 @@ dist/
|
|||||||
|
|
||||||
# Yarn
|
# Yarn
|
||||||
.yarn-integrity
|
.yarn-integrity
|
||||||
|
package-lock.json
|
||||||
|
|||||||
@@ -56,37 +56,104 @@
|
|||||||
< Back
|
< Back
|
||||||
</button>
|
</button>
|
||||||
<h2 class="font-bold mb-2">Add Wallet</h2>
|
<h2 class="font-bold mb-2">Add Wallet</h2>
|
||||||
<p class="mb-2">
|
|
||||||
Enter your 12 or 24 word recovery phrase below, or click the
|
<!-- Mode selector tabs -->
|
||||||
button to roll the die for a new one.
|
<div
|
||||||
</p>
|
class="flex border-b border-border mb-3"
|
||||||
<div class="mb-1 flex justify-end">
|
id="add-wallet-tabs"
|
||||||
|
>
|
||||||
<button
|
<button
|
||||||
id="btn-generate-phrase"
|
id="tab-mnemonic"
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer text-xs"
|
class="px-2 py-1 cursor-pointer text-xs border-b-2 border-fg font-bold"
|
||||||
title="Generate a random recovery phrase"
|
|
||||||
>
|
>
|
||||||
[⚀]
|
From Phrase
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
id="tab-privkey"
|
||||||
|
class="px-2 py-1 cursor-pointer text-xs border-b-2 border-transparent text-muted hover:text-fg"
|
||||||
|
>
|
||||||
|
From Key
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
id="tab-xprv"
|
||||||
|
class="px-2 py-1 cursor-pointer text-xs border-b-2 border-transparent text-muted hover:text-fg"
|
||||||
|
>
|
||||||
|
From xprv
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-2">
|
|
||||||
<textarea
|
<!-- Mnemonic form section -->
|
||||||
id="wallet-mnemonic"
|
<div id="add-wallet-section-mnemonic">
|
||||||
rows="3"
|
<p class="mb-2">
|
||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg resize-y"
|
Enter your 12 or 24 word recovery phrase below, or click
|
||||||
placeholder="word word word ..."
|
the button to roll the die for a new one.
|
||||||
></textarea>
|
</p>
|
||||||
|
<div class="mb-1 flex justify-end">
|
||||||
|
<button
|
||||||
|
id="btn-generate-phrase"
|
||||||
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer text-xs"
|
||||||
|
title="Generate a random recovery phrase"
|
||||||
|
>
|
||||||
|
[⚀]
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<textarea
|
||||||
|
id="wallet-mnemonic"
|
||||||
|
rows="3"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg resize-y"
|
||||||
|
placeholder="word word word ..."
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
id="add-wallet-phrase-warning"
|
||||||
|
class="text-xs mb-2 border border-border border-dashed p-2 hidden"
|
||||||
|
>
|
||||||
|
Write these words down and keep them safe. Anyone with
|
||||||
|
them can take your funds; if you lose them, your wallet
|
||||||
|
is gone.
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
id="add-wallet-phrase-warning"
|
<!-- Private key form section -->
|
||||||
class="text-xs mb-2 border border-border border-dashed p-2 hidden"
|
<div id="add-wallet-section-privkey" class="hidden">
|
||||||
>
|
<p class="mb-2">
|
||||||
Write these words down and keep them safe. Anyone with them
|
Paste your private key below. This wallet will have a
|
||||||
can take your funds; if you lose them, your wallet is gone.
|
single address.
|
||||||
|
</p>
|
||||||
|
<div class="mb-2">
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
id="import-private-key"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
|
placeholder="0x..."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Extended key (xprv) form section -->
|
||||||
|
<div id="add-wallet-section-xprv" class="hidden">
|
||||||
|
<p class="mb-2">
|
||||||
|
Paste your extended private key (xprv) below. This will
|
||||||
|
import the HD wallet and scan for used addresses.
|
||||||
|
</p>
|
||||||
|
<div class="mb-2">
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
id="import-xprv-key"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
|
placeholder="xprv..."
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Shared password fields -->
|
||||||
<div class="mb-2" id="add-wallet-password-section">
|
<div class="mb-2" id="add-wallet-password-section">
|
||||||
<label class="block mb-1">Choose a password</label>
|
<label class="block mb-1">Choose a password</label>
|
||||||
<p class="text-xs text-muted mb-1">
|
<p
|
||||||
|
class="text-xs text-muted mb-1"
|
||||||
|
id="add-wallet-password-hint"
|
||||||
|
>
|
||||||
This password encrypts your recovery phrase on this
|
This password encrypts your recovery phrase on this
|
||||||
device. You will need it to send funds.
|
device. You will need it to send funds.
|
||||||
</p>
|
</p>
|
||||||
@@ -107,64 +174,6 @@
|
|||||||
<button
|
<button
|
||||||
id="btn-add-wallet-confirm"
|
id="btn-add-wallet-confirm"
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||||
>
|
|
||||||
Add
|
|
||||||
</button>
|
|
||||||
<div class="mt-3 text-xs text-muted">
|
|
||||||
Have a private key instead?
|
|
||||||
<button
|
|
||||||
id="btn-add-wallet-import-key"
|
|
||||||
class="underline cursor-pointer bg-transparent border-none text-fg text-xs font-mono p-0"
|
|
||||||
>
|
|
||||||
Import private key
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- ============ IMPORT PRIVATE KEY ============ -->
|
|
||||||
<div id="view-import-key" class="view hidden">
|
|
||||||
<button
|
|
||||||
id="btn-import-key-back"
|
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer mb-2"
|
|
||||||
>
|
|
||||||
< Back
|
|
||||||
</button>
|
|
||||||
<h2 class="font-bold mb-2">Import Private Key</h2>
|
|
||||||
<p class="mb-2">
|
|
||||||
Paste your private key below. This wallet will have a single
|
|
||||||
address.
|
|
||||||
</p>
|
|
||||||
<div class="mb-2">
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
id="import-private-key"
|
|
||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
|
||||||
placeholder="0x..."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="mb-2" id="import-key-password-section">
|
|
||||||
<label class="block mb-1">Choose a password</label>
|
|
||||||
<p class="text-xs text-muted mb-1">
|
|
||||||
This password encrypts your private key on this device.
|
|
||||||
You will need it to send funds.
|
|
||||||
</p>
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
id="import-key-password"
|
|
||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="mb-2" id="import-key-password-confirm-section">
|
|
||||||
<label class="block mb-1">Confirm password</label>
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
id="import-key-password-confirm"
|
|
||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<button
|
|
||||||
id="btn-import-key-confirm"
|
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
|
||||||
>
|
>
|
||||||
Import
|
Import
|
||||||
</button>
|
</button>
|
||||||
@@ -305,6 +314,26 @@
|
|||||||
>
|
>
|
||||||
+ Token
|
+ Token
|
||||||
</button>
|
</button>
|
||||||
|
<div class="relative">
|
||||||
|
<button
|
||||||
|
id="btn-more-menu"
|
||||||
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||||
|
aria-label="More actions"
|
||||||
|
>
|
||||||
|
···
|
||||||
|
</button>
|
||||||
|
<div
|
||||||
|
id="more-menu-dropdown"
|
||||||
|
class="hidden absolute right-0 top-full mt-1 border border-border bg-bg z-50 whitespace-nowrap py-1"
|
||||||
|
>
|
||||||
|
<button
|
||||||
|
id="btn-export-privkey"
|
||||||
|
class="block w-full text-left px-4 py-1.5 text-xs font-light text-muted hover:bg-hover hover:text-fg cursor-pointer"
|
||||||
|
>
|
||||||
|
Export Private Key
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- transactions -->
|
<!-- transactions -->
|
||||||
@@ -318,6 +347,60 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- ============ EXPORT PRIVATE KEY VIEW ============ -->
|
||||||
|
<div id="view-export-privkey" class="view hidden">
|
||||||
|
<button
|
||||||
|
id="btn-export-privkey-back"
|
||||||
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer mb-2"
|
||||||
|
>
|
||||||
|
< Back
|
||||||
|
</button>
|
||||||
|
<div
|
||||||
|
id="export-privkey-jazzicon"
|
||||||
|
class="flex justify-center mt-1 mb-3"
|
||||||
|
></div>
|
||||||
|
<h2 class="font-bold mb-1">Export Private Key</h2>
|
||||||
|
<p class="text-xs mb-1" id="export-privkey-title"></p>
|
||||||
|
<p class="text-xs mb-3">
|
||||||
|
<span id="export-privkey-dot"></span>
|
||||||
|
<span
|
||||||
|
id="export-privkey-address"
|
||||||
|
class="cursor-pointer"
|
||||||
|
title="Click to copy"
|
||||||
|
></span>
|
||||||
|
</p>
|
||||||
|
<p class="text-xs mb-3 text-muted">
|
||||||
|
Warning: anyone with this private key can access and
|
||||||
|
transfer all funds from this address. Never share it.
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
id="export-privkey-flash"
|
||||||
|
class="text-xs mb-2 hidden"
|
||||||
|
></div>
|
||||||
|
<div id="export-privkey-password-section" class="mb-2">
|
||||||
|
<label class="block mb-1">Password</label>
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
id="export-privkey-password"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
|
placeholder="Enter your password to continue"
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
id="btn-export-privkey-confirm"
|
||||||
|
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer mt-2"
|
||||||
|
>
|
||||||
|
Reveal
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div id="export-privkey-result" class="hidden">
|
||||||
|
<div
|
||||||
|
id="export-privkey-value"
|
||||||
|
class="bg-danger-well rounded p-2 font-mono text-xs break-all cursor-pointer mb-1"
|
||||||
|
title="Click to copy"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- ============ ADDRESS-TOKEN DETAIL VIEW ============ -->
|
<!-- ============ ADDRESS-TOKEN DETAIL VIEW ============ -->
|
||||||
<div id="view-address-token" class="view hidden">
|
<div id="view-address-token" class="view hidden">
|
||||||
<button
|
<button
|
||||||
@@ -422,6 +505,11 @@
|
|||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
placeholder="Address (0x...) or ENS name"
|
placeholder="Address (0x...) or ENS name"
|
||||||
/>
|
/>
|
||||||
|
<div
|
||||||
|
id="send-to-error"
|
||||||
|
class="text-xs"
|
||||||
|
style="min-height: 1.25rem; color: #cc0000"
|
||||||
|
></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-2">
|
<div class="mb-2">
|
||||||
<div class="flex justify-between mb-1">
|
<div class="flex justify-between mb-1">
|
||||||
@@ -531,6 +619,7 @@
|
|||||||
<!-- ============ TX SUCCESS ============ -->
|
<!-- ============ TX SUCCESS ============ -->
|
||||||
<div id="view-success-tx" class="view hidden">
|
<div id="view-success-tx" class="view hidden">
|
||||||
<h2 class="font-bold mb-2">Transaction Confirmed</h2>
|
<h2 class="font-bold mb-2">Transaction Confirmed</h2>
|
||||||
|
<div id="success-tx-decoded" class="mb-3 hidden text-xs"></div>
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
<div class="text-xs text-muted mb-1">Amount</div>
|
<div class="text-xs text-muted mb-1">Amount</div>
|
||||||
<div id="success-tx-summary" class="font-bold"></div>
|
<div id="success-tx-summary" class="font-bold"></div>
|
||||||
@@ -636,9 +725,10 @@
|
|||||||
<div class="flex justify-center mb-3">
|
<div class="flex justify-center mb-3">
|
||||||
<canvas id="receive-qr"></canvas>
|
<canvas id="receive-qr"></canvas>
|
||||||
</div>
|
</div>
|
||||||
<div class="border border-border p-2 break-all mb-3 text-xs">
|
<div
|
||||||
<span id="receive-dot"></span>
|
class="border border-border p-2 break-all mb-3 text-xs cursor-pointer"
|
||||||
<span id="receive-address" class="select-all"></span>
|
>
|
||||||
|
<span id="receive-address-block" class="select-all"></span>
|
||||||
<span id="receive-etherscan-link"></span>
|
<span id="receive-etherscan-link"></span>
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
@@ -999,18 +1089,18 @@
|
|||||||
class="text-xs"
|
class="text-xs"
|
||||||
></div>
|
></div>
|
||||||
</div>
|
</div>
|
||||||
<div id="tx-detail-rawdata-section" class="hidden">
|
|
||||||
<div class="text-xs text-muted mb-1">Raw data</div>
|
|
||||||
<div
|
|
||||||
id="tx-detail-rawdata"
|
|
||||||
class="text-xs break-all font-mono border border-border border-dashed p-2"
|
|
||||||
></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="mb-4">
|
<div class="mb-4">
|
||||||
<div class="text-xs text-muted mb-1">Transaction hash</div>
|
<div class="text-xs text-muted mb-1">Transaction hash</div>
|
||||||
<div id="tx-detail-hash" class="text-xs break-all"></div>
|
<div id="tx-detail-hash" class="text-xs break-all"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="tx-detail-rawdata-section" class="mb-4 hidden">
|
||||||
|
<div class="text-xs text-muted mb-1">Raw data</div>
|
||||||
|
<div
|
||||||
|
id="tx-detail-rawdata"
|
||||||
|
class="text-xs break-all font-mono border border-border border-dashed p-2"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- ============ TRANSACTION APPROVAL ============ -->
|
<!-- ============ TRANSACTION APPROVAL ============ -->
|
||||||
|
|||||||
@@ -10,7 +10,6 @@ const { $, showView } = require("./views/helpers");
|
|||||||
const home = require("./views/home");
|
const home = require("./views/home");
|
||||||
const welcome = require("./views/welcome");
|
const welcome = require("./views/welcome");
|
||||||
const addWallet = require("./views/addWallet");
|
const addWallet = require("./views/addWallet");
|
||||||
const importKey = require("./views/importKey");
|
|
||||||
const addressDetail = require("./views/addressDetail");
|
const addressDetail = require("./views/addressDetail");
|
||||||
const addressToken = require("./views/addressToken");
|
const addressToken = require("./views/addressToken");
|
||||||
const send = require("./views/send");
|
const send = require("./views/send");
|
||||||
@@ -54,7 +53,6 @@ const ctx = {
|
|||||||
renderWalletList,
|
renderWalletList,
|
||||||
doRefreshAndRender,
|
doRefreshAndRender,
|
||||||
showAddWalletView: () => addWallet.show(),
|
showAddWalletView: () => addWallet.show(),
|
||||||
showImportKeyView: () => importKey.show(),
|
|
||||||
showAddressDetail: () => addressDetail.show(),
|
showAddressDetail: () => addressDetail.show(),
|
||||||
showAddressToken: () => addressToken.show(),
|
showAddressToken: () => addressToken.show(),
|
||||||
showAddTokenView: () => addToken.show(),
|
showAddTokenView: () => addToken.show(),
|
||||||
@@ -209,7 +207,6 @@ async function init() {
|
|||||||
|
|
||||||
welcome.init(ctx);
|
welcome.init(ctx);
|
||||||
addWallet.init(ctx);
|
addWallet.init(ctx);
|
||||||
importKey.init(ctx);
|
|
||||||
home.init(ctx);
|
home.init(ctx);
|
||||||
addressDetail.init(ctx);
|
addressDetail.init(ctx);
|
||||||
addressToken.init(ctx);
|
addressToken.init(ctx);
|
||||||
|
|||||||
@@ -11,6 +11,7 @@
|
|||||||
--color-border-light: #cccccc;
|
--color-border-light: #cccccc;
|
||||||
--color-hover: #eeeeee;
|
--color-hover: #eeeeee;
|
||||||
--color-well: #f5f5f5;
|
--color-well: #f5f5f5;
|
||||||
|
--color-danger-well: #fef2f2;
|
||||||
--color-section: #dddddd;
|
--color-section: #dddddd;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -3,114 +3,275 @@ const {
|
|||||||
generateMnemonic,
|
generateMnemonic,
|
||||||
hdWalletFromMnemonic,
|
hdWalletFromMnemonic,
|
||||||
isValidMnemonic,
|
isValidMnemonic,
|
||||||
|
addressFromPrivateKey,
|
||||||
|
hdWalletFromXprv,
|
||||||
|
isValidXprv,
|
||||||
} = require("../../shared/wallet");
|
} = require("../../shared/wallet");
|
||||||
const { encryptWithPassword } = require("../../shared/vault");
|
const { encryptWithPassword } = require("../../shared/vault");
|
||||||
const { state, saveState } = require("../../shared/state");
|
const { state, saveState } = require("../../shared/state");
|
||||||
const { scanForAddresses } = require("../../shared/balances");
|
const { scanForAddresses } = require("../../shared/balances");
|
||||||
|
|
||||||
|
let currentMode = "mnemonic";
|
||||||
|
|
||||||
|
const MODES = ["mnemonic", "privkey", "xprv"];
|
||||||
|
|
||||||
|
const PASSWORD_HINTS = {
|
||||||
|
mnemonic:
|
||||||
|
"This password encrypts your recovery phrase on this device. You will need it to send funds.",
|
||||||
|
privkey:
|
||||||
|
"This password encrypts your private key on this device. You will need it to send funds.",
|
||||||
|
xprv: "This password encrypts your key on this device. You will need it to send funds.",
|
||||||
|
};
|
||||||
|
|
||||||
|
function switchMode(mode) {
|
||||||
|
currentMode = mode;
|
||||||
|
for (const m of MODES) {
|
||||||
|
$("add-wallet-section-" + m).classList.toggle("hidden", m !== mode);
|
||||||
|
const tab = $("tab-" + m);
|
||||||
|
tab.classList.toggle("border-fg", m === mode);
|
||||||
|
tab.classList.toggle("font-bold", m === mode);
|
||||||
|
tab.classList.toggle("border-transparent", m !== mode);
|
||||||
|
tab.classList.toggle("text-muted", m !== mode);
|
||||||
|
}
|
||||||
|
$("add-wallet-password-hint").textContent = PASSWORD_HINTS[mode];
|
||||||
|
}
|
||||||
|
|
||||||
function show() {
|
function show() {
|
||||||
$("wallet-mnemonic").value = "";
|
$("wallet-mnemonic").value = "";
|
||||||
|
$("import-private-key").value = "";
|
||||||
|
$("import-xprv-key").value = "";
|
||||||
$("add-wallet-password").value = "";
|
$("add-wallet-password").value = "";
|
||||||
$("add-wallet-password-confirm").value = "";
|
$("add-wallet-password-confirm").value = "";
|
||||||
$("add-wallet-phrase-warning").classList.add("hidden");
|
$("add-wallet-phrase-warning").classList.add("hidden");
|
||||||
|
switchMode("mnemonic");
|
||||||
showView("add-wallet");
|
showView("add-wallet");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function validatePassword() {
|
||||||
|
const pw = $("add-wallet-password").value;
|
||||||
|
const pw2 = $("add-wallet-password-confirm").value;
|
||||||
|
if (!pw) {
|
||||||
|
showFlash("Please choose a password.");
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
if (pw.length < 12) {
|
||||||
|
showFlash("Password must be at least 12 characters.");
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
if (pw !== pw2) {
|
||||||
|
showFlash("Passwords do not match.");
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return pw;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function importMnemonic(ctx) {
|
||||||
|
const mnemonic = $("wallet-mnemonic").value.trim();
|
||||||
|
if (!mnemonic) {
|
||||||
|
showFlash("Enter a recovery phrase or press the die to generate one.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const words = mnemonic.split(/\s+/);
|
||||||
|
if (words.length !== 12 && words.length !== 24) {
|
||||||
|
showFlash(
|
||||||
|
"Recovery phrase must be 12 or 24 words. You entered " +
|
||||||
|
words.length +
|
||||||
|
".",
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!isValidMnemonic(mnemonic)) {
|
||||||
|
showFlash("Invalid recovery phrase. Check for typos.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const pw = validatePassword();
|
||||||
|
if (!pw) return;
|
||||||
|
const { xpub, firstAddress } = hdWalletFromMnemonic(mnemonic);
|
||||||
|
const duplicate = state.wallets.find(
|
||||||
|
(w) =>
|
||||||
|
w.type === "hd" &&
|
||||||
|
w.addresses[0] &&
|
||||||
|
w.addresses[0].address.toLowerCase() === firstAddress.toLowerCase(),
|
||||||
|
);
|
||||||
|
if (duplicate) {
|
||||||
|
showFlash(
|
||||||
|
"This recovery phrase is already added (" + duplicate.name + ").",
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const encrypted = await encryptWithPassword(mnemonic, pw);
|
||||||
|
const walletNum = state.wallets.length + 1;
|
||||||
|
const wallet = {
|
||||||
|
type: "hd",
|
||||||
|
name: "Wallet " + walletNum,
|
||||||
|
xpub: xpub,
|
||||||
|
encryptedSecret: encrypted,
|
||||||
|
nextIndex: 1,
|
||||||
|
addresses: [
|
||||||
|
{ address: firstAddress, balance: "0.0000", tokenBalances: [] },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
state.wallets.push(wallet);
|
||||||
|
state.hasWallet = true;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
showView("main");
|
||||||
|
|
||||||
|
// Scan for used HD addresses beyond index 0.
|
||||||
|
showFlash("Scanning for addresses...", 30000);
|
||||||
|
const scan = await scanForAddresses(xpub, state.rpcUrl);
|
||||||
|
if (scan.addresses.length > 1) {
|
||||||
|
wallet.addresses = scan.addresses.map((a) => ({
|
||||||
|
address: a.address,
|
||||||
|
balance: "0.0000",
|
||||||
|
tokenBalances: [],
|
||||||
|
}));
|
||||||
|
wallet.nextIndex = scan.nextIndex;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
showFlash("Found " + scan.addresses.length + " addresses.");
|
||||||
|
} else {
|
||||||
|
showFlash("Ready.", 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
ctx.doRefreshAndRender();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function importPrivateKey(ctx) {
|
||||||
|
const key = $("import-private-key").value.trim();
|
||||||
|
if (!key) {
|
||||||
|
showFlash("Please enter your private key.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let addr;
|
||||||
|
try {
|
||||||
|
addr = addressFromPrivateKey(key);
|
||||||
|
} catch (e) {
|
||||||
|
showFlash("Invalid private key.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const pw = validatePassword();
|
||||||
|
if (!pw) return;
|
||||||
|
const duplicate = state.wallets.find(
|
||||||
|
(w) =>
|
||||||
|
w.type === "key" &&
|
||||||
|
w.addresses[0] &&
|
||||||
|
w.addresses[0].address.toLowerCase() === addr.toLowerCase(),
|
||||||
|
);
|
||||||
|
if (duplicate) {
|
||||||
|
showFlash(
|
||||||
|
"This private key is already added (" + duplicate.name + ").",
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const encrypted = await encryptWithPassword(key, pw);
|
||||||
|
const walletNum = state.wallets.length + 1;
|
||||||
|
state.wallets.push({
|
||||||
|
type: "key",
|
||||||
|
name: "Wallet " + walletNum,
|
||||||
|
encryptedSecret: encrypted,
|
||||||
|
addresses: [{ address: addr, balance: "0.0000", tokenBalances: [] }],
|
||||||
|
});
|
||||||
|
state.hasWallet = true;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
showView("main");
|
||||||
|
|
||||||
|
ctx.doRefreshAndRender();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function importXprvKey(ctx) {
|
||||||
|
const xprv = $("import-xprv-key").value.trim();
|
||||||
|
if (!xprv) {
|
||||||
|
showFlash("Please enter your extended private key.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!isValidXprv(xprv)) {
|
||||||
|
showFlash("Invalid extended private key.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let result;
|
||||||
|
try {
|
||||||
|
result = hdWalletFromXprv(xprv);
|
||||||
|
} catch (e) {
|
||||||
|
showFlash("Invalid extended private key.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const { xpub, firstAddress } = result;
|
||||||
|
const duplicate = state.wallets.find(
|
||||||
|
(w) =>
|
||||||
|
(w.type === "hd" || w.type === "xprv") &&
|
||||||
|
w.addresses[0] &&
|
||||||
|
w.addresses[0].address.toLowerCase() === firstAddress.toLowerCase(),
|
||||||
|
);
|
||||||
|
if (duplicate) {
|
||||||
|
showFlash("This key is already added (" + duplicate.name + ").");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const pw = validatePassword();
|
||||||
|
if (!pw) return;
|
||||||
|
const encrypted = await encryptWithPassword(xprv, pw);
|
||||||
|
const walletNum = state.wallets.length + 1;
|
||||||
|
const wallet = {
|
||||||
|
type: "xprv",
|
||||||
|
name: "Wallet " + walletNum,
|
||||||
|
xpub: xpub,
|
||||||
|
encryptedSecret: encrypted,
|
||||||
|
nextIndex: 1,
|
||||||
|
addresses: [
|
||||||
|
{ address: firstAddress, balance: "0.0000", tokenBalances: [] },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
state.wallets.push(wallet);
|
||||||
|
state.hasWallet = true;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
showView("main");
|
||||||
|
|
||||||
|
// Scan for used HD addresses beyond index 0.
|
||||||
|
showFlash("Scanning for addresses...", 30000);
|
||||||
|
const scan = await scanForAddresses(xpub, state.rpcUrl);
|
||||||
|
if (scan.addresses.length > 1) {
|
||||||
|
wallet.addresses = scan.addresses.map((a) => ({
|
||||||
|
address: a.address,
|
||||||
|
balance: "0.0000",
|
||||||
|
tokenBalances: [],
|
||||||
|
}));
|
||||||
|
wallet.nextIndex = scan.nextIndex;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
showFlash("Found " + scan.addresses.length + " addresses.");
|
||||||
|
} else {
|
||||||
|
showFlash("Ready.", 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
ctx.doRefreshAndRender();
|
||||||
|
}
|
||||||
|
|
||||||
function init(ctx) {
|
function init(ctx) {
|
||||||
|
// Tab click handlers
|
||||||
|
$("tab-mnemonic").addEventListener("click", () => switchMode("mnemonic"));
|
||||||
|
$("tab-privkey").addEventListener("click", () => switchMode("privkey"));
|
||||||
|
$("tab-xprv").addEventListener("click", () => switchMode("xprv"));
|
||||||
|
|
||||||
|
// Generate mnemonic
|
||||||
$("btn-generate-phrase").addEventListener("click", () => {
|
$("btn-generate-phrase").addEventListener("click", () => {
|
||||||
$("wallet-mnemonic").value = generateMnemonic();
|
$("wallet-mnemonic").value = generateMnemonic();
|
||||||
$("add-wallet-phrase-warning").classList.remove("hidden");
|
$("add-wallet-phrase-warning").classList.remove("hidden");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Import / confirm
|
||||||
$("btn-add-wallet-confirm").addEventListener("click", async () => {
|
$("btn-add-wallet-confirm").addEventListener("click", async () => {
|
||||||
const mnemonic = $("wallet-mnemonic").value.trim();
|
if (currentMode === "mnemonic") {
|
||||||
if (!mnemonic) {
|
await importMnemonic(ctx);
|
||||||
showFlash(
|
} else if (currentMode === "privkey") {
|
||||||
"Enter a recovery phrase or press the die to generate one.",
|
await importPrivateKey(ctx);
|
||||||
);
|
} else if (currentMode === "xprv") {
|
||||||
return;
|
await importXprvKey(ctx);
|
||||||
}
|
}
|
||||||
const words = mnemonic.split(/\s+/);
|
|
||||||
if (words.length !== 12 && words.length !== 24) {
|
|
||||||
showFlash(
|
|
||||||
"Recovery phrase must be 12 or 24 words. You entered " +
|
|
||||||
words.length +
|
|
||||||
".",
|
|
||||||
);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (!isValidMnemonic(mnemonic)) {
|
|
||||||
showFlash("Invalid recovery phrase. Check for typos.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const pw = $("add-wallet-password").value;
|
|
||||||
const pw2 = $("add-wallet-password-confirm").value;
|
|
||||||
if (!pw) {
|
|
||||||
showFlash("Please choose a password.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (pw.length < 12) {
|
|
||||||
showFlash("Password must be at least 12 characters.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (pw !== pw2) {
|
|
||||||
showFlash("Passwords do not match.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const { xpub, firstAddress } = hdWalletFromMnemonic(mnemonic);
|
|
||||||
const duplicate = state.wallets.find(
|
|
||||||
(w) =>
|
|
||||||
w.type === "hd" &&
|
|
||||||
w.addresses[0] &&
|
|
||||||
w.addresses[0].address.toLowerCase() ===
|
|
||||||
firstAddress.toLowerCase(),
|
|
||||||
);
|
|
||||||
if (duplicate) {
|
|
||||||
showFlash(
|
|
||||||
"This recovery phrase is already added (" +
|
|
||||||
duplicate.name +
|
|
||||||
").",
|
|
||||||
);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const encrypted = await encryptWithPassword(mnemonic, pw);
|
|
||||||
const walletNum = state.wallets.length + 1;
|
|
||||||
const wallet = {
|
|
||||||
type: "hd",
|
|
||||||
name: "Wallet " + walletNum,
|
|
||||||
xpub: xpub,
|
|
||||||
encryptedSecret: encrypted,
|
|
||||||
nextIndex: 1,
|
|
||||||
addresses: [
|
|
||||||
{ address: firstAddress, balance: "0.0000", tokenBalances: [] },
|
|
||||||
],
|
|
||||||
};
|
|
||||||
state.wallets.push(wallet);
|
|
||||||
state.hasWallet = true;
|
|
||||||
await saveState();
|
|
||||||
ctx.renderWalletList();
|
|
||||||
showView("main");
|
|
||||||
|
|
||||||
// Scan for used HD addresses beyond index 0.
|
|
||||||
showFlash("Scanning for addresses...", 30000);
|
|
||||||
const scan = await scanForAddresses(xpub, state.rpcUrl);
|
|
||||||
if (scan.addresses.length > 1) {
|
|
||||||
wallet.addresses = scan.addresses.map((a) => ({
|
|
||||||
address: a.address,
|
|
||||||
balance: "0.0000",
|
|
||||||
tokenBalances: [],
|
|
||||||
}));
|
|
||||||
wallet.nextIndex = scan.nextIndex;
|
|
||||||
await saveState();
|
|
||||||
ctx.renderWalletList();
|
|
||||||
showFlash("Found " + scan.addresses.length + " addresses.");
|
|
||||||
} else {
|
|
||||||
showFlash("Ready.", 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.doRefreshAndRender();
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Back button
|
||||||
$("btn-add-wallet-back").addEventListener("click", () => {
|
$("btn-add-wallet-back").addEventListener("click", () => {
|
||||||
if (!state.hasWallet) {
|
if (!state.hasWallet) {
|
||||||
showView("welcome");
|
showView("welcome");
|
||||||
@@ -119,11 +280,6 @@ function init(ctx) {
|
|||||||
showView("main");
|
showView("main");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$("btn-add-wallet-import-key").addEventListener(
|
|
||||||
"click",
|
|
||||||
ctx.showImportKeyView,
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { init, show };
|
module.exports = { init, show };
|
||||||
|
|||||||
@@ -15,9 +15,15 @@ const {
|
|||||||
filterTransactions,
|
filterTransactions,
|
||||||
} = require("../../shared/transactions");
|
} = require("../../shared/transactions");
|
||||||
const { resolveEnsNames } = require("../../shared/ens");
|
const { resolveEnsNames } = require("../../shared/ens");
|
||||||
const { updateSendBalance, renderSendTokenSelect } = require("./send");
|
const {
|
||||||
|
updateSendBalance,
|
||||||
|
renderSendTokenSelect,
|
||||||
|
resetSendValidation,
|
||||||
|
} = require("./send");
|
||||||
const { log } = require("../../shared/log");
|
const { log } = require("../../shared/log");
|
||||||
const makeBlockie = require("ethereum-blockies-base64");
|
const makeBlockie = require("ethereum-blockies-base64");
|
||||||
|
const { decryptWithPassword } = require("../../shared/vault");
|
||||||
|
const { getSignerForAddress } = require("../../shared/wallet");
|
||||||
|
|
||||||
let ctx;
|
let ctx;
|
||||||
|
|
||||||
@@ -186,10 +192,12 @@ function renderTransactions(txs) {
|
|||||||
let html = "";
|
let html = "";
|
||||||
let i = 0;
|
let i = 0;
|
||||||
for (const tx of txs) {
|
for (const tx of txs) {
|
||||||
|
// For swap transactions, show the user's own labelled wallet
|
||||||
|
// address instead of the contract address (see issue #55).
|
||||||
const counterparty =
|
const counterparty =
|
||||||
tx.direction === "contract"
|
tx.direction === "contract" && tx.directionLabel === "Swap"
|
||||||
? tx.from
|
? tx.from
|
||||||
: tx.direction === "sent"
|
: tx.direction === "sent" || tx.direction === "contract"
|
||||||
? tx.to
|
? tx.to
|
||||||
: tx.from;
|
: tx.from;
|
||||||
const ensName = ensNameMap.get(counterparty) || null;
|
const ensName = ensNameMap.get(counterparty) || null;
|
||||||
@@ -255,6 +263,7 @@ function init(_ctx) {
|
|||||||
$("send-token").classList.remove("hidden");
|
$("send-token").classList.remove("hidden");
|
||||||
$("send-token-static").classList.add("hidden");
|
$("send-token-static").classList.add("hidden");
|
||||||
updateSendBalance();
|
updateSendBalance();
|
||||||
|
resetSendValidation();
|
||||||
showView("send");
|
showView("send");
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -263,6 +272,102 @@ function init(_ctx) {
|
|||||||
});
|
});
|
||||||
|
|
||||||
$("btn-add-token").addEventListener("click", ctx.showAddTokenView);
|
$("btn-add-token").addEventListener("click", ctx.showAddTokenView);
|
||||||
|
|
||||||
|
// More menu dropdown
|
||||||
|
const moreBtn = $("btn-more-menu");
|
||||||
|
const moreDropdown = $("more-menu-dropdown");
|
||||||
|
moreBtn.addEventListener("click", (e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
const isOpen = !moreDropdown.classList.toggle("hidden");
|
||||||
|
moreBtn.classList.toggle("bg-fg", isOpen);
|
||||||
|
moreBtn.classList.toggle("text-bg", isOpen);
|
||||||
|
});
|
||||||
|
document.addEventListener("click", () => {
|
||||||
|
moreDropdown.classList.add("hidden");
|
||||||
|
moreBtn.classList.remove("bg-fg", "text-bg");
|
||||||
|
});
|
||||||
|
moreDropdown.addEventListener("click", (e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("btn-export-privkey").addEventListener("click", () => {
|
||||||
|
moreDropdown.classList.add("hidden");
|
||||||
|
moreBtn.classList.remove("bg-fg", "text-bg");
|
||||||
|
const wallet = state.wallets[state.selectedWallet];
|
||||||
|
const addr = wallet.addresses[state.selectedAddress];
|
||||||
|
const blockieEl = $("export-privkey-jazzicon");
|
||||||
|
blockieEl.innerHTML = "";
|
||||||
|
const bImg = document.createElement("img");
|
||||||
|
bImg.src = makeBlockie(addr.address);
|
||||||
|
bImg.width = 48;
|
||||||
|
bImg.height = 48;
|
||||||
|
bImg.style.imageRendering = "pixelated";
|
||||||
|
bImg.style.borderRadius = "50%";
|
||||||
|
blockieEl.appendChild(bImg);
|
||||||
|
$("export-privkey-title").textContent =
|
||||||
|
wallet.name + " \u2014 Address " + (state.selectedAddress + 1);
|
||||||
|
$("export-privkey-dot").innerHTML = addressDotHtml(addr.address);
|
||||||
|
$("export-privkey-address").textContent = addr.address;
|
||||||
|
$("export-privkey-address").dataset.full = addr.address;
|
||||||
|
$("export-privkey-password").value = "";
|
||||||
|
$("export-privkey-flash").classList.add("hidden");
|
||||||
|
$("export-privkey-flash").textContent = "";
|
||||||
|
$("export-privkey-password-section").classList.remove("hidden");
|
||||||
|
$("export-privkey-result").classList.add("hidden");
|
||||||
|
$("export-privkey-value").textContent = "";
|
||||||
|
showView("export-privkey");
|
||||||
|
});
|
||||||
|
|
||||||
|
$("btn-export-privkey-confirm").addEventListener("click", async () => {
|
||||||
|
const password = $("export-privkey-password").value;
|
||||||
|
if (!password) {
|
||||||
|
$("export-privkey-flash").textContent = "Password is required.";
|
||||||
|
$("export-privkey-flash").classList.remove("hidden");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const wallet = state.wallets[state.selectedWallet];
|
||||||
|
try {
|
||||||
|
const secret = await decryptWithPassword(
|
||||||
|
wallet.encryptedSecret,
|
||||||
|
password,
|
||||||
|
);
|
||||||
|
const signer = getSignerForAddress(
|
||||||
|
wallet,
|
||||||
|
state.selectedAddress,
|
||||||
|
secret,
|
||||||
|
);
|
||||||
|
const privateKey = signer.privateKey;
|
||||||
|
$("export-privkey-password-section").classList.add("hidden");
|
||||||
|
$("export-privkey-value").textContent = privateKey;
|
||||||
|
$("export-privkey-result").classList.remove("hidden");
|
||||||
|
$("export-privkey-flash").classList.add("hidden");
|
||||||
|
} catch {
|
||||||
|
$("export-privkey-flash").textContent = "Wrong password.";
|
||||||
|
$("export-privkey-flash").classList.remove("hidden");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$("export-privkey-value").addEventListener("click", () => {
|
||||||
|
const key = $("export-privkey-value").textContent;
|
||||||
|
if (key) {
|
||||||
|
navigator.clipboard.writeText(key);
|
||||||
|
showFlash("Copied!");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$("export-privkey-address").addEventListener("click", () => {
|
||||||
|
const full = $("export-privkey-address").dataset.full;
|
||||||
|
if (full) {
|
||||||
|
navigator.clipboard.writeText(full);
|
||||||
|
showFlash("Copied!");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$("btn-export-privkey-back").addEventListener("click", () => {
|
||||||
|
$("export-privkey-value").textContent = "";
|
||||||
|
$("export-privkey-password").value = "";
|
||||||
|
show();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { init, show };
|
module.exports = { init, show };
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ const {
|
|||||||
balanceLine,
|
balanceLine,
|
||||||
} = require("./helpers");
|
} = require("./helpers");
|
||||||
const { state, currentAddress, saveState } = require("../../shared/state");
|
const { state, currentAddress, saveState } = require("../../shared/state");
|
||||||
const { TOKEN_BY_ADDRESS } = require("../../shared/tokenList");
|
const { TOKEN_BY_ADDRESS, resolveSymbol } = require("../../shared/tokenList");
|
||||||
const {
|
const {
|
||||||
formatUsd,
|
formatUsd,
|
||||||
getPrice,
|
getPrice,
|
||||||
@@ -23,7 +23,11 @@ const {
|
|||||||
filterTransactions,
|
filterTransactions,
|
||||||
} = require("../../shared/transactions");
|
} = require("../../shared/transactions");
|
||||||
const { resolveEnsNames } = require("../../shared/ens");
|
const { resolveEnsNames } = require("../../shared/ens");
|
||||||
const { updateSendBalance, renderSendTokenSelect } = require("./send");
|
const {
|
||||||
|
updateSendBalance,
|
||||||
|
renderSendTokenSelect,
|
||||||
|
resetSendValidation,
|
||||||
|
} = require("./send");
|
||||||
const { log } = require("../../shared/log");
|
const { log } = require("../../shared/log");
|
||||||
const makeBlockie = require("ethereum-blockies-base64");
|
const makeBlockie = require("ethereum-blockies-base64");
|
||||||
|
|
||||||
@@ -87,6 +91,7 @@ function show() {
|
|||||||
|
|
||||||
// Determine token symbol and balance
|
// Determine token symbol and balance
|
||||||
let symbol, amount, price;
|
let symbol, amount, price;
|
||||||
|
const knownToken = TOKEN_BY_ADDRESS.get(tokenId.toLowerCase());
|
||||||
if (tokenId === "ETH") {
|
if (tokenId === "ETH") {
|
||||||
symbol = "ETH";
|
symbol = "ETH";
|
||||||
amount = parseFloat(addr.balance || "0");
|
amount = parseFloat(addr.balance || "0");
|
||||||
@@ -95,7 +100,11 @@ function show() {
|
|||||||
const tb = (addr.tokenBalances || []).find(
|
const tb = (addr.tokenBalances || []).find(
|
||||||
(t) => t.address.toLowerCase() === tokenId.toLowerCase(),
|
(t) => t.address.toLowerCase() === tokenId.toLowerCase(),
|
||||||
);
|
);
|
||||||
symbol = tb ? tb.symbol : "?";
|
symbol = resolveSymbol(
|
||||||
|
tokenId,
|
||||||
|
addr.tokenBalances,
|
||||||
|
state.trackedTokens,
|
||||||
|
);
|
||||||
amount = tb ? parseFloat(tb.balance || "0") : 0;
|
amount = tb ? parseFloat(tb.balance || "0") : 0;
|
||||||
price = getPrice(symbol);
|
price = getPrice(symbol);
|
||||||
}
|
}
|
||||||
@@ -138,13 +147,32 @@ function show() {
|
|||||||
const tb = (addr.tokenBalances || []).find(
|
const tb = (addr.tokenBalances || []).find(
|
||||||
(t) => t.address.toLowerCase() === tokenId.toLowerCase(),
|
(t) => t.address.toLowerCase() === tokenId.toLowerCase(),
|
||||||
);
|
);
|
||||||
const tokenName = tb && tb.name ? escapeHtml(tb.name) : null;
|
const tracked = (state.trackedTokens || []).find(
|
||||||
const tokenSymbol = tb && tb.symbol ? escapeHtml(tb.symbol) : null;
|
(t) => t.address.toLowerCase() === tokenId.toLowerCase(),
|
||||||
const tokenDecimals = tb && tb.decimals != null ? tb.decimals : null;
|
);
|
||||||
|
const rawName =
|
||||||
|
(tb && tb.name) ||
|
||||||
|
(tracked && tracked.name) ||
|
||||||
|
(knownToken && knownToken.name) ||
|
||||||
|
null;
|
||||||
|
const rawSymbol =
|
||||||
|
(tb && tb.symbol) ||
|
||||||
|
(tracked && tracked.symbol) ||
|
||||||
|
(knownToken && knownToken.symbol) ||
|
||||||
|
null;
|
||||||
|
const tokenName = rawName ? escapeHtml(rawName) : null;
|
||||||
|
const tokenSymbol = rawSymbol ? escapeHtml(rawSymbol) : null;
|
||||||
|
const tokenDecimals =
|
||||||
|
tb && tb.decimals != null
|
||||||
|
? tb.decimals
|
||||||
|
: tracked && tracked.decimals != null
|
||||||
|
? tracked.decimals
|
||||||
|
: knownToken && knownToken.decimals != null
|
||||||
|
? knownToken.decimals
|
||||||
|
: null;
|
||||||
const tokenHolders = tb && tb.holders != null ? tb.holders : null;
|
const tokenHolders = tb && tb.holders != null ? tb.holders : null;
|
||||||
const dot = addressDotHtml(tokenId);
|
const dot = addressDotHtml(tokenId);
|
||||||
const tokenLink = `https://etherscan.io/token/${escapeHtml(tokenId)}`;
|
const tokenLink = `https://etherscan.io/token/${escapeHtml(tokenId)}`;
|
||||||
const knownToken = TOKEN_BY_ADDRESS.get(tokenId.toLowerCase());
|
|
||||||
const projectUrl = knownToken && knownToken.url ? knownToken.url : null;
|
const projectUrl = knownToken && knownToken.url ? knownToken.url : null;
|
||||||
let infoHtml = `<div class="font-bold mb-2">Contract Address</div>`;
|
let infoHtml = `<div class="font-bold mb-2">Contract Address</div>`;
|
||||||
infoHtml +=
|
infoHtml +=
|
||||||
@@ -348,6 +376,7 @@ function init(_ctx) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
updateSendBalance();
|
updateSendBalance();
|
||||||
|
resetSendValidation();
|
||||||
showView("send");
|
showView("send");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -78,10 +78,12 @@ function decodeCalldata(data, toAddress) {
|
|||||||
"0xffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff",
|
"0xffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff",
|
||||||
);
|
);
|
||||||
const isUnlimited = rawAmount === maxUint;
|
const isUnlimited = rawAmount === maxUint;
|
||||||
|
const amountRaw = isUnlimited
|
||||||
|
? "Unlimited"
|
||||||
|
: formatTxValue(formatUnits(rawAmount, tokenDecimals));
|
||||||
const amountStr = isUnlimited
|
const amountStr = isUnlimited
|
||||||
? "Unlimited"
|
? "Unlimited"
|
||||||
: formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
|
: amountRaw + (tokenSymbol ? " " + tokenSymbol : "");
|
||||||
(tokenSymbol ? " " + tokenSymbol : "");
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
name: "Token Approval",
|
name: "Token Approval",
|
||||||
@@ -100,7 +102,11 @@ function decodeCalldata(data, toAddress) {
|
|||||||
value: spender,
|
value: spender,
|
||||||
address: spender,
|
address: spender,
|
||||||
},
|
},
|
||||||
{ label: "Amount", value: amountStr },
|
{
|
||||||
|
label: "Amount",
|
||||||
|
value: amountStr,
|
||||||
|
rawValue: amountRaw,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -108,9 +114,11 @@ function decodeCalldata(data, toAddress) {
|
|||||||
if (parsed.name === "transfer") {
|
if (parsed.name === "transfer") {
|
||||||
const to = parsed.args[0];
|
const to = parsed.args[0];
|
||||||
const rawAmount = parsed.args[1];
|
const rawAmount = parsed.args[1];
|
||||||
|
const amountRaw = formatTxValue(
|
||||||
|
formatUnits(rawAmount, tokenDecimals),
|
||||||
|
);
|
||||||
const amountStr =
|
const amountStr =
|
||||||
formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
|
amountRaw + (tokenSymbol ? " " + tokenSymbol : "");
|
||||||
(tokenSymbol ? " " + tokenSymbol : "");
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
name: "Token Transfer",
|
name: "Token Transfer",
|
||||||
@@ -125,7 +133,11 @@ function decodeCalldata(data, toAddress) {
|
|||||||
isToken: true,
|
isToken: true,
|
||||||
},
|
},
|
||||||
{ label: "Recipient", value: to, address: to },
|
{ label: "Recipient", value: to, address: to },
|
||||||
{ label: "Amount", value: amountStr },
|
{
|
||||||
|
label: "Amount",
|
||||||
|
value: amountStr,
|
||||||
|
rawValue: amountRaw,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -163,7 +175,7 @@ function showTxApproval(details) {
|
|||||||
pendingTxDetails.to = d.address;
|
pendingTxDetails.to = d.address;
|
||||||
}
|
}
|
||||||
if (d.label === "Amount") {
|
if (d.label === "Amount") {
|
||||||
pendingTxDetails.amount = d.value;
|
pendingTxDetails.amount = d.rawValue || d.value;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (token) {
|
if (token) {
|
||||||
@@ -172,6 +184,15 @@ function showTxApproval(details) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Carry decoded calldata info through to success/error views
|
||||||
|
if (decoded) {
|
||||||
|
pendingTxDetails.decoded = {
|
||||||
|
name: decoded.name,
|
||||||
|
description: decoded.description,
|
||||||
|
details: decoded.details,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
$("approve-tx-hostname").textContent = details.hostname;
|
$("approve-tx-hostname").textContent = details.hostname;
|
||||||
$("approve-tx-from").innerHTML = approvalAddressHtml(state.activeAddress);
|
$("approve-tx-from").innerHTML = approvalAddressHtml(state.activeAddress);
|
||||||
|
|
||||||
|
|||||||
@@ -14,6 +14,7 @@ const {
|
|||||||
showError,
|
showError,
|
||||||
hideError,
|
hideError,
|
||||||
showView,
|
showView,
|
||||||
|
showFlash,
|
||||||
addressTitle,
|
addressTitle,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
@@ -95,11 +96,22 @@ function show(txInfo) {
|
|||||||
// Token contract section (ERC-20 only)
|
// Token contract section (ERC-20 only)
|
||||||
const tokenSection = $("confirm-token-section");
|
const tokenSection = $("confirm-token-section");
|
||||||
if (isErc20) {
|
if (isErc20) {
|
||||||
|
const dot = addressDotHtml(txInfo.token);
|
||||||
const link = etherscanTokenLink(txInfo.token);
|
const link = etherscanTokenLink(txInfo.token);
|
||||||
$("confirm-token-contract").innerHTML =
|
$("confirm-token-contract").innerHTML =
|
||||||
escapeHtml(txInfo.token) +
|
`<div class="flex items-center">${dot}` +
|
||||||
` <a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
`<span class="break-all underline decoration-dashed cursor-pointer" data-copy="${escapeHtml(txInfo.token)}">${escapeHtml(txInfo.token)}</span>` +
|
||||||
|
`<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>` +
|
||||||
|
`</div>`;
|
||||||
tokenSection.classList.remove("hidden");
|
tokenSection.classList.remove("hidden");
|
||||||
|
// Attach click-to-copy on the contract address
|
||||||
|
const copyEl = tokenSection.querySelector("[data-copy]");
|
||||||
|
if (copyEl) {
|
||||||
|
copyEl.onclick = () => {
|
||||||
|
navigator.clipboard.writeText(copyEl.dataset.copy);
|
||||||
|
showFlash("Copied!");
|
||||||
|
};
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
tokenSection.classList.add("hidden");
|
tokenSection.classList.add("hidden");
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -13,7 +13,6 @@ const { state, saveState } = require("../../shared/state");
|
|||||||
const VIEWS = [
|
const VIEWS = [
|
||||||
"welcome",
|
"welcome",
|
||||||
"add-wallet",
|
"add-wallet",
|
||||||
"import-key",
|
|
||||||
"main",
|
"main",
|
||||||
"address",
|
"address",
|
||||||
"address-token",
|
"address-token",
|
||||||
@@ -31,6 +30,7 @@ const VIEWS = [
|
|||||||
"approve-site",
|
"approve-site",
|
||||||
"approve-tx",
|
"approve-tx",
|
||||||
"approve-sign",
|
"approve-sign",
|
||||||
|
"export-privkey",
|
||||||
];
|
];
|
||||||
|
|
||||||
function $(id) {
|
function $(id) {
|
||||||
|
|||||||
@@ -11,7 +11,11 @@ const {
|
|||||||
truncateMiddle,
|
truncateMiddle,
|
||||||
} = require("./helpers");
|
} = require("./helpers");
|
||||||
const { state, saveState, currentAddress } = require("../../shared/state");
|
const { state, saveState, currentAddress } = require("../../shared/state");
|
||||||
const { updateSendBalance, renderSendTokenSelect } = require("./send");
|
const {
|
||||||
|
updateSendBalance,
|
||||||
|
renderSendTokenSelect,
|
||||||
|
resetSendValidation,
|
||||||
|
} = require("./send");
|
||||||
const { deriveAddressFromXpub } = require("../../shared/wallet");
|
const { deriveAddressFromXpub } = require("../../shared/wallet");
|
||||||
const {
|
const {
|
||||||
formatUsd,
|
formatUsd,
|
||||||
@@ -103,10 +107,15 @@ function renderHomeTxList(ctx) {
|
|||||||
let html = "";
|
let html = "";
|
||||||
let i = 0;
|
let i = 0;
|
||||||
for (const tx of homeTxs) {
|
for (const tx of homeTxs) {
|
||||||
|
// For swap transactions, show the user's own labelled wallet
|
||||||
|
// address (the one that initiated the swap) instead of the
|
||||||
|
// contract address which is not useful in the list view.
|
||||||
const counterparty =
|
const counterparty =
|
||||||
tx.direction === "sent" || tx.direction === "contract"
|
tx.direction === "contract" && tx.directionLabel === "Swap"
|
||||||
? tx.to
|
? tx.from
|
||||||
: tx.from;
|
: tx.direction === "sent" || tx.direction === "contract"
|
||||||
|
? tx.to
|
||||||
|
: tx.from;
|
||||||
const dirLabel = tx.directionLabel;
|
const dirLabel = tx.directionLabel;
|
||||||
const amountStr = tx.value
|
const amountStr = tx.value
|
||||||
? escapeHtml(tx.value + " " + tx.symbol)
|
? escapeHtml(tx.value + " " + tx.symbol)
|
||||||
@@ -230,7 +239,7 @@ function render(ctx) {
|
|||||||
html += `<div>`;
|
html += `<div>`;
|
||||||
html += `<div class="flex justify-between items-center bg-section py-1 px-2" style="margin:0 -0.5rem">`;
|
html += `<div class="flex justify-between items-center bg-section py-1 px-2" style="margin:0 -0.5rem">`;
|
||||||
html += `<span class="font-bold cursor-pointer wallet-name underline decoration-dashed" data-wallet="${wi}">${wallet.name}</span>`;
|
html += `<span class="font-bold cursor-pointer wallet-name underline decoration-dashed" data-wallet="${wi}">${wallet.name}</span>`;
|
||||||
if (wallet.type === "hd") {
|
if (wallet.type === "hd" || wallet.type === "xprv") {
|
||||||
html += `<button class="btn-add-address border border-border px-1 hover:bg-fg hover:text-bg cursor-pointer text-xs" data-wallet="${wi}" title="Add another address to this wallet">+</button>`;
|
html += `<button class="btn-add-address border border-border px-1 hover:bg-fg hover:text-bg cursor-pointer text-xs" data-wallet="${wi}" title="Add another address to this wallet">+</button>`;
|
||||||
}
|
}
|
||||||
html += `</div>`;
|
html += `</div>`;
|
||||||
@@ -383,6 +392,7 @@ function init(ctx) {
|
|||||||
$("send-token-static").classList.add("hidden");
|
$("send-token-static").classList.add("hidden");
|
||||||
renderSendTokenSelect(addr);
|
renderSendTokenSelect(addr);
|
||||||
updateSendBalance();
|
updateSendBalance();
|
||||||
|
resetSendValidation();
|
||||||
showView("send");
|
showView("send");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,69 +0,0 @@
|
|||||||
const { $, showView, showFlash } = require("./helpers");
|
|
||||||
const { addressFromPrivateKey } = require("../../shared/wallet");
|
|
||||||
const { encryptWithPassword } = require("../../shared/vault");
|
|
||||||
const { state, saveState } = require("../../shared/state");
|
|
||||||
|
|
||||||
function show() {
|
|
||||||
$("import-private-key").value = "";
|
|
||||||
$("import-key-password").value = "";
|
|
||||||
$("import-key-password-confirm").value = "";
|
|
||||||
showView("import-key");
|
|
||||||
}
|
|
||||||
|
|
||||||
function init(ctx) {
|
|
||||||
$("btn-import-key-confirm").addEventListener("click", async () => {
|
|
||||||
const key = $("import-private-key").value.trim();
|
|
||||||
if (!key) {
|
|
||||||
showFlash("Please enter your private key.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let addr;
|
|
||||||
try {
|
|
||||||
addr = addressFromPrivateKey(key);
|
|
||||||
} catch (e) {
|
|
||||||
showFlash("Invalid private key.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const pw = $("import-key-password").value;
|
|
||||||
const pw2 = $("import-key-password-confirm").value;
|
|
||||||
if (!pw) {
|
|
||||||
showFlash("Please choose a password.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (pw.length < 12) {
|
|
||||||
showFlash("Password must be at least 12 characters.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (pw !== pw2) {
|
|
||||||
showFlash("Passwords do not match.");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const encrypted = await encryptWithPassword(key, pw);
|
|
||||||
const walletNum = state.wallets.length + 1;
|
|
||||||
state.wallets.push({
|
|
||||||
type: "key",
|
|
||||||
name: "Wallet " + walletNum,
|
|
||||||
encryptedSecret: encrypted,
|
|
||||||
addresses: [
|
|
||||||
{ address: addr, balance: "0.0000", tokenBalances: [] },
|
|
||||||
],
|
|
||||||
});
|
|
||||||
state.hasWallet = true;
|
|
||||||
await saveState();
|
|
||||||
ctx.renderWalletList();
|
|
||||||
showView("main");
|
|
||||||
|
|
||||||
ctx.doRefreshAndRender();
|
|
||||||
});
|
|
||||||
|
|
||||||
$("btn-import-key-back").addEventListener("click", () => {
|
|
||||||
if (!state.hasWallet) {
|
|
||||||
showView("welcome");
|
|
||||||
} else {
|
|
||||||
ctx.renderWalletList();
|
|
||||||
showView("main");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = { init, show };
|
|
||||||
@@ -1,4 +1,10 @@
|
|||||||
const { $, showView, showFlash, addressDotHtml } = require("./helpers");
|
const {
|
||||||
|
$,
|
||||||
|
showView,
|
||||||
|
showFlash,
|
||||||
|
formatAddressHtml,
|
||||||
|
addressTitle,
|
||||||
|
} = require("./helpers");
|
||||||
const { state, currentAddress } = require("../../shared/state");
|
const { state, currentAddress } = require("../../shared/state");
|
||||||
const QRCode = require("qrcode");
|
const QRCode = require("qrcode");
|
||||||
|
|
||||||
@@ -12,8 +18,12 @@ const EXT_ICON =
|
|||||||
function show() {
|
function show() {
|
||||||
const addr = currentAddress();
|
const addr = currentAddress();
|
||||||
const address = addr ? addr.address : "";
|
const address = addr ? addr.address : "";
|
||||||
$("receive-dot").innerHTML = address ? addressDotHtml(address) : "";
|
const title = address ? addressTitle(address, state.wallets) : null;
|
||||||
$("receive-address").textContent = address;
|
const ensName = addr ? addr.ensName || null : null;
|
||||||
|
$("receive-address-block").innerHTML = address
|
||||||
|
? formatAddressHtml(address, ensName, null, title)
|
||||||
|
: "";
|
||||||
|
$("receive-address-block").dataset.full = address;
|
||||||
const link = address ? `https://etherscan.io/address/${address}` : "";
|
const link = address ? `https://etherscan.io/address/${address}` : "";
|
||||||
$("receive-etherscan-link").innerHTML = link
|
$("receive-etherscan-link").innerHTML = link
|
||||||
? `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`
|
? `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`
|
||||||
@@ -50,8 +60,16 @@ function show() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function init(ctx) {
|
function init(ctx) {
|
||||||
|
$("receive-address-block").addEventListener("click", () => {
|
||||||
|
const addr = $("receive-address-block").dataset.full;
|
||||||
|
if (addr) {
|
||||||
|
navigator.clipboard.writeText(addr);
|
||||||
|
showFlash("Copied!");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
$("btn-receive-copy").addEventListener("click", () => {
|
$("btn-receive-copy").addEventListener("click", () => {
|
||||||
const addr = $("receive-address").textContent;
|
const addr = $("receive-address-block").dataset.full;
|
||||||
if (addr) {
|
if (addr) {
|
||||||
navigator.clipboard.writeText(addr);
|
navigator.clipboard.writeText(addr);
|
||||||
showFlash("Copied!");
|
showFlash("Copied!");
|
||||||
|
|||||||
@@ -10,7 +10,108 @@ const {
|
|||||||
const { state, currentAddress } = require("../../shared/state");
|
const { state, currentAddress } = require("../../shared/state");
|
||||||
let ctx;
|
let ctx;
|
||||||
const { getProvider } = require("../../shared/balances");
|
const { getProvider } = require("../../shared/balances");
|
||||||
const { KNOWN_SYMBOLS } = require("../../shared/tokenList");
|
const { KNOWN_SYMBOLS, resolveSymbol } = require("../../shared/tokenList");
|
||||||
|
const { getAddress } = require("ethers");
|
||||||
|
|
||||||
|
const ZERO_ADDRESS = "0x0000000000000000000000000000000000000000";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Validate a destination address string.
|
||||||
|
* Returns { valid: true } or { valid: false, error: "..." }.
|
||||||
|
*/
|
||||||
|
function validateToAddress(value) {
|
||||||
|
const v = value.trim();
|
||||||
|
if (!v) return { valid: false, error: "" };
|
||||||
|
|
||||||
|
// ENS names: contains a dot and doesn't start with 0x
|
||||||
|
if (v.includes(".") && !v.startsWith("0x")) {
|
||||||
|
// Basic ENS format check: at least one label before and after dot
|
||||||
|
if (/^[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)+$/.test(v)) {
|
||||||
|
return { valid: true };
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
valid: false,
|
||||||
|
error: "Please enter a valid ENS name.",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Must look like an Ethereum address
|
||||||
|
if (!/^0x[0-9a-fA-F]{40}$/.test(v)) {
|
||||||
|
return {
|
||||||
|
valid: false,
|
||||||
|
error: "Please enter a valid Ethereum address.",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Reject zero address
|
||||||
|
if (v.toLowerCase() === ZERO_ADDRESS) {
|
||||||
|
return {
|
||||||
|
valid: false,
|
||||||
|
error: "Sending to the zero address is not allowed.",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// EIP-55 checksum validation: all-lowercase is ok, otherwise must match checksum
|
||||||
|
if (v !== v.toLowerCase()) {
|
||||||
|
try {
|
||||||
|
const checksummed = getAddress(v);
|
||||||
|
if (checksummed !== v) {
|
||||||
|
return {
|
||||||
|
valid: false,
|
||||||
|
error: "Address checksum is invalid. Please double-check the address.",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
return {
|
||||||
|
valid: false,
|
||||||
|
error: "Address checksum is invalid. Please double-check the address.",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Warn if sending to own address
|
||||||
|
const addr = currentAddress();
|
||||||
|
if (addr && v.toLowerCase() === addr.address.toLowerCase()) {
|
||||||
|
// Allow but will warn — we return valid with a warning
|
||||||
|
return {
|
||||||
|
valid: true,
|
||||||
|
warning: "This is your own address. Are you sure?",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return { valid: true };
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateToValidation() {
|
||||||
|
const input = $("send-to");
|
||||||
|
const errorEl = $("send-to-error");
|
||||||
|
const btn = $("btn-send-review");
|
||||||
|
const value = input.value.trim();
|
||||||
|
|
||||||
|
if (!value) {
|
||||||
|
errorEl.textContent = "";
|
||||||
|
btn.disabled = true;
|
||||||
|
btn.classList.add("opacity-50");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = validateToAddress(value);
|
||||||
|
if (!result.valid) {
|
||||||
|
errorEl.textContent = result.error;
|
||||||
|
errorEl.style.color = "#cc0000";
|
||||||
|
btn.disabled = true;
|
||||||
|
btn.classList.add("opacity-50");
|
||||||
|
} else if (result.warning) {
|
||||||
|
errorEl.textContent = result.warning;
|
||||||
|
errorEl.style.color = "#b8860b";
|
||||||
|
btn.disabled = false;
|
||||||
|
btn.classList.remove("opacity-50");
|
||||||
|
} else {
|
||||||
|
errorEl.textContent = "";
|
||||||
|
btn.disabled = false;
|
||||||
|
btn.classList.remove("opacity-50");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const EXT_ICON =
|
const EXT_ICON =
|
||||||
`<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
|
`<span style="display:inline-block;width:10px;height:10px;margin-left:4px;vertical-align:middle">` +
|
||||||
@@ -73,7 +174,11 @@ function updateSendBalance() {
|
|||||||
const tb = (addr.tokenBalances || []).find(
|
const tb = (addr.tokenBalances || []).find(
|
||||||
(t) => t.address.toLowerCase() === token.toLowerCase(),
|
(t) => t.address.toLowerCase() === token.toLowerCase(),
|
||||||
);
|
);
|
||||||
const symbol = tb ? tb.symbol : "?";
|
const symbol = resolveSymbol(
|
||||||
|
token,
|
||||||
|
addr.tokenBalances,
|
||||||
|
state.trackedTokens,
|
||||||
|
);
|
||||||
const bal = tb ? tb.balance || "0" : "0";
|
const bal = tb ? tb.balance || "0" : "0";
|
||||||
$("send-balance").textContent =
|
$("send-balance").textContent =
|
||||||
"Current balance: " + bal + " " + symbol;
|
"Current balance: " + bal + " " + symbol;
|
||||||
@@ -84,6 +189,13 @@ function init(_ctx) {
|
|||||||
ctx = _ctx;
|
ctx = _ctx;
|
||||||
$("send-token").addEventListener("change", updateSendBalance);
|
$("send-token").addEventListener("change", updateSendBalance);
|
||||||
|
|
||||||
|
// Initial state: disable review button until address is entered
|
||||||
|
$("btn-send-review").disabled = true;
|
||||||
|
$("btn-send-review").classList.add("opacity-50");
|
||||||
|
|
||||||
|
// Validate address on input
|
||||||
|
$("send-to").addEventListener("input", updateToValidation);
|
||||||
|
|
||||||
$("btn-send-review").addEventListener("click", async () => {
|
$("btn-send-review").addEventListener("click", async () => {
|
||||||
const to = $("send-to").value.trim();
|
const to = $("send-to").value.trim();
|
||||||
const amount = $("send-amount").value.trim();
|
const amount = $("send-amount").value.trim();
|
||||||
@@ -91,6 +203,15 @@ function init(_ctx) {
|
|||||||
showFlash("Please enter a recipient address.");
|
showFlash("Please enter a recipient address.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Re-validate before proceeding
|
||||||
|
const validation = validateToAddress(to);
|
||||||
|
if (!validation.valid) {
|
||||||
|
showFlash(
|
||||||
|
validation.error || "Please enter a valid Ethereum address.",
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
if (!amount || isNaN(parseFloat(amount)) || parseFloat(amount) <= 0) {
|
if (!amount || isNaN(parseFloat(amount)) || parseFloat(amount) <= 0) {
|
||||||
showFlash("Please enter a valid amount.");
|
showFlash("Please enter a valid amount.");
|
||||||
return;
|
return;
|
||||||
@@ -124,7 +245,11 @@ function init(_ctx) {
|
|||||||
const tb = (addr.tokenBalances || []).find(
|
const tb = (addr.tokenBalances || []).find(
|
||||||
(t) => t.address.toLowerCase() === token.toLowerCase(),
|
(t) => t.address.toLowerCase() === token.toLowerCase(),
|
||||||
);
|
);
|
||||||
tokenSymbol = tb ? tb.symbol : "?";
|
tokenSymbol = resolveSymbol(
|
||||||
|
token,
|
||||||
|
addr.tokenBalances,
|
||||||
|
state.trackedTokens,
|
||||||
|
);
|
||||||
tokenBalance = tb ? tb.balance || "0" : "0";
|
tokenBalance = tb ? tb.balance || "0" : "0";
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -151,4 +276,19 @@ function init(_ctx) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { init, updateSendBalance, renderSendTokenSelect };
|
function resetSendValidation() {
|
||||||
|
const errorEl = $("send-to-error");
|
||||||
|
const btn = $("btn-send-review");
|
||||||
|
if (errorEl) errorEl.textContent = "";
|
||||||
|
if (btn) {
|
||||||
|
btn.disabled = true;
|
||||||
|
btn.classList.add("opacity-50");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
init,
|
||||||
|
updateSendBalance,
|
||||||
|
renderSendTokenSelect,
|
||||||
|
resetSendValidation,
|
||||||
|
};
|
||||||
|
|||||||
@@ -37,11 +37,19 @@ function blockieHtml(address) {
|
|||||||
return `<img src="${src}" width="48" height="48" style="image-rendering:pixelated;border-radius:50%;display:inline-block">`;
|
return `<img src="${src}" width="48" height="48" style="image-rendering:pixelated;border-radius:50%;display:inline-block">`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function etherscanLinkHtml(url) {
|
||||||
|
return (
|
||||||
|
`<a href="${url}" target="_blank" rel="noopener" ` +
|
||||||
|
`class="inline-flex items-center"` +
|
||||||
|
`>${EXT_ICON}</a>`
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
function txAddressHtml(address, ensName, title) {
|
function txAddressHtml(address, ensName, title) {
|
||||||
const blockie = blockieHtml(address);
|
const blockie = blockieHtml(address);
|
||||||
const dot = addressDotHtml(address);
|
const dot = addressDotHtml(address);
|
||||||
const link = `https://etherscan.io/address/${address}`;
|
const link = `https://etherscan.io/address/${address}`;
|
||||||
const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
const extLink = etherscanLinkHtml(link);
|
||||||
let html = `<div class="mb-1">${blockie}</div>`;
|
let html = `<div class="mb-1">${blockie}</div>`;
|
||||||
if (title) {
|
if (title) {
|
||||||
html += `<div class="font-bold">${escapeHtml(title)}</div>`;
|
html += `<div class="font-bold">${escapeHtml(title)}</div>`;
|
||||||
@@ -50,10 +58,10 @@ function txAddressHtml(address, ensName, title) {
|
|||||||
html +=
|
html +=
|
||||||
`<div class="flex items-center">${dot}` +
|
`<div class="flex items-center">${dot}` +
|
||||||
copyableHtml(ensName, "") +
|
copyableHtml(ensName, "") +
|
||||||
extLink +
|
|
||||||
`</div>` +
|
`</div>` +
|
||||||
`<div class="break-all">` +
|
`<div class="flex items-center">${dot}` +
|
||||||
copyableHtml(address, "break-all") +
|
copyableHtml(address, "break-all") +
|
||||||
|
extLink +
|
||||||
`</div>`;
|
`</div>`;
|
||||||
} else {
|
} else {
|
||||||
html +=
|
html +=
|
||||||
@@ -67,7 +75,7 @@ function txAddressHtml(address, ensName, title) {
|
|||||||
|
|
||||||
function txHashHtml(hash) {
|
function txHashHtml(hash) {
|
||||||
const link = `https://etherscan.io/tx/${hash}`;
|
const link = `https://etherscan.io/tx/${hash}`;
|
||||||
const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
const extLink = etherscanLinkHtml(link);
|
||||||
return copyableHtml(hash, "break-all") + extLink;
|
return copyableHtml(hash, "break-all") + extLink;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -93,9 +101,6 @@ function show(tx) {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
render();
|
render();
|
||||||
if (tx.isContractCall || tx.direction === "contract") {
|
|
||||||
loadCalldata(tx.hash, tx.to);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function render() {
|
function render() {
|
||||||
@@ -138,15 +143,20 @@ function render() {
|
|||||||
typeEl.textContent = tx.directionLabel;
|
typeEl.textContent = tx.directionLabel;
|
||||||
typeSection.classList.remove("hidden");
|
typeSection.classList.remove("hidden");
|
||||||
}
|
}
|
||||||
if (headingEl) headingEl.textContent = tx.directionLabel;
|
|
||||||
} else {
|
} else {
|
||||||
if (typeSection) typeSection.classList.add("hidden");
|
if (typeSection) typeSection.classList.add("hidden");
|
||||||
if (headingEl) headingEl.textContent = "Transaction";
|
|
||||||
}
|
}
|
||||||
|
if (headingEl) headingEl.textContent = "Transaction";
|
||||||
|
|
||||||
// Hide calldata section by default; loadCalldata will show it if needed
|
// Hide calldata and raw data sections; re-fetch if this is a contract call
|
||||||
const calldataSection = $("tx-detail-calldata-section");
|
const calldataSection = $("tx-detail-calldata-section");
|
||||||
if (calldataSection) calldataSection.classList.add("hidden");
|
if (calldataSection) calldataSection.classList.add("hidden");
|
||||||
|
const rawDataSection = $("tx-detail-rawdata-section");
|
||||||
|
if (rawDataSection) rawDataSection.classList.add("hidden");
|
||||||
|
|
||||||
|
if (tx.isContractCall || tx.direction === "contract") {
|
||||||
|
loadCalldata(tx.hash, tx.to);
|
||||||
|
}
|
||||||
|
|
||||||
$("tx-detail-time").textContent =
|
$("tx-detail-time").textContent =
|
||||||
isoDate(tx.timestamp) + " (" + timeAgo(tx.timestamp) + ")";
|
isoDate(tx.timestamp) + " (" + timeAgo(tx.timestamp) + ")";
|
||||||
@@ -193,9 +203,20 @@ async function loadCalldata(txHash, toAddress) {
|
|||||||
for (const d of decoded.details || []) {
|
for (const d of decoded.details || []) {
|
||||||
detailsHtml += `<div class="mb-2">`;
|
detailsHtml += `<div class="mb-2">`;
|
||||||
detailsHtml += `<div class="text-muted">${escapeHtml(d.label)}</div>`;
|
detailsHtml += `<div class="text-muted">${escapeHtml(d.label)}</div>`;
|
||||||
if (d.address) {
|
if (d.address && d.isToken) {
|
||||||
|
// Token entry: show symbol on its own line, then dot + address + Etherscan link
|
||||||
const dot = addressDotHtml(d.address);
|
const dot = addressDotHtml(d.address);
|
||||||
detailsHtml += `<div>${dot}${copyableHtml(d.value, "break-all")}</div>`;
|
const tokenSymbol = d.value.match(/^(\S+)\s*\(/)?.[1];
|
||||||
|
if (tokenSymbol) {
|
||||||
|
detailsHtml += `<div class="font-bold">${escapeHtml(tokenSymbol)}</div>`;
|
||||||
|
}
|
||||||
|
const etherscanUrl = `https://etherscan.io/token/${d.address}`;
|
||||||
|
detailsHtml += `<div class="flex items-center">${dot}${copyableHtml(d.address, "break-all")}${etherscanLinkHtml(etherscanUrl)}</div>`;
|
||||||
|
} else if (d.address) {
|
||||||
|
// Protocol/contract entry: show name + Etherscan link
|
||||||
|
const dot = addressDotHtml(d.address);
|
||||||
|
const etherscanUrl = `https://etherscan.io/address/${d.address}`;
|
||||||
|
detailsHtml += `<div class="flex items-center">${dot}${copyableHtml(d.value, "break-all")}${etherscanLinkHtml(etherscanUrl)}</div>`;
|
||||||
} else {
|
} else {
|
||||||
detailsHtml += `<div class="font-bold">${escapeHtml(d.value)}</div>`;
|
detailsHtml += `<div class="font-bold">${escapeHtml(d.value)}</div>`;
|
||||||
}
|
}
|
||||||
@@ -219,13 +240,16 @@ async function loadCalldata(txHash, toAddress) {
|
|||||||
|
|
||||||
section.classList.remove("hidden");
|
section.classList.remove("hidden");
|
||||||
|
|
||||||
// Bind copy handlers for new elements
|
// Bind copy handlers for new elements (including raw data now outside section)
|
||||||
section.querySelectorAll("[data-copy]").forEach((el) => {
|
const copyTargets = [section, rawSection].filter(Boolean);
|
||||||
el.onclick = () => {
|
for (const container of copyTargets) {
|
||||||
navigator.clipboard.writeText(el.dataset.copy);
|
container.querySelectorAll("[data-copy]").forEach((el) => {
|
||||||
showFlash("Copied!");
|
el.onclick = () => {
|
||||||
};
|
navigator.clipboard.writeText(el.dataset.copy);
|
||||||
});
|
showFlash("Copied!");
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
log.errorf("loadCalldata failed:", e.message);
|
log.errorf("loadCalldata failed:", e.message);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -8,6 +8,7 @@ const {
|
|||||||
addressTitle,
|
addressTitle,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
} = require("./helpers");
|
} = require("./helpers");
|
||||||
|
const { TOKEN_BY_ADDRESS } = require("../../shared/tokenList");
|
||||||
const { state, saveState } = require("../../shared/state");
|
const { state, saveState } = require("../../shared/state");
|
||||||
const { getProvider } = require("../../shared/balances");
|
const { getProvider } = require("../../shared/balances");
|
||||||
const { log } = require("../../shared/log");
|
const { log } = require("../../shared/log");
|
||||||
@@ -121,11 +122,51 @@ function showSuccess(txInfo, txHash, blockNumber) {
|
|||||||
to: txInfo.to,
|
to: txInfo.to,
|
||||||
hash: txHash,
|
hash: txHash,
|
||||||
blockNumber: blockNumber,
|
blockNumber: blockNumber,
|
||||||
|
decoded: txInfo.decoded || null,
|
||||||
};
|
};
|
||||||
renderSuccess();
|
renderSuccess();
|
||||||
ctx.doRefreshAndRender();
|
ctx.doRefreshAndRender();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function tokenLabel(address) {
|
||||||
|
const t = TOKEN_BY_ADDRESS.get(address.toLowerCase());
|
||||||
|
return t ? t.symbol : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function etherscanTokenLink(address) {
|
||||||
|
return `https://etherscan.io/token/${address}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function decodedDetailsHtml(decoded) {
|
||||||
|
if (!decoded || !decoded.details) return "";
|
||||||
|
let html = "";
|
||||||
|
if (decoded.name) {
|
||||||
|
html += `<div class="mb-2"><div class="text-xs text-muted mb-1">Action</div>`;
|
||||||
|
html += `<div class="font-bold">${escapeHtml(decoded.name)}</div></div>`;
|
||||||
|
}
|
||||||
|
if (decoded.description) {
|
||||||
|
html += `<div class="mb-2"><div class="text-xs text-muted mb-1">Description</div>`;
|
||||||
|
html += `<div>${escapeHtml(decoded.description)}</div></div>`;
|
||||||
|
}
|
||||||
|
for (const d of decoded.details) {
|
||||||
|
html += `<div class="mb-2">`;
|
||||||
|
html += `<div class="text-xs text-muted mb-1">${escapeHtml(d.label)}</div>`;
|
||||||
|
if (d.address) {
|
||||||
|
if (d.isToken) {
|
||||||
|
const sym = tokenLabel(d.address) || "Unknown token";
|
||||||
|
html += `<div class="font-bold">${escapeHtml(sym)}</div>`;
|
||||||
|
html += toAddressHtml(d.address);
|
||||||
|
} else {
|
||||||
|
html += toAddressHtml(d.address);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
html += `<div class="font-bold">${escapeHtml(d.value)}</div>`;
|
||||||
|
}
|
||||||
|
html += `</div>`;
|
||||||
|
}
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
|
||||||
function renderSuccess() {
|
function renderSuccess() {
|
||||||
const d = state.viewData;
|
const d = state.viewData;
|
||||||
if (!d || !d.hash) return;
|
if (!d || !d.hash) return;
|
||||||
@@ -133,6 +174,16 @@ function renderSuccess() {
|
|||||||
$("success-tx-to").innerHTML = toAddressHtml(d.to);
|
$("success-tx-to").innerHTML = toAddressHtml(d.to);
|
||||||
$("success-tx-block").textContent = String(d.blockNumber);
|
$("success-tx-block").textContent = String(d.blockNumber);
|
||||||
$("success-tx-hash").innerHTML = txHashHtml(d.hash);
|
$("success-tx-hash").innerHTML = txHashHtml(d.hash);
|
||||||
|
|
||||||
|
// Show decoded calldata details if present
|
||||||
|
const decodedEl = $("success-tx-decoded");
|
||||||
|
if (decodedEl && d.decoded) {
|
||||||
|
decodedEl.innerHTML = decodedDetailsHtml(d.decoded);
|
||||||
|
decodedEl.classList.remove("hidden");
|
||||||
|
} else if (decodedEl) {
|
||||||
|
decodedEl.classList.add("hidden");
|
||||||
|
}
|
||||||
|
|
||||||
attachCopyHandlers("view-success-tx");
|
attachCopyHandlers("view-success-tx");
|
||||||
showView("success-tx");
|
showView("success-tx");
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -85,6 +85,7 @@ async function fetchTokenBalances(address, blockscoutUrl, trackedTokens) {
|
|||||||
|
|
||||||
balances.push({
|
balances.push({
|
||||||
address: item.token.address_hash,
|
address: item.token.address_hash,
|
||||||
|
name: item.token.name || "",
|
||||||
symbol: item.token.symbol || "???",
|
symbol: item.token.symbol || "???",
|
||||||
decimals: decimals,
|
decimals: decimals,
|
||||||
balance: bal,
|
balance: bal,
|
||||||
|
|||||||
@@ -3645,10 +3645,27 @@ async function getTopTokenPrices(n) {
|
|||||||
return prices;
|
return prices;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Resolve a token symbol from multiple sources, never returning "?".
|
||||||
|
function resolveSymbol(tokenAddress, tokenBalances, trackedTokens) {
|
||||||
|
const lower = (tokenAddress || "").toLowerCase();
|
||||||
|
const tb = (tokenBalances || []).find(
|
||||||
|
(t) => t.address.toLowerCase() === lower,
|
||||||
|
);
|
||||||
|
if (tb && tb.symbol) return tb.symbol;
|
||||||
|
const known = TOKEN_BY_ADDRESS.get(lower);
|
||||||
|
if (known && known.symbol) return known.symbol;
|
||||||
|
const tracked = (trackedTokens || []).find(
|
||||||
|
(t) => t.address.toLowerCase() === lower,
|
||||||
|
);
|
||||||
|
if (tracked && tracked.symbol) return tracked.symbol;
|
||||||
|
return lower.slice(0, 10) + "\u2026";
|
||||||
|
}
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
TOKENS,
|
TOKENS,
|
||||||
TOKEN_BY_ADDRESS,
|
TOKEN_BY_ADDRESS,
|
||||||
KNOWN_SYMBOLS,
|
KNOWN_SYMBOLS,
|
||||||
getTopTokens,
|
getTopTokens,
|
||||||
getTopTokenPrices,
|
getTopTokenPrices,
|
||||||
|
resolveSymbol,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -153,9 +153,11 @@ async function fetchRecentTransactions(address, blockscoutUrl, count = 25) {
|
|||||||
|
|
||||||
// When a token transfer shares a hash with a normal tx, the normal tx
|
// When a token transfer shares a hash with a normal tx, the normal tx
|
||||||
// is the contract call (0 ETH) and the token transfer has the real
|
// is the contract call (0 ETH) and the token transfer has the real
|
||||||
// amount and symbol. Replace the normal tx with the token transfer,
|
// amount and symbol. A single transaction (e.g. a swap) can produce
|
||||||
// but preserve contract call metadata (direction, label, method) so
|
// multiple token transfers (one per token involved), so we key token
|
||||||
// swaps and other contract interactions display correctly.
|
// transfers by hash + contract address to keep all of them. We also
|
||||||
|
// preserve contract-call metadata (direction, label, method) from the
|
||||||
|
// matching normal tx so swaps display correctly.
|
||||||
for (const tt of ttJson.items || []) {
|
for (const tt of ttJson.items || []) {
|
||||||
const parsed = parseTokenTransfer(tt, addrLower);
|
const parsed = parseTokenTransfer(tt, addrLower);
|
||||||
const existing = txsByHash.get(parsed.hash);
|
const existing = txsByHash.get(parsed.hash);
|
||||||
@@ -164,8 +166,13 @@ async function fetchRecentTransactions(address, blockscoutUrl, count = 25) {
|
|||||||
parsed.directionLabel = existing.directionLabel;
|
parsed.directionLabel = existing.directionLabel;
|
||||||
parsed.isContractCall = true;
|
parsed.isContractCall = true;
|
||||||
parsed.method = existing.method;
|
parsed.method = existing.method;
|
||||||
|
// Remove the bare-hash normal tx so it doesn't appear as a
|
||||||
|
// duplicate with empty value; token transfers replace it.
|
||||||
|
txsByHash.delete(parsed.hash);
|
||||||
}
|
}
|
||||||
txsByHash.set(parsed.hash, parsed);
|
// Use composite key so multiple token transfers per tx are kept.
|
||||||
|
const ttKey = parsed.hash + ":" + (parsed.contractAddress || "");
|
||||||
|
txsByHash.set(ttKey, parsed);
|
||||||
}
|
}
|
||||||
|
|
||||||
const txs = [...txsByHash.values()];
|
const txs = [...txsByHash.values()];
|
||||||
|
|||||||
@@ -161,6 +161,157 @@ function decodeWrapEth(input) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// V4 inner action IDs
|
||||||
|
const V4_SWAP_EXACT_IN_SINGLE = 0x06;
|
||||||
|
const V4_SWAP_EXACT_IN = 0x07;
|
||||||
|
const V4_SWAP_EXACT_OUT_SINGLE = 0x08;
|
||||||
|
const V4_SWAP_EXACT_OUT = 0x09;
|
||||||
|
const V4_SETTLE = 0x0b;
|
||||||
|
const V4_TAKE = 0x0e;
|
||||||
|
|
||||||
|
// Decode V4_SWAP (command 0x10) input bytes.
|
||||||
|
// The input is ABI-encoded as (bytes actions, bytes[] params).
|
||||||
|
// We extract token addresses from SETTLE (input) and TAKE (output) sub-actions,
|
||||||
|
// and swap amounts from the swap sub-actions.
|
||||||
|
function decodeV4Swap(input) {
|
||||||
|
try {
|
||||||
|
const d = coder.decode(["bytes", "bytes[]"], input);
|
||||||
|
const actions = getBytes(d[0]);
|
||||||
|
const params = d[1];
|
||||||
|
|
||||||
|
let settleToken = null;
|
||||||
|
let takeToken = null;
|
||||||
|
let amountIn = null;
|
||||||
|
let amountOutMin = null;
|
||||||
|
|
||||||
|
for (let i = 0; i < actions.length; i++) {
|
||||||
|
const actionId = actions[i];
|
||||||
|
try {
|
||||||
|
if (actionId === V4_SETTLE) {
|
||||||
|
// SETTLE: (address currency, uint256 maxAmount, bool payerIsUser)
|
||||||
|
const s = coder.decode(
|
||||||
|
["address", "uint256", "bool"],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
settleToken = s[0];
|
||||||
|
} else if (actionId === V4_TAKE) {
|
||||||
|
// TAKE: (address currency, address recipient, uint256 amount)
|
||||||
|
const t = coder.decode(
|
||||||
|
["address", "address", "uint256"],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
takeToken = t[0];
|
||||||
|
} else if (
|
||||||
|
actionId === V4_SWAP_EXACT_IN ||
|
||||||
|
actionId === V4_SWAP_EXACT_IN_SINGLE
|
||||||
|
) {
|
||||||
|
// Extract amounts from exact-in swap actions
|
||||||
|
if (actionId === V4_SWAP_EXACT_IN) {
|
||||||
|
// ExactInputParams: (address currencyIn,
|
||||||
|
// tuple(address,uint24,int24,address,bytes)[] path,
|
||||||
|
// uint128 amountIn, uint128 amountOutMin)
|
||||||
|
try {
|
||||||
|
const s = coder.decode(
|
||||||
|
[
|
||||||
|
"tuple(address,tuple(address,uint24,int24,address,bytes)[],uint128,uint128)",
|
||||||
|
],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
if (!settleToken) settleToken = s[0][0];
|
||||||
|
const path = s[0][1];
|
||||||
|
if (path.length > 0 && !takeToken) {
|
||||||
|
takeToken = path[path.length - 1][0];
|
||||||
|
}
|
||||||
|
if (!amountIn) amountIn = s[0][2];
|
||||||
|
if (!amountOutMin) amountOutMin = s[0][3];
|
||||||
|
} catch {
|
||||||
|
// Fall through — SETTLE/TAKE will provide tokens
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// ExactInputSingleParams: (tuple(address,address,uint24,int24,address) poolKey,
|
||||||
|
// bool zeroForOne, uint128 amountIn, uint128 amountOutMin, bytes hookData)
|
||||||
|
try {
|
||||||
|
const s = coder.decode(
|
||||||
|
[
|
||||||
|
"tuple(tuple(address,address,uint24,int24,address),bool,uint128,uint128,bytes)",
|
||||||
|
],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
const poolKey = s[0][0];
|
||||||
|
const zeroForOne = s[0][1];
|
||||||
|
if (!settleToken)
|
||||||
|
settleToken = zeroForOne
|
||||||
|
? poolKey[0]
|
||||||
|
: poolKey[1];
|
||||||
|
if (!takeToken)
|
||||||
|
takeToken = zeroForOne
|
||||||
|
? poolKey[1]
|
||||||
|
: poolKey[0];
|
||||||
|
if (!amountIn) amountIn = s[0][2];
|
||||||
|
if (!amountOutMin) amountOutMin = s[0][3];
|
||||||
|
} catch {
|
||||||
|
// Fall through
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else if (
|
||||||
|
actionId === V4_SWAP_EXACT_OUT ||
|
||||||
|
actionId === V4_SWAP_EXACT_OUT_SINGLE
|
||||||
|
) {
|
||||||
|
if (actionId === V4_SWAP_EXACT_OUT) {
|
||||||
|
try {
|
||||||
|
const s = coder.decode(
|
||||||
|
[
|
||||||
|
"tuple(address,tuple(address,uint24,int24,address,bytes)[],uint128,uint128)",
|
||||||
|
],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
if (!takeToken) takeToken = s[0][0];
|
||||||
|
const path = s[0][1];
|
||||||
|
if (path.length > 0 && !settleToken) {
|
||||||
|
settleToken = path[path.length - 1][0];
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// Fall through
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
try {
|
||||||
|
const s = coder.decode(
|
||||||
|
[
|
||||||
|
"tuple(tuple(address,address,uint24,int24,address),bool,uint128,uint128,bytes)",
|
||||||
|
],
|
||||||
|
params[i],
|
||||||
|
);
|
||||||
|
const poolKey = s[0][0];
|
||||||
|
const zeroForOne = s[0][1];
|
||||||
|
if (!settleToken)
|
||||||
|
settleToken = zeroForOne
|
||||||
|
? poolKey[0]
|
||||||
|
: poolKey[1];
|
||||||
|
if (!takeToken)
|
||||||
|
takeToken = zeroForOne
|
||||||
|
? poolKey[1]
|
||||||
|
: poolKey[0];
|
||||||
|
} catch {
|
||||||
|
// Fall through
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// Skip sub-actions we can't decode
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
tokenIn: settleToken,
|
||||||
|
tokenOut: takeToken,
|
||||||
|
amountIn,
|
||||||
|
amountOutMin,
|
||||||
|
};
|
||||||
|
} catch {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Try to decode a Universal Router execute() call.
|
// Try to decode a Universal Router execute() call.
|
||||||
// Returns { name, description, details } matching the format used by
|
// Returns { name, description, details } matching the format used by
|
||||||
// the approval UI, or null if the calldata is not a recognised execute().
|
// the approval UI, or null if the calldata is not a recognised execute().
|
||||||
@@ -233,6 +384,19 @@ function decode(data, toAddress) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (cmdId === 0x10) {
|
||||||
|
const v4 = decodeV4Swap(inputs[i]);
|
||||||
|
if (v4) {
|
||||||
|
if (!inputToken && v4.tokenIn) inputToken = v4.tokenIn;
|
||||||
|
if (!outputToken && v4.tokenOut)
|
||||||
|
outputToken = v4.tokenOut;
|
||||||
|
if (!inputAmount && v4.amountIn)
|
||||||
|
inputAmount = v4.amountIn;
|
||||||
|
if (!minOutput && v4.amountOutMin)
|
||||||
|
minOutput = v4.amountOutMin;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (cmdId === 0x0c) {
|
if (cmdId === 0x0c) {
|
||||||
hasUnwrapWeth = true;
|
hasUnwrapWeth = true;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -24,6 +24,26 @@ function hdWalletFromMnemonic(mnemonic) {
|
|||||||
return { xpub, firstAddress };
|
return { xpub, firstAddress };
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function hdWalletFromXprv(xprv) {
|
||||||
|
const root = HDNodeWallet.fromExtendedKey(xprv);
|
||||||
|
if (!root.privateKey) {
|
||||||
|
throw new Error("Not an extended private key (xprv).");
|
||||||
|
}
|
||||||
|
const node = root.derivePath("44'/60'/0'/0");
|
||||||
|
const xpub = node.neuter().extendedKey;
|
||||||
|
const firstAddress = node.deriveChild(0).address;
|
||||||
|
return { xpub, firstAddress };
|
||||||
|
}
|
||||||
|
|
||||||
|
function isValidXprv(key) {
|
||||||
|
try {
|
||||||
|
const node = HDNodeWallet.fromExtendedKey(key);
|
||||||
|
return !!node.privateKey;
|
||||||
|
} catch {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function addressFromPrivateKey(key) {
|
function addressFromPrivateKey(key) {
|
||||||
const w = new Wallet(key);
|
const w = new Wallet(key);
|
||||||
return w.address;
|
return w.address;
|
||||||
@@ -38,6 +58,11 @@ function getSignerForAddress(walletData, addrIndex, decryptedSecret) {
|
|||||||
);
|
);
|
||||||
return node.deriveChild(addrIndex);
|
return node.deriveChild(addrIndex);
|
||||||
}
|
}
|
||||||
|
if (walletData.type === "xprv") {
|
||||||
|
const root = HDNodeWallet.fromExtendedKey(decryptedSecret);
|
||||||
|
const node = root.derivePath("44'/60'/0'/0");
|
||||||
|
return node.deriveChild(addrIndex);
|
||||||
|
}
|
||||||
return new Wallet(decryptedSecret);
|
return new Wallet(decryptedSecret);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -49,6 +74,8 @@ module.exports = {
|
|||||||
generateMnemonic,
|
generateMnemonic,
|
||||||
deriveAddressFromXpub,
|
deriveAddressFromXpub,
|
||||||
hdWalletFromMnemonic,
|
hdWalletFromMnemonic,
|
||||||
|
hdWalletFromXprv,
|
||||||
|
isValidXprv,
|
||||||
addressFromPrivateKey,
|
addressFromPrivateKey,
|
||||||
getSignerForAddress,
|
getSignerForAddress,
|
||||||
isValidMnemonic,
|
isValidMnemonic,
|
||||||
|
|||||||
@@ -1,9 +1,10 @@
|
|||||||
const { AbiCoder, Interface, solidityPacked } = require("ethers");
|
const { AbiCoder, Interface, solidityPacked, getBytes } = require("ethers");
|
||||||
const uniswap = require("../src/shared/uniswap");
|
const uniswap = require("../src/shared/uniswap");
|
||||||
|
|
||||||
const ROUTER_ADDR = "0x66a9893cc07d91d95644aedd05d03f95e1dba8af";
|
const ROUTER_ADDR = "0x66a9893cc07d91d95644aedd05d03f95e1dba8af";
|
||||||
const USDT_ADDR = "0xdAC17F958D2ee523a2206206994597C13D831ec7";
|
const USDT_ADDR = "0xdAC17F958D2ee523a2206206994597C13D831ec7";
|
||||||
const WETH_ADDR = "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2";
|
const WETH_ADDR = "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2";
|
||||||
|
const USDC_ADDR = "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48";
|
||||||
const USER_ADDR = "0x66133E8ea0f5D1d612D2502a968757D1048c214a";
|
const USER_ADDR = "0x66133E8ea0f5D1d612D2502a968757D1048c214a";
|
||||||
|
|
||||||
// AutistMask's first-ever swap, 2026-02-27.
|
// AutistMask's first-ever swap, 2026-02-27.
|
||||||
@@ -256,6 +257,87 @@ describe("uniswap decoder", () => {
|
|||||||
expect(amount.value).toBe("5.0000 USDT");
|
expect(amount.value).toBe("5.0000 USDT");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// This test validates the decodeV4Swap() fix: a V4 ERC20→ERC20 swap
|
||||||
|
// (USDT→USDC) where the token addresses are ONLY discoverable inside
|
||||||
|
// the V4_SWAP sub-actions (SETTLE/TAKE). Before decodeV4Swap() was added,
|
||||||
|
// command 0x10 was opaque and this would decode as "Uniswap Swap" with
|
||||||
|
// no token info (or "ETH → ETH"). Now it correctly shows "USDT → USDC".
|
||||||
|
test("decodes V4_SWAP ERC20→ERC20 tokens via SETTLE/TAKE (regression: #59)", () => {
|
||||||
|
// Build a V4_SWAP input with SETTLE(USDT) + SWAP_EXACT_IN_SINGLE + TAKE(USDC)
|
||||||
|
const V4_SETTLE = 0x0b;
|
||||||
|
const V4_SWAP_EXACT_IN_SINGLE = 0x06;
|
||||||
|
const V4_TAKE = 0x0e;
|
||||||
|
|
||||||
|
// actions: SETTLE, SWAP_EXACT_IN_SINGLE, TAKE
|
||||||
|
const actions = new Uint8Array([
|
||||||
|
V4_SETTLE,
|
||||||
|
V4_SWAP_EXACT_IN_SINGLE,
|
||||||
|
V4_TAKE,
|
||||||
|
]);
|
||||||
|
|
||||||
|
// SETTLE params: (address currency, uint256 maxAmount, bool payerIsUser)
|
||||||
|
const settleParam = coder.encode(
|
||||||
|
["address", "uint256", "bool"],
|
||||||
|
[USDT_ADDR, 5000000n, true],
|
||||||
|
);
|
||||||
|
|
||||||
|
// SWAP_EXACT_IN_SINGLE params:
|
||||||
|
// (tuple(address,address,uint24,int24,address) poolKey, bool zeroForOne, uint128 amountIn, uint128 amountOutMin, bytes hookData)
|
||||||
|
const swapParam = coder.encode(
|
||||||
|
[
|
||||||
|
"tuple(tuple(address,address,uint24,int24,address),bool,uint128,uint128,bytes)",
|
||||||
|
],
|
||||||
|
[
|
||||||
|
[
|
||||||
|
[
|
||||||
|
USDT_ADDR,
|
||||||
|
USDC_ADDR,
|
||||||
|
100, // fee
|
||||||
|
1, // tickSpacing
|
||||||
|
"0x0000000000000000000000000000000000000000", // hooks
|
||||||
|
],
|
||||||
|
true, // zeroForOne
|
||||||
|
5000000n, // amountIn (5 USDT)
|
||||||
|
4900000n, // amountOutMin (4.9 USDC)
|
||||||
|
"0x", // hookData
|
||||||
|
],
|
||||||
|
],
|
||||||
|
);
|
||||||
|
|
||||||
|
// TAKE params: (address currency, address recipient, uint256 amount)
|
||||||
|
const takeParam = coder.encode(
|
||||||
|
["address", "address", "uint256"],
|
||||||
|
[USDC_ADDR, USER_ADDR, 0n],
|
||||||
|
);
|
||||||
|
|
||||||
|
// Encode the V4_SWAP input: (bytes actions, bytes[] params)
|
||||||
|
const v4Input = coder.encode(
|
||||||
|
["bytes", "bytes[]"],
|
||||||
|
[actions, [settleParam, swapParam, takeParam]],
|
||||||
|
);
|
||||||
|
|
||||||
|
// Build execute() with PERMIT2_PERMIT (0x0a) + V4_SWAP (0x10)
|
||||||
|
// The permit provides the input token, but V4_SWAP must provide
|
||||||
|
// the OUTPUT token — without decodeV4Swap, output would be unknown.
|
||||||
|
const data = buildExecute(
|
||||||
|
solidityPacked(["uint8", "uint8"], [0x0a, 0x10]),
|
||||||
|
[encodePermit2(USDT_ADDR, 5000000n, ROUTER_ADDR), v4Input],
|
||||||
|
9999999999n,
|
||||||
|
);
|
||||||
|
|
||||||
|
const result = uniswap.decode(data, ROUTER_ADDR);
|
||||||
|
expect(result).not.toBeNull();
|
||||||
|
// Before decodeV4Swap fix: name would be "Swap USDT → ETH" or "Uniswap Swap"
|
||||||
|
// After fix: correctly identifies both tokens from V4 sub-actions
|
||||||
|
expect(result.name).toBe("Swap USDT \u2192 USDC");
|
||||||
|
|
||||||
|
const tokenIn = result.details.find((d) => d.label === "Token In");
|
||||||
|
expect(tokenIn.value).toContain("USDT");
|
||||||
|
|
||||||
|
const steps = result.details.find((d) => d.label === "Steps");
|
||||||
|
expect(steps.value).toContain("V4 Swap");
|
||||||
|
});
|
||||||
|
|
||||||
test("handles unknown tokens gracefully", () => {
|
test("handles unknown tokens gracefully", () => {
|
||||||
const fakeToken = "0x1111111111111111111111111111111111111111";
|
const fakeToken = "0x1111111111111111111111111111111111111111";
|
||||||
const data = buildExecute(
|
const data = buildExecute(
|
||||||
|
|||||||
Reference in New Issue
Block a user