@defdone/annon 0.1.0-alpha.1 → 0.1.0-alpha.3

package/dist/browser/login.js

@@ -1,37 +1,24 @@
 import { Buffer } from 'buffer';
-import { signInAccountOnly } from '../wallet/account-only.js';
-import { evmWallet } from '../wallet/wallet.js';
+import { pageElements, renderSummary, showStatus } from './login-dom.js';
+import { walletPicker } from './login-dropdown.js';
+import { expiryText } from './login-format.js';
+import { connected, SendUncertain, STATUS, walletFailure } from './login-status.js';
+import { approvalSteps } from './login-steps.js';
+import { describeRequest, technicalDetails } from './login-view.js';
+import { pageWallets } from './login-wallet.js';
 Object.assign(globalThis, { Buffer });
-const pair = document.getElementById('pair');
-const display = document.getElementById('action');
-const status = document.getElementById('status');
-const approve = document.getElementById('approve');
-const nearChoice = document.getElementById('near-wallet');
-const hotChoice = document.getElementById('near-wallet-hot');
-/** Signing-request chains the page can bind a NEAR wallet to. Anything else is refused. */
-const NEAR_NETWORKS = new Map([
-    ['near:mainnet', 'mainnet'],
-    ['near:testnet', 'testnet'],
-]);
-/** The selector's only RPC per network. The page CSP allows exactly these (browser-login.ts). */
-const NEAR_RPC = {
-    mainnet: 'https://free.rpc.fastnear.com',
-    testnet: 'https://test.rpc.fastnear.com',
-};
-/**
- * NEAR wallets offered on this page and the networks each is bound to. MyNearWallet is retired
- * and no longer connects to apps. HOT's selector module sends no network with its requests, so
- * it is offered for mainnet only and never loaded for another network.
- */
-const NEAR_WALLETS = new Map([
-    ['meteor-wallet', { name: 'Meteor Wallet', networks: ['mainnet', 'testnet'] }],
-    ['hot-wallet', { name: 'HOT Wallet', networks: ['mainnet'] }],
-]);
+const el = pageElements(document);
+const approve = el.approve;
+const cancel = document.getElementById('cancel');
 const fragment = new URLSearchParams(location.hash.slice(1));
 const redirected = location.pathname === '/callback';
 let capability = redirected ? '' : location.hash.slice(1);
 history.replaceState(null, '', location.pathname);
