Compare commits
102 Commits
3b419c7517
...
fix/87-con
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
db1b5c1c69 | ||
| 699e080e3e | |||
|
|
8f2bf9618e | ||
| 069981baa0 | |||
|
|
886cd38a9b | ||
| 438d915f73 | |||
|
|
78f961f416 | ||
| 6a214f1c58 | |||
| ad2ce3d8ff | |||
| b826279d8f | |||
|
|
20ced62e1a | ||
|
|
9b69a60cca | ||
| 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 | ||
| fb67359b3f | |||
| 1986704569 | |||
| 49c29f6bb3 | |||
| cdb7f478e2 | |||
| cbe77d0224 | |||
|
|
2abb720d54 | ||
|
|
bf9a483031 | ||
| 79fec8551f | |||
|
|
da428a3815 | ||
| 171b21c5d8 | |||
| e7a960c601 | |||
| b69eec40ef | |||
| cacf2c683c | |||
|
|
15e856e63f | ||
| 43e10521ef | |||
| 04ba926d43 | |||
| 4fdbc5adae | |||
| 85427e1fd4 | |||
| 8226495994 | |||
| 2f57370155 | |||
| c6d5cf4e64 | |||
| 34e29d7659 | |||
| 6d0531f1b4 | |||
| 8893f5dce7 | |||
| 2bffa91045 | |||
| 2b0b889b01 | |||
| 5936199676 | |||
|
|
8824237db6 | ||
|
|
aaeb38d7c6 | ||
| f2e44ff4ab | |||
| 107c243f65 | |||
| 655b90c7df | |||
| 34cd72be88 | |||
|
|
689bcbf171 | ||
| 4eefe4c1af | |||
| 8b7d73cc35 | |||
| 3fd3e30f44 | |||
|
|
76059c3674 | ||
|
|
27f16191b4 | ||
| 909543e943 | |||
| 04a34d1a5e | |||
| 98f68adb11 |
1
.gitignore
vendored
1
.gitignore
vendored
@@ -25,3 +25,4 @@ dist/
|
|||||||
|
|
||||||
# Yarn
|
# Yarn
|
||||||
.yarn-integrity
|
.yarn-integrity
|
||||||
|
package-lock.json
|
||||||
|
|||||||
@@ -93,11 +93,13 @@ function resetPopupUrl() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Fallback: open approval in a separate window (used when openPopup is unavailable)
|
// Open approval in a separate popup window.
|
||||||
|
// This is the primary mechanism for tx/sign approvals (triggered programmatically,
|
||||||
|
// not from a user gesture) and the fallback for site-connection approvals.
|
||||||
function openApprovalWindow(id) {
|
function openApprovalWindow(id) {
|
||||||
const popupUrl = runtime.getURL("src/popup/index.html?approval=" + id);
|
const popupUrl = runtime.getURL("src/popup/index.html?approval=" + id);
|
||||||
const popupWidth = 400;
|
const popupWidth = 360;
|
||||||
const popupHeight = 500;
|
const popupHeight = 600;
|
||||||
|
|
||||||
windowsApi.getLastFocused((currentWin) => {
|
windowsApi.getLastFocused((currentWin) => {
|
||||||
const opts = {
|
const opts = {
|
||||||
@@ -148,7 +150,9 @@ function requestApproval(origin, hostname) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Open a tx-approval popup and return a promise that resolves with txHash or error.
|
// Open a tx-approval popup and return a promise that resolves with txHash or error.
|
||||||
// Uses the toolbar popup only — no fallback window.
|
// Uses windows.create() directly because tx approvals are triggered programmatically
|
||||||
|
// (from a dApp RPC call), not from a user gesture, so action.openPopup() is
|
||||||
|
// unreliable in this context.
|
||||||
function requestTxApproval(origin, hostname, txParams) {
|
function requestTxApproval(origin, hostname, txParams) {
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
const id = crypto.randomUUID();
|
const id = crypto.randomUUID();
|
||||||
@@ -160,27 +164,14 @@ function requestTxApproval(origin, hostname, txParams) {
|
|||||||
type: "tx",
|
type: "tx",
|
||||||
};
|
};
|
||||||
|
|
||||||
if (actionApi && typeof actionApi.setPopup === "function") {
|
openApprovalWindow(id);
|
||||||
actionApi.setPopup({
|
|
||||||
popup: "src/popup/index.html?approval=" + id,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (actionApi && typeof actionApi.openPopup === "function") {
|
|
||||||
try {
|
|
||||||
const result = actionApi.openPopup();
|
|
||||||
if (result && typeof result.catch === "function") {
|
|
||||||
result.catch(() => {});
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
// openPopup unsupported — user clicks toolbar icon
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Open a sign-approval popup and return a promise that resolves with { signature } or { error }.
|
// Open a sign-approval popup and return a promise that resolves with { signature } or { error }.
|
||||||
// Uses the toolbar popup only — no fallback window. If openPopup() fails the
|
// Uses windows.create() directly because sign approvals are triggered programmatically
|
||||||
// popup URL is still set, so the user can click the toolbar icon to respond.
|
// (from a dApp RPC call), not from a user gesture, so action.openPopup() is
|
||||||
|
// unreliable in this context.
|
||||||
function requestSignApproval(origin, hostname, signParams) {
|
function requestSignApproval(origin, hostname, signParams) {
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
const id = crypto.randomUUID();
|
const id = crypto.randomUUID();
|
||||||
@@ -192,27 +183,14 @@ function requestSignApproval(origin, hostname, signParams) {
|
|||||||
type: "sign",
|
type: "sign",
|
||||||
};
|
};
|
||||||
|
|
||||||
if (actionApi && typeof actionApi.setPopup === "function") {
|
openApprovalWindow(id);
|
||||||
actionApi.setPopup({
|
|
||||||
popup: "src/popup/index.html?approval=" + id,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (actionApi && typeof actionApi.openPopup === "function") {
|
|
||||||
try {
|
|
||||||
const result = actionApi.openPopup();
|
|
||||||
if (result && typeof result.catch === "function") {
|
|
||||||
result.catch(() => {});
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
// openPopup unsupported — user clicks toolbar icon
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Detect when an approval popup (browser-action) closes without a response.
|
// Detect when an approval popup (browser-action) closes without a response.
|
||||||
// TX and sign approvals are NOT auto-rejected on disconnect because toolbar
|
// TX and sign approvals now use windows.create() and are handled by the
|
||||||
// popups naturally close on focus loss and the user can reopen them.
|
// windowsApi.onRemoved listener below, but we still handle site-connection
|
||||||
|
// approval disconnects here.
|
||||||
runtime.onConnect.addListener((port) => {
|
runtime.onConnect.addListener((port) => {
|
||||||
if (port.name.startsWith("approval:")) {
|
if (port.name.startsWith("approval:")) {
|
||||||
const id = port.name.split(":")[1];
|
const id = port.name.split(":")[1];
|
||||||
|
|||||||
@@ -13,6 +13,26 @@ if (typeof browser !== "undefined") {
|
|||||||
(document.head || document.documentElement).appendChild(script);
|
(document.head || document.documentElement).appendChild(script);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Send the persisted EIP-6963 provider UUID to the inpage script.
|
||||||
|
// Generated once at install time and stored in chrome.storage.local.
|
||||||
|
(function sendProviderUuid() {
|
||||||
|
const storage =
|
||||||
|
typeof browser !== "undefined"
|
||||||
|
? browser.storage.local
|
||||||
|
: chrome.storage.local;
|
||||||
|
storage.get("eip6963Uuid", (items) => {
|
||||||
|
let uuid = items?.eip6963Uuid;
|
||||||
|
if (!uuid) {
|
||||||
|
uuid = crypto.randomUUID();
|
||||||
|
storage.set({ eip6963Uuid: uuid });
|
||||||
|
}
|
||||||
|
window.postMessage(
|
||||||
|
{ type: "AUTISTMASK_PROVIDER_UUID", uuid },
|
||||||
|
location.origin,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
})();
|
||||||
|
|
||||||
// Relay requests from the page to the background script
|
// Relay requests from the page to the background script
|
||||||
window.addEventListener("message", (event) => {
|
window.addEventListener("message", (event) => {
|
||||||
if (event.source !== window) return;
|
if (event.source !== window) return;
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
const pending = {};
|
const pending = {};
|
||||||
|
|
||||||
// Listen for responses from the content script
|
// Listen for responses from the content script
|
||||||
window.addEventListener("message", (event) => {
|
window.addEventListener("message", function onUuid(event) {
|
||||||
if (event.source !== window) return;
|
if (event.source !== window) return;
|
||||||
if (event.data?.type !== "AUTISTMASK_RESPONSE") return;
|
if (event.data?.type !== "AUTISTMASK_RESPONSE") return;
|
||||||
const { id, result, error } = event.data;
|
const { id, result, error } = event.data;
|
||||||
@@ -24,7 +24,7 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
// Listen for events pushed from the extension
|
// Listen for events pushed from the extension
|
||||||
window.addEventListener("message", (event) => {
|
window.addEventListener("message", function onUuid(event) {
|
||||||
if (event.source !== window) return;
|
if (event.source !== window) return;
|
||||||
if (event.data?.type !== "AUTISTMASK_EVENT") return;
|
if (event.data?.type !== "AUTISTMASK_EVENT") return;
|
||||||
const { eventName, data } = event.data;
|
const { eventName, data } = event.data;
|
||||||
@@ -134,7 +134,7 @@
|
|||||||
// Some dApps (wagmi) check this to confirm MetaMask-like behavior
|
// Some dApps (wagmi) check this to confirm MetaMask-like behavior
|
||||||
_metamask: {
|
_metamask: {
|
||||||
isUnlocked() {
|
isUnlocked() {
|
||||||
return Promise.resolve(true);
|
return Promise.resolve(provider.selectedAddress !== null);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
@@ -155,21 +155,38 @@
|
|||||||
"</svg>",
|
"</svg>",
|
||||||
);
|
);
|
||||||
|
|
||||||
const providerInfo = {
|
let providerUuid = crypto.randomUUID(); // fallback until real UUID arrives
|
||||||
uuid: "f3c5b2a1-8d4e-4f6a-9c7b-1e2d3a4b5c6d",
|
|
||||||
name: "AutistMask",
|
function buildProviderInfo() {
|
||||||
icon: ICON_SVG,
|
return {
|
||||||
rdns: "berlin.sneak.autistmask",
|
uuid: providerUuid,
|
||||||
};
|
name: "AutistMask",
|
||||||
|
icon: ICON_SVG,
|
||||||
|
rdns: "berlin.sneak.autistmask",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
function announceProvider() {
|
function announceProvider() {
|
||||||
window.dispatchEvent(
|
window.dispatchEvent(
|
||||||
new CustomEvent("eip6963:announceProvider", {
|
new CustomEvent("eip6963:announceProvider", {
|
||||||
detail: Object.freeze({ info: providerInfo, provider }),
|
detail: Object.freeze({
|
||||||
|
info: buildProviderInfo(),
|
||||||
|
provider,
|
||||||
|
}),
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Listen for the persisted UUID from the content script
|
||||||
|
function onProviderUuid(event) {
|
||||||
|
if (event.source !== window) return;
|
||||||
|
if (event.data?.type !== "AUTISTMASK_PROVIDER_UUID") return;
|
||||||
|
window.removeEventListener("message", onProviderUuid);
|
||||||
|
providerUuid = event.data.uuid;
|
||||||
|
announceProvider();
|
||||||
|
}
|
||||||
|
window.addEventListener("message", onProviderUuid);
|
||||||
|
|
||||||
window.addEventListener("eip6963:requestProvider", announceProvider);
|
window.addEventListener("eip6963:requestProvider", announceProvider);
|
||||||
announceProvider();
|
announceProvider();
|
||||||
})();
|
})();
|
||||||
|
|||||||
@@ -104,6 +104,10 @@
|
|||||||
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"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
id="add-wallet-error"
|
||||||
|
class="text-xs mb-2 min-h-[1.25rem] hidden"
|
||||||
|
></div>
|
||||||
<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"
|
||||||
@@ -162,6 +166,10 @@
|
|||||||
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"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
id="import-key-error"
|
||||||
|
class="text-xs mb-2 min-h-[1.25rem] hidden"
|
||||||
|
></div>
|
||||||
<button
|
<button
|
||||||
id="btn-import-key-confirm"
|
id="btn-import-key-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"
|
||||||
@@ -305,6 +313,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 +346,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-error"
|
||||||
|
class="text-xs mb-2 min-h-[1.25rem] 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
|
||||||
@@ -377,7 +459,7 @@
|
|||||||
<!-- token contract details (ERC-20 only) -->
|
<!-- token contract details (ERC-20 only) -->
|
||||||
<div
|
<div
|
||||||
id="address-token-contract-info"
|
id="address-token-contract-info"
|
||||||
class="bg-hover rounded-md mx-4 p-3 mb-3 text-xs hidden"
|
class="bg-hover rounded-md mx-1 p-3 mb-3 text-xs hidden"
|
||||||
></div>
|
></div>
|
||||||
|
|
||||||
<!-- token-filtered transactions -->
|
<!-- token-filtered transactions -->
|
||||||
@@ -422,6 +504,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">
|
||||||
@@ -502,11 +589,23 @@
|
|||||||
id="confirm-errors"
|
id="confirm-errors"
|
||||||
class="mb-2 border border-border border-dashed p-2 hidden"
|
class="mb-2 border border-border border-dashed p-2 hidden"
|
||||||
></div>
|
></div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="block mb-1 text-xs">Password</label>
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
id="confirm-tx-password"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
id="confirm-tx-password-error"
|
||||||
|
class="text-xs mb-2 min-h-[1.25rem]"
|
||||||
|
></div>
|
||||||
<button
|
<button
|
||||||
id="btn-confirm-send"
|
id="btn-confirm-send"
|
||||||
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"
|
||||||
>
|
>
|
||||||
Send
|
Sign & Send
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -531,6 +630,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>
|
||||||
@@ -584,42 +684,6 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- ============ PASSWORD MODAL ============ -->
|
|
||||||
<div
|
|
||||||
id="password-modal"
|
|
||||||
class="hidden fixed inset-0 bg-bg flex items-center justify-center z-50"
|
|
||||||
>
|
|
||||||
<div class="border border-border p-4 bg-bg w-80">
|
|
||||||
<h2 class="font-bold mb-2">Enter Password</h2>
|
|
||||||
<p class="text-xs text-muted mb-2">
|
|
||||||
Your password is needed to authorize this transaction.
|
|
||||||
</p>
|
|
||||||
<input
|
|
||||||
type="password"
|
|
||||||
id="modal-password"
|
|
||||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg mb-2"
|
|
||||||
/>
|
|
||||||
<div
|
|
||||||
id="modal-password-error"
|
|
||||||
class="text-xs mb-2 border border-border border-dashed p-1 hidden"
|
|
||||||
></div>
|
|
||||||
<div class="flex gap-2">
|
|
||||||
<button
|
|
||||||
id="btn-modal-confirm"
|
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
|
||||||
>
|
|
||||||
Confirm
|
|
||||||
</button>
|
|
||||||
<button
|
|
||||||
id="btn-modal-cancel"
|
|
||||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- ============ RECEIVE ============ -->
|
<!-- ============ RECEIVE ============ -->
|
||||||
<div id="view-receive" class="view hidden">
|
<div id="view-receive" class="view hidden">
|
||||||
<button
|
<button
|
||||||
@@ -636,9 +700,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
|
||||||
@@ -708,9 +773,7 @@
|
|||||||
|
|
||||||
<div class="bg-well p-3 mx-1 mb-3">
|
<div class="bg-well p-3 mx-1 mb-3">
|
||||||
<h3 class="font-bold mb-1">Wallets</h3>
|
<h3 class="font-bold mb-1">Wallets</h3>
|
||||||
<p class="text-xs text-muted mb-2">
|
<div id="settings-wallet-list" class="mb-2"></div>
|
||||||
Add a new wallet from a recovery phrase or private key.
|
|
||||||
</p>
|
|
||||||
<button
|
<button
|
||||||
id="btn-main-add-wallet"
|
id="btn-main-add-wallet"
|
||||||
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"
|
||||||
@@ -845,6 +908,41 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- ============ DELETE WALLET CONFIRM ============ -->
|
||||||
|
<div id="view-delete-wallet-confirm" class="view hidden">
|
||||||
|
<button
|
||||||
|
id="btn-delete-wallet-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-3">Delete Wallet</h2>
|
||||||
|
<p class="text-xs mb-3">
|
||||||
|
Deleting
|
||||||
|
<strong id="delete-wallet-name"></strong> is permanent. Any
|
||||||
|
funds will be unrecoverable without your recovery phrase.
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
id="delete-wallet-error"
|
||||||
|
class="text-xs mb-2 min-h-[1.25rem] hidden"
|
||||||
|
></div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="block mb-1">Password</label>
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
id="delete-wallet-password"
|
||||||
|
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||||
|
placeholder="Enter your password to confirm"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<button
|
||||||
|
id="btn-delete-wallet-confirm"
|
||||||
|
class="border border-border text-red-500 px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||||
|
>
|
||||||
|
Confirm Delete
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- ============ SETTINGS: ADD TOKEN ============ -->
|
<!-- ============ SETTINGS: ADD TOKEN ============ -->
|
||||||
<div id="view-settings-addtoken" class="view hidden">
|
<div id="view-settings-addtoken" class="view hidden">
|
||||||
<button
|
<button
|
||||||
@@ -920,7 +1018,13 @@
|
|||||||
>
|
>
|
||||||
< Back
|
< Back
|
||||||
</button>
|
</button>
|
||||||
<h2 class="font-bold mb-2">Transaction</h2>
|
<h2 id="tx-detail-heading" class="font-bold mb-2">
|
||||||
|
Transaction
|
||||||
|
</h2>
|
||||||
|
<div id="tx-detail-type-section" class="mb-4 hidden">
|
||||||
|
<div class="text-xs text-muted mb-1">Type</div>
|
||||||
|
<div id="tx-detail-type" class="text-xs font-bold"></div>
|
||||||
|
</div>
|
||||||
<div class="mb-4">
|
<div class="mb-4">
|
||||||
<div class="text-xs text-muted mb-1">Status</div>
|
<div class="text-xs text-muted mb-1">Status</div>
|
||||||
<div id="tx-detail-status" class="text-xs"></div>
|
<div id="tx-detail-status" class="text-xs"></div>
|
||||||
@@ -945,10 +1049,33 @@
|
|||||||
<div class="text-xs text-muted mb-1">To</div>
|
<div class="text-xs text-muted mb-1">To</div>
|
||||||
<div id="tx-detail-to" class="text-xs break-all"></div>
|
<div id="tx-detail-to" class="text-xs break-all"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="tx-detail-calldata-section" class="mb-4 hidden">
|
||||||
|
<div
|
||||||
|
id="tx-detail-calldata-well"
|
||||||
|
class="mb-3 border border-border border-dashed p-2"
|
||||||
|
>
|
||||||
|
<div class="text-xs text-muted mb-1">Action</div>
|
||||||
|
<div
|
||||||
|
id="tx-detail-calldata-action"
|
||||||
|
class="text-xs font-bold mb-2"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
id="tx-detail-calldata-details"
|
||||||
|
class="text-xs"
|
||||||
|
></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 ============ -->
|
||||||
@@ -996,7 +1123,10 @@
|
|||||||
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"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div id="approve-tx-error" class="text-xs hidden mb-2"></div>
|
<div
|
||||||
|
id="approve-tx-error"
|
||||||
|
class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.25rem] hidden"
|
||||||
|
></div>
|
||||||
<div class="flex justify-between">
|
<div class="flex justify-between">
|
||||||
<button
|
<button
|
||||||
id="btn-approve-tx"
|
id="btn-approve-tx"
|
||||||
@@ -1059,7 +1189,10 @@
|
|||||||
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"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div id="approve-sign-error" class="text-xs hidden mb-2"></div>
|
<div
|
||||||
|
id="approve-sign-error"
|
||||||
|
class="text-xs mb-2 border border-border border-dashed p-1 min-h-[1.25rem] hidden"
|
||||||
|
></div>
|
||||||
<div class="flex justify-between">
|
<div class="flex justify-between">
|
||||||
<button
|
<button
|
||||||
id="btn-approve-sign"
|
id="btn-approve-sign"
|
||||||
|
|||||||
@@ -74,6 +74,7 @@ const RESTORABLE_VIEWS = new Set([
|
|||||||
"receive",
|
"receive",
|
||||||
"settings",
|
"settings",
|
||||||
"settings-addtoken",
|
"settings-addtoken",
|
||||||
|
"confirm-tx",
|
||||||
"transaction",
|
"transaction",
|
||||||
"success-tx",
|
"success-tx",
|
||||||
"error-tx",
|
"error-tx",
|
||||||
@@ -127,6 +128,13 @@ function restoreView() {
|
|||||||
case "settings-addtoken":
|
case "settings-addtoken":
|
||||||
settingsAddToken.show();
|
settingsAddToken.show();
|
||||||
break;
|
break;
|
||||||
|
case "confirm-tx":
|
||||||
|
if (state.viewData && state.viewData.pendingTx) {
|
||||||
|
confirmTx.restore();
|
||||||
|
} else {
|
||||||
|
fallbackView();
|
||||||
|
}
|
||||||
|
break;
|
||||||
case "transaction":
|
case "transaction":
|
||||||
if (state.viewData && state.viewData.tx) {
|
if (state.viewData && state.viewData.tx) {
|
||||||
transactionDetail.render();
|
transactionDetail.render();
|
||||||
@@ -189,7 +197,7 @@ async function init() {
|
|||||||
const params = new URLSearchParams(window.location.search);
|
const params = new URLSearchParams(window.location.search);
|
||||||
const approvalId = params.get("approval");
|
const approvalId = params.get("approval");
|
||||||
if (approvalId) {
|
if (approvalId) {
|
||||||
approval.show(parseInt(approvalId, 10));
|
approval.show(approvalId);
|
||||||
showView("approve-site");
|
showView("approve-site");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
const { $, showView, showFlash } = require("./helpers");
|
const { $, showView, showFlash, showError, hideError } = require("./helpers");
|
||||||
const {
|
const {
|
||||||
generateMnemonic,
|
generateMnemonic,
|
||||||
hdWalletFromMnemonic,
|
hdWalletFromMnemonic,
|
||||||
@@ -13,6 +13,7 @@ function show() {
|
|||||||
$("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");
|
||||||
|
hideError("add-wallet-error");
|
||||||
showView("add-wallet");
|
showView("add-wallet");
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -25,14 +26,16 @@ function init(ctx) {
|
|||||||
$("btn-add-wallet-confirm").addEventListener("click", async () => {
|
$("btn-add-wallet-confirm").addEventListener("click", async () => {
|
||||||
const mnemonic = $("wallet-mnemonic").value.trim();
|
const mnemonic = $("wallet-mnemonic").value.trim();
|
||||||
if (!mnemonic) {
|
if (!mnemonic) {
|
||||||
showFlash(
|
showError(
|
||||||
|
"add-wallet-error",
|
||||||
"Enter a recovery phrase or press the die to generate one.",
|
"Enter a recovery phrase or press the die to generate one.",
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const words = mnemonic.split(/\s+/);
|
const words = mnemonic.split(/\s+/);
|
||||||
if (words.length !== 12 && words.length !== 24) {
|
if (words.length !== 12 && words.length !== 24) {
|
||||||
showFlash(
|
showError(
|
||||||
|
"add-wallet-error",
|
||||||
"Recovery phrase must be 12 or 24 words. You entered " +
|
"Recovery phrase must be 12 or 24 words. You entered " +
|
||||||
words.length +
|
words.length +
|
||||||
".",
|
".",
|
||||||
@@ -40,21 +43,27 @@ function init(ctx) {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!isValidMnemonic(mnemonic)) {
|
if (!isValidMnemonic(mnemonic)) {
|
||||||
showFlash("Invalid recovery phrase. Check for typos.");
|
showError(
|
||||||
|
"add-wallet-error",
|
||||||
|
"Invalid recovery phrase. Check for typos.",
|
||||||
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const pw = $("add-wallet-password").value;
|
const pw = $("add-wallet-password").value;
|
||||||
const pw2 = $("add-wallet-password-confirm").value;
|
const pw2 = $("add-wallet-password-confirm").value;
|
||||||
if (!pw) {
|
if (!pw) {
|
||||||
showFlash("Please choose a password.");
|
showError("add-wallet-error", "Please choose a password.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (pw.length < 12) {
|
if (pw.length < 12) {
|
||||||
showFlash("Password must be at least 12 characters.");
|
showError(
|
||||||
|
"add-wallet-error",
|
||||||
|
"Password must be at least 12 characters.",
|
||||||
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (pw !== pw2) {
|
if (pw !== pw2) {
|
||||||
showFlash("Passwords do not match.");
|
showError("add-wallet-error", "Passwords do not match.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const { xpub, firstAddress } = hdWalletFromMnemonic(mnemonic);
|
const { xpub, firstAddress } = hdWalletFromMnemonic(mnemonic);
|
||||||
@@ -66,13 +75,15 @@ function init(ctx) {
|
|||||||
firstAddress.toLowerCase(),
|
firstAddress.toLowerCase(),
|
||||||
);
|
);
|
||||||
if (duplicate) {
|
if (duplicate) {
|
||||||
showFlash(
|
showError(
|
||||||
|
"add-wallet-error",
|
||||||
"This recovery phrase is already added (" +
|
"This recovery phrase is already added (" +
|
||||||
duplicate.name +
|
duplicate.name +
|
||||||
").",
|
").",
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
hideError("add-wallet-error");
|
||||||
const encrypted = await encryptWithPassword(mnemonic, pw);
|
const encrypted = await encryptWithPassword(mnemonic, pw);
|
||||||
const walletNum = state.wallets.length + 1;
|
const walletNum = state.wallets.length + 1;
|
||||||
const wallet = {
|
const wallet = {
|
||||||
|
|||||||
@@ -2,8 +2,11 @@ const {
|
|||||||
$,
|
$,
|
||||||
showView,
|
showView,
|
||||||
showFlash,
|
showFlash,
|
||||||
|
showError,
|
||||||
|
hideError,
|
||||||
balanceLinesForAddress,
|
balanceLinesForAddress,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
|
addressTitle,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
truncateMiddle,
|
truncateMiddle,
|
||||||
} = require("./helpers");
|
} = require("./helpers");
|
||||||
@@ -14,9 +17,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;
|
||||||
|
|
||||||
@@ -150,11 +159,11 @@ async function loadTransactions(address) {
|
|||||||
|
|
||||||
loadedTxs = txs;
|
loadedTxs = txs;
|
||||||
|
|
||||||
// Collect unique counterparty addresses for ENS resolution.
|
// Collect ALL unique addresses (from + to) for ENS resolution so
|
||||||
|
// that reverse lookups work for every displayed address, not just
|
||||||
|
// the ones that were originally entered as ENS names.
|
||||||
const counterparties = [
|
const counterparties = [
|
||||||
...new Set(
|
...new Set(txs.flatMap((tx) => [tx.from, tx.to].filter(Boolean))),
|
||||||
txs.map((tx) => (tx.direction === "sent" ? tx.to : tx.from)),
|
|
||||||
),
|
|
||||||
];
|
];
|
||||||
if (counterparties.length > 0) {
|
if (counterparties.length > 0) {
|
||||||
try {
|
try {
|
||||||
@@ -185,14 +194,23 @@ function renderTransactions(txs) {
|
|||||||
let html = "";
|
let html = "";
|
||||||
let i = 0;
|
let i = 0;
|
||||||
for (const tx of txs) {
|
for (const tx of txs) {
|
||||||
const counterparty = tx.direction === "sent" ? tx.to : tx.from;
|
// For swap transactions, show the user's own labelled wallet
|
||||||
|
// address instead of the contract address (see issue #55).
|
||||||
|
const counterparty =
|
||||||
|
tx.direction === "contract" && tx.directionLabel === "Swap"
|
||||||
|
? tx.from
|
||||||
|
: tx.direction === "sent" || tx.direction === "contract"
|
||||||
|
? tx.to
|
||||||
|
: tx.from;
|
||||||
const ensName = ensNameMap.get(counterparty) || null;
|
const ensName = ensNameMap.get(counterparty) || null;
|
||||||
|
const title = addressTitle(counterparty, state.wallets);
|
||||||
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)
|
||||||
: escapeHtml(tx.symbol);
|
: escapeHtml(tx.symbol);
|
||||||
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
||||||
const displayAddr = ensName || truncateMiddle(counterparty, maxAddr);
|
const displayAddr =
|
||||||
|
title || ensName || truncateMiddle(counterparty, maxAddr);
|
||||||
const addrStr = escapeHtml(displayAddr);
|
const addrStr = escapeHtml(displayAddr);
|
||||||
const dot = addressDotHtml(counterparty);
|
const dot = addressDotHtml(counterparty);
|
||||||
const err = tx.isError ? " (failed)" : "";
|
const err = tx.isError ? " (failed)" : "";
|
||||||
@@ -247,6 +265,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");
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -255,6 +274,105 @@ 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 = "";
|
||||||
|
hideError("export-privkey-error");
|
||||||
|
$("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) {
|
||||||
|
showError("export-privkey-error", "Password is required.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const btn = $("btn-export-privkey-confirm");
|
||||||
|
btn.disabled = true;
|
||||||
|
btn.classList.add("text-muted");
|
||||||
|
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");
|
||||||
|
hideError("export-privkey-error");
|
||||||
|
} catch {
|
||||||
|
showError("export-privkey-error", "Wrong password.");
|
||||||
|
} finally {
|
||||||
|
btn.disabled = false;
|
||||||
|
btn.classList.remove("text-muted");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$("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 };
|
||||||
|
|||||||
@@ -6,12 +6,13 @@ const {
|
|||||||
showView,
|
showView,
|
||||||
showFlash,
|
showFlash,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
|
addressTitle,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
truncateMiddle,
|
truncateMiddle,
|
||||||
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,
|
||||||
@@ -22,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");
|
||||||
|
|
||||||
@@ -86,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");
|
||||||
@@ -94,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);
|
||||||
}
|
}
|
||||||
@@ -137,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 +=
|
||||||
@@ -213,11 +242,10 @@ async function loadTransactions(address, tokenId) {
|
|||||||
|
|
||||||
loadedTxs = txs;
|
loadedTxs = txs;
|
||||||
|
|
||||||
// Collect unique counterparty addresses for ENS resolution
|
// Collect ALL unique addresses for ENS resolution so reverse
|
||||||
|
// lookups work for every displayed address.
|
||||||
const counterparties = [
|
const counterparties = [
|
||||||
...new Set(
|
...new Set(txs.flatMap((tx) => [tx.from, tx.to].filter(Boolean))),
|
||||||
txs.map((tx) => (tx.direction === "sent" ? tx.to : tx.from)),
|
|
||||||
),
|
|
||||||
];
|
];
|
||||||
if (counterparties.length > 0) {
|
if (counterparties.length > 0) {
|
||||||
try {
|
try {
|
||||||
@@ -250,12 +278,14 @@ function renderTransactions(txs) {
|
|||||||
for (const tx of txs) {
|
for (const tx of txs) {
|
||||||
const counterparty = tx.direction === "sent" ? tx.to : tx.from;
|
const counterparty = tx.direction === "sent" ? tx.to : tx.from;
|
||||||
const ensName = ensNameMap.get(counterparty) || null;
|
const ensName = ensNameMap.get(counterparty) || null;
|
||||||
|
const title = addressTitle(counterparty, state.wallets);
|
||||||
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)
|
||||||
: escapeHtml(tx.symbol);
|
: escapeHtml(tx.symbol);
|
||||||
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
||||||
const displayAddr = ensName || truncateMiddle(counterparty, maxAddr);
|
const displayAddr =
|
||||||
|
title || ensName || truncateMiddle(counterparty, maxAddr);
|
||||||
const addrStr = escapeHtml(displayAddr);
|
const addrStr = escapeHtml(displayAddr);
|
||||||
const dot = addressDotHtml(counterparty);
|
const dot = addressDotHtml(counterparty);
|
||||||
const err = tx.isError ? " (failed)" : "";
|
const err = tx.isError ? " (failed)" : "";
|
||||||
@@ -346,6 +376,7 @@ function init(_ctx) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
updateSendBalance();
|
updateSendBalance();
|
||||||
|
resetSendValidation();
|
||||||
showView("send");
|
showView("send");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,12 @@
|
|||||||
const { $, addressDotHtml, escapeHtml, showView } = require("./helpers");
|
const {
|
||||||
|
$,
|
||||||
|
addressDotHtml,
|
||||||
|
addressTitle,
|
||||||
|
escapeHtml,
|
||||||
|
showView,
|
||||||
|
showError,
|
||||||
|
hideError,
|
||||||
|
} = require("./helpers");
|
||||||
const { state, saveState } = require("../../shared/state");
|
const { state, saveState } = require("../../shared/state");
|
||||||
const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers");
|
const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers");
|
||||||
const { ERC20_ABI } = require("../../shared/constants");
|
const { ERC20_ABI } = require("../../shared/constants");
|
||||||
@@ -22,7 +30,15 @@ function approvalAddressHtml(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 = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
||||||
return `<div class="flex items-center">${dot}<span class="break-all">${escapeHtml(address)}</span>${extLink}</div>`;
|
const title = addressTitle(address, state.wallets);
|
||||||
|
let html = "";
|
||||||
|
if (title) {
|
||||||
|
html += `<div class="flex items-center font-bold">${dot}${escapeHtml(title)}</div>`;
|
||||||
|
html += `<div class="break-all">${escapeHtml(address)}${extLink}</div>`;
|
||||||
|
} else {
|
||||||
|
html += `<div class="flex items-center">${dot}<span class="break-all">${escapeHtml(address)}</span>${extLink}</div>`;
|
||||||
|
}
|
||||||
|
return html;
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatTxValue(val) {
|
function formatTxValue(val) {
|
||||||
@@ -64,10 +80,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",
|
||||||
@@ -86,7 +104,11 @@ function decodeCalldata(data, toAddress) {
|
|||||||
value: spender,
|
value: spender,
|
||||||
address: spender,
|
address: spender,
|
||||||
},
|
},
|
||||||
{ label: "Amount", value: amountStr },
|
{
|
||||||
|
label: "Amount",
|
||||||
|
value: amountStr,
|
||||||
|
rawValue: amountRaw,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -94,9 +116,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",
|
||||||
@@ -111,7 +135,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,
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -149,7 +177,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) {
|
||||||
@@ -158,6 +186,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);
|
||||||
|
|
||||||
@@ -219,6 +256,9 @@ function showTxApproval(details) {
|
|||||||
$("approve-tx-data-section").classList.add("hidden");
|
$("approve-tx-data-section").classList.add("hidden");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
$("approve-tx-password").value = "";
|
||||||
|
$("approve-tx-error").classList.add("hidden");
|
||||||
|
|
||||||
showView("approve-tx");
|
showView("approve-tx");
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -307,7 +347,7 @@ function showSignApproval(details) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
$("approve-sign-password").value = "";
|
$("approve-sign-password").value = "";
|
||||||
$("approve-sign-error").classList.add("hidden");
|
hideError("approve-sign-error");
|
||||||
$("btn-approve-sign").disabled = false;
|
$("btn-approve-sign").disabled = false;
|
||||||
$("btn-approve-sign").classList.remove("text-muted");
|
$("btn-approve-sign").classList.remove("text-muted");
|
||||||
|
|
||||||
@@ -372,11 +412,10 @@ function init(ctx) {
|
|||||||
$("btn-approve-tx").addEventListener("click", () => {
|
$("btn-approve-tx").addEventListener("click", () => {
|
||||||
const password = $("approve-tx-password").value;
|
const password = $("approve-tx-password").value;
|
||||||
if (!password) {
|
if (!password) {
|
||||||
$("approve-tx-error").textContent = "Please enter your password.";
|
showError("approve-tx-error", "Please enter your password.");
|
||||||
$("approve-tx-error").classList.remove("hidden");
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
$("approve-tx-error").classList.add("hidden");
|
hideError("approve-tx-error");
|
||||||
$("btn-approve-tx").disabled = true;
|
$("btn-approve-tx").disabled = true;
|
||||||
$("btn-approve-tx").classList.add("text-muted");
|
$("btn-approve-tx").classList.add("text-muted");
|
||||||
|
|
||||||
@@ -412,11 +451,10 @@ function init(ctx) {
|
|||||||
$("btn-approve-sign").addEventListener("click", () => {
|
$("btn-approve-sign").addEventListener("click", () => {
|
||||||
const password = $("approve-sign-password").value;
|
const password = $("approve-sign-password").value;
|
||||||
if (!password) {
|
if (!password) {
|
||||||
$("approve-sign-error").textContent = "Please enter your password.";
|
showError("approve-sign-error", "Please enter your password.");
|
||||||
$("approve-sign-error").classList.remove("hidden");
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
$("approve-sign-error").classList.add("hidden");
|
hideError("approve-sign-error");
|
||||||
$("btn-approve-sign").disabled = true;
|
$("btn-approve-sign").disabled = true;
|
||||||
$("btn-approve-sign").classList.add("text-muted");
|
$("btn-approve-sign").classList.add("text-muted");
|
||||||
|
|
||||||
@@ -434,8 +472,7 @@ function init(ctx) {
|
|||||||
} else {
|
} else {
|
||||||
const msg =
|
const msg =
|
||||||
(response && response.error) || "Signing failed.";
|
(response && response.error) || "Signing failed.";
|
||||||
$("approve-sign-error").textContent = msg;
|
showError("approve-sign-error", msg);
|
||||||
$("approve-sign-error").classList.remove("hidden");
|
|
||||||
$("btn-approve-sign").disabled = false;
|
$("btn-approve-sign").disabled = false;
|
||||||
$("btn-approve-sign").classList.remove("text-muted");
|
$("btn-approve-sign").classList.remove("text-muted");
|
||||||
}
|
}
|
||||||
@@ -453,4 +490,4 @@ function init(ctx) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { init, show };
|
module.exports = { init, show, decodeCalldata };
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
// Transaction confirmation view + password modal.
|
// Transaction confirmation view with inline password.
|
||||||
// Shows transaction details, warnings, errors. On proceed, opens
|
// Shows transaction details, warnings, errors. On Sign & Send,
|
||||||
// password modal, decrypts secret, signs and broadcasts.
|
// reads inline password, decrypts secret, signs and broadcasts.
|
||||||
|
|
||||||
const {
|
const {
|
||||||
parseEther,
|
parseEther,
|
||||||
@@ -14,6 +14,7 @@ const {
|
|||||||
showError,
|
showError,
|
||||||
hideError,
|
hideError,
|
||||||
showView,
|
showView,
|
||||||
|
showFlash,
|
||||||
addressTitle,
|
addressTitle,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
@@ -38,6 +39,13 @@ const EXT_ICON =
|
|||||||
|
|
||||||
let pendingTx = null;
|
let pendingTx = null;
|
||||||
|
|
||||||
|
function restore() {
|
||||||
|
const d = state.viewData;
|
||||||
|
if (d && d.pendingTx) {
|
||||||
|
show(d.pendingTx);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function etherscanTokenLink(address) {
|
function etherscanTokenLink(address) {
|
||||||
return `https://etherscan.io/token/${address}`;
|
return `https://etherscan.io/token/${address}`;
|
||||||
}
|
}
|
||||||
@@ -95,11 +103,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");
|
||||||
}
|
}
|
||||||
@@ -214,9 +233,14 @@ function show(txInfo) {
|
|||||||
sendBtn.classList.remove("text-muted");
|
sendBtn.classList.remove("text-muted");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Reset password field and error
|
||||||
|
$("confirm-tx-password").value = "";
|
||||||
|
hideError("confirm-tx-password-error");
|
||||||
|
|
||||||
// Gas estimate — show placeholder then fetch async
|
// Gas estimate — show placeholder then fetch async
|
||||||
$("confirm-fee").classList.remove("hidden");
|
$("confirm-fee").classList.remove("hidden");
|
||||||
$("confirm-fee-amount").textContent = "Estimating...";
|
$("confirm-fee-amount").textContent = "Estimating...";
|
||||||
|
state.viewData = { pendingTx: txInfo };
|
||||||
showView("confirm-tx");
|
showView("confirm-tx");
|
||||||
|
|
||||||
estimateGas(txInfo);
|
estimateGas(txInfo);
|
||||||
@@ -262,39 +286,20 @@ async function estimateGas(txInfo) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function showPasswordModal() {
|
|
||||||
$("modal-password").value = "";
|
|
||||||
hideError("modal-password-error");
|
|
||||||
$("password-modal").classList.remove("hidden");
|
|
||||||
}
|
|
||||||
|
|
||||||
function hidePasswordModal() {
|
|
||||||
$("password-modal").classList.add("hidden");
|
|
||||||
}
|
|
||||||
|
|
||||||
function init(ctx) {
|
function init(ctx) {
|
||||||
$("btn-confirm-send").addEventListener("click", () => {
|
$("btn-confirm-send").addEventListener("click", async () => {
|
||||||
showPasswordModal();
|
const password = $("confirm-tx-password").value;
|
||||||
});
|
|
||||||
|
|
||||||
$("btn-confirm-back").addEventListener("click", () => {
|
|
||||||
showView("send");
|
|
||||||
});
|
|
||||||
|
|
||||||
$("btn-modal-cancel").addEventListener("click", () => {
|
|
||||||
hidePasswordModal();
|
|
||||||
});
|
|
||||||
|
|
||||||
$("btn-modal-confirm").addEventListener("click", async () => {
|
|
||||||
const password = $("modal-password").value;
|
|
||||||
if (!password) {
|
if (!password) {
|
||||||
showError("modal-password-error", "Please enter your password.");
|
showError(
|
||||||
|
"confirm-tx-password-error",
|
||||||
|
"Please enter your password.",
|
||||||
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const wallet = state.wallets[state.selectedWallet];
|
const wallet = state.wallets[state.selectedWallet];
|
||||||
let decryptedSecret;
|
let decryptedSecret;
|
||||||
hideError("modal-password-error");
|
hideError("confirm-tx-password-error");
|
||||||
|
|
||||||
try {
|
try {
|
||||||
decryptedSecret = await decryptWithPassword(
|
decryptedSecret = await decryptWithPassword(
|
||||||
@@ -302,11 +307,12 @@ function init(ctx) {
|
|||||||
password,
|
password,
|
||||||
);
|
);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
showError("modal-password-error", "Wrong password.");
|
showError("confirm-tx-password-error", "Wrong password.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
hidePasswordModal();
|
$("btn-confirm-send").disabled = true;
|
||||||
|
$("btn-confirm-send").classList.add("text-muted");
|
||||||
|
|
||||||
let tx;
|
let tx;
|
||||||
try {
|
try {
|
||||||
@@ -343,8 +349,15 @@ function init(ctx) {
|
|||||||
decryptedSecret = null;
|
decryptedSecret = null;
|
||||||
const hash = tx ? tx.hash : null;
|
const hash = tx ? tx.hash : null;
|
||||||
txStatus.showError(pendingTx, hash, e.shortMessage || e.message);
|
txStatus.showError(pendingTx, hash, e.shortMessage || e.message);
|
||||||
|
} finally {
|
||||||
|
$("btn-confirm-send").disabled = false;
|
||||||
|
$("btn-confirm-send").classList.remove("text-muted");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$("btn-confirm-back").addEventListener("click", () => {
|
||||||
|
showView("send");
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { init, show };
|
module.exports = { init, show, restore };
|
||||||
|
|||||||
93
src/popup/views/deleteWallet.js
Normal file
93
src/popup/views/deleteWallet.js
Normal file
@@ -0,0 +1,93 @@
|
|||||||
|
const { $, showView, showFlash, showError, hideError } = require("./helpers");
|
||||||
|
const { state, saveState } = require("../../shared/state");
|
||||||
|
const { decryptWithPassword } = require("../../shared/vault");
|
||||||
|
|
||||||
|
let deleteWalletIndex = null;
|
||||||
|
let ctx = null;
|
||||||
|
|
||||||
|
function show(walletIdx) {
|
||||||
|
deleteWalletIndex = walletIdx;
|
||||||
|
const wallet = state.wallets[walletIdx];
|
||||||
|
$("delete-wallet-name").textContent =
|
||||||
|
wallet.name || "Wallet " + (walletIdx + 1);
|
||||||
|
$("delete-wallet-password").value = "";
|
||||||
|
hideError("delete-wallet-error");
|
||||||
|
showView("delete-wallet-confirm");
|
||||||
|
}
|
||||||
|
|
||||||
|
function init(_ctx) {
|
||||||
|
ctx = _ctx;
|
||||||
|
|
||||||
|
$("btn-delete-wallet-back").addEventListener("click", () => {
|
||||||
|
deleteWalletIndex = null;
|
||||||
|
ctx.showSettingsView();
|
||||||
|
});
|
||||||
|
|
||||||
|
$("btn-delete-wallet-confirm").addEventListener("click", async () => {
|
||||||
|
const pw = $("delete-wallet-password").value;
|
||||||
|
if (!pw) {
|
||||||
|
showError("delete-wallet-error", "Please enter your password.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (deleteWalletIndex === null) {
|
||||||
|
showError(
|
||||||
|
"delete-wallet-error",
|
||||||
|
"No wallet selected for deletion.",
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const btn = $("btn-delete-wallet-confirm");
|
||||||
|
btn.disabled = true;
|
||||||
|
btn.classList.add("text-muted");
|
||||||
|
|
||||||
|
const walletIdx = deleteWalletIndex;
|
||||||
|
const wallet = state.wallets[walletIdx];
|
||||||
|
|
||||||
|
// Verify password against the wallet's encrypted data
|
||||||
|
try {
|
||||||
|
await decryptWithPassword(wallet.encryptedSecret, pw);
|
||||||
|
} catch (_e) {
|
||||||
|
showError("delete-wallet-error", "Wrong password.");
|
||||||
|
btn.disabled = false;
|
||||||
|
btn.classList.remove("text-muted");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Collect addresses to clean up from allowedSites/deniedSites
|
||||||
|
const addresses = (wallet.addresses || []).map((a) => a.address);
|
||||||
|
|
||||||
|
// Remove wallet
|
||||||
|
state.wallets.splice(walletIdx, 1);
|
||||||
|
|
||||||
|
// Clean up site permissions for deleted addresses
|
||||||
|
for (const addr of addresses) {
|
||||||
|
delete state.allowedSites[addr];
|
||||||
|
delete state.deniedSites[addr];
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteWalletIndex = null;
|
||||||
|
|
||||||
|
if (state.wallets.length === 0) {
|
||||||
|
// No wallets left — reset selection and show welcome
|
||||||
|
state.selectedWallet = null;
|
||||||
|
state.selectedAddress = null;
|
||||||
|
state.activeAddress = null;
|
||||||
|
await saveState();
|
||||||
|
showView("welcome");
|
||||||
|
} else {
|
||||||
|
// Switch to first wallet if deleted wallet was active
|
||||||
|
state.selectedWallet = 0;
|
||||||
|
state.selectedAddress = 0;
|
||||||
|
state.activeAddress =
|
||||||
|
state.wallets[0].addresses[0]?.address || null;
|
||||||
|
await saveState();
|
||||||
|
ctx.renderWalletList();
|
||||||
|
ctx.showSettingsView();
|
||||||
|
showFlash("Wallet deleted.");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = { init, show };
|
||||||
@@ -25,11 +25,13 @@ const VIEWS = [
|
|||||||
"receive",
|
"receive",
|
||||||
"add-token",
|
"add-token",
|
||||||
"settings",
|
"settings",
|
||||||
|
"delete-wallet-confirm",
|
||||||
"settings-addtoken",
|
"settings-addtoken",
|
||||||
"transaction",
|
"transaction",
|
||||||
"approve-site",
|
"approve-site",
|
||||||
"approve-tx",
|
"approve-tx",
|
||||||
"approve-sign",
|
"approve-sign",
|
||||||
|
"export-privkey",
|
||||||
];
|
];
|
||||||
|
|
||||||
function $(id) {
|
function $(id) {
|
||||||
|
|||||||
@@ -6,11 +6,16 @@ const {
|
|||||||
isoDate,
|
isoDate,
|
||||||
timeAgo,
|
timeAgo,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
|
addressTitle,
|
||||||
escapeHtml,
|
escapeHtml,
|
||||||
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,
|
||||||
@@ -102,13 +107,22 @@ function renderHomeTxList(ctx) {
|
|||||||
let html = "";
|
let html = "";
|
||||||
let i = 0;
|
let i = 0;
|
||||||
for (const tx of homeTxs) {
|
for (const tx of homeTxs) {
|
||||||
const counterparty = tx.direction === "sent" ? tx.to : tx.from;
|
// 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 =
|
||||||
|
tx.direction === "contract" && tx.directionLabel === "Swap"
|
||||||
|
? 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)
|
||||||
: escapeHtml(tx.symbol);
|
: escapeHtml(tx.symbol);
|
||||||
|
const title = addressTitle(counterparty, state.wallets);
|
||||||
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
const maxAddr = Math.max(32, 36 - Math.max(0, amountStr.length - 10));
|
||||||
const displayAddr = truncateMiddle(counterparty, maxAddr);
|
const displayAddr = title || truncateMiddle(counterparty, maxAddr);
|
||||||
const addrStr = escapeHtml(displayAddr);
|
const addrStr = escapeHtml(displayAddr);
|
||||||
const dot = addressDotHtml(counterparty);
|
const dot = addressDotHtml(counterparty);
|
||||||
const err = tx.isError ? " (failed)" : "";
|
const err = tx.isError ? " (failed)" : "";
|
||||||
@@ -378,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,4 +1,4 @@
|
|||||||
const { $, showView, showFlash } = require("./helpers");
|
const { $, showView, showError, hideError } = require("./helpers");
|
||||||
const { addressFromPrivateKey } = require("../../shared/wallet");
|
const { addressFromPrivateKey } = 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");
|
||||||
@@ -7,6 +7,7 @@ function show() {
|
|||||||
$("import-private-key").value = "";
|
$("import-private-key").value = "";
|
||||||
$("import-key-password").value = "";
|
$("import-key-password").value = "";
|
||||||
$("import-key-password-confirm").value = "";
|
$("import-key-password-confirm").value = "";
|
||||||
|
hideError("import-key-error");
|
||||||
showView("import-key");
|
showView("import-key");
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -14,30 +15,34 @@ function init(ctx) {
|
|||||||
$("btn-import-key-confirm").addEventListener("click", async () => {
|
$("btn-import-key-confirm").addEventListener("click", async () => {
|
||||||
const key = $("import-private-key").value.trim();
|
const key = $("import-private-key").value.trim();
|
||||||
if (!key) {
|
if (!key) {
|
||||||
showFlash("Please enter your private key.");
|
showError("import-key-error", "Please enter your private key.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let addr;
|
let addr;
|
||||||
try {
|
try {
|
||||||
addr = addressFromPrivateKey(key);
|
addr = addressFromPrivateKey(key);
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
showFlash("Invalid private key.");
|
showError("import-key-error", "Invalid private key.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const pw = $("import-key-password").value;
|
const pw = $("import-key-password").value;
|
||||||
const pw2 = $("import-key-password-confirm").value;
|
const pw2 = $("import-key-password-confirm").value;
|
||||||
if (!pw) {
|
if (!pw) {
|
||||||
showFlash("Please choose a password.");
|
showError("import-key-error", "Please choose a password.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (pw.length < 12) {
|
if (pw.length < 12) {
|
||||||
showFlash("Password must be at least 12 characters.");
|
showError(
|
||||||
|
"import-key-error",
|
||||||
|
"Password must be at least 12 characters.",
|
||||||
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (pw !== pw2) {
|
if (pw !== pw2) {
|
||||||
showFlash("Passwords do not match.");
|
showError("import-key-error", "Passwords do not match.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
hideError("import-key-error");
|
||||||
const encrypted = await encryptWithPassword(key, pw);
|
const encrypted = await encryptWithPassword(key, pw);
|
||||||
const walletNum = state.wallets.length + 1;
|
const walletNum = state.wallets.length + 1;
|
||||||
state.wallets.push({
|
state.wallets.push({
|
||||||
|
|||||||
@@ -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!");
|
||||||
|
|||||||
@@ -1,10 +1,117 @@
|
|||||||
// Send view: collect To, Amount, Token. Then go to confirmation.
|
// Send view: collect To, Amount, Token. Then go to confirmation.
|
||||||
|
|
||||||
const { $, showFlash, addressDotHtml, escapeHtml } = require("./helpers");
|
const {
|
||||||
|
$,
|
||||||
|
showFlash,
|
||||||
|
addressDotHtml,
|
||||||
|
addressTitle,
|
||||||
|
escapeHtml,
|
||||||
|
} = require("./helpers");
|
||||||
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">` +
|
||||||
@@ -44,8 +151,15 @@ function updateSendBalance() {
|
|||||||
const dot = addressDotHtml(addr.address);
|
const dot = addressDotHtml(addr.address);
|
||||||
const link = `https://etherscan.io/address/${addr.address}`;
|
const link = `https://etherscan.io/address/${addr.address}`;
|
||||||
const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
const extLink = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
||||||
|
const title = addressTitle(addr.address, state.wallets);
|
||||||
let fromHtml = "";
|
let fromHtml = "";
|
||||||
if (addr.ensName) {
|
if (title) {
|
||||||
|
fromHtml += `<div class="flex items-center font-bold">${dot}${escapeHtml(title)}</div>`;
|
||||||
|
if (addr.ensName) {
|
||||||
|
fromHtml += `<div>${escapeHtml(addr.ensName)}</div>`;
|
||||||
|
}
|
||||||
|
fromHtml += `<div class="break-all">${escapeHtml(addr.address)}${extLink}</div>`;
|
||||||
|
} else if (addr.ensName) {
|
||||||
fromHtml += `<div class="flex items-center font-bold">${dot}${escapeHtml(addr.ensName)}</div>`;
|
fromHtml += `<div class="flex items-center font-bold">${dot}${escapeHtml(addr.ensName)}</div>`;
|
||||||
fromHtml += `<div class="break-all">${escapeHtml(addr.address)}${extLink}</div>`;
|
fromHtml += `<div class="break-all">${escapeHtml(addr.address)}${extLink}</div>`;
|
||||||
} else {
|
} else {
|
||||||
@@ -60,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;
|
||||||
@@ -71,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();
|
||||||
@@ -78,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;
|
||||||
@@ -111,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";
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -138,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,
|
||||||
|
};
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ const { $, showView, showFlash, escapeHtml } = require("./helpers");
|
|||||||
const { state, saveState } = require("../../shared/state");
|
const { state, saveState } = require("../../shared/state");
|
||||||
const { ETHEREUM_MAINNET_CHAIN_ID } = require("../../shared/constants");
|
const { ETHEREUM_MAINNET_CHAIN_ID } = require("../../shared/constants");
|
||||||
const { log, debugFetch } = require("../../shared/log");
|
const { log, debugFetch } = require("../../shared/log");
|
||||||
|
const deleteWallet = require("./deleteWallet");
|
||||||
|
|
||||||
const runtime =
|
const runtime =
|
||||||
typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
|
typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
|
||||||
@@ -65,11 +66,68 @@ function renderTrackedTokens() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function renderWalletListSettings() {
|
||||||
|
const container = $("settings-wallet-list");
|
||||||
|
if (state.wallets.length === 0) {
|
||||||
|
container.innerHTML = '<p class="text-xs text-muted">No wallets.</p>';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let html = "";
|
||||||
|
state.wallets.forEach((wallet, idx) => {
|
||||||
|
const name = escapeHtml(wallet.name || "Wallet " + (idx + 1));
|
||||||
|
html += `<div class="flex justify-between items-center text-xs py-1 border-b border-border-light">`;
|
||||||
|
html += `<span class="settings-wallet-name cursor-pointer underline decoration-dashed" data-idx="${idx}">${name}</span>`;
|
||||||
|
html += `<button class="btn-delete-wallet border border-border px-1 hover:bg-fg hover:text-bg cursor-pointer" data-idx="${idx}">[x]</button>`;
|
||||||
|
html += `</div>`;
|
||||||
|
});
|
||||||
|
container.innerHTML = html;
|
||||||
|
container.querySelectorAll(".btn-delete-wallet").forEach((btn) => {
|
||||||
|
btn.addEventListener("click", () => {
|
||||||
|
const idx = parseInt(btn.dataset.idx, 10);
|
||||||
|
deleteWallet.show(idx);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Inline rename on click
|
||||||
|
container.querySelectorAll(".settings-wallet-name").forEach((span) => {
|
||||||
|
span.addEventListener("click", () => {
|
||||||
|
const idx = parseInt(span.dataset.idx, 10);
|
||||||
|
const wallet = state.wallets[idx];
|
||||||
|
const input = document.createElement("input");
|
||||||
|
input.type = "text";
|
||||||
|
input.className =
|
||||||
|
"border border-border p-0 text-xs bg-bg text-fg w-full";
|
||||||
|
input.value = wallet.name || "Wallet " + (idx + 1);
|
||||||
|
span.replaceWith(input);
|
||||||
|
input.focus();
|
||||||
|
input.select();
|
||||||
|
const finish = async () => {
|
||||||
|
const val = input.value.trim();
|
||||||
|
if (val && val !== wallet.name) {
|
||||||
|
wallet.name = val;
|
||||||
|
await saveState();
|
||||||
|
}
|
||||||
|
renderWalletListSettings();
|
||||||
|
};
|
||||||
|
input.addEventListener("blur", finish);
|
||||||
|
input.addEventListener("keydown", (e) => {
|
||||||
|
if (e.key === "Enter") input.blur();
|
||||||
|
if (e.key === "Escape") {
|
||||||
|
input.value = wallet.name || "Wallet " + (idx + 1);
|
||||||
|
input.blur();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function show() {
|
function show() {
|
||||||
$("settings-rpc").value = state.rpcUrl;
|
$("settings-rpc").value = state.rpcUrl;
|
||||||
$("settings-blockscout").value = state.blockscoutUrl;
|
$("settings-blockscout").value = state.blockscoutUrl;
|
||||||
renderTrackedTokens();
|
renderTrackedTokens();
|
||||||
renderSiteLists();
|
renderSiteLists();
|
||||||
|
renderWalletListSettings();
|
||||||
|
|
||||||
showView("settings");
|
showView("settings");
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -83,6 +141,8 @@ function renderSiteLists() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function init(ctx) {
|
function init(ctx) {
|
||||||
|
deleteWallet.init(ctx);
|
||||||
|
|
||||||
$("btn-save-rpc").addEventListener("click", async () => {
|
$("btn-save-rpc").addEventListener("click", async () => {
|
||||||
const url = $("settings-rpc").value.trim();
|
const url = $("settings-rpc").value.trim();
|
||||||
if (!url) {
|
if (!url) {
|
||||||
|
|||||||
@@ -13,6 +13,8 @@ const {
|
|||||||
} = require("./helpers");
|
} = require("./helpers");
|
||||||
const { state } = require("../../shared/state");
|
const { state } = require("../../shared/state");
|
||||||
const makeBlockie = require("ethereum-blockies-base64");
|
const makeBlockie = require("ethereum-blockies-base64");
|
||||||
|
const { log, debugFetch } = require("../../shared/log");
|
||||||
|
const { decodeCalldata } = require("./approval");
|
||||||
|
|
||||||
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">` +
|
||||||
@@ -35,27 +37,35 @@ 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="flex items-center font-bold">${dot}${escapeHtml(title)}</div>`;
|
html += `<div class="font-bold">${escapeHtml(title)}</div>`;
|
||||||
}
|
}
|
||||||
if (ensName) {
|
if (ensName) {
|
||||||
html +=
|
html +=
|
||||||
`<div class="flex items-center">${title ? "" : 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 +=
|
||||||
`<div class="flex items-center">${title ? "" : dot}` +
|
`<div class="flex items-center">${dot}` +
|
||||||
copyableHtml(address, "break-all") +
|
copyableHtml(address, "break-all") +
|
||||||
extLink +
|
extLink +
|
||||||
`</div>`;
|
`</div>`;
|
||||||
@@ -65,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;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -85,6 +95,9 @@ function show(tx) {
|
|||||||
fromEns: tx.fromEns || null,
|
fromEns: tx.fromEns || null,
|
||||||
toEns: tx.toEns || null,
|
toEns: tx.toEns || null,
|
||||||
directionLabel: tx.directionLabel || null,
|
directionLabel: tx.directionLabel || null,
|
||||||
|
direction: tx.direction || null,
|
||||||
|
isContractCall: tx.isContractCall || false,
|
||||||
|
method: tx.method || null,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
render();
|
render();
|
||||||
@@ -121,6 +134,30 @@ function render() {
|
|||||||
nativeEl.parentElement.classList.add("hidden");
|
nativeEl.parentElement.classList.add("hidden");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Show type label for contract interactions (Swap, Execute, etc.)
|
||||||
|
const typeSection = $("tx-detail-type-section");
|
||||||
|
const typeEl = $("tx-detail-type");
|
||||||
|
const headingEl = $("tx-detail-heading");
|
||||||
|
if (tx.direction === "contract" && tx.directionLabel) {
|
||||||
|
if (typeSection) {
|
||||||
|
typeEl.textContent = tx.directionLabel;
|
||||||
|
typeSection.classList.remove("hidden");
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (typeSection) typeSection.classList.add("hidden");
|
||||||
|
}
|
||||||
|
if (headingEl) headingEl.textContent = "Transaction";
|
||||||
|
|
||||||
|
// Hide calldata and raw data sections; re-fetch if this is a contract call
|
||||||
|
const calldataSection = $("tx-detail-calldata-section");
|
||||||
|
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) + ")";
|
||||||
$("tx-detail-status").textContent = tx.isError ? "Failed" : "Success";
|
$("tx-detail-status").textContent = tx.isError ? "Failed" : "Success";
|
||||||
@@ -137,6 +174,87 @@ function render() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadCalldata(txHash, toAddress) {
|
||||||
|
const section = $("tx-detail-calldata-section");
|
||||||
|
const actionEl = $("tx-detail-calldata-action");
|
||||||
|
const detailsEl = $("tx-detail-calldata-details");
|
||||||
|
const wellEl = $("tx-detail-calldata-well");
|
||||||
|
const rawSection = $("tx-detail-rawdata-section");
|
||||||
|
const rawEl = $("tx-detail-rawdata");
|
||||||
|
if (!section || !actionEl || !detailsEl) return;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const resp = await debugFetch(
|
||||||
|
state.blockscoutUrl + "/transactions/" + txHash,
|
||||||
|
);
|
||||||
|
if (!resp.ok) return;
|
||||||
|
const txData = await resp.json();
|
||||||
|
const inputData = txData.raw_input || txData.input || null;
|
||||||
|
if (!inputData || inputData === "0x") return;
|
||||||
|
|
||||||
|
const decoded = decodeCalldata(inputData, toAddress || "");
|
||||||
|
if (decoded) {
|
||||||
|
// Render decoded calldata matching approval view style
|
||||||
|
actionEl.textContent = decoded.name;
|
||||||
|
let detailsHtml = "";
|
||||||
|
if (decoded.description) {
|
||||||
|
detailsHtml += `<div class="mb-2">${escapeHtml(decoded.description)}</div>`;
|
||||||
|
}
|
||||||
|
for (const d of decoded.details || []) {
|
||||||
|
detailsHtml += `<div class="mb-2">`;
|
||||||
|
detailsHtml += `<div class="text-muted">${escapeHtml(d.label)}</div>`;
|
||||||
|
if (d.address && d.isToken) {
|
||||||
|
// Token entry: show symbol on its own line, then dot + address + Etherscan link
|
||||||
|
const dot = addressDotHtml(d.address);
|
||||||
|
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 {
|
||||||
|
detailsHtml += `<div class="font-bold">${escapeHtml(d.value)}</div>`;
|
||||||
|
}
|
||||||
|
detailsHtml += `</div>`;
|
||||||
|
}
|
||||||
|
detailsEl.innerHTML = detailsHtml;
|
||||||
|
if (wellEl) wellEl.classList.remove("hidden");
|
||||||
|
} else {
|
||||||
|
// Unknown contract call — show method name in well
|
||||||
|
const method = txData.method || "Unknown contract call";
|
||||||
|
actionEl.textContent = method;
|
||||||
|
detailsEl.innerHTML = "";
|
||||||
|
if (wellEl) wellEl.classList.remove("hidden");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Always show raw data
|
||||||
|
if (rawSection && rawEl) {
|
||||||
|
rawEl.innerHTML = copyableHtml(inputData, "break-all");
|
||||||
|
rawSection.classList.remove("hidden");
|
||||||
|
}
|
||||||
|
|
||||||
|
section.classList.remove("hidden");
|
||||||
|
|
||||||
|
// Bind copy handlers for new elements (including raw data now outside section)
|
||||||
|
const copyTargets = [section, rawSection].filter(Boolean);
|
||||||
|
for (const container of copyTargets) {
|
||||||
|
container.querySelectorAll("[data-copy]").forEach((el) => {
|
||||||
|
el.onclick = () => {
|
||||||
|
navigator.clipboard.writeText(el.dataset.copy);
|
||||||
|
showFlash("Copied!");
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
log.errorf("loadCalldata failed:", e.message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function init(_ctx) {
|
function init(_ctx) {
|
||||||
ctx = _ctx;
|
ctx = _ctx;
|
||||||
$("btn-tx-back").addEventListener("click", () => {
|
$("btn-tx-back").addEventListener("click", () => {
|
||||||
|
|||||||
@@ -5,8 +5,10 @@ const {
|
|||||||
showView,
|
showView,
|
||||||
showFlash,
|
showFlash,
|
||||||
addressDotHtml,
|
addressDotHtml,
|
||||||
|
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");
|
||||||
@@ -37,6 +39,13 @@ function toAddressHtml(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 = `<a href="${link}" target="_blank" rel="noopener" class="inline-flex items-center">${EXT_ICON}</a>`;
|
||||||
|
const title = addressTitle(address, state.wallets);
|
||||||
|
if (title) {
|
||||||
|
return (
|
||||||
|
`<div class="flex items-center font-bold">${dot}${escapeHtml(title)}</div>` +
|
||||||
|
`<div class="break-all">${escapeHtml(address)}${extLink}</div>`
|
||||||
|
);
|
||||||
|
}
|
||||||
return `<div class="flex items-center">${dot}<span class="break-all">${escapeHtml(address)}</span>${extLink}</div>`;
|
return `<div class="flex items-center">${dot}<span class="break-all">${escapeHtml(address)}</span>${extLink}</div>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -113,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;
|
||||||
@@ -125,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,
|
||||||
@@ -123,15 +124,27 @@ async function refreshBalances(wallets, rpcUrl, blockscoutUrl, trackedTokens) {
|
|||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
// ENS reverse lookup
|
// ENS reverse lookup — only overwrite on success so that
|
||||||
|
// transient RPC errors don't wipe a previously resolved name.
|
||||||
updates.push(
|
updates.push(
|
||||||
provider
|
provider
|
||||||
.lookupAddress(addr.address)
|
.lookupAddress(addr.address)
|
||||||
.then((name) => {
|
.then((name) => {
|
||||||
addr.ensName = name || null;
|
addr.ensName = name || null;
|
||||||
|
log.debugf(
|
||||||
|
"ENS reverse",
|
||||||
|
addr.address,
|
||||||
|
"->",
|
||||||
|
addr.ensName,
|
||||||
|
);
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch((e) => {
|
||||||
addr.ensName = null;
|
log.errorf(
|
||||||
|
"ENS reverse failed",
|
||||||
|
addr.address,
|
||||||
|
e.message,
|
||||||
|
);
|
||||||
|
// Keep existing addr.ensName if we had one
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -192,6 +205,10 @@ async function lookupTokenInfo(contractAddress, rpcUrl) {
|
|||||||
name = symbol;
|
name = symbol;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Truncate to prevent storage of excessively long values from RPC
|
||||||
|
name = String(name).slice(0, 64);
|
||||||
|
symbol = String(symbol).slice(0, 12);
|
||||||
|
|
||||||
log.infof("Token resolved:", symbol, "decimals", Number(decimals));
|
log.infof("Token resolved:", symbol, "decimals", Number(decimals));
|
||||||
return { name, symbol, decimals: Number(decimals) };
|
return { name, symbol, decimals: Number(decimals) };
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -39,7 +39,7 @@ async function resolveEnsName(address, rpcUrl) {
|
|||||||
return name;
|
return name;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
log.errorf("ENS reverse lookup failed", address, e.message);
|
log.errorf("ENS reverse lookup failed", address, e.message);
|
||||||
setCache(address, null);
|
// Don't cache failures — let subsequent lookups retry
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -37,7 +37,21 @@ function parseTx(tx, addrLower) {
|
|||||||
if (token) {
|
if (token) {
|
||||||
symbol = token.symbol;
|
symbol = token.symbol;
|
||||||
}
|
}
|
||||||
const label = method.charAt(0).toUpperCase() + method.slice(1);
|
// Map known DEX methods to "Swap" for cleaner display
|
||||||
|
const SWAP_METHODS = new Set([
|
||||||
|
"execute",
|
||||||
|
"swap",
|
||||||
|
"swapExactTokensForTokens",
|
||||||
|
"swapTokensForExactTokens",
|
||||||
|
"swapExactETHForTokens",
|
||||||
|
"swapTokensForExactETH",
|
||||||
|
"swapExactTokensForETH",
|
||||||
|
"swapETHForExactTokens",
|
||||||
|
"multicall",
|
||||||
|
]);
|
||||||
|
const label = SWAP_METHODS.has(method)
|
||||||
|
? "Swap"
|
||||||
|
: method.charAt(0).toUpperCase() + method.slice(1);
|
||||||
direction = "contract";
|
direction = "contract";
|
||||||
directionLabel = label;
|
directionLabel = label;
|
||||||
value = "";
|
value = "";
|
||||||
@@ -139,10 +153,26 @@ 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
|
||||||
|
// multiple token transfers (one per token involved), so we key token
|
||||||
|
// 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);
|
||||||
txsByHash.set(parsed.hash, parsed);
|
const existing = txsByHash.get(parsed.hash);
|
||||||
|
if (existing && existing.direction === "contract") {
|
||||||
|
parsed.direction = "contract";
|
||||||
|
parsed.directionLabel = existing.directionLabel;
|
||||||
|
parsed.isContractCall = true;
|
||||||
|
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);
|
||||||
|
}
|
||||||
|
// 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;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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