117 lines
5.0 KiB
React
117 lines
5.0 KiB
React
import React from "react";
|
|
|
|
function CompleteConfirmCredit({ onClose, confirmCredit }) {
|
|
const { data } = confirmCredit;
|
|
return (
|
|
<div className="logout-modal-body w-full flex flex-col items-center">
|
|
<div className="content-wrapper w-full h-[32rem]">
|
|
<div className="w-full mb-10">
|
|
<div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl">
|
|
<div className="px-4 md:p-8 py-4 add-fund-info">
|
|
<div className="field w-full mb-3 min-h-[45px]">
|
|
<div
|
|
className={`flex flex-col gap-4 ${
|
|
data?.result !== "Charge success" &&
|
|
"h-[328px] items-center justify-center"
|
|
}`}
|
|
>
|
|
{/* Success Icon for now */}
|
|
<div className="flex items-center w-full justify-center">
|
|
{data?.result == "Charge success" ||
|
|
data?.status == "successful" ? (
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="100"
|
|
height="100"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="green"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
className="feather feather-check-circle"
|
|
>
|
|
<path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path>
|
|
<polyline points="22 4 12 14.01 9 11.01"></polyline>
|
|
</svg>
|
|
) : (
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
width="100"
|
|
height="100"
|
|
stroke="red"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
className="feather feather-x-circle"
|
|
>
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<line x1="15" y1="9" x2="9" y2="15"></line>
|
|
<line x1="9" y1="9" x2="15" y2="15"></line>
|
|
</svg>
|
|
)}
|
|
</div>
|
|
|
|
<div className={`flex items-center`}>
|
|
<h1 className="text-xl font-semibold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
{data?.result == "Charge success" ||
|
|
data?.status == "successful"
|
|
? "Credit was Successful!"
|
|
: "Credit was Unsuccessful"}
|
|
</h1>
|
|
</div>
|
|
|
|
{data?.internal_return >= 0 ? (
|
|
<>
|
|
<div className="flex items-center gap-8">
|
|
<h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
Amount({data?.currency || ""})
|
|
</h1>
|
|
<span className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
{`${data?.symbol || ""} ${
|
|
Number(data?.amount * 0.01).toLocaleString() || ""
|
|
}`}
|
|
</span>
|
|
</div>
|
|
|
|
<div className="flex items-center gap-8">
|
|
<h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
Wallet Balance
|
|
</h1>
|
|
<span className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
{data?.curr_balance}
|
|
</span>
|
|
</div>
|
|
|
|
<div className="flex items-center gap-8">
|
|
<h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
Confirmation Number
|
|
</h1>
|
|
<span className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
|
|
{data?.confirmation}
|
|
</span>
|
|
</div>
|
|
</>
|
|
) : null}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="md:p-8 p-4 add-fund-btn flex justify-end items-center py-4 gap-4">
|
|
<button
|
|
className="px-4 h-11 flex justify-center items-center btn-gradient text-white text-base rounded-full w-[100px]"
|
|
onClick={onClose}
|
|
>
|
|
Ok
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default CompleteConfirmCredit;
|