78 lines
1.9 KiB
TypeScript
78 lines
1.9 KiB
TypeScript
import {PaymentIntention} from "@/interfaces/paymob";
|
|
import {DurationUnit} from "@/interfaces/paypal";
|
|
import {User} from "@/interfaces/user";
|
|
import axios from "axios";
|
|
import {useRouter} from "next/router";
|
|
import {useState} from "react";
|
|
import Button from "./Low/Button";
|
|
import Input from "./Low/Input";
|
|
import Modal from "./Modal";
|
|
|
|
interface Props {
|
|
user: User;
|
|
currency: string;
|
|
price: number;
|
|
setIsPaymentLoading: (v: boolean) => void;
|
|
duration: number;
|
|
duration_unit: DurationUnit;
|
|
onSuccess: (duration: number, duration_unit: DurationUnit) => void;
|
|
}
|
|
|
|
export default function PaymobPayment({user, price, setIsPaymentLoading, currency, duration, duration_unit, onSuccess}: Props) {
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
|
|
const router = useRouter();
|
|
|
|
const handleCardPayment = async () => {
|
|
try {
|
|
setIsPaymentLoading(true);
|
|
|
|
const paymentIntention: PaymentIntention = {
|
|
amount: price * 1000,
|
|
currency: "OMR",
|
|
items: [],
|
|
payment_methods: [],
|
|
customer: {
|
|
email: user.email,
|
|
first_name: user.name.split(" ")[0],
|
|
last_name: [...user.name.split(" ")].pop() || "N/A",
|
|
extras: {
|
|
re: user.id,
|
|
},
|
|
},
|
|
billing_data: {
|
|
apartment: "N/A",
|
|
building: "N/A",
|
|
country: user.demographicInformation?.country || "N/A",
|
|
email: user.email,
|
|
first_name: user.name.split(" ")[0],
|
|
last_name: [...user.name.split(" ")].pop() || "N/A",
|
|
floor: "N/A",
|
|
phone_number: user.demographicInformation?.phone || "N/A",
|
|
state: "N/A",
|
|
street: "N/A",
|
|
},
|
|
extras: {
|
|
userID: user.id,
|
|
duration,
|
|
duration_unit,
|
|
},
|
|
};
|
|
|
|
const response = await axios.post<{iframeURL: string}>(`/api/paymob`, paymentIntention);
|
|
|
|
router.push(response.data.iframeURL);
|
|
} catch (error) {
|
|
console.error("Error starting card payment process:", error);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<Button isLoading={isLoading} onClick={handleCardPayment}>
|
|
Select
|
|
</Button>
|
|
</>
|
|
);
|
|
}
|