CHIEFSOFT\ameye
274 lines
17 KiB
React
274 lines
17 KiB
React
import React from "react";
|
|
import bank1 from "../../assets/images/bank-1.png";
|
|
import bank2 from "../../assets/images/bank-2.png";
|
|
import bank3 from "../../assets/images/bank-3.png";
|
|
import bank4 from "../../assets/images/bank-4.png";
|
|
import Layout from "../Partials/Layout";
|
|
import CurrencyStaticsSection from "./CurrencyStaticsSection";
|
|
import CurrentBalanceWidget from "./CurrentBalanceWidget";
|
|
import InvestmentSection from "./InvestmentSection";
|
|
import RecentTransactionWidget from "./RecentTransactionWidget";
|
|
import LoadingSpinner from "../Spinners/LoadingSpinner";
|
|
import WalletItemCard from "./WalletItemCard";
|
|
|
|
export default function WalletBox({wallet, coupon}) {
|
|
return (
|
|
<>
|
|
|
|
<div className="my-wallet-wrapper w-full mb-10">
|
|
<div className="main-wrapper w-full">
|
|
<div className="balance-inquery w-full lg:h-[436px] lg:flex lg:space-x-11 mb-11">
|
|
{wallet.loading ?
|
|
<LoadingSpinner size='16' color='sky-blue' />
|
|
:
|
|
wallet.data.length ?
|
|
wallet.data.map((item, index)=> (
|
|
<div className="lg:w-1/2 h-full mb-10 lg:mb-0">
|
|
<WalletItemCard walletItem={item} />
|
|
</div>
|
|
)) : ''
|
|
}
|
|
|
|
{/*<div className="flex-1">*/}
|
|
{/* <CurrentBalanceWidget />*/}
|
|
{/*</div>*/}
|
|
{/* <div className="flex-1">*/}
|
|
{/* <div className="my-wallets w-full h-full bg-white dark:bg-dark-white rounded-lg p-6">*/}
|
|
{/* <div className="mb-4">*/}
|
|
{/* <h1 className="text-xl font-bold tracking-wide text-dark-gray dark:text-white">*/}
|
|
{/* My Wallet*/}
|
|
{/* </h1>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="content-area">*/}
|
|
{/* <div className="flex justify-between items-center mb-6">*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div className="account-name flex space-x-4 items-center">*/}
|
|
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
|
{/* <img src={bank1} alt="" />*/}
|
|
{/* </div>*/}
|
|
{/* <div className="name">*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
|
{/* MetaMask*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div>*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
|
{/* $734.79*/}
|
|
{/* </p>*/}
|
|
{/* <p className="text-sm text-thin-light-gray">*/}
|
|
{/* New Add*/}
|
|
{/* <span className="text-light-green ml-1">*/}
|
|
{/* +324.75*/}
|
|
{/* </span>*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* <div>*/}
|
|
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
|
{/* <svg*/}
|
|
{/* width="6"*/}
|
|
{/* height="26"*/}
|
|
{/* viewBox="0 0 6 26"*/}
|
|
{/* fill="none"*/}
|
|
{/* className="fill-current"*/}
|
|
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
|
{/* >*/}
|
|
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="12.75"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="22.5"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* </svg>*/}
|
|
{/*</span>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex justify-between items-center mb-6">*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div className="account-name flex space-x-4 items-center">*/}
|
|
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
|
{/* <img src={bank2} alt="" />*/}
|
|
{/* </div>*/}
|
|
{/* <div className="name">*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
|
{/* Coinbase Wallet*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div>*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
|
{/* $734.79*/}
|
|
{/* </p>*/}
|
|
{/* <p className="text-sm text-thin-light-gray">*/}
|
|
{/* New Add*/}
|
|
{/* <span className="text-light-green ml-1">*/}
|
|
{/* +324.75*/}
|
|
{/* </span>*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* <div>*/}
|
|
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
|
{/* <svg*/}
|
|
{/* width="6"*/}
|
|
{/* height="26"*/}
|
|
{/* viewBox="0 0 6 26"*/}
|
|
{/* fill="none"*/}
|
|
{/* className="fill-current"*/}
|
|
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
|
{/* >*/}
|
|
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="12.75"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="22.5"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* </svg>*/}
|
|
{/*</span>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex justify-between items-center mb-6">*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div className="account-name flex space-x-4 items-center">*/}
|
|
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
|
{/* <img src={bank3} alt="" />*/}
|
|
{/* </div>*/}
|
|
{/* <div className="name">*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
|
{/* Bitski*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div>*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
|
{/* $734.79*/}
|
|
{/* </p>*/}
|
|
{/* <p className="text-sm text-thin-light-gray">*/}
|
|
{/* New Add*/}
|
|
{/* <span className="text-light-green ml-1">*/}
|
|
{/* +324.75*/}
|
|
{/* </span>*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* <div>*/}
|
|
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
|
{/* <svg*/}
|
|
{/* width="6"*/}
|
|
{/* height="26"*/}
|
|
{/* viewBox="0 0 6 26"*/}
|
|
{/* fill="none"*/}
|
|
{/* className="fill-current"*/}
|
|
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
|
{/* >*/}
|
|
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="12.75"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="22.5"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* </svg>*/}
|
|
{/*</span>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex justify-between items-center mb-6">*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div className="account-name flex space-x-4 items-center">*/}
|
|
{/* <div className="icon w-14 h-14 transition duration-300 ease-in-out rounded-full flex justify-center items-center bg-light-purple dark:bg-dark-light-purple ">*/}
|
|
{/* <img src={bank4} alt="" />*/}
|
|
{/* </div>*/}
|
|
{/* <div className="name">*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">*/}
|
|
{/* WalletConnect*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* <div className="flex space-x-5 items-center">*/}
|
|
{/* <div>*/}
|
|
{/* <p className="text-xl font-bold text-dark-gray dark:text-white text-right mb-3">*/}
|
|
{/* $734.79*/}
|
|
{/* </p>*/}
|
|
{/* <p className="text-sm text-thin-light-gray">*/}
|
|
{/* New Add*/}
|
|
{/* <span className="text-light-green ml-1">*/}
|
|
{/* +324.75*/}
|
|
{/* </span>*/}
|
|
{/* </p>*/}
|
|
{/* </div>*/}
|
|
{/* <div>*/}
|
|
{/*<span className="dark:text-thin-light-gray text-[#374557]">*/}
|
|
{/* <svg*/}
|
|
{/* width="6"*/}
|
|
{/* height="26"*/}
|
|
{/* viewBox="0 0 6 26"*/}
|
|
{/* fill="none"*/}
|
|
{/* className="fill-current"*/}
|
|
{/* xmlns="http://www.w3.org/2000/svg"*/}
|
|
{/* >*/}
|
|
{/* <circle cx="3" cy="3" r="3" fillOpacity="0.6" />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="12.75"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* <circle*/}
|
|
{/* cx="3"*/}
|
|
{/* cy="22.5"*/}
|
|
{/* r="3"*/}
|
|
{/* fillOpacity="0.6"*/}
|
|
{/* />*/}
|
|
{/* </svg>*/}
|
|
{/*</span>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
{/* </div>*/}
|
|
</div>
|
|
{/* flex space-x-11 */}
|
|
{/*<div className="recent-and-investment grid lg:grid-cols-2 grid-cols-1 2xl:gap-[40px] xl:gap-7 gap-4 lg:h-[416px] w-full justify-between">*/}
|
|
{/* <div className=" h-full">*/}
|
|
{/* <RecentTransactionWidget />*/}
|
|
{/* </div>*/}
|
|
{/* <div className=" h-full">*/}
|
|
{/* <InvestmentSection />*/}
|
|
{/* </div>*/}
|
|
{/*</div>*/}
|
|
</div>
|
|
</div>
|
|
|
|
</>
|
|
);
|
|
}
|