From 0641ee85ef958dba42e8040a6d89c9d18d590956 Mon Sep 17 00:00:00 2001
From: archipelago <archipelago@localhost>
Date: Sat, 25 Jul 2026 10:44:08 -0400
Subject: [PATCH] feat(wallet): total-bitcoin row at top of wallet card;
 on-chain gets a chain icon
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The wallet card (Home + Web5 views) now leads with a Total Bitcoin row
summing all rails (on-chain + lightning + cashu + fedimint + ark), using
the orange ₿ mark. The on-chain row swaps ₿ for a link/chain icon.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 neode-ui/src/locales/en.json               |  1 +
 neode-ui/src/locales/es.json               |  1 +
 neode-ui/src/views/home/HomeWalletCard.vue | 15 ++++++++++++++-
 neode-ui/src/views/web5/Web5Wallet.vue     | 13 ++++++++++++-
 4 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/neode-ui/src/locales/en.json b/neode-ui/src/locales/en.json
index 00aeddfd..98b2e15a 100644
--- a/neode-ui/src/locales/en.json
+++ b/neode-ui/src/locales/en.json
@@ -415,6 +415,7 @@
     "totalEarned": "Total Earned",
     "monthlyAvg": "Monthly Avg",
     "ecashBalance": "Ecash Balance",
+    "totalBitcoin": "Total Bitcoin",
     "onChain": "On-chain",
     "lightning": "Lightning",
     "ecash": "Ecash",
diff --git a/neode-ui/src/locales/es.json b/neode-ui/src/locales/es.json
index f94ff178..3c9dd268 100644
--- a/neode-ui/src/locales/es.json
+++ b/neode-ui/src/locales/es.json
@@ -413,6 +413,7 @@
     "totalEarned": "Total ganado",
     "monthlyAvg": "Promedio mensual",
     "ecashBalance": "Saldo Ecash",
+    "totalBitcoin": "Bitcoin total",
     "onChain": "On-chain",
     "lightning": "Lightning",
     "ecash": "Ecash",
diff --git a/neode-ui/src/views/home/HomeWalletCard.vue b/neode-ui/src/views/home/HomeWalletCard.vue
index c9c37fbf..e69f83b0 100644
--- a/neode-ui/src/views/home/HomeWalletCard.vue
+++ b/neode-ui/src/views/home/HomeWalletCard.vue
@@ -112,9 +112,18 @@
         </transition>
 
         <div class="home-card-stats space-y-3 mb-4 flex-1 min-h-0">
-          <div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
+          <div class="flex items-center justify-between p-3 bg-white/10 rounded-lg">
             <div class="flex items-center gap-3">
               <span class="text-lg text-orange-500 font-bold">&#x20bf;</span>
+              <span class="text-sm font-medium text-white">{{ t('web5.totalBitcoin') }}</span>
+            </div>
+            <span class="text-white text-sm font-semibold">{{ walletTotal.toLocaleString() }} sats</span>
+          </div>
+          <div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
+            <div class="flex items-center gap-3">
+              <svg class="w-5 h-5 text-orange-500" role="img" aria-label="On-chain" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
+              </svg>
               <span class="text-sm text-white/80">{{ t('web5.onChain') }}</span>
             </div>
             <span class="text-orange-500 text-sm font-medium">{{ walletOnchain.toLocaleString() }} sats</span>
@@ -232,6 +241,10 @@ defineEmits<{
 
 const showIncomingTxPanel = ref(false)
 
+const walletTotal = computed(() =>
+  props.walletOnchain + props.walletLightning + props.walletEcash + props.walletFedimint + (props.walletArk ?? 0)
+)
+
 function isOnchain(tx: WalletTransaction): boolean {
   return !tx.kind || tx.kind === 'onchain'
 }
diff --git a/neode-ui/src/views/web5/Web5Wallet.vue b/neode-ui/src/views/web5/Web5Wallet.vue
index 00195014..dc00a514 100644
--- a/neode-ui/src/views/web5/Web5Wallet.vue
+++ b/neode-ui/src/views/web5/Web5Wallet.vue
@@ -95,10 +95,21 @@
     <div v-if="walletError" class="alert-error mb-3">{{ walletError }}</div>
 
     <div class="space-y-3 flex-1 min-h-0">
+      <!-- Total Balance -->
+      <div class="flex items-center justify-between p-3 bg-white/10 rounded-lg">
+        <div class="flex items-center gap-3">
+          <span class="text-lg text-orange-500 font-bold">₿</span>
+          <span class="text-white text-sm font-medium">{{ t('web5.totalBitcoin') }}</span>
+        </div>
+        <span class="text-white text-sm font-semibold">{{ (lndOnchainBalance + lndChannelBalance + ecashBalance).toLocaleString() }} sats</span>
+      </div>
+
       <!-- On-chain Balance -->
       <div class="flex items-center justify-between p-3 bg-white/5 rounded-lg">
         <div class="flex items-center gap-3">
-          <span class="text-lg text-orange-500 font-bold">₿</span>
+          <svg class="w-5 h-5 text-orange-500" role="img" aria-label="On-chain" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" />
+          </svg>
           <span class="text-white/80 text-sm">{{ t('web5.onChain') }}</span>
         </div>
         <span class="text-orange-500 text-sm font-medium">{{ lndOnchainBalance.toLocaleString() }} sats</span>