Add Send and Receive buttons to main view using active address

src/popup/index.html

@@ -178,6 +178,22 @@
                     class="text-2xl font-bold mb-2 min-h-[2rem]"
                 ></div>
 
+                <!-- quick actions for active address -->
+                <div class="flex gap-2 mb-3">
+                    <button
+                        id="btn-main-send"
+                        class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer flex-1"
+                    >
+                        Send
+                    </button>
+                    <button
+                        id="btn-main-receive"
+                        class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer flex-1"
+                    >
+                        Receive
+                    </button>
+                </div>
+
                 <!-- wallet list -->
                 <div id="wallet-list"></div>
             </div>

src/popup/views/home.js

@@ -6,7 +6,9 @@ const {
     addressDotHtml,
     truncateMiddle,
 } = require("./helpers");
-const { state, saveState } = require("../../shared/state");
+const { state, saveState, currentAddress } = require("../../shared/state");
+const { updateSendBalance } = require("./send");
+const QRCode = require("qrcode");
 const { deriveAddressFromXpub } = require("../../shared/wallet");
 const {
     formatUsd,
@@ -109,6 +111,55 @@ function render(ctx) {
     renderTotalValue();
 }
 
-function init(ctx) {}
+function selectActiveAddress() {
+    for (let wi = 0; wi < state.wallets.length; wi++) {
+        for (let ai = 0; ai < state.wallets[wi].addresses.length; ai++) {
+            if (
+                state.wallets[wi].addresses[ai].address === state.activeAddress
+            ) {
+                state.selectedWallet = wi;
+                state.selectedAddress = ai;
+                return true;
+            }
+        }
+    }
+    return false;
+}
+
+function init(ctx) {
+    $("btn-main-send").addEventListener("click", () => {
+        if (!selectActiveAddress()) {
+            showFlash("No active address selected.");
+            return;
+        }
+        const addr = currentAddress();
+        if (!addr.balance || parseFloat(addr.balance) === 0) {
+            showFlash("Cannot send \u2014 zero balance.");
+            return;
+        }
+        $("send-to").value = "";
+        $("send-amount").value = "";
+        updateSendBalance();
+        showView("send");
+    });
+
+    $("btn-main-receive").addEventListener("click", () => {
+        if (!selectActiveAddress()) {
+            showFlash("No active address selected.");
+            return;
+        }
+        const addr = currentAddress();
+        const address = addr ? addr.address : "";
+        $("receive-address").textContent = address;
+        if (address) {
+            QRCode.toCanvas($("receive-qr"), address, {
+                width: 200,
+                margin: 2,
+                color: { dark: "#000000", light: "#ffffff" },
+            });
+        }
+        showView("receive");
+    });
+}
 
 module.exports = { init, render };