show stakings on table

This commit is contained in:
João Geonizeli
2021-08-19 22:15:03 -03:00
parent dec7aadf5f
commit c9764c1eae
2 changed files with 75 additions and 10 deletions

View File

@@ -15,14 +15,56 @@ export const Dashbaord: FC = () => {
if (data?.status === "0" || !data) return null; if (data?.status === "0" || !data) return null;
return ( return (
<div> <div className="grid place-items-center w-full h-5 mt-16">
<ul> <div className="inline-block max-w-3xl shadow rounded-lg overflow-hidden">
<li>Ganho: {data.result.PancakeSwap.staking.totalUSDValues.yield}</li> <table className="min-w-full leading-normal">
<li> <thead>
Depositado: {data.result.PancakeSwap.staking.totalUSDValues.deposit} <tr>
</li> <th
<li>Total: {data.result.PancakeSwap.staking.totalUSDValues.total}</li> scope="col"
</ul> className="px-5 py-3 bg-white border-b border-gray-200 text-gray-800 text-left text-sm uppercase font-normal"
>
Pool
</th>
<th
scope="col"
className="px-5 py-3 bg-white border-b border-gray-200 text-gray-800 text-left text-sm uppercase font-normal"
>
Depositado
</th>
<th
scope="col"
className="px-5 py-3 bg-white border-b border-gray-200 text-gray-800 text-left text-sm uppercase font-normal"
>
Ganho
</th>
</tr>
</thead>
<tbody>
{data.result.PancakeSwap.staking.vaults.map((vault) => {
return (
<tr key={vault.chainId}>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{vault.name}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{vault.depositedTokens.toFixed(4)}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{vault.totalRewards.toFixed(4)}
</p>
</td>
</tr>
);
})}
</tbody>
</table>
</div>
</div> </div>
); );
}; };

View File

@@ -56,9 +56,31 @@ type TotalUSDValues3 = {
total: number; total: number;
}; };
type PoolInfo = {
apr: number;
};
type Vault = {
type: string;
name: string;
platform: string;
chainId: number;
depositToken: string;
rewardToken: string;
depositedTokens: number;
pendingRewards: number;
harvestedRewards: number;
totalRewards: number;
priceInUSDRewardToken: number;
priceInUSDDepositToken: number;
stakingTx: any[];
apy: number;
poolInfo: PoolInfo;
};
type Staking = { type Staking = {
totalUSDValues: TotalUSDValues3; totalUSDValues: TotalUSDValues3;
vaults: any[]; vaults: Vault[];
}; };
type PancakeSwap = { type PancakeSwap = {
@@ -76,10 +98,11 @@ type Result = {
watchBalance: WatchBalance; watchBalance: WatchBalance;
currencies: Currencies; currencies: Currencies;
PancakeSwap: PancakeSwap; PancakeSwap: PancakeSwap;
walletBalance: WalletBalance;
}; };
export type YieldwatchResponse = { export type YieldwatchResponse = {
status: "0" | "1"; status: string;
message: string; message: string;
result: Result; result: Result;
}; };