Skip to content

Commit

Permalink
...
Browse files Browse the repository at this point in the history
  • Loading branch information
@apexearth
apexearth committed Jan 12, 2024
1 parent 7c1e337 commit e00e452
Show file tree
Hide file tree
Showing 3 changed files with 52 additions and 35 deletions.
77 changes: 43 additions & 34 deletions pages/proof-of-yield/[timestamp]/[strategy].tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ const YieldSourceStrategy = ({
.startOf("day")
.subtract(days + smoothingDays, "days")
.toDate(),
moment.utc().endOf("day").add(1, "day").toDate(),
moment.utc().endOf("day").add(999, "day").toDate(),
),
{
keepPreviousData: true,
Expand Down Expand Up @@ -97,12 +97,19 @@ const YieldSourceStrategy = ({
...data,
apySMA: calcSma(data.apy),
}))
.slice(historyBase.length - days, historyBase.length - 1);
.slice(historyBase.length - days, historyBase.length);
}, [historyBase]);

const latestDailyYield = history?.[history.length - 1];
const latestDailyYieldDay = latestDailyYield?.timestamp.slice(0, 10);

const previousDailyYield = history?.[history.length - 2];
const previousDailyYieldDay = previousDailyYield?.timestamp.slice(0, 10);

const allocation = latestDailyYield?.balance;
const apy = previousDailyYield?.apy;
const earnings = latestDailyYield?.earnings;

