From cf994a293019ce179b4214fc7637b0ea7e5a0105 Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Mon, 15 Sep 2025 00:58:03 +0200
Subject: [PATCH] Refactor Navbar component for improved mobile wallet
 interaction

- Changed the mobile wallet balance display from a div to a button for better accessibility and interaction.
- Updated the button to navigate to the wallet page and close the dropdown when clicked, enhancing user experience.

These changes streamline the navigation and improve the overall functionality of the Navbar component.
---
 src/components/layout/Navbar.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/layout/Navbar.vue b/src/components/layout/Navbar.vue
index b1a6cee..b2ad46a 100644
--- a/src/components/layout/Navbar.vue
+++ b/src/components/layout/Navbar.vue
@@ -265,10 +265,13 @@ const handleLogout = async () => {
             </div>
 
             <!-- Mobile Wallet Balance -->
-            <div class="flex items-center gap-2 px-2 py-1 bg-muted/50 rounded-lg">
+            <button
+              @click="() => { router.push('/wallet'); isOpen = false }"
+              class="flex items-center gap-2 px-2 py-1 bg-muted/50 rounded-lg hover:bg-muted/70 transition-colors w-full text-left"
+            >
               <Wallet class="h-4 w-4 text-muted-foreground" />
               <CurrencyDisplay :balance-msat="totalBalance" />
-            </div>
+            </button>
 
             <div class="space-y-1">
               <Button variant="ghost" size="sm" @click="openProfileDialog" class="w-full justify-start gap-2">