Refactor chat module and navigation components for improved user experience

- Update app configuration to load chat module on startup for route registration.
- Introduce useModularNavigation composable for dynamic navigation based on enabled modules.
- Simplify Navbar.vue by utilizing userMenuItems for dropdown and button rendering, enhancing maintainability.
- Enhance ChatPage.vue with detailed debug information and user authentication checks for better feedback.

src/modules/chat/views/ChatPage.vue

@@ -1,9 +1,57 @@
 <template>
-  <div class="h-full w-full">
-    <ChatComponent />
+  <div class="h-full w-full p-8">
+    <div class="text-center">
+      <h1 class="text-2xl font-bold mb-4">Chat Module</h1>
+      <p class="text-muted-foreground mb-4">Status: {{ debugInfo.status }}</p>
+      
+      <div v-if="!debugInfo.isAuthenticated" class="bg-yellow-100 border border-yellow-400 text-yellow-700 px-4 py-3 rounded mb-4">
+        <p><strong>Authentication Required:</strong> Please log in to use chat</p>
+      </div>
+      
+      <div v-else-if="!debugInfo.hasNostrKeys" class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4">
+        <p><strong>Nostr Keys Missing:</strong> Your account needs Nostr keys configured</p>
+        <p class="text-sm mt-2">Key status: {{ debugInfo.keyStatus.message }}</p>
+      </div>
+      
+      <div v-else-if="!debugInfo.isConnected" class="bg-blue-100 border border-blue-400 text-blue-700 px-4 py-3 rounded mb-4">
+        <p><strong>Connecting to Nostr relays...</strong></p>
+      </div>
+      
+      <div v-else class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4">
+        <p><strong>Ready!</strong> Chat should work now</p>
+        <ChatComponent />
+      </div>
+      
+      <details class="mt-8 text-left">
+        <summary class="cursor-pointer font-semibold">Debug Info</summary>
+        <pre class="mt-4 p-4 bg-gray-100 rounded text-xs overflow-auto">{{ JSON.stringify(debugInfo, null, 2) }}</pre>
+      </details>
+    </div>
   </div>
 </template>
 
 <script setup lang="ts">
+import { computed } from 'vue'
 import ChatComponent from '../components/ChatComponent.vue'
+import { nostrChat } from '@/composables/useNostrChat'
+import { useAuth } from '@/composables/useAuth'
+
+const auth = useAuth()
+
+const debugInfo = computed(() => {
+  const keyStatus = nostrChat.getNostrKeyStatus()
+  
+  return {
+    status: nostrChat.isConnected.value ? 'Connected' : 'Disconnected',
+    isAuthenticated: auth.isAuthenticated.value,
+    hasNostrKeys: nostrChat.hasNostrKeys.value,
+    isConnected: nostrChat.isConnected.value,
+    keyStatus,
+    peerCount: nostrChat.peers.value.length,
+    totalUnread: nostrChat.totalUnreadCount.value,
+    currentUser: nostrChat.currentUser.value?.pubkey ? {
+      pubkey: nostrChat.currentUser.value.pubkey.slice(0, 16) + '...'
+    } : null
+  }
+})
 </script>