Implement eth_sendTransaction for dApp-initiated transactions

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.

src/popup/views/approval.js

@@ -1,11 +1,26 @@
-const { $, formatAddressHtml } = require("./helpers");
+const { $, formatAddressHtml, showView } = require("./helpers");
 const { state, saveState } = require("../../shared/state");
+const { formatEther } = require("ethers");
 
 const runtime =
     typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
 
 let approvalId = null;
 
+function showTxApproval(details) {
+    $("approve-tx-hostname").textContent = details.hostname;
+    $("approve-tx-from").textContent = state.activeAddress;
+    $("approve-tx-to").textContent =
+        details.txParams.to || "(contract creation)";
+    $("approve-tx-value").textContent =
+        formatEther(details.txParams.value || "0") + " ETH";
+    if (details.txParams.data && details.txParams.data !== "0x") {
+        $("approve-tx-data").textContent = details.txParams.data;
+        $("approve-tx-data-section").classList.remove("hidden");
+    }
+    showView("approve-tx");
+}
+
 function show(id) {
     approvalId = id;
     // Connect a port so the background detects if the popup closes
@@ -16,6 +31,10 @@ function show(id) {
             window.close();
             return;
         }
+        if (details.type === "tx") {
+            showTxApproval(details);
+            return;
+        }
         $("approve-hostname").textContent = details.hostname;
         $("approve-address").innerHTML = formatAddressHtml(
             state.activeAddress,
@@ -53,6 +72,25 @@ function init(ctx) {
         });
         window.close();
     });
+
+    $("btn-approve-tx").addEventListener("click", () => {
+        runtime.sendMessage({
+            type: "AUTISTMASK_TX_RESPONSE",
+            id: approvalId,
+            approved: true,
+            password: $("approve-tx-password").value,
+        });
+        window.close();
+    });
+
+    $("btn-reject-tx").addEventListener("click", () => {
+        runtime.sendMessage({
+            type: "AUTISTMASK_TX_RESPONSE",
+            id: approvalId,
+            approved: false,
+        });
+        window.close();
+    });
 }
 
 module.exports = { init, show };