return (
<>
<Head>
Expand All @@ -118,12 +125,12 @@ const YieldSourceStrategy = ({
<GradientButton
small
href={`/proof-of-yield/${timestamp}`}
className="h-8 flex items-center justify-center"
className="h-7 w-10 flex items-center justify-center"
>
<Image
src={assetRootPath("/images/arrow-left.svg")}
width="8"
height="11"
width="7"
height="10"
alt="arrow-left"
style={{ marginLeft: -2 }}
/>
Expand All @@ -135,13 +142,10 @@ const YieldSourceStrategy = ({
<Container>
<ContainerHeader small>Strategy</ContainerHeader>
<ContainerBody className="pb-4">
<div className="mb-4 flex flex-wrap gap-x-4">
<div className="mb-4">
<div className="flex items-center text-3xl">
{strategy.name}
</div>
<div className="flex items-center text-2xl text-origin-white/70">
{latestDailyYieldDay}
</div>
</div>
<ExternalLinkButton
href={`https://etherscan.io/address/${strategy.address}`}
Expand All @@ -162,23 +166,21 @@ const YieldSourceStrategy = ({
/>
</div>
<div className="flex flex-wrap justify-center font-bold text-lg md:text-2xl leading-[32px] md:leading-[48px]">
{latestDailyYield === undefined
{allocation === undefined
? "..."
: Number(
formatEther(BigInt(latestDailyYield.balance)),
).toLocaleString("en-US", {
notation: "compact",
minimumFractionDigits: 3,
maximumFractionDigits: 3,
})}
{latestDailyYield?.balance && (
: Number(formatEther(BigInt(allocation))).toLocaleString(
"en-US",
{
notation: "compact",
minimumFractionDigits: 3,
maximumFractionDigits: 3,
},
)}
{allocation && (
<span className="font-normal ml-2 text-origin-white/70">
(
{`${dn.format(
dn.mul(
dn.div(latestDailyYield.balance, totalBalance, 18),
100,
),
dn.mul(dn.div(allocation, totalBalance, 18), 100),
{
digits: 1,
trailingZeros: true,
Expand All @@ -193,15 +195,13 @@ const YieldSourceStrategy = ({
<div className="flex items-center text-sm leading-8">
APY
<Tooltip
info={`APY on ${latestDailyYieldDay}`}
info={`APY on ${previousDailyYieldDay}`}
className="mx-2"
tooltipClassName="whitespace-nowrap text-center"
/>
</div>
<div className="font-bold text-lg md:text-2xl leading-[32px] md:leading-[48px]">
{latestDailyYield === undefined
? "..."
: `${(latestDailyYield.apy * 100).toFixed(1)}%`}
{apy === undefined ? "..." : `${(apy * 100).toFixed(1)}%`}
</div>
</div>
<div className="flex flex-col items-center justify-center h-32">
Expand All @@ -214,15 +214,16 @@ const YieldSourceStrategy = ({
/>
</div>
<div className="font-bold text-lg md:text-2xl leading-[32px] md:leading-[48px]">
{latestDailyYield === undefined
{earnings === undefined
? "..."
: Number(
formatEther(BigInt(latestDailyYield.earnings)),
).toLocaleString("en-US", {
notation: "compact",
minimumFractionDigits: 2,
maximumFractionDigits: 2,
})}
: Number(formatEther(BigInt(earnings))).toLocaleString(
"en-US",
{
notation: "compact",
minimumFractionDigits: 2,
maximumFractionDigits: 2,
},
)}
</div>
</div>
</ContainerBody>
Expand Down Expand Up @@ -403,6 +404,14 @@ const YieldSourceStrategy = ({
</div>
</ContainerBody>
</Container>
<Container>
<ContainerHeader className="font-normal">
How yield is generated
</ContainerHeader>
<ContainerBody className="text-origin-white/70">
{strategy.yieldDescription}
</ContainerBody>
</Container>
</div>
<div className="hidden xl:flex flex-col gap-4 md:gap-8">
<StrategyInfo strategy={strategy} />
Expand Down
2 changes: 1 addition & 1 deletion sections/proof-of-yield/YieldSources.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ const YieldSources = ({
<Header className="justify-end" tooltip={`Allocation on ${to}`}>
Allocation
</Header>
<Header />
<Header className="w-2 md:w-8" />
</tr>
</thead>
{/* Content */}
Expand Down
8 changes: 8 additions & 0 deletions sections/proof-of-yield/utils/strategies.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { uniq } from "lodash";
import protocolMapping from "../../../constants/protocolMapping";

export interface StrategyInfo {
key: string;
Expand All @@ -7,6 +8,7 @@ export interface StrategyInfo {
protocol: string;
protocolHref: string; // Link to protocol website
name: string;
yieldDescription?: string;
asset: string;
assetName: string;
assetSymbol: string;
Expand All @@ -22,6 +24,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Frax",
protocolHref: "https://frax.finance/",
name: "Staked Frax Ether",
yieldDescription: protocolMapping.Frax.description,
asset: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
assetName: "Frax ETH",
assetSymbol: "frxETH",
Expand All @@ -35,6 +38,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Convex",
protocolHref: "https://www.convexfinance.com/",
name: "Convex ETH+OETH Curve pool",
yieldDescription: protocolMapping.Convex.description,
asset: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
assetName: "Curve Pool",
assetSymbol: "ETH+OETH",
Expand All @@ -48,6 +52,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Aura",
protocolHref: "https://aura.finance/",
name: "Aura WETH+rETH Balancer pool",
yieldDescription: protocolMapping.Aura.description,
asset: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
assetName: "Balancer Pool",
assetSymbol: "WETH+rETH",
Expand All @@ -61,6 +66,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Lido",
protocolHref: "https://lido.fi/",
name: "Lido Staked Ether",
yieldDescription: protocolMapping.Lido.description,
asset: "0xae7ab96520de3a18e5e111b5eaab095312d7fe84",
assetName: "Lido Staked Ether",
assetSymbol: "stETH",
Expand All @@ -74,6 +80,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Rocket Pool",
protocolHref: "https://rocketpool.net/",
name: "Rocket Pool ETH",
yieldDescription: protocolMapping.RocketPool.description,
asset: "0xae78736cd615f374d3085123a210448e74fc6393",
assetName: "Rocket Pool ETH",
assetSymbol: "rETH",
Expand All @@ -87,6 +94,7 @@ export const strategies: StrategyInfo[] = [
protocol: "Aave",
protocolHref: "https://aave.com/",
name: "Aave V2 Optimizer WETH",
yieldDescription: protocolMapping.Morpho.description,
asset: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
assetName: "Wrapped Ether",
assetSymbol: "WETH",
Expand Down

0 comments on commit e00e452

Please sign in to comment.