Files
Users-Wrench/src/components/MyWallet/WalletAction.jsx
T
2024-11-02 06:31:47 +01:00

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;