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;
return (
<div>
<ul>
<li>Ganho: {data.result.PancakeSwap.staking.totalUSDValues.yield}</li>
<li>
Depositado: {data.result.PancakeSwap.staking.totalUSDValues.deposit}
</li>
<li>Total: {data.result.PancakeSwap.staking.totalUSDValues.total}</li>
</ul>
<div className="grid place-items-center w-full h-5 mt-16">
<div className="inline-block max-w-3xl shadow rounded-lg overflow-hidden">
<table className="min-w-full leading-normal">
<thead>
<tr>
<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"
>
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>
);
};

View File

@@ -56,9 +56,31 @@ type TotalUSDValues3 = {
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 = {
totalUSDValues: TotalUSDValues3;
vaults: any[];
vaults: Vault[];
};
type PancakeSwap = {
@@ -76,10 +98,11 @@ type Result = {
watchBalance: WatchBalance;
currencies: Currencies;
PancakeSwap: PancakeSwap;
walletBalance: WalletBalance;
};
export type YieldwatchResponse = {
status: "0" | "1";
status: string;
message: string;
result: Result;
};