From 734122ad27d67a86fa64556b84b677dd81a03de9 Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Wed, 30 Jul 2025 00:23:36 +0200
Subject: [PATCH] refactor: Simplify logout process and enhance routing in
 authentication components

- Remove unnecessary async handling in logout functions across UserProfile.vue and Navbar.vue.
- Integrate `useRouter` for consistent redirection to the login page after logout.
- Update `logout` method in useAuth.ts to clear local state without an API call.
---
 src/components/auth/UserProfile.vue | 13 ++++----
 src/components/layout/Navbar.vue    |  7 ++--
 src/composables/useAuth.ts          | 16 +++------
 src/lib/api/lnbits.ts               | 51 +++++++++++++++++++++++------
 4 files changed, 56 insertions(+), 31 deletions(-)

diff --git a/src/components/auth/UserProfile.vue b/src/components/auth/UserProfile.vue
index 7982f5a..b06b5e7 100644
--- a/src/components/auth/UserProfile.vue
+++ b/src/components/auth/UserProfile.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { computed } from 'vue'
+import { useRouter } from 'vue-router'
 import { Button } from '@/components/ui/button'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
@@ -7,15 +8,13 @@ import { User, LogOut, Settings } from 'lucide-vue-next'
 import { auth } from '@/composables/useAuth'
 import { toast } from 'vue-sonner'
 
+const router = useRouter()
 const userDisplay = computed(() => auth.userDisplay.value)
 
-async function handleLogout() {
-  try {
-    await auth.logout()
-    toast.success('Logged out successfully')
-  } catch (error) {
-    toast.error('Failed to logout')
-  }
+function handleLogout() {
+  auth.logout()
+  toast.success('Logged out successfully')
+  router.push('/login')
 }
 </script>
 
diff --git a/src/components/layout/Navbar.vue b/src/components/layout/Navbar.vue
index 4464731..291921a 100644
--- a/src/components/layout/Navbar.vue
+++ b/src/components/layout/Navbar.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue'
+import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { useTheme } from '@/components/theme-provider'
 import { Button } from '@/components/ui/button'
@@ -15,6 +16,7 @@ interface NavigationItem {
   href: string
 }
 
+const router = useRouter()
 const { t } = useI18n()
 const { theme, setTheme } = useTheme()
 const isOpen = ref(false)
@@ -41,9 +43,10 @@ const openLoginDialog = () => {
 
 const handleLogout = async () => {
   try {
-    await auth.logout()
+    auth.logout()
     isOpen.value = false
-    // The redirect is now handled in the auth.logout() function
+    // Redirect to login page
+    router.push('/login')
   } catch (error) {
     console.error('Logout failed:', error)
   }
diff --git a/src/composables/useAuth.ts b/src/composables/useAuth.ts
index d9c6be0..525d80c 100644
--- a/src/composables/useAuth.ts
+++ b/src/composables/useAuth.ts
@@ -1,5 +1,4 @@
 import { ref, computed } from 'vue'
-import { useRouter } from 'vue-router'
 import { lnbitsAPI, type User, type LoginCredentials, type RegisterData } from '@/lib/api/lnbits'
 
 const currentUser = ref<User | null>(null)
@@ -7,7 +6,6 @@ const isLoading = ref(false)
 const error = ref<string | null>(null)
 
 export function useAuth() {
-  const router = useRouter()
   const isAuthenticated = computed(() => !!currentUser.value)
 
   /**
@@ -77,16 +75,10 @@ export function useAuth() {
    * Logout and clear user data
    */
   async function logout(): Promise<void> {
-    try {
-      await lnbitsAPI.logout()
-    } catch (err) {
-      console.error('Logout error:', err)
-    } finally {
-      currentUser.value = null
-      error.value = null
-      // Redirect to login page after logout
-      router.push('/login')
-    }
+    // Clear local state
+    lnbitsAPI.logout()
+    currentUser.value = null
+    error.value = null
   }
 
   /**
diff --git a/src/lib/api/lnbits.ts b/src/lib/api/lnbits.ts
index 5bb8164..e13a64c 100644
--- a/src/lib/api/lnbits.ts
+++ b/src/lib/api/lnbits.ts
@@ -50,14 +50,50 @@ class LnbitsAPI {
       (headers as Record<string, string>)['Authorization'] = `Bearer ${this.accessToken}`
     }
 
+    // Debug logging
+    if (import.meta.env.VITE_LNBITS_DEBUG === 'true') {
+      console.log('LNBits API Request:', {
+        url,
+        method: options.method || 'GET',
+        headers: options.headers,
+        body: options.body
+      })
+    }
+
     const response = await fetch(url, {
       ...options,
       headers,
     })
 
+    // Debug logging
+    if (import.meta.env.VITE_LNBITS_DEBUG === 'true') {
+      console.log('LNBits API Response:', {
+        status: response.status,
+        statusText: response.statusText,
+        url: response.url
+      })
+    }
+
     if (!response.ok) {
-      const errorData = await response.json().catch(() => ({}))
-      throw new Error(errorData.detail || `HTTP ${response.status}: ${response.statusText}`)
+      let errorMessage = `HTTP ${response.status}: ${response.statusText}`
+      try {
+        const errorData = await response.json()
+        errorMessage = errorData.detail || errorData.message || errorMessage
+      } catch {
+        // If we can't parse JSON, use the default error message
+      }
+      
+      // Debug logging for errors
+      if (import.meta.env.VITE_LNBITS_DEBUG === 'true') {
+        console.error('LNBits API Error:', {
+          status: response.status,
+          statusText: response.statusText,
+          url: response.url,
+          error: errorMessage
+        })
+      }
+      
+      throw new Error(errorMessage)
     }
 
     return response.json()
@@ -88,14 +124,9 @@ class LnbitsAPI {
   }
 
   async logout(): Promise<void> {
-    try {
-      await this.request('/auth/logout', {
-        method: 'POST',
-      })
-    } finally {
-      this.accessToken = null
-      removeAuthToken()
-    }
+    // Just clear local state - no API call needed for logout
+    this.accessToken = null
+    removeAuthToken()
   }
 
   async getCurrentUser(): Promise<User> {