From ed38cadceeaee3be722ff88824be205cf7037e91 Mon Sep 17 00:00:00 2001
From: Ebube <ebube.ojinta@chiefsoft.com>
Date: Fri, 14 Jul 2023 12:53:05 +0100
Subject: [PATCH] Start credit Api for Dollar acc

---
 src/components/MyWallet/AddFundDollars.jsx    | 40 +++++++++++++++----
 src/components/MyWallet/AddFundPop.jsx        | 22 ++++++----
 src/components/MyWallet/ConfirmAddFund.jsx    | 38 ++++++++++--------
 src/components/MyWallet/Popup/CreditPopup.jsx |  1 +
 4 files changed, 69 insertions(+), 32 deletions(-)

diff --git a/src/components/MyWallet/AddFundDollars.jsx b/src/components/MyWallet/AddFundDollars.jsx
index 65343c6..91f8e05 100644
--- a/src/components/MyWallet/AddFundDollars.jsx
+++ b/src/components/MyWallet/AddFundDollars.jsx
@@ -58,7 +58,7 @@ const initialValues = {
 function AddFundDollars(props) {
   const navigate = useNavigate();
   const apiCall = new usersService();
-
+  let countryWallet = props.walletItem.country;
   const [tab, setTab] = useState("previous");
   const [loader, setLoader] = useState(false);
   const { userDetails } = useSelector((state) => state?.userDetails);
@@ -82,7 +82,7 @@ function AddFundDollars(props) {
     indexOfLastItem
   );
 
-  const handleSubmit = (values, helpers) => {
+  const handleSubmit = async (values, helpers) => {
     props.setInputError("");
     if (!props.input || props.input === "0") {
       props.setInputError("Please Enter Amount");
@@ -99,13 +99,37 @@ function AddFundDollars(props) {
         return;
       }
       setLoader(true);
-      const stateData = {
-        amount: Number(props.input),
-        currency: props.currency,
-        card: prevCardDetails["payment-card"],
-        cardType: "prev",
+      let stateData = {
+        amount: Number(props.input) * 100,
+        currency: props.walletItem?.code,
       };
 
+      try {
+        const res = await apiCall.getStartCredit(stateData);
+        if (res.data.internal_return < 0) {
+          setLoader(false);
+          props.setInputError("An Error Occurred");
+          setTimeout(() => props.setInputError(""), 5000);
+          return;
+        }
+
+        const _response = res.data;
+        stateData.amount = Number(props.input);
+        stateData.card = prevCardDetails["payment-card"];
+        stateData.cardType = "prev";
+        stateData = { ...stateData, ..._response };
+
+        setTimeout(() => {
+          setLoader(false);
+          props.setConfirmCredit({
+            show: true,
+            data: stateData,
+          });
+        }, 1500);
+      } catch (error) {
+        console.log(error);
+      }
+
       return setTimeout(() => {
         props.setConfirmCredit({ show: true, data: stateData });
         setLoader(false);
@@ -142,7 +166,7 @@ function AddFundDollars(props) {
         <div className="flex">
           <form className="add-fund-info flex items-center gap-3">
             <h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
-              {props.currency == "US Dollars" && "Payment Method"}
+              {countryWallet == "US" && "Payment Method"}
             </h1>
             <div className="my-1 flex items-center gap-2">
               <label
diff --git a/src/components/MyWallet/AddFundPop.jsx b/src/components/MyWallet/AddFundPop.jsx
index e8566f5..cf040ab 100644
--- a/src/components/MyWallet/AddFundPop.jsx
+++ b/src/components/MyWallet/AddFundPop.jsx
@@ -6,10 +6,17 @@ import InputCom from "../Helpers/Inputs/InputCom";
 import LoadingSpinner from "../Spinners/LoadingSpinner";
 import AddFundDollars from "./AddFundDollars";
 
-function AddFundPop({ _payment, input, setInput, onClose, setConfirmCredit }) {
+function AddFundPop({
+  _payment,
+  input,
+  setInput,
+  onClose,
+  setConfirmCredit,
+  walletItem,
+}) {
   const navigate = useNavigate();
   const apiCall = new usersService();
-
+  let countryWallet = walletItem?.country;
   const { payment, currency } = _payment;
 
   const [inputError, setInputError] = useState("");
@@ -38,8 +45,8 @@ function AddFundPop({ _payment, input, setInput, onClose, setConfirmCredit }) {
     }
 
     let stateData = {
-      amount: Number(input),
-      currency: currency.toUpperCase(),
+      amount: Number(input) * 100,
+      currency: walletItem?.code,
     };
 
     try {
@@ -92,10 +99,11 @@ function AddFundPop({ _payment, input, setInput, onClose, setConfirmCredit }) {
               </div>
             </form>
 
-            {currency === "US Dollars" && (
+            {countryWallet === "US" && (
               <div className="w-full md:px-8 md:pt-4 px-4 pt-2 bg-white dark:bg-dark-white rounded-2xl">
                 <AddFundDollars
                   setInputError={setInputError}
+                  walletItem={walletItem}
                   input={input}
                   setInput={setInput}
                   currency={currency}
@@ -105,9 +113,9 @@ function AddFundPop({ _payment, input, setInput, onClose, setConfirmCredit }) {
               </div>
             )}
 
-            {currency !== "US Dollars" && <div className="h-[18rem]"></div>}
+            {countryWallet == "NG" && <div className="h-[18rem]"></div>}
 
-            {currency !== "US Dollars" && (
+            {countryWallet == "NG" && (
               <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-base rounded-full text-white"
diff --git a/src/components/MyWallet/ConfirmAddFund.jsx b/src/components/MyWallet/ConfirmAddFund.jsx
index 56ab033..bdf941a 100644
--- a/src/components/MyWallet/ConfirmAddFund.jsx
+++ b/src/components/MyWallet/ConfirmAddFund.jsx
@@ -9,6 +9,7 @@ import { FlutterWaveButton, closePaymentModal } from "flutterwave-react-v3";
 
 function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
   const __confirmData = confirmCredit?.data;
+  const __confirmCountry = walletItem?.country;
   const __confirmCardDetails = __confirmData.card
     ? JSON.parse(__confirmData.card)
     : "";
@@ -46,7 +47,7 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
           loading: false,
           status: true,
         });
-        toast.success("Account Topup was sucessful");
+        toast.success("Account Topup was successful");
         setTimeout(() => {
           navigate("/my-wallet", { replace: true });
         }, 1000);
@@ -91,10 +92,8 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
   };
 
   const handlePrevCard = () => {
-    console.log("Test me")
-  }
-
- 
+    console.log("Test me");
+  };
 
   const ThePaymentText = ({ value }) => (
     <div className="my-2 flex items-center gap-5">
@@ -109,7 +108,7 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
     </div>
   );
 
-  // console.log(confirmCredit);
+  console.log(confirmCredit);
 
   return (
     <div className="content-wrapper w-full h-[32rem]">
@@ -119,7 +118,11 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
             <div className="field w-full mb-3 min-h-[45px]">
               {confirmCredit?.show ? (
                 <div className="flex flex-col gap-4">
-                  <div className="flex items-center gap-4">
+                  <div
+                    className={`flex items-center ${
+                      __confirmCountry == "US" ? "gap-14" : "gap-4"
+                    }`}
+                  >
                     <h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
                       Amount({__confirmData?.currency})
                     </h1>
@@ -129,13 +132,13 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
                       }`}
                     </span>
                   </div>
-                  {__confirmData?.currency == "US Dollars" && (
+                  {__confirmCountry == "US" && (
                     <div className="flex items-center gap-8">
                       <label
                         htmlFor="payment"
                         className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1"
                       >
-                        {__confirmData?.currency && "Payment Method"}
+                        {__confirmCountry == "US" && "Payment Method"}
                       </label>
                       <span className="text-[#181c32] dark:text-white ">
                         {__confirmCardDetails ? (
@@ -147,17 +150,14 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
 
                   <div
                     className={`${
-                      __confirmData?.currency == "US Dollars"
-                        ? "gap-14"
-                        : "gap-6"
+                      __confirmCountry == "US" ? "gap-[3.7rem]" : "gap-6"
                     } flex items-center`}
                   >
                     <h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
                       Reference No
                     </h1>
                     <span className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
-                      {__confirmCardDetails?.card_uid ||
-                        __confirmData?.credit_reference}
+                      {__confirmData?.credit_reference}
                     </span>
                   </div>
                 </div>
@@ -165,7 +165,11 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
             </div>
           </div>
           {/* <hr /> */}
-          <div className={__confirmData?.currency == "US Dollars" ? "min-h-[163px]":"min-h-[200px]"}></div>
+          <div
+            className={
+              __confirmCountry == "US" ? "min-h-[163px]" : "min-h-[200px]"
+            }
+          ></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 border-gradient text-base rounded-full"
@@ -173,7 +177,7 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
             >
               Cancel
             </button>
-            {__confirmData?.currency == "US Dollars" && (
+            {__confirmCountry == "US" && (
               <button
                 className="px-4 h-11 flex justify-center items-center btn-gradient text-white text-base rounded-full"
                 onClick={
@@ -185,7 +189,7 @@ function ConfirmAddFund({ confirmCredit, onClose, walletItem }) {
                 Proceed
               </button>
             )}
-            {__confirmData?.currency == "Naira" && (
+            {__confirmCountry == "NG" && (
               <FlutterWaveButton
                 {...fwConfig}
                 className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
diff --git a/src/components/MyWallet/Popup/CreditPopup.jsx b/src/components/MyWallet/Popup/CreditPopup.jsx
index 059887f..c02d60c 100644
--- a/src/components/MyWallet/Popup/CreditPopup.jsx
+++ b/src/components/MyWallet/Popup/CreditPopup.jsx
@@ -81,6 +81,7 @@ const CreditPopup = ({ details, onClose, situation, walletItem }) => {
           ) : (
             <AddFundPop
               _payment={details}
+              walletItem={walletItem}
               input={input}
               setInput={setInput}
               onClose={onClose}