aiolabs/webapp
8
0
Fork 0
Code Issues 65 Pull requests Projects Releases Packages Wiki Activity Actions

feat(events): add Back button to the calendar page

Browse source 
The calendar page had no way back to the feed except the browser/back
gesture. Add a top-bar ghost Back link (ArrowLeft + "Back" → events feed)
mirroring EventDetailPage's pattern for navigation consistency.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-06-16 00:38:23 +02:00
commit 434d57974f
1 changed files with 14 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/modules/events/views/EventsCalendarPage.vue
View file

@ -2,7 +2,7 @@
import { computed, onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { Ticket } from 'lucide-vue-next' import { ArrowLeft, Ticket } from 'lucide-vue-next'
import { Button } from '@/components/ui/button' import { Button } from '@/components/ui/button'
import { useEvents } from '../composables/useEvents' import { useEvents } from '../composables/useEvents'
import { useOwnedTickets } from '../composables/useOwnedTickets' import { useOwnedTickets } from '../composables/useOwnedTickets'
@ -34,10 +34,23 @@ onMounted(() => {
function handleSelectEvent(event: Event) { function handleSelectEvent(event: Event) {
router.push({ name: 'event-detail', params: { id: event.id } }) router.push({ name: 'event-detail', params: { id: event.id } })
} }
function goBack() {
router.push({ name: 'events' })
}
</script> </script>
<template> <template>
<div class="container mx-auto px-4 py-6 max-w-lg"> <div class="container mx-auto px-4 py-6 max-w-lg">
<!-- Back to the events feed — mirrors EventDetailPage's top-bar
back link for navigation consistency. -->
<div class="flex items-center mb-4">
<Button variant="ghost" size="sm" class="gap-1.5" @click="goBack">
<ArrowLeft class="w-4 h-4" />
{{ t('common.nav.back', 'Back') }}
</Button>
</div>
<!-- Filter chip: narrows the calendar to events the user has <!-- Filter chip: narrows the calendar to events the user has
paid tickets for. Hidden when logged out — nothing to own. paid tickets for. Hidden when logged out — nothing to own.
Left-aligned so it doesn't collide with the fixed top-right Left-aligned so it doesn't collide with the fixed top-right