Compare commits
1 Commits
30973616b9
...
feature/sh
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
78c050e1fa |
35
README.md
35
README.md
@@ -213,6 +213,22 @@ create an address with the same visible characters and trick the user into
|
||||
sending funds to it. Showing the complete identifier defeats this class of
|
||||
attack.
|
||||
|
||||
#### Clipboard Policy
|
||||
|
||||
AutistMask never clears or overwrites the user's clipboard. When sensitive data
|
||||
such as a private key is copied, it is the user's responsibility to manage their
|
||||
clipboard afterwards. We deliberately avoid auto-clearing the clipboard for two
|
||||
reasons:
|
||||
|
||||
1. **User expectations**: silently modifying the clipboard violates the
|
||||
principle of least surprise. The user initiated the copy and knows the
|
||||
content is sensitive.
|
||||
2. **Data safety**: the user may have copied something else important in the
|
||||
intervening time. A timed clipboard clear would destroy that unrelated data.
|
||||
|
||||
The warning shown before revealing a private key makes it clear that the key is
|
||||
sensitive and that clipboard management is the user's responsibility.
|
||||
|
||||
#### Data Model
|
||||
|
||||
The core hierarchy is **Wallets → Addresses**:
|
||||
@@ -316,15 +332,34 @@ transitions.
|
||||
- Balance list: ETH + tracked ERC-20 tokens (4 decimal places, USD inline).
|
||||
Each balance row is clickable → **AddressToken**
|
||||
- Send / Receive / + Token buttons
|
||||
- "Show private key" button
|
||||
- Transaction list (with ENS resolution for counterparties)
|
||||
- **Transitions**:
|
||||
- Tap balance row → **AddressToken** (for that token)
|
||||
- "Send" → **Send**
|
||||
- "Receive" → **Receive**
|
||||
- "+ Token" → **AddToken**
|
||||
- "Show private key" → **ShowPrivateKey**
|
||||
- Tap transaction row → **TransactionDetail**
|
||||
- "Back" → **Home**
|
||||
|
||||
#### ShowPrivateKey
|
||||
|
||||
- **When**: User clicked "Show private key" on AddressDetail.
|
||||
- **Elements**:
|
||||
- "Back" button
|
||||
- Title: "Display Private Key"
|
||||
- Warning box (lock + money icons) explaining the key controls funds and
|
||||
that the user is responsible for clipboard management
|
||||
- Password input
|
||||
- "Display Private Key" button (with lock + money icons)
|
||||
- After reveal: private key in a read-only well (monospace, select-all),
|
||||
Copy button, Done button
|
||||
- **Transitions**:
|
||||
- "Display Private Key" (correct password) → reveals key in-place
|
||||
- "Copy" → copies key to clipboard
|
||||
- "Done" / "Back" → **AddressDetail** (key cleared from DOM)
|
||||
|
||||
#### AddressToken
|
||||
|
||||
- **When**: User clicked a specific token balance on AddressDetail.
|
||||
|
||||
@@ -119,15 +119,6 @@
|
||||
Import private key
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-1 text-xs text-muted">
|
||||
Have an extended private key (xprv)?
|
||||
<button
|
||||
id="btn-add-wallet-import-xprv"
|
||||
class="underline cursor-pointer bg-transparent border-none text-fg text-xs font-mono p-0"
|
||||
>
|
||||
Import xprv
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ IMPORT PRIVATE KEY ============ -->
|
||||
@@ -179,55 +170,6 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- ============ IMPORT XPRV ============ -->
|
||||
<div id="view-import-xprv" class="view hidden">
|
||||
<button
|
||||
id="btn-import-xprv-back"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer mb-2"
|
||||
>
|
||||
< Back
|
||||
</button>
|
||||
<h2 class="font-bold mb-2">Import Extended Private Key</h2>
|
||||
<p class="mb-2">
|
||||
Paste your extended private key (xprv) below. This will
|
||||
import the HD wallet and scan for used addresses.
|
||||
</p>
|
||||
<div class="mb-2">
|
||||
<input
|
||||
type="password"
|
||||
id="import-xprv-key"
|
||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||
placeholder="xprv..."
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-2" id="import-xprv-password-section">
|
||||
<label class="block mb-1">Choose a password</label>
|
||||
<p class="text-xs text-muted mb-1">
|
||||
This password encrypts your key on this device. You will
|
||||
need it to send funds.
|
||||
</p>
|
||||
<input
|
||||
type="password"
|
||||
id="import-xprv-password"
|
||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-2" id="import-xprv-password-confirm-section">
|
||||
<label class="block mb-1">Confirm password</label>
|
||||
<input
|
||||
type="password"
|
||||
id="import-xprv-password-confirm"
|
||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
id="btn-import-xprv-confirm"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Import
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- ============ MAIN VIEW: ALL WALLETS & ADDRESSES ============ -->
|
||||
<div id="view-main" class="view hidden">
|
||||
<!-- active address headline -->
|
||||
@@ -365,6 +307,15 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<button
|
||||
id="btn-show-private-key"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer text-xs"
|
||||
>
|
||||
🔒 Show private key
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- transactions -->
|
||||
<div class="mt-3">
|
||||
<div class="border-b border-border pb-1 mb-1">
|
||||
@@ -376,6 +327,77 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ SHOW PRIVATE KEY ============ -->
|
||||
<div id="view-show-private-key" class="view hidden">
|
||||
<button
|
||||
id="btn-show-pk-back"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer mb-2"
|
||||
>
|
||||
< Back
|
||||
</button>
|
||||
<h2 class="font-bold mb-2">Display Private Key</h2>
|
||||
|
||||
<!-- password prompt section -->
|
||||
<div id="show-pk-prompt">
|
||||
<div
|
||||
class="border border-border border-dashed p-3 mb-3 text-xs"
|
||||
>
|
||||
<p class="mb-1">
|
||||
🔒💰 Your private key controls this
|
||||
address and all its funds. Anyone who has it can
|
||||
spend your tokens.
|
||||
</p>
|
||||
<p>
|
||||
Do not share it. Do not paste it into websites. If
|
||||
you copy it, you are responsible for clearing your
|
||||
clipboard when you are done.
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="block mb-1">Password</label>
|
||||
<input
|
||||
type="password"
|
||||
id="show-pk-password"
|
||||
class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
|
||||
placeholder="Enter your password"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
id="show-pk-error"
|
||||
class="text-xs mb-2 border border-border border-dashed p-1 hidden"
|
||||
></div>
|
||||
<button
|
||||
id="btn-show-pk-reveal"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
🔒💰 Display Private Key
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- revealed key section -->
|
||||
<div id="show-pk-key-well" class="hidden">
|
||||
<div
|
||||
class="bg-well p-3 mx-1 mb-3 break-all font-mono text-xs select-all"
|
||||
>
|
||||
<span id="show-pk-key-value"></span>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<button
|
||||
id="btn-show-pk-copy"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Copy
|
||||
</button>
|
||||
<button
|
||||
id="btn-show-pk-done"
|
||||
class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
|
||||
>
|
||||
Done
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ============ ADDRESS-TOKEN DETAIL VIEW ============ -->
|
||||
<div id="view-address-token" class="view hidden">
|
||||
<button
|
||||
|
||||
@@ -11,7 +11,6 @@ const home = require("./views/home");
|
||||
const welcome = require("./views/welcome");
|
||||
const addWallet = require("./views/addWallet");
|
||||
const importKey = require("./views/importKey");
|
||||
const importXprv = require("./views/importXprv");
|
||||
const addressDetail = require("./views/addressDetail");
|
||||
const addressToken = require("./views/addressToken");
|
||||
const send = require("./views/send");
|
||||
@@ -20,6 +19,7 @@ const txStatus = require("./views/txStatus");
|
||||
const transactionDetail = require("./views/transactionDetail");
|
||||
const receive = require("./views/receive");
|
||||
const addToken = require("./views/addToken");
|
||||
const showPrivateKey = require("./views/showPrivateKey");
|
||||
const settings = require("./views/settings");
|
||||
const settingsAddToken = require("./views/settingsAddToken");
|
||||
const approval = require("./views/approval");
|
||||
@@ -56,8 +56,8 @@ const ctx = {
|
||||
doRefreshAndRender,
|
||||
showAddWalletView: () => addWallet.show(),
|
||||
showImportKeyView: () => importKey.show(),
|
||||
showImportXprvView: () => importXprv.show(),
|
||||
showAddressDetail: () => addressDetail.show(),
|
||||
showPrivateKey: () => showPrivateKey.show(),
|
||||
showAddressToken: () => addressToken.show(),
|
||||
showAddTokenView: () => addToken.show(),
|
||||
showConfirmTx: (txInfo) => confirmTx.show(txInfo),
|
||||
@@ -212,9 +212,9 @@ async function init() {
|
||||
welcome.init(ctx);
|
||||
addWallet.init(ctx);
|
||||
importKey.init(ctx);
|
||||
importXprv.init(ctx);
|
||||
home.init(ctx);
|
||||
addressDetail.init(ctx);
|
||||
showPrivateKey.init(ctx);
|
||||
addressToken.init(ctx);
|
||||
send.init(ctx);
|
||||
confirmTx.init(ctx);
|
||||
|
||||
@@ -124,11 +124,6 @@ function init(ctx) {
|
||||
"click",
|
||||
ctx.showImportKeyView,
|
||||
);
|
||||
|
||||
$("btn-add-wallet-import-xprv").addEventListener(
|
||||
"click",
|
||||
ctx.showImportXprvView,
|
||||
);
|
||||
}
|
||||
|
||||
module.exports = { init, show };
|
||||
|
||||
@@ -261,6 +261,10 @@ function init(_ctx) {
|
||||
});
|
||||
|
||||
$("btn-add-token").addEventListener("click", ctx.showAddTokenView);
|
||||
|
||||
$("btn-show-private-key").addEventListener("click", () => {
|
||||
ctx.showPrivateKey();
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = { init, show };
|
||||
|
||||
@@ -16,6 +16,7 @@ const VIEWS = [
|
||||
"import-key",
|
||||
"main",
|
||||
"address",
|
||||
"show-private-key",
|
||||
"address-token",
|
||||
"send",
|
||||
"confirm-tx",
|
||||
|
||||
@@ -230,7 +230,7 @@ function render(ctx) {
|
||||
html += `<div>`;
|
||||
html += `<div class="flex justify-between items-center bg-section py-1 px-2" style="margin:0 -0.5rem">`;
|
||||
html += `<span class="font-bold cursor-pointer wallet-name underline decoration-dashed" data-wallet="${wi}">${wallet.name}</span>`;
|
||||
if (wallet.type === "hd" || wallet.type === "xprv") {
|
||||
if (wallet.type === "hd") {
|
||||
html += `<button class="btn-add-address border border-border px-1 hover:bg-fg hover:text-bg cursor-pointer text-xs" data-wallet="${wi}" title="Add another address to this wallet">+</button>`;
|
||||
}
|
||||
html += `</div>`;
|
||||
|
||||
@@ -1,106 +0,0 @@
|
||||
const { $, showView, showFlash } = require("./helpers");
|
||||
const { hdWalletFromXprv, isValidXprv } = require("../../shared/wallet");
|
||||
const { encryptWithPassword } = require("../../shared/vault");
|
||||
const { state, saveState } = require("../../shared/state");
|
||||
const { scanForAddresses } = require("../../shared/balances");
|
||||
|
||||
function show() {
|
||||
$("import-xprv-key").value = "";
|
||||
$("import-xprv-password").value = "";
|
||||
$("import-xprv-password-confirm").value = "";
|
||||
showView("import-xprv");
|
||||
}
|
||||
|
||||
function init(ctx) {
|
||||
$("btn-import-xprv-confirm").addEventListener("click", async () => {
|
||||
const xprv = $("import-xprv-key").value.trim();
|
||||
if (!xprv) {
|
||||
showFlash("Please enter your extended private key.");
|
||||
return;
|
||||
}
|
||||
if (!isValidXprv(xprv)) {
|
||||
showFlash("Invalid extended private key.");
|
||||
return;
|
||||
}
|
||||
let result;
|
||||
try {
|
||||
result = hdWalletFromXprv(xprv);
|
||||
} catch (e) {
|
||||
showFlash("Invalid extended private key.");
|
||||
return;
|
||||
}
|
||||
const { xpub, firstAddress } = result;
|
||||
const duplicate = state.wallets.find(
|
||||
(w) =>
|
||||
(w.type === "hd" || w.type === "xprv") &&
|
||||
w.addresses[0] &&
|
||||
w.addresses[0].address.toLowerCase() ===
|
||||
firstAddress.toLowerCase(),
|
||||
);
|
||||
if (duplicate) {
|
||||
showFlash("This key is already added (" + duplicate.name + ").");
|
||||
return;
|
||||
}
|
||||
const pw = $("import-xprv-password").value;
|
||||
const pw2 = $("import-xprv-password-confirm").value;
|
||||
if (!pw) {
|
||||
showFlash("Please choose a password.");
|
||||
return;
|
||||
}
|
||||
if (pw.length < 12) {
|
||||
showFlash("Password must be at least 12 characters.");
|
||||
return;
|
||||
}
|
||||
if (pw !== pw2) {
|
||||
showFlash("Passwords do not match.");
|
||||
return;
|
||||
}
|
||||
const encrypted = await encryptWithPassword(xprv, pw);
|
||||
const walletNum = state.wallets.length + 1;
|
||||
const wallet = {
|
||||
type: "xprv",
|
||||
name: "Wallet " + walletNum,
|
||||
xpub: xpub,
|
||||
encryptedSecret: encrypted,
|
||||
nextIndex: 1,
|
||||
addresses: [
|
||||
{ address: firstAddress, balance: "0.0000", tokenBalances: [] },
|
||||
],
|
||||
};
|
||||
state.wallets.push(wallet);
|
||||
state.hasWallet = true;
|
||||
await saveState();
|
||||
ctx.renderWalletList();
|
||||
showView("main");
|
||||
|
||||
// Scan for used HD addresses beyond index 0.
|
||||
showFlash("Scanning for addresses...", 30000);
|
||||
const scan = await scanForAddresses(xpub, state.rpcUrl);
|
||||
if (scan.addresses.length > 1) {
|
||||
wallet.addresses = scan.addresses.map((a) => ({
|
||||
address: a.address,
|
||||
balance: "0.0000",
|
||||
tokenBalances: [],
|
||||
}));
|
||||
wallet.nextIndex = scan.nextIndex;
|
||||
await saveState();
|
||||
ctx.renderWalletList();
|
||||
showFlash("Found " + scan.addresses.length + " addresses.");
|
||||
} else {
|
||||
showFlash("Ready.", 1000);
|
||||
}
|
||||
|
||||
ctx.doRefreshAndRender();
|
||||
});
|
||||
|
||||
$("btn-import-xprv-back").addEventListener("click", () => {
|
||||
if (!state.hasWallet) {
|
||||
showView("welcome");
|
||||
} else {
|
||||
ctx.renderWalletList();
|
||||
showView("main");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = { init, show };
|
||||
79
src/popup/views/showPrivateKey.js
Normal file
79
src/popup/views/showPrivateKey.js
Normal file
@@ -0,0 +1,79 @@
|
||||
const { $, showView, showFlash, showError, hideError } = require("./helpers");
|
||||
const { state } = require("../../shared/state");
|
||||
const { decryptWithPassword } = require("../../shared/vault");
|
||||
const { getPrivateKeyForAddress } = require("../../shared/wallet");
|
||||
|
||||
let ctx;
|
||||
let revealed = false;
|
||||
|
||||
function show() {
|
||||
revealed = false;
|
||||
$("show-pk-password").value = "";
|
||||
$("show-pk-key-well").classList.add("hidden");
|
||||
$("show-pk-key-value").textContent = "";
|
||||
$("show-pk-prompt").classList.remove("hidden");
|
||||
hideError("show-pk-error");
|
||||
showView("show-private-key");
|
||||
}
|
||||
|
||||
function init(_ctx) {
|
||||
ctx = _ctx;
|
||||
|
||||
$("btn-show-pk-back").addEventListener("click", () => {
|
||||
clearKey();
|
||||
ctx.showAddressDetail();
|
||||
});
|
||||
|
||||
$("btn-show-pk-reveal").addEventListener("click", async () => {
|
||||
const pw = $("show-pk-password").value;
|
||||
if (!pw) {
|
||||
showError("show-pk-error", "Please enter your password.");
|
||||
return;
|
||||
}
|
||||
|
||||
const wallet = state.wallets[state.selectedWallet];
|
||||
let decryptedSecret;
|
||||
try {
|
||||
decryptedSecret = await decryptWithPassword(
|
||||
wallet.encryptedSecret,
|
||||
pw,
|
||||
);
|
||||
} catch (_e) {
|
||||
showError("show-pk-error", "Wrong password.");
|
||||
return;
|
||||
}
|
||||
|
||||
const privateKey = getPrivateKeyForAddress(
|
||||
wallet,
|
||||
state.selectedAddress,
|
||||
decryptedSecret,
|
||||
);
|
||||
|
||||
revealed = true;
|
||||
$("show-pk-prompt").classList.add("hidden");
|
||||
$("show-pk-key-well").classList.remove("hidden");
|
||||
$("show-pk-key-value").textContent = privateKey;
|
||||
hideError("show-pk-error");
|
||||
});
|
||||
|
||||
$("btn-show-pk-copy").addEventListener("click", () => {
|
||||
const key = $("show-pk-key-value").textContent;
|
||||
if (key) {
|
||||
navigator.clipboard.writeText(key);
|
||||
showFlash("Copied!");
|
||||
}
|
||||
});
|
||||
|
||||
$("btn-show-pk-done").addEventListener("click", () => {
|
||||
clearKey();
|
||||
ctx.showAddressDetail();
|
||||
});
|
||||
}
|
||||
|
||||
function clearKey() {
|
||||
revealed = false;
|
||||
$("show-pk-key-value").textContent = "";
|
||||
$("show-pk-password").value = "";
|
||||
}
|
||||
|
||||
module.exports = { init, show };
|
||||
@@ -24,25 +24,6 @@ function hdWalletFromMnemonic(mnemonic) {
|
||||
return { xpub, firstAddress };
|
||||
}
|
||||
|
||||
function hdWalletFromXprv(xprv) {
|
||||
const node = HDNodeWallet.fromExtendedKey(xprv);
|
||||
if (!node.privateKey) {
|
||||
throw new Error("Not an extended private key (xprv).");
|
||||
}
|
||||
const xpub = node.neuter().extendedKey;
|
||||
const firstAddress = node.deriveChild(0).address;
|
||||
return { xpub, firstAddress };
|
||||
}
|
||||
|
||||
function isValidXprv(key) {
|
||||
try {
|
||||
const node = HDNodeWallet.fromExtendedKey(key);
|
||||
return !!node.privateKey;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function addressFromPrivateKey(key) {
|
||||
const w = new Wallet(key);
|
||||
return w.address;
|
||||
@@ -57,13 +38,21 @@ function getSignerForAddress(walletData, addrIndex, decryptedSecret) {
|
||||
);
|
||||
return node.deriveChild(addrIndex);
|
||||
}
|
||||
if (walletData.type === "xprv") {
|
||||
const node = HDNodeWallet.fromExtendedKey(decryptedSecret);
|
||||
return node.deriveChild(addrIndex);
|
||||
}
|
||||
return new Wallet(decryptedSecret);
|
||||
}
|
||||
|
||||
function getPrivateKeyForAddress(walletData, addrIndex, decryptedSecret) {
|
||||
if (walletData.type === "hd") {
|
||||
const node = HDNodeWallet.fromPhrase(
|
||||
decryptedSecret,
|
||||
"",
|
||||
BIP44_ETH_PATH,
|
||||
);
|
||||
return node.deriveChild(addrIndex).privateKey;
|
||||
}
|
||||
return decryptedSecret;
|
||||
}
|
||||
|
||||
function isValidMnemonic(mnemonic) {
|
||||
return Mnemonic.isValidMnemonic(mnemonic);
|
||||
}
|
||||
@@ -72,9 +61,8 @@ module.exports = {
|
||||
generateMnemonic,
|
||||
deriveAddressFromXpub,
|
||||
hdWalletFromMnemonic,
|
||||
hdWalletFromXprv,
|
||||
isValidXprv,
|
||||
addressFromPrivateKey,
|
||||
getSignerForAddress,
|
||||
getPrivateKeyForAddress,
|
||||
isValidMnemonic,
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user