-const api = async (path, body) => {
+let paused = false;
+let finished = false;
+let pollTimer;
+const steps = approvalSteps(document, el);
+const api = async (path, body, accepted) => {
     const r = await fetch(path, {
         method: 'POST',
         headers: { authorization: `Bearer ${capability}`, 'content-type': 'application/json' },
@@ -42,11 +29,77 @@ const api = async (path, body) => {
     });
     if (!r.ok)
         throw new Error('Session expired or wallet result rejected. Return to the terminal.');
+    accepted?.();
     return r.json();
 };
-const used = new Set();
+/** Requests whose result went to the CLI, or that ended here: never signed again. */
+const done = new Set();
 const callbacks = new Map();
+const submitting = new Set();
+const wallets = pageWallets({
+    expect: (state, id) => callbacks.set(state, id),
+    forget: (state) => callbacks.delete(state),
+    sending: async (id) => {
+        // The wallet may broadcast from now on: this request is never attempted again here, and the
+        // CLI records it before the wallet is called.
+        done.add(id);
+        await api('/api/report', { id, reason: 'send_started' });
+    },
+});
 let current;
+let expiry;
+let busy = false;
+const status = (s) => showStatus(el, s);
+const picker = walletPicker(document, () => controls());
+const walletId = () => picker.value();
+/** Buttons and wallet choice follow the request: usable only while it is open and idle. */
+function controls() {
+    const q = current;
+    const open = !!q && !done.has(q.id) && Date.now() < q.expiresAt;
+    approve.disabled = !open || busy;
+    if (cancel) {
+        cancel.hidden = !open;
+        cancel.disabled = busy;
+    }
+    // No wallet switch while a wallet is open or once the request is finished or sent.
+    picker.setLocked(!open || busy);
+    approve.textContent =
+        q && wallets.needsConnect(q, walletId()) ? 'Connect wallet' : 'Review in wallet';
+}
+async function submit(id, result) {
+    if (submitting.has(id))
+        return;
+    submitting.add(id);
+    paused = true;
+    clearTimeout(pollTimer);
+    done.add(id);
+    status(STATUS.verifying);
+    controls();
+    try {
+        let accepted = false;
+        try {
+            const next = await api('/api/result', { id, result, follow: true }, () => {
+                accepted = true;
+                steps.finish();
+                finished = true;
+                status(STATUS.signed);
+            });
+            if (next.action && next.action.id !== id) {
+                show(next.action);
+            }
+        }
+        catch (error) {
+            if (!accepted)
+                throw error;
+            status(STATUS.signed);
+        }
+        paused = false;
+        pollTimer = setTimeout(() => void poll(), 1000);
+    }
+    catch {
+        status(STATUS.rejected);
+    }
+}
 if (redirected) {
     // Only a per-action opaque nonce leaves this origin. The capability stays in the opener.
     window.opener?.postMessage({
@@ -58,7 +111,7 @@ if (redirected) {
             signature: fragment.get('signature'),
         },
     }, location.origin);
-    status.textContent = 'Proof returned to the approval window. Return to your terminal.';
+    status(STATUS.redirected);
 }
 else {
     window.addEventListener('message', (event) => {
@@ -68,149 +121,108 @@ else {
         if (!id)
             return;
         callbacks.delete(event.data.state);
-        void api('/api/result', { id, result: event.data.result })
-            .then(() => {
-            status.textContent = 'Proof verified. Return to your terminal.';
-        })
-            .catch((e) => {
-            status.textContent = e.message;
-        });
+        void submit(id, event.data.result);
     });
 }
+/** Shows the CLI's current request; a finished one stays on screen with its outcome. */
+function show(q, sendStarted = false) {
+    if (q && q.id !== current?.id) {
+        current = q;
+        finished = false;
+        steps.start();
+        expiry = renderSummary(document, el, describeRequest(q), technicalDetails(q));
+        el['wallet-field'].hidden = !q.operation.startsWith('near.');
+        picker.setDisabled('hot-wallet', q.chain !== 'near:mainnet');
+        status(wallets.needsConnect(q, walletId()) ? STATUS.connect : STATUS.ready);
+    }
+    const last = current;
+    // A send started from an earlier load of this page: the wallet may have broadcast it.
+    if (last && q && sendStarted && !done.has(last.id)) {
+        done.add(last.id);
+        status({ tone: 'error', text: walletFailure(new SendUncertain()).text });
+    }
+    if (!last || !expiry) {
+        status(STATUS.waitingCli);
+    }
+    else {
+        expiry.textContent = expiryText(last.expiresAt, Date.now());
+        const expired = Date.now() >= last.expiresAt;
+        // The CLI dropped the request (expired, cancelled or session over) before a result was sent.
+        if (!done.has(last.id) && (!q || expired)) {
+            done.add(last.id);
+            status(expired ? STATUS.expired : STATUS.ended);
+        }
+    }
+    controls();
+}
 async function poll() {
+    if (paused)
+        return;
     if (!capability) {
-        status.textContent = 'Open the exact URL printed by your CLI.';
+        status(STATUS.noCapability);
         return;
     }
     try {
         const r = await api('/api/action');
-        pair.textContent = `Pairing code: ${r.pairingCode}. Match this with your terminal.`;
-        current = r.action ?? undefined;
-        display.textContent = current ? JSON.stringify(current, null, 2) : 'Waiting for the CLI…';
-        approve.disabled = !current || used.has(current.id);
-        if (hotChoice)
-            hotChoice.disabled =
-                current?.chain?.startsWith('near:') === true && current.chain !== 'near:mainnet';
-        setTimeout(() => {
+        if (paused)
+            return;
+        el.pair.textContent = String(r.pairingCode);
+        show(r.action ?? undefined, r.sendStarted === true);
+        pollTimer = setTimeout(() => {
             void poll();
         }, 1000);
     }
     catch (e) {
-        status.textContent = e.message;
+        if (paused || finished)
+            return;
+        status({ tone: 'error', text: e.message });
         capability = '';
         approve.disabled = true;
     }
 }
 approve.onclick = async () => {
     const q = current;
-    if (!q || used.has(q.id) || Date.now() >= q.expiresAt)
+    if (!q || busy || done.has(q.id) || Date.now() >= q.expiresAt)
         return;
-    used.add(q.id);
-    approve.disabled = true;
+    busy = true;
+    controls();
+    status(STATUS.wallet);
     try {
-        let result;
-        if (q.operation.startsWith('evm.')) {
-            const provider = window.ethereum;
-            if (!provider)
-                throw new Error('Install an injected EVM wallet.');
-            const accounts = (await provider.request({ method: 'eth_requestAccounts' }));
-            const address = q.account || accounts[0];
-            if (!address)
-                throw new Error('No account');
-            const chain = await provider.request({ method: 'eth_chainId' });
-            if (`eip155:${BigInt(String(chain))}` !== q.chain)
-                throw new Error(`Select ${q.chain} in your wallet.`);
-            const wallet = evmWallet(provider, address.toLowerCase());
-            result =
-                q.operation === 'evm.personalSign'
-                    ? {
-                        signature: (await wallet.authorize(q.payload.message))?.sig ?? '',
-                        account: wallet.identity.id,
-                    }
-                    : { signature: await wallet.signTypedData(q.payload) };
-        }
-        else {
-            const networkId = NEAR_NETWORKS.get(q.chain);
-            if (!networkId)
-                throw new Error(`Browser NEAR wallets support near:mainnet and near:testnet, not ${q.chain}.`);
-            const id = nearChoice?.value || 'meteor-wallet';
-            const offered = NEAR_WALLETS.get(id);
-            if (!offered)
-                throw new Error('Unknown NEAR wallet');
-            if (!offered.networks.includes(networkId))
-                throw new Error(`${offered.name} is offered for near:mainnet only. Pick Meteor Wallet.`);
-            // Only the chosen wallet is loaded, on first use: the page starts without wallet code
-            // touching storage or listeners, and a refused wallet never runs.
-            const [{ setupWalletSelector }, module] = await Promise.all([
-                import('@near-wallet-selector/core'),
-                id === 'hot-wallet'
-                    ? import('@near-wallet-selector/hot-wallet').then((m) => m.setupHotWallet())
-                    : import('@near-wallet-selector/meteor-wallet').then((m) => m.setupMeteorWallet()),
-            ]);
-            const selector = await setupWalletSelector({
-                network: networkId,
-                fallbackRpcUrls: [NEAR_RPC[networkId]],
-                modules: [module],
-            });
-            const wallet = await selector.wallet(id);
-            const accounts = await signInAccountOnly(wallet);
-            const account = q.account || accounts[0]?.accountId;
-            if (!account || !accounts.some((a) => a.accountId === account))
-                throw new Error('Select the requested NEAR account.');
-            if (q.operation === 'near.nep413') {
-                if (!wallet.signMessage)
-                    throw new Error('NEP-413 unavailable');
-                const p = q.payload;
-                const state = crypto.randomUUID();
-                callbacks.set(state, q.id);
-                const signed = await wallet.signMessage({
-                    ...p,
-                    nonce: Buffer.from(p.nonce),
-                    state,
-                });
-                if (!signed)
-                    return; // redirect wallets: /callback forwards the fragment
-                callbacks.delete(state);
-                result = signed;
-            }
-            else {
-                const p = q.payload;
-                const outcome = await wallet.signAndSendTransaction({
-                    signerId: account,
-                    receiverId: p.receiverId,
-                    // Selector v10 passes Borsh Action structs through to its transaction encoder.
-                    actions: [
-                        {
-                            functionCall: {
-                                methodName: p.method,
-                                args: Buffer.from(JSON.stringify(p.args)),
-                                gas: BigInt(p.gas),
-                                deposit: BigInt(p.deposit),
-                            },
-                        },
-                    ],
-                });
-                if (!outcome)
-                    return;
-                result = { txHash: outcome.transaction.hash };
-            }
-        }
-        await api('/api/result', { id: q.id, result });
-        status.textContent = 'Verified. Return to the terminal.';
+        const outcome = await wallets.run(q, walletId());
+        busy = false;
+        if (outcome.kind === 'connected')
+            status(connected(outcome.account));
+        else if (outcome.kind === 'result')
+            await submit(q.id, outcome.result);
     }
     catch (e) {
-        status.textContent = e.message;
+        // One click per attempt, never retried here: the person may try this request again until it
+        // expires. The CLI hears only a fixed reason name.
+        const failure = walletFailure(e);
+        status({ tone: 'error', text: failure.text });
+        void api('/api/report', { id: q.id, reason: failure.reason }).catch(() => { });
     }
     finally {
-        approve.disabled = true;
+        busy = false;
+        controls();
     }
 };
+if (cancel)
+    cancel.onclick = () => {
+        const q = current;
+        if (!q || busy || done.has(q.id))
+            return;
+        done.add(q.id);
+        controls();
+        status({ tone: 'error', text: 'Cancelled. Return to the terminal.' });
+        void api('/api/report', { id: q.id, reason: 'cancelled' }).catch(() => { });
+    };
 if (!redirected) {
     void (async () => {
         if (!capability)
             capability = (await api('/api/bootstrap')).capability;
         await poll();
     })().catch((e) => {
-        status.textContent = e.message;
+        status({ tone: 'error', text: e.message });
     });
 }