Frame event checkout sheet for ticket buyers.

Use buyer-facing copy, attendee email for gateway receipts, and keep operator wording only for staff wallet top-up.

app/Services/Events/EventRegistrationService.php

@@ -130,16 +130,18 @@ class EventRegistrationService
             ? sprintf('%s — %s', $content['name'] ?? $qrCode->label, $tierName)
             : sprintf('%s ticket — %s', $content['name'] ?? $qrCode->label, $tierName);
 
-        $sellerEmail = trim((string) ($qrCode->user->email ?? ''));
+        // Ticket buyers (not till staff): gateways get the attendee email so
-        if ($sellerEmail === '' || ! str_contains($sellerEmail, '@')) {
+        // receipts and 3DS challenges belong to the person purchasing.
-            $sellerEmail = 'seller+'.($qrCode->user->public_id ?? 'events').'@checkout.ladill.local';
+        $buyerEmail = $email;
+        if ($buyerEmail === '' || ! str_contains($buyerEmail, '@')) {
+            $buyerEmail = 'buyer+'.($registration->reference).'@checkout.ladill.local';
         }
 
         $checkout = $this->gateway->initializeCheckout(
             $qrCode->user,
             $amountMinor,
             (string) ($registration->currency ?? 'GHS'),
-            $sellerEmail,
+            $buyerEmail,
             LadillLink::path($qrCode->short_code, 'register/callback'),
             $registration->reference,
             [
@@ -148,6 +150,7 @@ class EventRegistrationService
                 'registration_reference' => $registration->reference,
                 'qr_code_id' => $qrCode->id,
                 'mode' => $mode,
+                'attendee_email' => $email,
             ],
         );
 

resources/views/components/user/service-topup-modal.blade.php

@@ -118,7 +118,11 @@
                 </button>
             </div>
 
-            @include('partials.paystack-sheet')
+            @include('partials.paystack-sheet', [
+                'audience' => 'operator',
+                'sheetTitle' => 'Add credits',
+                'sheetSubtitle' => 'Complete payment to top up this account.',
+            ])
         </form>
     </div>
 </x-modal>

resources/views/partials/paystack-sheet.blade.php

@@ -1,14 +1,44 @@
 {{--
     Payment checkout shell: bottomsheet on mobile, centered modal on desktop.
+
+    Audiences:
+      - buyer (default): public ticket buyers, donors, shoppers — self-serve checkout
+      - operator: signed-in staff flows such as wallet top-up
+
+    Optional overrides: $sheetTitle, $sheetSubtitle, $sheetFooter, $sheetAria, $iframeTitle
     Requires Alpine ancestor with: showSheet (bool), checkoutUrl (string).
 --}}
+@php
+    $audience = $audience ?? 'buyer';
+    $defaults = match ($audience) {
+        'operator' => [
+            'title' => 'Complete payment',
+            'subtitle' => null,
+            'aria' => 'Complete payment',
+            'iframe' => 'Payment checkout',
+            'footer' => null,
+        ],
+        default => [
+            'title' => 'Complete your payment',
+            'subtitle' => 'Pay securely. You\'ll get a confirmation when it succeeds.',
+            'aria' => 'Complete your payment',
+            'iframe' => 'Secure payment checkout',
+            'footer' => 'Your payment is processed securely. Do not close this window until finished.',
+        ],
+    };
+    $sheetTitle = $sheetTitle ?? $defaults['title'];
+    $sheetSubtitle = $sheetSubtitle ?? $defaults['subtitle'];
+    $sheetAria = $sheetAria ?? $defaults['aria'];
+    $iframeTitle = $iframeTitle ?? $defaults['iframe'];
+    $sheetFooter = $sheetFooter ?? $defaults['footer'];
+@endphp
 <template x-teleport="body">
 <div x-show="showSheet"
      x-cloak
      class="fixed inset-0 z-[9999] flex items-end justify-center md:items-center md:p-6"
      role="dialog"
      aria-modal="true"
-     aria-label="Complete payment">
+     aria-label="{{ $sheetAria }}">
 
     <div class="absolute inset-0 bg-black/60"
          x-show="showSheet"
@@ -32,21 +62,33 @@
          x-transition:leave-start="translate-y-0"
          x-transition:leave-end="translate-y-full"
          @click.stop>
-        <div class="relative flex shrink-0 items-center justify-between border-b border-slate-100 px-4 py-3">
+        <div class="relative flex shrink-0 flex-col gap-0.5 border-b border-slate-100 px-4 pb-3 pt-5">
             <div class="absolute left-1/2 top-2 h-1 w-10 -translate-x-1/2 rounded-full bg-slate-200"></div>
-            <p class="text-sm font-semibold text-slate-800">Complete payment</p>
+            <div class="flex items-start justify-between gap-3">
-            <button type="button" @click="showSheet = false"
+                <div class="min-w-0">
-                    class="rounded-full p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
+                    <p class="text-sm font-semibold text-slate-800">{{ $sheetTitle }}</p>
-                    aria-label="Close">
+                    @if (! empty($sheetSubtitle))
-                <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                        <p class="mt-0.5 text-xs leading-snug text-slate-500">{{ $sheetSubtitle }}</p>
-                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
+                    @endif
-                </svg>
+                </div>
-            </button>
+                <button type="button" @click="showSheet = false"
+                        class="shrink-0 rounded-full p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
+                        aria-label="Close">
+                    <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
+                    </svg>
+                </button>
+            </div>
         </div>
         <iframe :src="showSheet ? checkoutUrl : ''"
                 class="h-full w-full flex-1 border-0"
                 allow="payment *"
-                title="Payment checkout"></iframe>
+                title="{{ $iframeTitle }}"></iframe>
+        @if (! empty($sheetFooter))
+            <p class="shrink-0 border-t border-slate-100 bg-slate-50 px-4 py-2 text-center text-[11px] text-slate-500">
+                {{ $sheetFooter }}
+            </p>
+        @endif
     </div>
 
     {{-- Desktop modal --}}
@@ -59,10 +101,15 @@
          x-transition:leave-start="opacity-100 scale-100"
          x-transition:leave-end="opacity-0 scale-95"
          @click.stop>
-        <div class="flex shrink-0 items-center justify-between border-b border-slate-100 px-5 py-3">
+        <div class="flex shrink-0 items-start justify-between gap-3 border-b border-slate-100 px-5 py-3">
-            <p class="text-sm font-semibold text-slate-800">Complete payment</p>
+            <div class="min-w-0">
+                <p class="text-sm font-semibold text-slate-800">{{ $sheetTitle }}</p>
+                @if (! empty($sheetSubtitle))
+                    <p class="mt-0.5 text-xs leading-snug text-slate-500">{{ $sheetSubtitle }}</p>
+                @endif
+            </div>
             <button type="button" @click="showSheet = false"
-                    class="rounded-full p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
+                    class="shrink-0 rounded-full p-1.5 text-slate-400 transition hover:bg-slate-100 hover:text-slate-700"
                     aria-label="Close">
                 <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
                     <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
@@ -72,7 +119,12 @@
         <iframe :src="showSheet ? checkoutUrl : ''"
                 class="min-h-0 w-full flex-1 border-0"
                 allow="payment *"
-                title="Payment checkout"></iframe>
+                title="{{ $iframeTitle }}"></iframe>
+        @if (! empty($sheetFooter))
+            <p class="shrink-0 border-t border-slate-100 bg-slate-50 px-5 py-2 text-center text-[11px] text-slate-500">
+                {{ $sheetFooter }}
+            </p>
+        @endif
     </div>
 </div>
 </template>

resources/views/public/payment-return.blade.php

@@ -10,7 +10,7 @@
     </style>
 </head>
 <body>
-    <p>Finishing payment…</p>
+    <p>Confirming your payment…</p>
     <script>
         (function () {
             var url = @json($redirect);

resources/views/public/qr/landing.blade.php

@@ -615,7 +615,11 @@
         </div>
         @endif
 
-        @include('partials.paystack-sheet')
+        @include('partials.paystack-sheet', [
+            'audience' => 'buyer',
+            'sheetTitle' => 'Complete your gift',
+            'sheetSubtitle' => 'Pay securely. You\'ll get a confirmation when it succeeds.',
+        ])
     </div>
 </div>
 
@@ -922,7 +926,13 @@
         @endif
     </div>
 
-    @include('partials.paystack-sheet')
+    @include('partials.paystack-sheet', [
+        'audience' => 'buyer',
+        'sheetTitle' => $evMode === 'contributions' ? 'Complete your contribution' : 'Complete your ticket payment',
+        'sheetSubtitle' => $evMode === 'contributions'
+            ? 'Pay securely for your contribution. You\'ll get a confirmation when it succeeds.'
+            : 'Pay securely for your ticket. You\'ll get a confirmation when it succeeds.',
+    ])
 </div>
 
 {{-- ===== ITINERARY ===== --}}
@@ -1514,7 +1524,11 @@
 @endif
 
 @if($acceptsPayment)
-@include('partials.paystack-sheet')
+@include('partials.paystack-sheet', [
+    'audience' => 'buyer',
+    'sheetTitle' => 'Complete your payment',
+    'sheetSubtitle' => 'Pay securely for your order. You\'ll get a confirmation when it succeeds.',
+])
 @endif
 
 </div>{{-- end x-data --}}