import { useEffect, useState } from "react"; import axios from "axios"; import { useRouter } from "next/router"; import Cookies from "js-cookie"; import { SyncOutlined } from "@ant-design/icons"; import { Spin } from "antd"; import toast from "react-hot-toast"; import ConfirmOrder from "./confirmOrder"; import Head from "next/head"; import Image from "next/image"; // import { orderInterface } from '@/INTERFACES/order'; const apiKey = process.env.NEXT_PUBLIC_API_KEY; let apiLiveKey = process.env.NEXT_PUBLIC_API_LIVE_KEY; const antIcon = ; const PaymentCallback = () => { const router = useRouter(); const { reference } = router.query; const [isOrderPlace, setOrderPlace] = useState(); const [loading, setLoading] = useState(true); const authToken = Cookies.get("jazz_token"); // Configure the Axios instance with the authorization header const axiosInstance = axios.create({ baseURL: "https://api.jazzagain.com/public/index.php", headers: { authorization: `Bearer ${authToken}`, }, }); useEffect(() => { // 🛑 CRITICAL PRODUCTION FIX: Jab tak Next.js router ready na ho, execution roko if (!router.isReady) return; if (!reference) { console.log("Waiting for reference from URL params..."); return; } const verifyPayment = async () => { console.log("PRODUCTION VERIFICATION REFERENCE =>", reference); const primaryKey = process.env.NODE_ENV === "production" ? apiLiveKey : apiKey; const fallbackKey = process.env.NODE_ENV === "production" ? apiKey : apiLiveKey; try { let response; try { response = await axios.get( `https://api.paystack.co/transaction/verify/${reference}`, { headers: { Authorization: `Bearer ${primaryKey}`, }, }, ); } catch (initialError: any) { if (fallbackKey && fallbackKey !== primaryKey) { console.log("Primary key failed, trying fallback key..."); response = await axios.get( `https://api.paystack.co/transaction/verify/${reference}`, { headers: { Authorization: `Bearer ${fallbackKey}`, }, }, ); } else { throw initialError; } } console.log("Paystack verification response:", response.data); const paymentStatus = response.data?.data?.status; const paystackReference = response.data?.data?.reference; console.log("paystackReference:", paystackReference); const orderId = response.data?.data?.metadata?.order_id || response.data?.data?.metadata?.orderResponse?.orderId; console.log("Retrieved OrderID:", orderId); if (paymentStatus !== "success") { toast.error("Payment not successful"); setLoading(false); return; } if (!orderId) { toast.error("Order ID not found in metadata"); setLoading(false); return; } const url = `/api/user/orders/${orderId}/edit`; const res = await axiosInstance.get(url); console.log("Order verification response:", res.data); const orderData = res.data?.order || res.data?.data || res.data; console.log("Order data retrieved:", orderData); setOrderPlace({ ...orderData, paystackReference, orderId, }); setLoading(false); } catch (error: any) { console.error("Error verifying payment:", error); toast.error(error.response?.data?.message || "Verification failed"); setLoading(false); } }; verifyPayment(); }, [reference, router.isReady]); console.log("isOrderPlace:", isOrderPlace); return ( <>