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.
This commit is contained in:
parent
412849b312
commit
734122ad27
4 changed files with 56 additions and 31 deletions
|
|
@ -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>
|
||||
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -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> {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue