Add transaction confirmation screen and password modal
All checks were successful
check / check (push) Successful in 13s
All checks were successful
check / check (push) Successful in 13s
New send flow: Send → Confirm → Password → Broadcast. Send view: collects To (with ENS resolution), Amount, Token. "Review" button advances to confirmation. No password field. Confirm Transaction view: shows From, To (with ENS name), Amount (with USD value), and runs pre-send checks: - Scam address warning (checked against local blocklist) - Self-send warning - Insufficient balance error (disables Send button) Password modal: full-screen overlay, appears only after user clicks Send on the confirmation screen. Decrypts the wallet secret, signs and broadcasts the transaction. Wrong password is caught inline. scamlist.js: hardcoded set of known scam/fraud addresses (Tornado Cash sanctioned, drainer contracts, address poisoning). Checked locally, no external API.
This commit is contained in:
@@ -298,27 +298,12 @@
|
||||
placeholder="0.0"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
id="send-fee-estimate"
|
||||
class="text-xs text-muted mb-2 hidden"
|
||||
></div>
|
||||
<div class="mb-2">
|
||||
<label class="block mb-1">Password</label>
|
||||
<p class="text-xs text-muted mb-1">
|
||||
Required to authorize the transaction.
|
||||
</p>
|
||||
<input
|
||||
type="password"
|
||||
id="send-password"
|
||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
id="btn-send-confirm"
|
||||
id="btn-send-review"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Send
|
||||
Review
|
||||
</button>
|
||||
<button
|
||||
id="btn-send-back"
|
||||
@@ -328,11 +313,99 @@
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
id="send-status"
|
||||
id="send-error"
|
||||
class="mt-2 border border-border border-dashed p-1 hidden"
|
||||
></div>
|
||||
</div>
|
||||
|
||||
<!-- ============ CONFIRM TRANSACTION ============ -->
|
||||
<div id="view-confirm-tx" class="view hidden">
|
||||
<h2 class="font-bold mb-2">Confirm Transaction</h2>
|
||||
<div class="mb-2">
|
||||
<div class="text-xs text-muted">From</div>
|
||||
<div id="confirm-from" class="text-xs break-all"></div>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<div class="text-xs text-muted">To</div>
|
||||
<div id="confirm-to" class="text-xs break-all"></div>
|
||||
<div
|
||||
id="confirm-to-ens"
|
||||
class="text-xs text-muted hidden"
|
||||
></div>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<div class="text-xs text-muted">Amount</div>
|
||||
<div id="confirm-amount" class="font-bold"></div>
|
||||
<div
|
||||
id="confirm-amount-usd"
|
||||
class="text-xs text-muted"
|
||||
></div>
|
||||
</div>
|
||||
<div
|
||||
id="confirm-fee"
|
||||
class="mb-2 text-xs text-muted hidden"
|
||||
></div>
|
||||
<div id="confirm-warnings" class="mb-2 hidden"></div>
|
||||
<div
|
||||
id="confirm-errors"
|
||||
class="mb-2 border border-border border-dashed p-2 hidden"
|
||||
></div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
id="btn-confirm-send"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Send
|
||||
</button>
|
||||
<button
|
||||
id="btn-confirm-back"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Back
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
id="confirm-status"
|
||||
class="mt-2 border border-border p-1 hidden"
|
||||
></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 ============ -->
|
||||
<div id="view-receive" class="view hidden">
|
||||
<h2 class="font-bold mb-2">Receive</h2>
|
||||
|
||||
Reference in New Issue
Block a user