From a6a65800a4e6c805d04bdf4e37d23a0f8656896a Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Fri, 1 Aug 2025 21:58:35 +0200
Subject: [PATCH] feat: Update PurchaseTicketDialog to enhance ticket purchase
 confirmation

- Modify PurchaseTicketDialog.vue to improve the ticket purchase success message and display a ticket icon.
- Add a button for users to easily navigate to their tickets area.
- Refactor the layout for better visual presentation of ticket information.
---
 .../events/PurchaseTicketDialog.vue           | 21 ++++++++++++-------
 src/components/layout/Navbar.vue              |  1 -
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/events/PurchaseTicketDialog.vue b/src/components/events/PurchaseTicketDialog.vue
index c273c1d..330a82c 100644
--- a/src/components/events/PurchaseTicketDialog.vue
+++ b/src/components/events/PurchaseTicketDialog.vue
@@ -6,7 +6,7 @@ import { Button } from '@/components/ui/button'
 import { Badge } from '@/components/ui/badge'
 import { useTicketPurchase } from '@/composables/useTicketPurchase'
 import { useAuth } from '@/composables/useAuth'
-import { User, Wallet, CreditCard, Zap } from 'lucide-vue-next'
+import { User, Wallet, CreditCard, Zap, Ticket } from 'lucide-vue-next'
 
 interface Props {
   event: {
@@ -222,16 +222,18 @@ onUnmounted(() => {
         <div class="text-center space-y-2">
           <h3 class="text-lg font-semibold text-green-600">Ticket Purchased Successfully!</h3>
           <p class="text-sm text-muted-foreground">
-            Your ticket has been purchased. Here's your ticket QR code:
+            Your ticket has been purchased and is now available in your tickets area.
           </p>
         </div>
 
-        <div class="bg-muted/50 rounded-lg p-4">
-          <div class="flex flex-col items-center space-y-3">
-            <img :src="ticketQRCode" alt="Ticket QR code" class="w-48 h-48 border rounded-lg" />
-            <div class="text-center w-full">
-              <p class="text-xs text-muted-foreground mb-1">Ticket ID</p>
-              <div class="bg-background border rounded px-2 py-1 max-w-full">
+        <div class="bg-muted/50 rounded-lg p-4 w-full">
+          <div class="text-center space-y-3">
+            <div class="flex justify-center">
+              <Ticket class="w-12 h-12 text-green-600" />
+            </div>
+            <div>
+              <p class="text-sm font-medium">Ticket ID</p>
+              <div class="bg-background border rounded px-2 py-1 max-w-full mt-1">
                 <p class="text-xs font-mono break-all">{{ purchasedTicketId }}</p>
               </div>
             </div>
@@ -239,6 +241,9 @@ onUnmounted(() => {
         </div>
 
         <div class="space-y-3 w-full">
+          <Button @click="() => $router.push('/my-tickets')" class="w-full">
+            View My Tickets
+          </Button>
           <Button variant="outline" @click="handleClose" class="w-full">
             Close
           </Button>
diff --git a/src/components/layout/Navbar.vue b/src/components/layout/Navbar.vue
index a6d7569..c67e99d 100644
--- a/src/components/layout/Navbar.vue
+++ b/src/components/layout/Navbar.vue
@@ -27,7 +27,6 @@ const showProfileDialog = ref(false)
 const navigation = computed<NavigationItem[]>(() => [
   { name: t('nav.home'), href: '/' },
   { name: t('nav.events'), href: '/events' },
-  { name: 'My Tickets', href: '/my-tickets' },
   { name: t('nav.support'), href: '/support' },
 ])