From c1e48f3825fc01257c22405bf2a17f47ec40338c Mon Sep 17 00:00:00 2001
From: clawbot <clawbot@noreply.git.eeqj.de>
Date: Sun, 1 Mar 2026 07:44:50 -0800
Subject: [PATCH] feat: add blockie identicon to Identity block in
 TransactionDetail

Generate a blockie from the transaction hash and display it centered
at the top of the Identity block, matching the pattern used in
AddressDetail and AddressToken views. Updates README to document
the new element.
---
 README.md                            |  1 +
 src/popup/index.html                 |  4 ++++
 src/popup/views/transactionDetail.js | 13 +++++++++++++
 3 files changed, 18 insertions(+)

diff --git a/README.md b/README.md
index be7f94d..3a9af9b 100644
--- a/README.md
+++ b/README.md
@@ -439,6 +439,7 @@ transitions.
   matching the Settings view pattern):
     - "Transaction" heading, "Back" button
     - **Identity block**:
+        - Blockie identicon (48px, centered, derived from transaction hash)
         - Transaction hash: full hash (tap to copy) + etherscan link
         - Type: transaction classification — one of: Native ETH Transfer, ERC-20
           Token Transfer, Swap, Token Approval, Contract Call, Contract Creation
diff --git a/src/popup/index.html b/src/popup/index.html
index 5d0adac..abbbce0 100644
--- a/src/popup/index.html
+++ b/src/popup/index.html
@@ -1068,6 +1068,10 @@
                 <!-- ── Identity ── -->
                 <div class="bg-well p-3 mx-1 mb-3">
                     <h3 class="font-bold mb-1">Identity</h3>
+                    <div
+                        id="tx-detail-blockie"
+                        class="flex justify-center mt-1 mb-3"
+                    ></div>
                     <div class="mb-2">
                         <div class="text-xs text-muted mb-1">
                             Transaction hash
diff --git a/src/popup/views/transactionDetail.js b/src/popup/views/transactionDetail.js
index 7af9d50..73f4f1e 100644
--- a/src/popup/views/transactionDetail.js
+++ b/src/popup/views/transactionDetail.js
@@ -130,6 +130,19 @@ function render() {
     if (!tx) return;
     $("tx-detail-hash").innerHTML = txHashHtml(tx.hash);
 
+    // Blockie identicon for the transaction hash
+    const blockieEl = $("tx-detail-blockie");
+    if (blockieEl) {
+        blockieEl.innerHTML = "";
+        const img = document.createElement("img");
+        img.src = makeBlockie(tx.hash);
+        img.width = 48;
+        img.height = 48;
+        img.style.imageRendering = "pixelated";
+        img.style.borderRadius = "50%";
+        blockieEl.appendChild(img);
+    }
+
     const fromTitle = addressTitle(tx.from, state.wallets);
     const toTitle = addressTitle(tx.to, state.wallets);
     $("tx-detail-from").innerHTML = txAddressHtml(