diff options
Diffstat (limited to 'src/app.js')
| -rw-r--r-- | src/app.js | 160 |
1 files changed, 149 insertions, 11 deletions
@@ -2077,7 +2077,7 @@ function restoreAccountsState() { else { ui.screen = 'unlock'; render(); } return true; } - ui.screen = 'vault'; render(); return true; + ui.screen = 'vault'; ui.passkeyAsk = true; render(); return true; } const watch = loadWatchAccounts(); if (watch.length) { @@ -2096,6 +2096,17 @@ const LOCK_PW_KEY = 'btc-wallet-lockpw'; const lockPwAsked = () => { try { return !!localStorage.getItem(LOCK_PW_KEY); } catch { return true; } }; const markLockPwAsked = () => { try { localStorage.setItem(LOCK_PW_KEY, '1'); } catch {} }; let vaultPassword = null; // in memory once unlocked/set this session; cleared on lock +// Locked with a passkey instead of a password: the vault's password is then +// a secret only that passkey's PRF produces (passkey.js), and the blob names +// the credential to ask for. Held beside vaultPassword while it's in use. +let vaultPasskeyId = null; +const passkeySecret = (pw) => typeof pw === 'string' && pw.startsWith('passkey:'); +const vaultPasskey = () => (loadVaultBlob() || {}).passkey || null; +function sealVault(list, password) { + const b = encryptVault(list, password); + if (passkeySecret(password) && vaultPasskeyId) b.passkey = vaultPasskeyId; + return b; +} function loadVaultBlob() { try { return JSON.parse(localStorage.getItem(VAULT_KEY) || 'null'); } catch { return null; } @@ -2110,7 +2121,7 @@ function writeVault() { .map((a) => (a.xprv ? { label: a.label, xprv: a.xprv, network: a.network } : { label: a.label, mnemonic: a.mnemonic, passphrase: a.passphrase || '', network: a.network })); try { if (!list.length) localStorage.removeItem(VAULT_KEY); - else localStorage.setItem(VAULT_KEY, JSON.stringify(encryptVault(list, vaultPassword))); + else localStorage.setItem(VAULT_KEY, JSON.stringify(sealVault(list, vaultPassword))); } catch {} } @@ -2255,6 +2266,15 @@ function submitPw() { toast(t('pwChanged')); return; } + if (p.purpose === 'passkeyOn') { + let list; + try { list = decryptVault(loadVaultBlob(), p.v1 || ''); } catch { p.error = t('pwWrong'); render(); return; } + vaultPassword = p.v1 || ''; + mergeVaultList(list); + ui.pw = null; + enablePasskeyLock(); + return; + } if (p.purpose === 'lock') { if (!p.v1) { p.error = t('pwNeededToLock'); render(); return; } if (p.v1 !== p.v2) { p.error = t('pwMismatch'); render(); return; } @@ -2291,12 +2311,97 @@ function submitPw() { render(); } +// Lock with a passkey (fingerprint or face) instead of a password. The +// vault's wallets are re-sealed under the passkey's secret; from then on +// opening them takes the passkey, and the recovery words remain the way back +// if it's ever lost. `lockAfter`: the padlock's offer — lock once it's set. +async function enablePasskeyLock({ lockAfter = false } = {}) { + // what the vault holds now, under whatever opens it today + if (hasVault()) { + let list; + try { list = decryptVault(loadVaultBlob(), vaultPassword != null ? vaultPassword : ''); } catch { + ui.pw = { purpose: 'passkeyOn', mode: 'enter', v0: '', v1: '', v2: '', error: '' }; + render(); return; + } + mergeVaultList(list); + } + let made; + try { + const pass = await import('./passkey.js'); + made = await pass.lockPasskeyCreate(); + } catch (e) { + const pass = await import('./passkey.js').catch(() => null); + if (!(pass && pass.passkeyCancelled(e))) toast(t('passkeyLockFailed', { msg: (e && e.message) || String(e) }), 4000); + render(); return; + } + vaultPassword = made.secret; + vaultPasskeyId = made.id; + // a wallet that only lives in this tab joins the vault, or it couldn't come back + const active = activeAccount(); + if (active && active.type === 'full' && !active.provisional) active.persisted = true; + writeVault(); + persistAccounts(); + markLockPwAsked(); + ui.pw = null; + if (lockAfter) { softLock(); return; } + render(); + toast(t('passkeyLockOnToast')); +} +// Back to no lock at all (the padlock offers a password or the passkey +// again). Needs the passkey once, unless this session already holds it. +async function disablePasskeyLock() { + let secret = passkeySecret(vaultPassword) ? vaultPassword : null; + if (!secret) { + const s2 = await passkeyVaultSecret(); + if (!s2) return; + secret = s2; + } + let list; + try { list = decryptVault(loadVaultBlob(), secret); } catch { toast(t('pwWrong')); return; } + mergeVaultList(list); + vaultPassword = ''; + vaultPasskeyId = null; + writeVault(); + persistAccounts(); + render(); + toast(t('passkeyLockOffToast')); +} +// The fingerprint or face check: the vault's secret, or null (cancelled or +// failed — a failure is shown where the unlock was asked for). +async function passkeyVaultSecret() { + const id = vaultPasskey(); + if (!id) return null; + const pass = await import('./passkey.js'); + try { return await pass.lockPasskeyUnlock(id); } catch (e) { + if (!pass.passkeyCancelled(e)) { ui.vaultError = (e && e.message) || String(e); toast(ui.vaultError, 4000); render(); } + return null; + } +} +async function unlockVaultWithPasskey() { + ui.vaultError = ''; + const secret = await passkeyVaultSecret(); + if (!secret) return; + ui.vaultPw = secret; + unlockVault(); + ui.vaultPw = ''; +} +// The password prompts that only need the vault opened (save, forget, lock +// a stray wallet) take the passkey instead when that's what locks it. +async function submitPwWithPasskey() { + const p = ui.pw; + const secret = await passkeyVaultSecret(); + if (!secret || ui.pw !== p) return; + p.v1 = secret; + submitPw(); +} + // Try to decrypt the vault with the given password; on success, seed the // accounts (watch-only directory + the unlocked full wallets). Returns success. function attemptVaultUnlock(password) { let list; try { list = decryptVault(loadVaultBlob(), password); } catch { return false; } vaultPassword = password; + vaultPasskeyId = passkeySecret(password) ? vaultPasskey() : null; // Start from the durable directory (watch-only views of every known wallet), // then upgrade the vault-saved ones to spendable — so non-saved wallets still // appear (watch-only) instead of vanishing. @@ -2513,6 +2618,7 @@ function lock({ offerPassword = false } = {}) { for (const f of FEATURES) { try { f.stop && f.stop(); } catch {} } clearAccounts(); vaultPassword = null; + vaultPasskeyId = null; wallet.load({ mnemonic: '', passphrase: '', netName: getNetwork(), offline: false }); wallet.mnemonic = ''; // Wallets save themselves to this device without asking, under an empty @@ -2652,6 +2758,7 @@ function softLock() { _featuresInited = false; for (const f of FEATURES) { try { f.stop && f.stop(); } catch {} } vaultPassword = null; + vaultPasskeyId = null; accounts = watch.slice(); persistAccounts(); const cur = accounts.find((a) => a.id === keepId) || accounts[0]; @@ -2674,7 +2781,7 @@ function lockBtn() { if (attemptVaultUnlock('')) { const cur = accounts.find((a) => a.id === activeId) || accounts[0]; if (cur) activateAccount(cur, { fresh: true }); - } else { ui.justLocked = false; ui.screen = 'vault'; render(); } + } else { ui.justLocked = false; ui.screen = 'vault'; ui.passkeyAsk = true; render(); } } : () => softLock(), }, h('span', { style: 'font-size:15px;line-height:1;margin-right:6px' }, locked ? '\u{1F512}' : '\u{1F513}'), locked ? t('unlock') : t('lockWallet')); @@ -3289,7 +3396,7 @@ function accountsScreen() { h('button', { class: 'btn-block', onClick: signInAnother }, t('signInAnother')), lockBtn(), activeAccount() ? h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.logoutConfirm = true; render(); } }, t('logout')) : null, - hasVault() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null, + hasVault() && !vaultPasskey() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null, h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.confirmClear = true; render(); } }, t('clearAll')) ), h('button', { class: 'btn-ghost btn-block', onClick: () => goBack(() => { ui.screen = 'wallet'; }) }, t('back')) @@ -3486,10 +3593,24 @@ function securityCard() { return h('div', { class: 'card col', style: 'gap:8px' }, h('h3', {}, t('securityTitle')), lockBtn(), - hasVault() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null, + passkeyLockRow(), + hasVault() && !vaultPasskey() ? h('button', { class: 'btn-ghost btn-block', onClick: startChangePw }, t('changePassword')) : null, anon ? h('button', { class: 'btn-block', onClick: signInAnother }, t('signInAnother')) : null, anon ? h('button', { class: 'btn-ghost btn-block', onClick: () => { ui.logoutConfirm = true; render(); } }, t('logout')) : null); } +// Settings → Security: lock with a passkey, or say that it is and offer the +// way back. Only where the browser does passkeys at all. +function passkeyLockRow() { + if (vaultPasskey()) { + return h('div', { class: 'col', style: 'gap:6px' }, + h('div', { class: 'small muted' }, '\u{1F510} ' + t('passkeyLockOnNote')), + h('button', { class: 'btn-ghost btn-block', onClick: disablePasskeyLock }, t('passkeyLockOff'))); + } + if (typeof window === 'undefined' || !window.PublicKeyCredential || !navigator.credentials) return null; + return h('div', { class: 'col', style: 'gap:6px' }, + h('button', { class: 'btn-block', onClick: () => enablePasskeyLock() }, '\u{1F510} ' + t('passkeyLockBtn')), + h('div', { class: 'small muted' }, t('passkeyLockDesc'))); +} function accountSettingsScreen() { if (ui.pw) return h('div', { class: 'col', style: 'gap:16px' }, brandHeader(false), pwPromptCard()); if (ui.logoutConfirm) return logoutConfirmScreen(); @@ -3534,22 +3655,36 @@ function pwPromptCard() { const atLock = p.purpose === 'lock'; const newish = change || p.mode === 'set'; // entering a (new) password with confirm const atLockSave = p.purpose === 'locksave'; // locking, but the vault needs its password first + // opening the vault when a passkey, not a password, is what locks it + const byPasskey = p.mode === 'enter' && !change && p.purpose !== 'passkeyOn' && !!vaultPasskey(); return h('div', { class: 'card col' }, h('h3', {}, atLock ? t('lockPwTitle') : atLockSave ? t('lockWallet') : change ? t('changePassword') : p.mode === 'set' ? t('setPassword') : t('enterPassword')), h('p', { class: 'small muted', style: 'margin:0' }, - atLock ? t('lockPwDesc') : change ? t('changePasswordDesc') : atLockSave ? t('lockSaveDesc') : p.mode === 'set' ? t('setPasswordDesc') : t('enterPasswordDesc')), + atLock ? t('lockPwDesc') : change ? t('changePasswordDesc') : byPasskey ? t('passkeyEnterDesc') : atLockSave ? t('lockSaveDesc') : p.mode === 'set' ? t('setPasswordDesc') : t('enterPasswordDesc')), + // the padlock's offer: a fingerprint or face instead of a password + atLock && window.PublicKeyCredential ? h('button', { class: 'btn-primary btn-block', onClick: () => enablePasskeyLock({ lockAfter: true }) }, '\u{1F510} ' + t('passkeyLockBtn')) : null, + atLock && window.PublicKeyCredential ? h('div', { class: 'small muted', style: 'text-align:center' }, t('lockPwOrPassword')) : null, + byPasskey ? h('button', { class: 'btn-primary btn-block', onClick: submitPwWithPasskey }, '\u{1F510} ' + t('passkeyUnlock')) : null, change ? h('input', { type: 'password', placeholder: t('currentPassword'), value: p.v0, onInput: (e) => (p.v0 = e.target.value) }) : null, - h('input', { type: 'password', placeholder: newish ? t('passwordOptional') : t('password'), value: p.v1, onInput: (e) => (p.v1 = e.target.value) }), + byPasskey ? null : h('input', { type: 'password', placeholder: newish ? t('passwordOptional') : t('password'), value: p.v1, onInput: (e) => (p.v1 = e.target.value) }), newish ? h('input', { type: 'password', placeholder: t('confirmPassword'), value: p.v2, onInput: (e) => (p.v2 = e.target.value) }) : null, p.error && h('div', { class: 'notice err' }, p.error), h('div', { class: 'row gap6' }, h('button', { class: 'btn-ghost grow', onClick: cancelPw }, atLock ? t('lockPwSkip') : t('back')), - h('button', { class: 'btn-primary grow', onClick: submitPw }, newish ? t('save') : atLockSave ? t('lockAction') : t('unlock')) + byPasskey ? null : h('button', { class: (atLock ? 'btn-ghost' : 'btn-primary') + ' grow', onClick: submitPw }, newish ? t('save') : atLockSave ? t('lockAction') : t('unlock')) ) ); } +// A passkey-locked vault asks for the fingerprint as it opens — on the app's +// own start and on the padlock's tap, not right after you locked it; once, +// so a cancel leaves the button rather than a loop. function vaultScreen() { + const byPasskey = !!vaultPasskey(); + if (ui.passkeyAsk) { + ui.passkeyAsk = false; + if (byPasskey) setTimeout(() => { if (ui.screen === 'vault') unlockVaultWithPasskey(); }, 0); + } return h( 'div', { class: 'col', style: 'gap:16px' }, @@ -3558,8 +3693,8 @@ function vaultScreen() { h('div', { class: 'row gap6', style: 'align-items:center' }, h('span', { style: 'font-size:20px;line-height:1' }, '\u{1F512}'), h('h3', { style: 'margin:0' }, ui.justLocked ? t('lockedTitle') : t('unlockSaved'))), - h('p', { class: 'small muted', style: 'margin:0' }, ui.justLocked ? t('lockedDesc') : t('unlockSavedDesc')), - h('input', { type: 'password', placeholder: t('password'), value: ui.vaultPw, + h('p', { class: 'small muted', style: 'margin:0' }, byPasskey ? t('passkeyLockedDesc') : ui.justLocked ? t('lockedDesc') : t('unlockSavedDesc')), + byPasskey ? null : h('input', { type: 'password', placeholder: t('password'), value: ui.vaultPw, onInput: (e) => (ui.vaultPw = e.target.value), onKeyDown: (e) => { if (e.key === 'Enter') unlockVault(); } }), h('div', { class: 'row between', style: 'align-items:center;gap:10px' }, h('span', { class: 'small muted', style: 'white-space:nowrap;flex-shrink:0' }, t('unlockForLabel')), @@ -3569,7 +3704,10 @@ function vaultScreen() { selected: (ui.unlockFor != null ? ui.unlockFor : Number(localStorage.getItem(UNLOCK_FOR_KEY)) || 0) === o.ms, }, t(o.label))))), ui.vaultError && h('div', { class: 'notice err' }, ui.vaultError), - h('button', { class: 'btn-primary btn-block', onClick: unlockVault }, t('unlock')), + byPasskey + ? h('button', { class: 'btn-primary btn-block', onClick: unlockVaultWithPasskey }, '\u{1F510} ' + t('passkeyUnlock')) + : h('button', { class: 'btn-primary btn-block', onClick: unlockVault }, t('unlock')), + byPasskey ? h('div', { class: 'small muted', style: 'text-align:center' }, t('passkeyLostHint')) : null, h('button', { class: 'btn-ghost btn-block', onClick: skipVault }, loadWatchAccounts().length ? t('viewWithoutPassword') : t('useAnotherWallet')) ) |