Complete rewrite of the Screen Map section documenting all 17 views:
Welcome, Home, AddWallet, ImportKey, AddressDetail, AddressToken,
Send, ConfirmTx, WaitTx, SuccessTx, ErrorTx, Receive,
TransactionDetail, AddToken, Settings, SiteApproval, TxApproval.
Each view documents its elements (with display details like blockies,
color dots, etherscan links, formatting) and all state transitions
with their destination screens and conditions.
After broadcast, the user is taken to a full-screen wait view showing
the amount, recipient, tx hash (copyable + etherscan link), and a
count-up timer. The view polls every 10 seconds for confirmation.
On confirmation: navigates to success screen showing block number,
tx hash, and a Done button that returns to the address view.
On 60-second timeout or error: navigates to error screen with the
failure message, tx hash (if available), and Done button.
Replaces the previous inline confirm-status div that was crammed
onto the confirmation page.
Receive view: address now shows color dot and etherscan link,
matching every other address display in the app.
Send view "From": address now includes etherscan link alongside
the existing color dot.
Send view "What to send" (ERC-20 from token view): shows token
symbol as bold heading, then full contract address below with
color dot, copy-on-click, and etherscan link.
Approval views: tx approval From/To addresses now show color
dots and etherscan links instead of bare text. Site approval
address adds etherscan link. Tx approval value uses 4 decimal
places consistent with all other amount displays.
Home tx list: row padding changed from py-1 to py-2, matching
addressDetail and addressToken transaction lists.
From and To addresses now render with 48px blockie identicons,
color dots, and etherscan links — matching the transaction detail
view pattern. USD estimates for amount, balance, and network fee
are shown in parentheses after the value on the same line, not on
a separate line below.
The confirmation page now shows:
- Transaction type (Native ETH transfer vs ERC-20 token transfer)
- Full ERC-20 token contract address with etherscan link
- Token symbol throughout (not raw contract address)
- Current balance of the token being sent, with USD value
- Estimated network fee in ETH and USD (fetched async)
- USD value for ERC-20 token amounts (not just ETH)
- Insufficient balance errors for ERC-20 tokens
Also implements actual ERC-20 token transfers via the token contract's
transfer() function, rather than only supporting native ETH sends.
Read token from state.selectedToken when set, falling back to the
select element. This ensures the correct token balance is shown even
when the select dropdown is hidden or its value didn't take because
the token was filtered out by renderSendTokenSelect.
When sending from the address-token view, show the token symbol as
plain text instead of a disabled dropdown. ERC-20 tokens include an
etherscan link to the contract address. The dropdown is restored when
navigating back or entering send from other views.
The warning about only sending ERC-20 tokens on the Ethereum network
belongs on the receive page where the QR code is shown, not on the
token detail view. Non-token receive flows hide the warning.
Clicking a token balance on the address detail view navigates to a
focused view showing only that token's transactions. Send pre-selects
and locks the token dropdown, Receive shows an ERC-20 warning for
non-ETH tokens, and all back buttons return to the correct parent view.
Show a confirmation popup with tx details (from, to, value, data) and
password prompt when a dApp calls eth_sendTransaction. Sign and broadcast
the transaction in the background, returning the tx hash to the dApp.
- Remove mb-1 from Recent Transactions header (wallet headers have
no bottom margin, so this should match)
- Remove mb-3 wrapper from wallet sections (section header bg
provides the visual break, extra margin created uneven gaps)
- Change tx row padding from py-2 to py-1 to match address rows
Add --color-section (#dddddd) distinct from --color-well (#f5f5f5).
Section headers on the home screen use bg-section so they stand out
as visual dividers rather than blending with the price well.
Address titles now use wallet name instead of wallet index (e.g.
"Wallet 1 — Address 2" instead of "Address 1.2"). This applies to
the address detail page title, the home address labels, and the
addressTitle() helper used on confirmation pages.
Section dividers on the home screen are now full-width grey
background stripes instead of horizontal rules, visually breaking
the page into wallet sections and a recent transactions section.
Wallet and Recent Transactions headings now use border-border-light
for their bottom rule. Thick 2px black horizontal rules separate
wallet sections from each other and from the transactions section,
with generous vertical spacing.
Fetch transactions for every address across all wallets in parallel,
merge and deduplicate by hash, apply anti-poisoning filters, sort by
block number, and display the top 25 below the wallet list. Clicking
a transaction navigates to the address detail page for the relevant
address. Shows "Loading..." placeholder to prevent layout shift.
Blockies now appear above the from/to addresses on a separate line,
with color dots restored inline next to the address text. Increased
spacing between transaction detail fields from mb-2 to mb-3.
Show a 48px pixelated blockie (same style as Etherscan) centered
above the wallet title on the address detail page. Uses
ethereum-blockies-base64 which generates a base64 PNG from the
address. Replaces the previously added @metamask/jazzicon.
The "Scanning for addresses..." flash had a 30-second timeout and was
never cleared on completion. Now shows "Found N addresses." when
multiple are found, or briefly shows "Ready." for single-address
wallets.
Remove border and padding from the info button, use dashed underline
text style instead. This saves enough horizontal space that the full
address no longer wraps.
Both elements now have min-height and placeholder content so they
reserve vertical space before API data arrives, preventing layout
jumps when prices load. This follows the No Layout Shift policy
in the README.
Clicking an address row now makes it the active address (bold title,
updates headline and active address display, broadcasts to dapps).
The [info] button on each row opens the address detail page. This
replaces the previous [ ]/ACTIVE toggle.
The address now sits on its own line with no other elements beside it,
followed by an etherscan external link icon. The USD total value moves
to a separate line below.
Headline shows active address ETH balance with ETH-only USD value
in parentheses. Small "Total:" subtitle below includes ETH + token
values. A centered well between Send/Receive buttons and the wallet
list displays the current ETH price in USD.
Replace [select] with [ ] to avoid wrapping the full address line.
ACTIVE label stays as-is for discoverability. Show the currently
active address (full, untruncated, with color dot) above the Send
and Receive buttons on the home screen.
Each address now shows: title on its own line, full untruncated
address with ACTIVE/select marker on the next line, USD total
right-aligned on the next line, then token balances below. The
wallet rename input now fills the available width.
Click the wallet name on the home screen to edit it inline. The name
turns into a text input; press Enter or click away to save, Escape
to cancel. The dashed underline on the name indicates it is editable.
Add debugFetch wrapper in log.js that logs method, URL, and body on
request, and status code on response. Replace all fetch() calls
across balances, transactions, tokens, background RPC proxy, and
settings validation with debugFetch.
Add showZeroBalanceTokens setting (default: on). When enabled,
balanceLinesForAddress merges state.trackedTokens with the address's
tokenBalances, showing 0.0000 lines for tracked tokens that have no
balance on that address. This gives users visibility into all tokens
they're watching across all addresses.
From address, to address, and tx hash are now clickable to copy.
Each also has a small box-arrow icon linking to the corresponding
etherscan page. ENS names and full addresses are both copyable.
Add more vertical spacing between checkboxes in the Token Spam
Protection well. Change the gwei threshold from a number input
(with spinner arrows) to a plain text input with numeric keyboard
hint.
Address poisoning attacks also use real native ETH dust transfers
(e.g. 1 gwei) from look-alike addresses. Token-level filters cannot
catch these. Add a configurable dust threshold (default 100,000 gwei
/ 0.0001 ETH) that hides transactions below the threshold from
history. The threshold is editable in Settings and the filter can be
disabled entirely. Document the specific attack tx in the README.
Three layers of defense against address poisoning attacks:
1. Known symbol verification: tokens claiming a symbol from the
hardcoded top-250 list (e.g. "ETH", "USDT") but from an
unrecognized contract are identified as spoofs and always hidden.
Their contract addresses are auto-added to the fraud blocklist.
2. Low-holder filtering: tokens with <1000 holders are hidden from
both transaction history and the send token selector. Controlled
by the "Hide tokens with fewer than 1,000 holders" setting.
3. Fraud contract blocklist: a persistent local list of detected
fraud contract addresses. Transactions involving these contracts
are hidden. Controlled by the "Hide transactions from detected
fraud contracts" setting.
Both settings default to on and can be disabled in Settings.
Fetching and filtering are separated: fetchRecentTransactions returns
raw data, filterTransactions is a pure function applying heuristics.
Token holder counts are now passed through from the Blockscout API.
Detail the specific attack observed against our test address: a fake
ERC-20 contract emitting spoofed Transfer events to plant a look-alike
scam address in transaction history. Document all planned defenses:
known token symbol verification, low-holder filtering, fraud contract
blocklist, send-side filtering, and the principle that all filters are
user-configurable.
Once a transaction is successfully broadcast: disable the send button
to prevent double-sends, immediately show an etherscan link for the
pending tx, and display a live elapsed-time counter that updates every
second until confirmation arrives.
Add addressTitle() helper that looks up an address across all wallets
and returns its title (e.g. "Address 1.2"). The confirm page now shows
titles for both sender and receiver when they belong to our wallet.
formatAddressHtml gains an optional title parameter shown above the
full address, alongside any ENS name.
Use action.openPopup() to show the approval in the toolbar popup,
which is anchored to the browser window and cannot trigger a macOS
Space switch. Falls back to a separate window if openPopup() is
unavailable. A port connection detects when the popup is dismissed
without a response, and the popup URL is reset to the main UI after
every approval resolution.
Use getLastFocused to find the current Chrome window and position the
approval popup centered over it. This keeps the popup on the same
macOS virtual desktop instead of switching Spaces.
When switching addresses, reject and close any open approval popup
windows so their promises don't hang forever. Without this, stale
pending approvals from automatic dapp reconnection attempts block
future connection requests.
Non-remembered approvals should not survive switching to a different
address and back. Wipe connectedSites when broadcasting
accountsChanged so temporary approvals require re-prompting.
When the active address changes, each tab now receives either the new
address (if permitted) or an empty array (if not). This prevents dapps
from seeing an address they have no permission for, which caused them
to break.
allowedSites and deniedSites are now objects keyed by address instead
of flat arrays, so approving a site for one address no longer grants
access for all addresses. Old flat-array data is discarded on load.
Settings view collects unique hostnames across all addresses and
deleting removes the site from every address.
The Allow/Deny buttons did nothing because approval.init(ctx) was
called after the early return for approval mode, so listeners were
never attached. Move it before the check.
Rename view from "approve" to "approve-site" to avoid ambiguity with
future transaction approval. Space Allow and Deny buttons apart with
justify-between to prevent misclicks.
Move renderSendTokenSelect to send.js so both the main view and
address detail view call it before navigating to send. Without it,
the token dropdown was stale and updateSendBalance had no context.
Scanning: check all gap-limit addresses in parallel per batch instead
of sequentially. For a wallet with 1 used address this reduces from
12 sequential RPC round-trips to 1 parallel batch + 1 small follow-up.
Display: add shared formatAddressHtml(address, ensName, maxLen) and
escapeHtml() to helpers.js. Use them in confirm-tx (was missing color
dot entirely) and approval view. Remove duplicate escapeHtml from
addressDetail.js.
- Add activeAddress, allowedSites, deniedSites, rememberSiteChoice to
persisted state
- Replace auto-connect with permission checks: allowed sites connect
automatically, denied sites are rejected, unknown sites trigger an
approval popup
- Add approval popup UI with hostname display, active address preview,
remember checkbox, and allow/deny buttons
- Add ACTIVE/[select] indicator on address rows in the main view to
set the active web3 address
- Add allowed/denied site list management in settings with delete buttons
- Broadcast accountsChanged to connected dapps when active address changes
- Handle approval window close as implicit denial
Move truncateMiddle to helpers.js for reuse. Shorten displayed addresses
by 2 characters wherever a dot is shown: home view (40 char max), tx list
(maxAddr - 2), and address detail container (40ch width).
Deterministic colored dots derived from address bytes (16-color palette)
displayed before every address. ENS reverse resolution for transaction
counterparties with 12-hour localStorage cache.
- Transaction values now use exactly 4 decimal places (was 6),
matching balance display everywhere else
- Transaction detail view shows "2026-02-25 15:04:23 (23 days ago)"
instead of just the ISO date
- Added Display Consistency policy to README
- Rebuilt tx list rendering using innerHTML instead of createElement
- scrollbar-gutter: stable on body to prevent content shift
- max-width:42ch instead of width:42ch to prevent horizontal overflow
- overflow-x:hidden on body and #app
Left-side spans (age, address) get tailwind truncate class so they
can't push the row wider than its container. Right-side spans (direction,
amount) get shrink-0 so they keep their full text. Also added
overflow-hidden on #tx-list container.
The 42ch fixed-width spans with shrink-0 prevented flex from shrinking
them when the container was narrower, causing horizontal scrolling.
Also added overflow-x: hidden on body and #app as a safety net.
For every character beyond 10 in the amount string (e.g. "17.1900 USDT"
is 12 chars, 2 excess), remove that many characters from the middle of
the counterparty address, replaced with an ellipsis. Hover shows the
full address; clicking goes to tx detail which also shows it in full.
Prevents the address from wrapping onto a second line.
Transaction list entries are now two lines with more spacing:
- Line 1: humanized age (hover for ISO datetime) + direction (Sent/Received)
- Line 2: counterparty address + amount with symbol
- Clickable rows navigate to transaction detail view
Transaction detail view (placeholder) shows:
- Status, time, amount, from, to, transaction hash
- Back button returns to address detail
Also added "transaction" to VIEWS list in helpers.
Blockscout v2 API rejects the `limit` query parameter on
/transactions and /token-transfers endpoints (returns 422).
Remove it and slice results client-side instead.
Major changes:
- Fetch token balances and tx history from Blockscout API (configurable)
- Remove manual token discovery (discoverTokens) in favor of Blockscout
- HD address gap scanning on mnemonic import
- Duplicate mnemonic detection on wallet add
- EIP-6963 multi-wallet discovery + selectedAddress updates in inpage
- Two-tier balance refresh: 10s while popup open, 60s background
- Fix $0.00 flash before prices load (return null when no prices)
- No-layout-shift: min-height on total value element
- Aligned balance columns (42ch address width, consistent USD column)
- All errors use flash messages instead of off-screen error divs
- Settings gear in global title bar, add-wallet moved to settings pane
- Settings wells with light grey background, configurable Blockscout URL
- Consistent "< Back" buttons top-left on all views
- Address titles (Address 1.1, 1.2, etc.) on main and detail views
- Send view shows current balance of selected asset
- Clickable affordance policy added to README
- Shortened mnemonic backup warning
- Fix broken background script constant imports
Split popup/index.js (784 lines) into focused modules:
- shared/state.js: state management, storage persistence
- shared/wallet.js: mnemonic gen, HD derivation, signing
- shared/prices.js: price cache (5min TTL), USD formatting,
value aggregation (address → wallet → total)
- shared/balances.js: ETH + ERC-20 balance cache (60s TTL),
ENS lookup, token contract metadata lookup
- shared/vault.js: unchanged (libsodium encryption)
- shared/tokens.js: unchanged (token list + CoinDesk client)
- popup/index.js: view switching and event wiring only
Token tracking is now app-wide: trackedTokens stored in state,
balances fetched for all tracked tokens across all addresses.
Add Token now calls the real contract to read name/symbol/decimals.
Total portfolio value shown in 2x type on Home screen.
Total USD value displayed in 2x type above wallet list on Home.
Value aggregation: getAddressValueUsd (ETH + all tokens) →
getWalletValueUsd → getTotalValueUsd. Price API cached for 5
minutes, balance fetches cached for 60 seconds. Both caches
are app-wide — repeated calls to refreshPrices/refreshBalances
are no-ops within the TTL.
Move "AutistMask by @sneak" to a global title bar that appears
on every screen. Per-view headings demoted to h2 sub-headings.
Settings button moved to bottom of main view alongside Add
wallet. In DEBUG mode, the red banner now shows the current
screen name in parentheses (e.g. "DEBUG / INSECURE (main)").
Three-part architecture:
- inpage.js: creates window.ethereum in page context with
request(), on(), send(), sendAsync(), enable() methods.
Sets isMetaMask=true for compatibility.
- content/index.js: bridge between page and extension via
postMessage (page<->content) and runtime.sendMessage
(content<->background).
- background/index.js: handles RPC routing. Proxies read-only
methods (eth_call, eth_getBalance, etc.) to configured RPC.
Handles eth_requestAccounts (auto-connect for now),
wallet_switchEthereumChain (mainnet only), and returns
informative errors for unimplemented signing methods.
Manifests updated with web_accessible_resources for inpage.js.
Build updated to bundle inpage.js as a separate output file.
Shows the top 25 tokens by market cap as clickable buttons
below the contract address input. Clicking a token fills in
its contract address automatically.
vault.js: Argon2id key derivation + XSalsa20-Poly1305 encryption
via libsodium-wrappers-sumo. No raw crypto primitives.
Wallet creation now requires a password. The mnemonic or private
key is encrypted before storage — only the ciphertext blob
(salt, nonce, ciphertext) is persisted. The plaintext secret
is never stored.
Sending requires the password to decrypt the secret, derive
the signing key, and construct the transaction. Wrong password
is caught and reported.
Send: stores mnemonic/private key with wallet data, derives
signing key from mnemonic + address index via ethers HDNodeWallet,
constructs transaction with parseEther, broadcasts via
sendTransaction, waits for confirmation, shows block number
and tx hash. ENS resolution in To field preserved.
Receive: QR code rendered to canvas via qrcode library (1.5.4).
Shows scannable QR above the full address text.
README updated with qrcode dependency and TODO progress.
Full screen map with iOS-style stack navigation: Welcome, Home,
AddWallet, ImportKey, AddressDetail, Send, Receive, AddToken,
Settings, Approval. Each screen documents its elements and
transitions. TODO reorganized into Done, Wallet Management,
Sending, Receiving, Display, Tokens, Testing, and Post-MVP.
External Services updated to include CoinDesk price API.
tokens.js: ~150 ERC-20 tokens ordered by market cap with
getTopTokenSymbols(n) and getTopTokenPrices(n) (errors if n>30).
Price fetching uses CoinDesk CADLI API. Popup now shows USD
values next to ETH balances in wallet list and address detail.
Prices and balances fetched in parallel on popup open.
sneak