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/composables/useModularNavigation.ts

@@ -0,0 +1,106 @@
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { pluginManager } from '@/core/plugin-manager'
+import appConfig from '@/app.config'
+
+interface NavigationItem {
+  name: string
+  href: string
+  icon?: string
+  requiresAuth?: boolean
+}
+
+/**
+ * Composable for dynamic navigation based on enabled modules
+ */
+export function useModularNavigation() {
+  const { t } = useI18n()
+
+  /**
+   * Get navigation items for enabled modules
+   */
+  const navigation = computed<NavigationItem[]>(() => {
+    const items: NavigationItem[] = []
+
+    // Always include home
+    items.push({ name: t('nav.home'), href: '/', requiresAuth: true })
+
+    // Add navigation items based on enabled modules
+    if (appConfig.modules.events.enabled) {
+      items.push({ 
+        name: t('nav.events'), 
+        href: '/events', 
+        requiresAuth: true 
+      })
+    }
+
+    if (appConfig.modules.market.enabled) {
+      items.push({ 
+        name: t('nav.market'), 
+        href: '/market', 
+        requiresAuth: true 
+      })
+    }
+
+    if (appConfig.modules.chat.enabled) {
+      items.push({ 
+        name: t('nav.chat'), 
+        href: '/chat', 
+        requiresAuth: true 
+      })
+    }
+
+    return items
+  })
+
+  /**
+   * Get dropdown menu items for authenticated users
+   */
+  const userMenuItems = computed<NavigationItem[]>(() => {
+    const items: NavigationItem[] = []
+
+    // Events module items
+    if (appConfig.modules.events.enabled) {
+      items.push({ 
+        name: 'My Tickets', 
+        href: '/my-tickets', 
+        icon: 'Ticket',
+        requiresAuth: true 
+      })
+    }
+
+    // Market module items  
+    if (appConfig.modules.market.enabled) {
+      items.push({ 
+        name: 'Market Dashboard', 
+        href: '/market-dashboard', 
+        icon: 'BarChart3',
+        requiresAuth: true 
+      })
+    }
+
+    // Base module items (always available)
+    items.push({ 
+      name: 'Relay Hub Status', 
+      href: '/relay-hub-status', 
+      icon: 'Activity',
+      requiresAuth: true 
+    })
+
+    return items
+  })
+
+  /**
+   * Check if a module is enabled and installed
+   */
+  const isModuleAvailable = (moduleName: string): boolean => {
+    return appConfig.modules[moduleName as keyof typeof appConfig.modules]?.enabled && 
+           pluginManager.isInstalled(moduleName)
+  }
+
+  return {
+    navigation,
+    userMenuItems,
+    isModuleAvailable
+  }
+}