Implement personal_sign and eth_signTypedData_v4 message signing

Replace stub error handlers with full approval flow for personal_sign,
eth_sign, eth_signTypedData_v4, and eth_signTypedData. Uses toolbar
popup only (no fallback window) and keeps sign approvals pending across
popup close/reopen cycles so the user can respond via the toolbar icon.

src/popup/index.html

@@ -886,11 +886,7 @@
                 </div>
                 <div id="approve-tx-data-section" class="mb-3 hidden">
                     <div class="text-xs text-muted mb-1">Raw data</div>
-                    <div
-                        id="approve-tx-data"
-                        class="text-xs break-all"
-                        style="max-height: 4rem; overflow-y: auto"
-                    ></div>
+                    <div id="approve-tx-data" class="text-xs break-all"></div>
                 </div>
                 <div class="mb-2">
                     <label class="block mb-1 text-xs">Password</label>
@@ -917,6 +913,58 @@
                 </div>
             </div>
 
+            <!-- ============ SIGNATURE APPROVAL ============ -->
+            <div id="view-approve-sign" class="view hidden">
+                <h2 class="font-bold mb-2">Signature Request</h2>
+                <p class="mb-2">
+                    <span id="approve-sign-hostname" class="font-bold"></span>
+                    wants you to sign a message.
+                </p>
+
+                <div class="mb-3">
+                    <div class="text-xs text-muted mb-1">Type</div>
+                    <div id="approve-sign-type" class="text-xs font-bold"></div>
+                </div>
+
+                <div class="mb-3">
+                    <div class="text-xs text-muted mb-1">From</div>
+                    <div id="approve-sign-from" class="text-xs break-all"></div>
+                </div>
+
+                <div class="mb-3">
+                    <div class="text-xs text-muted mb-1">Message</div>
+                    <div
+                        id="approve-sign-message"
+                        class="text-xs break-all"
+                        style="max-height: 12rem; overflow-y: auto"
+                    ></div>
+                </div>
+
+                <div class="mb-2">
+                    <label class="block mb-1 text-xs">Password</label>
+                    <input
+                        type="password"
+                        id="approve-sign-password"
+                        class="border border-border p-1 w-full font-mono text-sm bg-bg text-fg"
+                    />
+                </div>
+                <div id="approve-sign-error" class="text-xs hidden mb-2"></div>
+                <div class="flex justify-between">
+                    <button
+                        id="btn-approve-sign"
+                        class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
+                    >
+                        Sign
+                    </button>
+                    <button
+                        id="btn-reject-sign"
+                        class="border border-border px-2 py-1 hover:bg-fg hover:text-bg cursor-pointer"
+                    >
+                        Reject
+                    </button>
+                </div>
+            </div>
+
             <!-- ============ SITE APPROVAL ============ -->
             <div id="view-approve-site" class="view hidden">
                 <h2 class="font-bold mb-2">Connection Request</h2>

src/popup/views/approval.js

@@ -1,9 +1,10 @@
 const { $, addressDotHtml, escapeHtml, showView } = require("./helpers");
 const { state, saveState } = require("../../shared/state");
-const { formatEther, formatUnits, Interface } = require("ethers");
+const { formatEther, formatUnits, Interface, toUtf8String } = require("ethers");
 const { ERC20_ABI } = require("../../shared/constants");
 const { TOKEN_BY_ADDRESS } = require("../../shared/tokenList");
 const txStatus = require("./txStatus");
+const uniswap = require("../../shared/uniswap");
 
 const runtime =
     typeof browser !== "undefined" ? browser.runtime : chrome.runtime;
@@ -40,81 +41,90 @@ function etherscanTokenLink(address) {
     return `https://etherscan.io/token/${address}`;
 }
 
