Icons in the receive selector and on silent-payment history rows

The receive address-type picker was a native <select>, which can't
render SVG in <option>s. Replace it with a lightweight custom dropdown
(icon-select) that shows a glyph per rail — ₿ Bitcoin, ⚡ Lightning,
the Second mark for Ark, 🕶️ Silent payment — closing on select or an
outside tap. Receive modes gained an icon field; the address option is
built in app.js. Silent-payment receipts (which merge into history as
on-chain-looking rows) now get a rail glyph + SP tag via a
decorateTxRow so they're distinguishable, matching how ark/gift rows
already decorate.

Co-Authored-By: Claude Fable 5 <[email protected]>

1 files changed, 8 insertions, 1 deletions

diff --git a/src/features/sp.js b/src/features/sp.js
index 5c55457..92f091f 100644
--- a/src/features/sp.js
+++ b/src/features/sp.js
@@ -42,7 +42,7 @@ export function spFeature(ctx) {
       const spAddr = wallet.silentPaymentsAvailable && wallet.silentPaymentsAvailable() ? wallet.silentPaymentAddress() : null;
       if (!spAddr) return [];
       return [{
-        id: 'sp', label: t('receiveSpTab'),
+        id: 'sp', label: t('receiveSpTab'), icon: '🕶️',
         render: (seg) => h(
           'div',
           { class: 'card col', style: 'align-items:center;gap:14px' },
@@ -54,6 +54,13 @@ export function spFeature(ctx) {
       }];
     },
     isSendDest(a) { return isSilentPaymentAddress(a); },
+    // Silent-payment receipts merge into the main history as on-chain-looking
+    // rows (tx.sp) — give them a rail glyph + tag so they're recognizable.
+    decorateTxRow(tx) {
+      return tx && tx.sp
+        ? { icon: '🕶️', label: h('span', {}, t('received'), ' ', h('span', { class: 'tag' }, t('receiveSpTab'))) }
+        : null;
+    },
     settingsCards() { return [spIndexerCard()]; },
   };
 }