Implement LNbits integration in AuthService and enhance ChatComponent for improved user experience

- Refactor AuthService to integrate LNbits authentication, including fetching user data from the API and handling token validation.
- Update ChatComponent to reflect changes in peer management, replacing user_id with pubkey and username with name for better clarity.
- Enhance connection status indicators in ChatComponent for improved user feedback during chat initialization.

src/modules/base/auth/auth-service.ts

@@ -1,6 +1,8 @@
-// Copy the existing auth logic into a service class
+// Auth service for LNbits integration
 import { ref } from 'vue'
 import { eventBus } from '@/core/event-bus'
+import { getAuthToken } from '@/lib/config/lnbits'
+import { config } from '@/lib/config'
 
 export class AuthService {
   public isAuthenticated = ref(false)
@@ -10,33 +12,64 @@ export class AuthService {
   async initialize(): Promise<void> {
     console.log('🔑 Initializing auth service...')
     
-    // Check for existing auth state
-    this.checkAuth()
+    // Check for existing auth state and fetch user data
+    await this.checkAuth()
     
     if (this.isAuthenticated.value) {
       eventBus.emit('auth:login', { user: this.user.value }, 'auth-service')
     }
   }
 
-  checkAuth(): boolean {
-    // Implement your existing auth check logic here
-    // For now, we'll use a simple localStorage check
-    const authData = localStorage.getItem('auth')
-    if (authData) {
-      try {
-        const parsed = JSON.parse(authData)
-        this.isAuthenticated.value = true
-        this.user.value = parsed
-        return true
-      } catch (error) {
-        console.error('Invalid auth data in localStorage:', error)
-        this.logout()
-      }
-    }
+  async checkAuth(): Promise<boolean> {
+    const authToken = getAuthToken()
     
-    this.isAuthenticated.value = false
-    this.user.value = null
-    return false
+    if (!authToken) {
+      console.log('🔑 No auth token found - user needs to login')
+      this.isAuthenticated.value = false
+      this.user.value = null
+      return false
+    }
+
+    // Fetch current user data from API
+    try {
+      this.isLoading.value = true
+      const API_BASE_URL = config.api.baseUrl || 'http://localhost:5006'
+      const response = await fetch(`${API_BASE_URL}/api/v1/auth/nostr/me`, {
+        headers: {
+          'Authorization': `Bearer ${authToken}`,
+          'Content-Type': 'application/json'
+        }
+      })
+
+      if (!response.ok) {
+        if (response.status === 401) {
+          console.log('🔑 Auth token invalid - user needs to login')
+          this.logout()
+          return false
+        }
+        console.warn(`🔑 Failed to fetch user data: ${response.status} - authentication may not be properly configured`)
+        this.isAuthenticated.value = false
+        this.user.value = null
+        return false
+      }
+
+      const userData = await response.json()
+      
+      this.user.value = userData
+      this.isAuthenticated.value = true
+      
+      console.log('🔑 User authenticated:', userData.username || userData.id, userData.pubkey?.slice(0, 8))
+      
+      return true
+      
+    } catch (error) {
+      console.warn('🔑 Authentication check failed:', error)
+      this.isAuthenticated.value = false
+      this.user.value = null
+      return false
+    } finally {
+      this.isLoading.value = false
+    }
   }
 
   async login(credentials: any): Promise<void> {
@@ -71,8 +104,8 @@ export class AuthService {
   }
 
   async refresh(): Promise<void> {
-    // Implement token refresh logic if needed
-    console.log('Refreshing auth token...')
+    // Re-fetch user data from API
+    await this.checkAuth()
   }
 }