-// Try to decode calldata using the ERC-20 ABI.
+// Try to decode calldata using known ABIs.
 // Returns { name, description, details } or null.
 function decodeCalldata(data, toAddress) {
     if (!data || data === "0x" || data.length < 10) return null;
 
+    // Try ERC-20 (approve / transfer)
     try {
         const parsed = erc20Iface.parseTransaction({ data });
-        if (!parsed) return null;
+        if (parsed) {
+            const token = TOKEN_BY_ADDRESS.get(toAddress.toLowerCase());
+            const tokenSymbol = token ? token.symbol : null;
+            const tokenDecimals = token ? token.decimals : 18;
+            const contractLabel = tokenSymbol
+                ? tokenSymbol + " (" + toAddress + ")"
+                : toAddress;
 
-        const token = TOKEN_BY_ADDRESS.get(toAddress.toLowerCase());
-        const tokenSymbol = token ? token.symbol : null;
-        const tokenDecimals = token ? token.decimals : 18;
-        const contractLabel = tokenSymbol
-            ? tokenSymbol + " (" + toAddress + ")"
-            : toAddress;
+            if (parsed.name === "approve") {
+                const spender = parsed.args[0];
+                const rawAmount = parsed.args[1];
+                const maxUint = BigInt(
+                    "0xffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff",
+                );
+                const isUnlimited = rawAmount === maxUint;
+                const amountStr = isUnlimited
+                    ? "Unlimited"
+                    : formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
+                      (tokenSymbol ? " " + tokenSymbol : "");
 
-        if (parsed.name === "approve") {
-            const spender = parsed.args[0];
-            const rawAmount = parsed.args[1];
-            const maxUint = BigInt(
-                "0xffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff",
-            );
-            const isUnlimited = rawAmount === maxUint;
-            const amountStr = isUnlimited
-                ? "Unlimited"
-                : formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
-                  (tokenSymbol ? " " + tokenSymbol : "");
+                return {
+                    name: "Token Approval",
+                    description: tokenSymbol
+                        ? "Approve spending of your " + tokenSymbol
+                        : "Approve spending of an ERC-20 token",
+                    details: [
+                        {
+                            label: "Token",
+                            value: contractLabel,
+                            address: toAddress,
+                            isToken: true,
+                        },
+                        {
+                            label: "Spender",
+                            value: spender,
+                            address: spender,
+                        },
+                        { label: "Amount", value: amountStr },
+                    ],
+                };
+            }
 
-            return {
-                name: "Token Approval",
-                description: tokenSymbol
-                    ? "Approve spending of your " + tokenSymbol
-                    : "Approve spending of an ERC-20 token",
-                details: [
-                    {
-                        label: "Token",
-                        value: contractLabel,
-                        address: toAddress,
-                        isToken: true,
-                    },
-                    { label: "Spender", value: spender, address: spender },
-                    { label: "Amount", value: amountStr },
-                ],
-            };
+            if (parsed.name === "transfer") {
+                const to = parsed.args[0];
+                const rawAmount = parsed.args[1];
+                const amountStr =
+                    formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
+                    (tokenSymbol ? " " + tokenSymbol : "");
+
+                return {
+                    name: "Token Transfer",
+                    description: tokenSymbol
+                        ? "Transfer " + tokenSymbol
+                        : "Transfer ERC-20 token",
+                    details: [
+                        {
+                            label: "Token",
+                            value: contractLabel,
+                            address: toAddress,
+                            isToken: true,
+                        },
+                        { label: "Recipient", value: to, address: to },
+                        { label: "Amount", value: amountStr },
+                    ],
+                };
+            }
         }
-
-        if (parsed.name === "transfer") {
-            const to = parsed.args[0];
-            const rawAmount = parsed.args[1];
-            const amountStr =
-                formatTxValue(formatUnits(rawAmount, tokenDecimals)) +
-                (tokenSymbol ? " " + tokenSymbol : "");
-
-            return {
-                name: "Token Transfer",
-                description: tokenSymbol
-                    ? "Transfer " + tokenSymbol
-                    : "Transfer ERC-20 token",
-                details: [
-                    {
-                        label: "Token",
-                        value: contractLabel,
-                        address: toAddress,
-                        isToken: true,
-                    },
-                    { label: "Recipient", value: to, address: to },
-                    { label: "Amount", value: amountStr },
-                ],
-            };
-        }
-
-        return null;
     } catch {
-        return null;
+        // Not ERC-20 — fall through
     }
+
+    // Try Uniswap Universal Router
+    const routerResult = uniswap.decode(data, toAddress);
+    if (routerResult) return routerResult;
+
+    return null;
 }
 
 function showTxApproval(details) {
@@ -212,6 +222,86 @@ function showTxApproval(details) {
     showView("approve-tx");
 }
 
+function decodeHexMessage(hex) {
+    try {
+        const bytes = Uint8Array.from(
+            hex
+                .slice(2)
+                .match(/.{1,2}/g)
+                .map((b) => parseInt(b, 16)),
+        );
+        return toUtf8String(bytes);
+    } catch {
+        return null;
+    }
+}
+
+function formatTypedDataHtml(jsonStr) {
+    try {
+        const data = JSON.parse(jsonStr);
+        let html = "";
+
+        if (data.domain) {
+            html += `<div class="mb-2"><div class="text-muted">Domain</div>`;
+            for (const [key, val] of Object.entries(data.domain)) {
+                html += `<div><span class="text-muted">${escapeHtml(key)}:</span> ${escapeHtml(String(val))}</div>`;
+            }
+            html += `</div>`;
+        }
+
+        if (data.primaryType) {
+            html += `<div class="mb-2"><div class="text-muted">Primary type</div>`;
+            html += `<div class="font-bold">${escapeHtml(data.primaryType)}</div></div>`;
+        }
+
+        if (data.message) {
+            html += `<div class="mb-2"><div class="text-muted">Message</div>`;
+            for (const [key, val] of Object.entries(data.message)) {
+                const display =
+                    typeof val === "object" ? JSON.stringify(val) : String(val);
+                html += `<div><span class="text-muted">${escapeHtml(key)}:</span> <span class="break-all">${escapeHtml(display)}</span></div>`;
+            }
+            html += `</div>`;
+        }
+
+        return html;
+    } catch {
+        return `<div class="break-all">${escapeHtml(jsonStr)}</div>`;
+    }
+}
+
+function showSignApproval(details) {
+    const sp = details.signParams;
+
+    $("approve-sign-hostname").textContent = details.hostname;
+    $("approve-sign-from").innerHTML = approvalAddressHtml(sp.from);
+
+    const isTyped =
+        sp.method === "eth_signTypedData_v4" ||
+        sp.method === "eth_signTypedData";
+    $("approve-sign-type").textContent = isTyped
+        ? "Typed data (EIP-712)"
+        : "Personal message";
+
+    if (isTyped) {
+        $("approve-sign-message").innerHTML = formatTypedDataHtml(sp.typedData);
+    } else {
+        const decoded = decodeHexMessage(sp.message);
+        if (decoded !== null) {
+            $("approve-sign-message").textContent = decoded;
+        } else {
+            $("approve-sign-message").textContent = sp.message;
+        }
+    }
+
+    $("approve-sign-password").value = "";
+    $("approve-sign-error").classList.add("hidden");
+    $("btn-approve-sign").disabled = false;
+    $("btn-approve-sign").classList.remove("text-muted");
+
+    showView("approve-sign");
+}
+
 function show(id) {
     approvalId = id;
     runtime.connect({ name: "approval:" + id });
@@ -224,6 +314,10 @@ function show(id) {
             showTxApproval(details);
             return;
         }
+        if (details.type === "sign") {
+            showSignApproval(details);
+            return;
+        }
         $("approve-hostname").textContent = details.hostname;
         $("approve-address").innerHTML = approvalAddressHtml(
             state.activeAddress,
@@ -301,6 +395,48 @@ function init(ctx) {
         });
         window.close();
     });
+
+    $("btn-approve-sign").addEventListener("click", () => {
+        const password = $("approve-sign-password").value;
+        if (!password) {
+            $("approve-sign-error").textContent = "Please enter your password.";
+            $("approve-sign-error").classList.remove("hidden");
+            return;
+        }
+        $("approve-sign-error").classList.add("hidden");
+        $("btn-approve-sign").disabled = true;
+        $("btn-approve-sign").classList.add("text-muted");
+
+        runtime.sendMessage(
+            {
+                type: "AUTISTMASK_SIGN_RESPONSE",
+                id: approvalId,
+                approved: true,
+                password: password,
+            },
+            (response) => {
+                if (response && response.signature) {
+                    window.close();
+                } else {
+                    const msg =
+                        (response && response.error) || "Signing failed.";
+                    $("approve-sign-error").textContent = msg;
+                    $("approve-sign-error").classList.remove("hidden");
+                    $("btn-approve-sign").disabled = false;
+                    $("btn-approve-sign").classList.remove("text-muted");
+                }
+            },
+        );
+    });
+
+    $("btn-reject-sign").addEventListener("click", () => {
+        runtime.sendMessage({
+            type: "AUTISTMASK_SIGN_RESPONSE",
+            id: approvalId,
+            approved: false,
+        });
+        window.close();
+    });
 }
 
 module.exports = { init, show };

src/popup/views/helpers.js

@@ -26,6 +26,7 @@ const VIEWS = [
     "transaction",
     "approve-site",
     "approve-tx",
+    "approve-sign",
 ];
 
 function $(id) {