padreug/web-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor chat module and navigation components for improved user experience

Browse source 
- 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.
This commit is contained in:
padreug 2025-09-05 00:31:53 +02:00
parent c692664c93
commit 0ee0bc428c
4 changed files with 175 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/components/layout/Navbar.vue
View file

@ -16,6 +16,7 @@ import { auth } from '@/composables/useAuth'
import { useMarketPreloader } from '@/composables/useMarketPreloader'
import { useMarketStore } from '@/stores/market'
import { nostrChat } from '@/composables/useNostrChat'
import { useModularNavigation } from '@/composables/useModularNavigation'
interface NavigationItem {
name: string
@ -31,13 +32,9 @@ const showProfileDialog = ref(false)
const showLogoutConfirm = ref(false)
const marketPreloader = useMarketPreloader()
const marketStore = useMarketStore()
const { navigation: modularNavigation, userMenuItems } = useModularNavigation()
const navigation = computed<NavigationItem[]>(() => [
{ name: t('nav.home'), href: '/' },
{ name: t('nav.events'), href: '/events' },
{ name: t('nav.market'), href: '/market' },
{ name: t('nav.chat'), href: '/chat' },
])
const navigation = modularNavigation
// Compute total wallet balance
const totalBalance = computed(() => {
@ -167,18 +164,13 @@ const handleLogout = async () => {
<User class="h-4 w-4" />
Profile
</DropdownMenuItem>
<DropdownMenuItem @click="() => router.push('/my-tickets')" class="gap-2">
<Ticket class="h-4 w-4" />
My Tickets
</DropdownMenuItem>
<DropdownMenuItem @click="() => router.push('/market-dashboard')" class="gap-2">
<BarChart3 class="h-4 w-4" />
Market Dashboard
</DropdownMenuItem>
<DropdownMenuItem @click="() => router.push('/relay-hub-status')" class="gap-2">
<Activity class="h-4 w-4" />
Relay Hub Status
<DropdownMenuItem
v-for="item in userMenuItems"
:key="item.href"
@click="() => router.push(item.href)"
class="gap-2">
<component :is="item.icon === 'Ticket' ? Ticket : item.icon === 'BarChart3' ? BarChart3 : Activity" class="h-4 w-4" />
{{ item.name }}
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem @click="showLogoutConfirm = true" class="gap-2 text-destructive">
@ -256,21 +248,15 @@ const handleLogout = async () => {
<User class="h-4 w-4" />
Profile
</Button>
<Button variant="ghost" size="sm" @click="() => router.push('/my-tickets')"
<Button
v-for="item in userMenuItems"
:key="item.href"
variant="ghost"
size="sm"
@click="() => router.push(item.href)"
class="w-full justify-start gap-2">
<Ticket class="h-4 w-4" />
My Tickets
</Button>
<Button variant="ghost" size="sm" @click="() => router.push('/market-dashboard')"
class="w-full justify-start gap-2">
<BarChart3 class="h-4 w-4" />
Market Dashboard
</Button>
<Button variant="ghost" size="sm" @click="() => router.push('/relay-hub-status')"
class="w-full justify-start gap-2">
<Activity class="h-4 w-4" />
Relay Hub Status
<component :is="item.icon === 'Ticket' ? Ticket : item.icon === 'BarChart3' ? BarChart3 : Activity" class="h-4 w-4" />
{{ item.name }}
</Button>
<Button variant="ghost" size="sm" @click="showLogoutConfirm = true" class="w-full justify-start gap-2 text-destructive hover:text-destructive/90 hover:bg-destructive/10">
<LogOut class="h-4 w-4" />