Fix Mini Paystack checkout by redirecting instead of iframe embed.

Paystack blocks checkout in third-party iframes, so payment QRs now navigate to the hosted checkout URL and prefer authorization_url from the initialize response.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/Services/Mini/MiniPaymentService.php

@@ -71,9 +71,18 @@ class MiniPaymentService
             ],
         ]);
 
+        $checkoutUrl = $paystackData['authorization_url']
+            ?? (isset($paystackData['access_code']) && $paystackData['access_code'] !== ''
+                ? 'https://checkout.paystack.com/'.$paystackData['access_code']
+                : '');
+
+        if ($checkoutUrl === '') {
+            throw new RuntimeException('Could not start Paystack checkout. Please try again.');
+        }
+
         return [
             'payment' => $payment,
-            'checkout_url' => 'https://checkout.paystack.com/'.($paystackData['access_code'] ?? ''),
+            'checkout_url' => $checkoutUrl,
         ];
     }
 

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

@@ -19,8 +19,6 @@
           amount: @js(old('amount')),
           loading: false,
           errorMsg: @js(session('error')),
-          showSheet: false,
-          checkoutUrl: '',
           async submitPay() {
               const value = parseFloat(this.amount);
               if (!value || value <= 0) {
@@ -46,9 +44,12 @@
                       this.loading = false;
                       return;
                   }
-                  this.checkoutUrl = data.checkout_url;
-                  this.showSheet = true;
-                  this.loading = false;
+                  if (!data.checkout_url) {
+                      this.errorMsg = 'Could not start payment. Please try again.';
+                      this.loading = false;
+                      return;
+                  }
+                  window.location.assign(data.checkout_url);
               } catch (e) {
                   this.errorMsg = 'Network error. Please try again.';
                   this.loading = false;
@@ -133,7 +134,5 @@
             <p class="mt-4 text-center text-[11px] text-slate-400">Secured by Paystack · Powered by Ladill Mini</p>
         </div>
     </main>
-
-    @include('partials.paystack-sheet')
 </body>
 </html>