transfer fund implemented

src/components/MyWallet/Balance.jsx

@@ -31,11 +31,11 @@ function Balance({wallet, payment, coupon, purchase}) {
                                 </div>
                                 <div className='balance-info'>
                                     <p className='py-2'>balance</p>
-                                    <span className='text-sm py-1 px-2 bg-green-100 text-green-500 rounded-lg'>{item.symbol}{(item.amount*1).toFixed(2)}</span>
+                                    <span className='text-sm py-1 px-2 bg-green-100 text-green-500 rounded-lg'>{item.symbol}{(item.amount*0.01).toFixed(2)}</span>
                                 </div>
                                 <div className='balance-info'>
                                     <p className='py-2'>Escrow</p>
-                                    <span className='text-sm py-1 px-2 bg-red-100 text-red-500 rounded-lg'>{item.symbol}{(item.escrow*1).toFixed(2)}</span>
+                                    <span className='text-sm py-1 px-2 bg-red-100 text-red-500 rounded-lg'>{item.symbol}{(item.escrow*0.01).toFixed(2)}</span>
                                 </div>
                             </div>
 

src/components/MyWallet/ConfirmTransfer.jsx

@@ -1,10 +1,15 @@
-import React, {useState} from 'react'
+import React, {useState, useEffect} from 'react'
 import {useLocation, useNavigate} from 'react-router-dom'
 import RecentActivityTable from './WalletComponent/RecentActivityTable'
 import LoadingSpinner from '../Spinners/LoadingSpinner'
 import InputCom from '../Helpers/Inputs/InputCom'
+import {toast} from 'react-toastify'
+
+import usersService from '../../services/UsersService'
 
 function ConfirmTransfer({payment, wallet}) {
+    const apiURL = new usersService()
+
     const navigate = useNavigate()
     
     let {state} = useLocation()
@@ -14,107 +19,133 @@ function ConfirmTransfer({payment, wallet}) {
     }
 
     let [requestStatus, setRequestStatus] = useState({message: '', loading: false, status: false})
+    let [pageLoading, setPageLoading] = useState(true)
 
     //FUNCTION TO HANDLE SUBMIT
     const handleSubmit = () => {
-        // let [requestStatus, setRequestStatus] = useState({message: '', loading: true, status: false})
+        setRequestStatus({message: '', loading: true, status: false})
-
+        let reqData = {
-        //valid inputs before submitting. Just for texting remove later
+            amount: Number(state.amount),
-     
+            Fee: Number(state.fee),
+            recipientid: Number(state.recipientID)
+        }
+        apiURL.sendMoney(reqData).then((res)=>{
+            if(res.data.internal_return < 0){
+                setRequestStatus({message: 'Could not perform transaction', loading: false, status: false})
+                return
+            }
+            setRequestStatus({message: 'transfer successful', loading: false, status: true})
+            toast.success('Transfer sucessful')
+            setTimeout(()=>{
+                navigate('/', {replace: true})
+            }, 1000)
+        }).catch(error=>{
+            setRequestStatus({message: 'Opps! something went wrong! Try Again', loading: false, status: false})
+        })
     }
+
+    useEffect(()=>{
+        setPageLoading(false)
+    },[])
     return (
         <div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
-            <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
+            {pageLoading ? 
-                <div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
+                <LoadingSpinner size='8' color='sky-blue' />
-                    <div className='px-4 md:px-8 py-4'>
+            :
-                        {wallet.loading ?
+                (
+                <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
+                    <div className="add-fund w-full bg-white dark:bg-dark-white rounded-2xl shadow">
+                        <div className='px-4 md:px-8 py-4'>
+                            {wallet.loading ?
+                                <LoadingSpinner size='8' color='sky-blue' />
+                                :
+                                wallet.data.length ? 
+                                <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>
+                                {wallet.data.map(item => {
+                                    if(item.description == 'Naira'){
+                                        return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*0.01).toFixed(2)}`
+                                    }
+                                })}
+                                </h2>
+                                :
+                                wallet.error ? 
+                                <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>Opps! An Error Occured</h2>
+                                :
+                                <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>No Wallet Information Found!</h2>
+                            }
+                        </div>
+                        <hr />
+                        <div className='px-4 md:px-8 py-4 add-fund-info'>
+                                <h2 className='my-2 text-slate-900 dark:text-white text-sm xl:text-xl font-medium'>Confirm Withdraw to Account</h2>
+                                {/* AMOUNT */}
+                                <div className="field w-full mb-3">
+                                    <InputCom
+                                        label="Amount:"
+                                        type="text"
+                                        name="amount"
+                                        value={state?.amount || ''}
+                                        disable={true}
+                                    />
+                                </div>
+
+                                {/* RECIPIENT ACC: */}
+                                <div className="field w-full mb-3">
+                                    <InputCom
+                                        label="Recipient Acc:"
+                                        type="text"
+                                        name="recipient"
+                                        value={state?.details.recipient || ''}
+                                        disable={true}
+                                    />
+                                </div>
+
+                                {/* PROCESSING FEE: */}
+                                <div className="field w-full mb-3">
+                                    <InputCom
+                                        label="Processing Fee:"
+                                        type="text"
+                                        name="processingFee"
+                                        value={state?.fee || ''}
+                                        disable={true}
+                                    />
+                                </div>
+
+                                {/* TOTAL */}
+                                <div className="field w-full mb-3">
+                                    <InputCom
+                                        label="Total"
+                                        type="text"
+                                        name="total"
+                                        value={state?.total || ''}
+                                        disable={true}
+                                    />
+                                </div>
+
+                                {/* COMMENT/NOTE */}
+                                <div className="field w-full mb-3">
+                                    <InputCom
+                                        label="Comment/Note:"
+                                        type="text"
+                                        name="comment"
+                                        value={state?.comment || ''}
+                                        disable={true}
+                                    />
+                                </div>
+                        </div>
+
+                        <hr />
+                        {requestStatus.message && <p className={`text-base ${requestStatus.status? 'text-green-500' : 'text-red-500'} px-4 md:px-8 py-4`}>{requestStatus.message}</p>}
+                        <div className='px-4 md:px-8 py-4 add-fund-btn flex justify-end items-center'>
+                            {requestStatus.loading ? 
                             <LoadingSpinner size='8' color='sky-blue' />
                             :
-                            wallet.data.length ? 
+                            <button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Transfer</button>
-                            <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>
+                            }
-                            {wallet.data.map(item => {
-                                if(item.description == 'Naira'){
-                                    return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*1).toFixed(2)}`
-                                }
-                            })}
-                            </h2>
-                            :
-                            wallet.error ? 
-                            <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>Opps! An Error Occured</h2>
-                            :
-                            <h2 className='my-4 text-slate-500 dark:text-white text-sm xl:text-xl font-medium'>No Wallet Information Found!</h2>
-                        }
-                    </div>
-                    <hr />
-                   <div className='px-4 md:px-8 py-4 add-fund-info'>
-                        <h2 className='my-2 text-slate-900 dark:text-white text-sm xl:text-xl font-medium'>Confirm Withdraw to Account</h2>
-                        {/* AMOUNT */}
-                        <div className="field w-full mb-3">
-                            <InputCom
-                                label="Amount:"
-                                type="text"
-                                name="amount"
-                                value={state?.amount || ''}
-                                disable={true}
-                            />
                         </div>
-
-                        {/* RECIPIENT ACC: */}
-                        <div className="field w-full mb-3">
-                            <InputCom
-                                label="Recipient Acc:"
-                                type="text"
-                                name="recipient"
-                                value={state?.details.recipient || ''}
-                                disable={true}
-                            />
-                        </div>
-
-                        {/* PROCESSING FEE: */}
-                        <div className="field w-full mb-3">
-                            <InputCom
-                                label="Processing Fee:"
-                                type="text"
-                                name="processingFee"
-                                value={state?.fee || ''}
-                                disable={true}
-                            />
-                        </div>
-
-                        {/* TOTAL */}
-                        <div className="field w-full mb-3">
-                            <InputCom
-                                label="Total"
-                                type="text"
-                                name="total"
-                                value={state?.total || ''}
-                                disable={true}
-                            />
-                        </div>
-
-                        {/* COMMENT/NOTE */}
-                        <div className="field w-full mb-3">
-                            <InputCom
-                                label="Comment/Note:"
-                                type="text"
-                                name="comment"
-                                value={state?.comment || ''}
-                                disable={true}
-                            />
-                        </div>
-                   </div>
-
-                   
-                    <hr />
-                    <div className='px-4 md:px-8 py-4 add-fund-btn flex justify-end items-center'>
-                        {requestStatus.loading ? 
-                        <LoadingSpinner size='8' color='sky-blue' />
-                        :
-                        <button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Transfer</button>
-                        }
                     </div>
                 </div>
-            </div>
+                )
+            }
     
             <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
                 <div className="wallet w-full px-4 md:px-8 py-4 h-full max-h-[800px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">

src/components/MyWallet/TransferFund.jsx

@@ -103,7 +103,7 @@ function TransferFund({payment, wallet}) {
                                     <h2 className='my-4 py-2 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>
                                     {wallet.data.map(item => {
                                         if(item.description == 'Naira'){
-                                            return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*1).toFixed(2)}`
+                                            return `Withdraw from Naira Wallet : ${item.symbol}${(item.amount*0.01).toFixed(2)}`
                                         }
                                     })}
                                     </h2>

src/components/MyWallet/WalletHeader.jsx

@@ -58,7 +58,7 @@ export default function WalletHeader(props) {
                                             </div>
                                             <div>
                                                 <p className="eth text-xl font-bold text-purple">
-                                                    {(value.amount*1).toFixed(2)} {value.code}
+                                                    {(value.amount*0.01).toFixed(2)} {value.code}
                                                 </p>
                                                 <p className="usd text-base text-thin-light-gray text-right">
                                                     {/*(773.69 USD)*/}

src/services/UsersService.js

@@ -230,6 +230,19 @@ class usersService {
         };
         return this.postAuxEnd("/paymenthx", postData);
     }
+
+    // API FUNCTION TO GET PAYMENT HISTORY
+    sendMoney(reqData){
+        var postData = {
+            uid: localStorage.getItem("uid"),
+            member_id: localStorage.getItem("member_id"),
+            sessionid: localStorage.getItem("session_token"),
+            senderid: localStorage.getItem("member_id"),
+            action: 33020,
+            ...reqData
+        };
+        return this.postAuxEnd("/sendmoney", postData);
+    }
     
     //END POINT CALL FOR REFERRAL HISTORY
     getReferralHx(){