From b453637867766b168ac27552f2062e5e20d4799d Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Tue, 5 Aug 2025 00:20:03 +0200
Subject: [PATCH] feat: Add wallet opening functionality in ProfileDialog
 component

- Introduce a new button to open the user's wallet in a new tab.
- Implement error handling for cases where the user ID is not available.
- Retrieve the API base URL from environment variables for constructing the wallet URL.
---
 src/components/auth/ProfileDialog.vue | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/src/components/auth/ProfileDialog.vue b/src/components/auth/ProfileDialog.vue
index 4c2bbc1..26f3640 100644
--- a/src/components/auth/ProfileDialog.vue
+++ b/src/components/auth/ProfileDialog.vue
@@ -4,7 +4,7 @@ import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } f
 import { Button } from '@/components/ui/button'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
-import { User, LogOut, Settings, Key } from 'lucide-vue-next'
+import { User, LogOut, Settings, Key, Wallet, ExternalLink } from 'lucide-vue-next'
 import { auth } from '@/composables/useAuth'
 import { toast } from 'vue-sonner'
 
@@ -21,12 +21,26 @@ const emit = defineEmits<Emits>()
 
 const userDisplay = computed(() => auth.userDisplay.value)
 
+// Get the API base URL from environment variables
+const apiBaseUrl = import.meta.env.VITE_API_BASE_URL || ''
+
 function handleLogout() {
   auth.logout()
   toast.success('Logged out successfully')
   handleClose()
 }
 
+function handleOpenWallet() {
+  if (!auth.currentUser.value?.id) {
+    toast.error('User ID not available')
+    return
+  }
+  
+  const walletUrl = `${apiBaseUrl}/wallet?usr=${auth.currentUser.value.id}`
+  window.open(walletUrl, '_blank')
+  toast.success('Opening wallet in new tab')
+}
+
 function handleClose() {
   emit('update:isOpen', false)
 }
@@ -95,6 +109,12 @@ function handleClose() {
           </CardHeader>
           <CardContent class="space-y-4">
             <div class="grid gap-3">
+              <Button variant="outline" @click="handleOpenWallet" class="w-full justify-start gap-2">
+                <Wallet class="w-4 h-4" />
+                Open Wallet
+                <ExternalLink class="w-3 h-3 ml-auto" />
+              </Button>
+              
               <Button variant="outline" class="w-full justify-start gap-2">
                 <Settings class="w-4 h-4" />
                 Account Settings