123 lines
3.6 KiB
React
123 lines
3.6 KiB
React
import React, { useEffect, useState } from "react";
|
|
import usersService from "../../services/UsersService";
|
|
import ConfirmNairaWithdraw from "./Popup/ConfirmNairaWithdraw";
|
|
import NairaWithdraw from "./Popup/NairaWithdraw";
|
|
import VirtualAddCardPopout from "./walletvirtual/VirtualAddCardPopout";
|
|
import WalletExtraActionBtn from "./WalletExtraActionBtn";
|
|
|
|
function WalletAction({ walletItem, payment, openPopUp }) {
|
|
|
|
// virtual add card popout
|
|
const [virtualPopup, setVirtualPopup] = useState({ show: false, data: {} });
|
|
|
|
/*OPENS the virtual add card popout*/
|
|
const openVirtualPopUp = (value) => {
|
|
setVirtualPopup({
|
|
show: true,
|
|
data: { ...value },
|
|
});
|
|
};
|
|
|
|
/*Closes the virtual add card popout*/
|
|
const closeVirtualPopUp = () => {
|
|
setVirtualPopup({ show: false, data: {} });
|
|
// dispatch(tableReload({ type: "WALLETTABLE" }));
|
|
};
|
|
|
|
const [showNairaWithdraw, setShowNairaWithdraw] = useState({
|
|
show: false,
|
|
state: {},
|
|
}); // DETERMINES WHEN NAIRA WITHDRAWAL POPS UP
|
|
|
|
const [showConfirmNairaWithdraw, setShowConfirmNairaWithdraw] = useState({
|
|
show: false,
|
|
state: {},
|
|
}); // DETERMINES WHEN CONFIRM NAIRA WITHDRAWAL POPS UP
|
|
|
|
return (
|
|
<div className="counters w-full flex justify-between gap-2">
|
|
<div className="w-1/2 flex justify-start items-center">
|
|
<button
|
|
onClick={() => {
|
|
walletItem?.code == 'NAIRA' ?
|
|
setShowNairaWithdraw((prev) => ({ ...prev, show: true }))
|
|
: walletItem?.code == 'USD' ?
|
|
openVirtualPopUp({walletItem})
|
|
:
|
|
()=>{}
|
|
}}
|
|
className={`${
|
|
walletItem?.code != "NAIRA" && ""
|
|
} logout-btn btn-gradient text-white`}
|
|
>
|
|
{/* Spend */}
|
|
{walletItem?.code == 'NAIRA' ?
|
|
walletItem?.extra_actions?.SPEND_FROM_BALANCE[0]?.text
|
|
: walletItem?.code == 'USD' ?
|
|
walletItem?.extra_actions?.ADD_VIRTUAL_CARD[0]?.text
|
|
:
|
|
'View'
|
|
}
|
|
</button>
|
|
{/* <WalletExtraActionBtn /> // TO BE USED lATER */}
|
|
</div>
|
|
<div className="w-1/2 flex justify-end items-center">
|
|
<button
|
|
className="logout-btn btn-gradient text-white"
|
|
onClick={() => {
|
|
openPopUp({
|
|
payment: payment,
|
|
currency: walletItem?.description,
|
|
});
|
|
}}
|
|
>
|
|
Add Credit
|
|
</button>
|
|
</div>
|
|
|
|
{showNairaWithdraw.show && (
|
|
<NairaWithdraw
|
|
wallet={walletItem}
|
|
action={() => {
|
|
setShowNairaWithdraw((prev) => ({
|
|
...prev,
|
|
show: !prev.show,
|
|
}));
|
|
}}
|
|
situation={showNairaWithdraw.show}
|
|
state={showNairaWithdraw.state}
|
|
setShowConfirmNairaWithdraw={setShowConfirmNairaWithdraw}
|
|
/>
|
|
)}
|
|
|
|
{showConfirmNairaWithdraw.show && (
|
|
<ConfirmNairaWithdraw
|
|
wallet={walletItem}
|
|
state={showConfirmNairaWithdraw.state}
|
|
action={() => {
|
|
setShowConfirmNairaWithdraw((prev) => ({
|
|
...prev,
|
|
show: !prev.show,
|
|
}));
|
|
}}
|
|
setShowNairaWithdraw={setShowNairaWithdraw}
|
|
situation={showConfirmNairaWithdraw.show}
|
|
/>
|
|
)}
|
|
|
|
{/* VIRTUAL CARD POPOUT */}
|
|
{virtualPopup.show && (
|
|
<VirtualAddCardPopout
|
|
details={virtualPopup.data}
|
|
walletItem={walletItem}
|
|
onClose={closeVirtualPopUp}
|
|
situation={virtualPopup.show}
|
|
/>
|
|
)}
|
|
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default WalletAction;
|