Skip to content

Commit

Permalink
feat: replace APR with APY (#584)
Browse files Browse the repository at this point in the history 
* feat: replace APR with APY

* fix: imports
  • Loading branch information
@Majorfi
Majorfi authored Sep 4, 2024
1 parent 8de143c commit 520f0c9
Show file tree
Hide file tree
Showing 16 changed files with 219 additions and 263 deletions.
44 changes: 0 additions & 44 deletions apps/common/utils/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,3 @@
import {formatUnits, parseUnits} from 'viem';
import {formatPercent, toAddress, toBigInt, toNormalizedValue} from '@builtbymom/web3/utils';
import {
LPYCRV_TOKEN_ADDRESS,
LPYCRV_V2_TOKEN_ADDRESS,
YCRV_CURVE_POOL_ADDRESS,
YVBOOST_TOKEN_ADDRESS,
YVECRV_TOKEN_ADDRESS
} from '@yearn-finance/web-lib/utils/constants';

import type {TYDaemonVault} from '@yearn-finance/web-lib/utils/schemas/yDaemonVaultsSchemas';
import type {TAddress, TDict} from '@builtbymom/web3/types';

Expand All @@ -18,40 +8,6 @@ export function max(input: bigint, balance: bigint): bigint {
return input;
}

export function getVaultAPR(vaults: TDict<TYDaemonVault | undefined>, vaultAddress: string): string {
if (!vaults?.[toAddress(vaultAddress)]) {
return '';
}

if (toAddress(vaultAddress) === YVECRV_TOKEN_ADDRESS || toAddress(vaultAddress) === YVBOOST_TOKEN_ADDRESS) {
return `APY ${formatPercent(0)}`;
}

if (vaults?.[toAddress(vaultAddress)]?.apr?.netAPR) {
return `APY ${formatPercent((vaults?.[toAddress(vaultAddress)]?.apr?.netAPR || 0) * 100, 2, 2, 500)}`;
}
return `APY ${formatPercent(0)}`;
}

export function getAmountWithSlippage(from: string, to: string, value: bigint, slippage: number): number {
const hasLP =
toAddress(from) === LPYCRV_TOKEN_ADDRESS ||
toAddress(to) === LPYCRV_TOKEN_ADDRESS ||
toAddress(from) === LPYCRV_V2_TOKEN_ADDRESS ||
toAddress(to) === LPYCRV_V2_TOKEN_ADDRESS;
const isDirectDeposit =
toAddress(from) === YCRV_CURVE_POOL_ADDRESS ||
toAddress(to) === LPYCRV_TOKEN_ADDRESS ||
toAddress(to) === LPYCRV_V2_TOKEN_ADDRESS;

if (hasLP && !isDirectDeposit) {
const minAmountStr = Number(formatUnits(toBigInt(value), 18));
const minAmountWithSlippage = parseUnits((minAmountStr * (1 - slippage / 100)).toFixed(18) as `${number}`, 18);
return toNormalizedValue(toBigInt(minAmountWithSlippage), 18);
}
return toNormalizedValue(value, 18);
}

export function getVaultName(vault: TYDaemonVault): string {
const baseName = vault.name;
if (baseName.includes(' yVault')) {
Expand Down
6 changes: 3 additions & 3 deletions apps/vaults-v3/components/details/RewardsTab.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ import type {TYDaemonVault} from '@yearn-finance/web-lib/utils/schemas/yDaemonVa
function BoostMessage(props: {currentVault: TYDaemonVault; hasStakingRewardsLive: boolean}): ReactElement {
const hasVaultData = Boolean(props.currentVault.staking.available);
const vaultDataource = props.currentVault.staking.source;
const extraAPR = props.currentVault.apr.extra.stakingRewardsAPR;
const extraAPY = props.currentVault.apr.extra.stakingRewardsAPR;
const {pathname} = useRouter();
const isV3Page = pathname.startsWith(`/v3`);

Expand Down Expand Up @@ -74,7 +74,7 @@ function BoostMessage(props: {currentVault: TYDaemonVault; hasStakingRewardsLive
<b className={'text-lg'}>{'Yield is good, but more yield is good-er!'}</b>
<div className={'mt-2 flex flex-col gap-2'}>
<p>
{`This Vault has an active veYFI gauge which boosts your APR from ${formatAmount(extraAPR * 10)}% to ${formatAmount(extraAPR * 100)}%. Simply deposit and stake to start earning.`}
{`This Vault has an active veYFI gauge which boosts your APY from ${formatAmount(extraAPY * 10)}% to ${formatAmount(extraAPY * 100)}%. Simply deposit and stake to start earning.`}
</p>
<p className={'block'}>
{'Learn more about veYFI rewards in the '}
Expand All @@ -101,7 +101,7 @@ function BoostMessage(props: {currentVault: TYDaemonVault; hasStakingRewardsLive
<b className={'text-lg'}>{'Yield is good, but more yield is good-er!'}</b>
<div className={'mt-2 flex flex-col gap-2'}>
<p>
{`This Vault can be juiced for even more yield. Simply deposit and stake to receive juiced APRs of ${formatAmount(extraAPR * 100)}%.`}
{`This Vault can be juiced for even more yield. Simply deposit and stake to receive juiced APYs of ${formatAmount(extraAPY * 100)}%.`}
</p>
<p className={'block'}>
{'Visit '}
Expand Down
6 changes: 3 additions & 3 deletions apps/vaults-v3/components/details/VaultActionsTabsWrapper.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export function BoostMessage(props: {
const {isAutoStakingEnabled} = useYearn();
const hasStakingRewards = Boolean(props.currentVault.staking.available);
const stakingRewardSource = props.currentVault.staking.source;
const extraAPR = props.currentVault.apr.extra.stakingRewardsAPR;
const extraAPY = props.currentVault.apr.extra.stakingRewardsAPR;

if (
props.currentTab === 0 &&
Expand Down Expand Up @@ -120,7 +120,7 @@ export function BoostMessage(props: {
<div className={'col-span-12 flex p-4 pt-0 md:px-8 md:pb-6'}>
<div className={'w-full rounded-lg bg-[#34A14F] p-2 md:px-6 md:py-4'}>
<b className={'text-base text-white'}>
{`This Vault has an active veYFI gauge which boosts your APR from ${formatAmount(extraAPR * 10)}% to ${formatAmount(extraAPR * 100)}%. Simply deposit and stake to start earning.`}
{`This Vault has an active veYFI gauge which boosts your APY from ${formatAmount(extraAPY * 10)}% to ${formatAmount(extraAPY * 100)}%. Simply deposit and stake to start earning.`}
</b>
<b className={'block text-white'}>
{'Learn more about veYFI rewards in the '}
Expand All @@ -142,7 +142,7 @@ export function BoostMessage(props: {
<div className={'col-span-12 flex p-4 pt-0 md:px-8 md:pb-6'}>
<div className={'w-full rounded-lg bg-[#34A14F] p-2 md:px-6 md:py-4'}>
<b className={'text-base text-white'}>
{`This Vault can be juiced for even more yield. Simply deposit and stake to receive juiced APRs of ${formatAmount(extraAPR * 100)}%.`}
{`This Vault can be juiced for even more yield. Simply deposit and stake to receive juiced APYs of ${formatAmount(extraAPY * 100)}%.`}
</b>
<b className={'block text-white'}>
{'Visit '}
Expand Down
80 changes: 40 additions & 40 deletions apps/vaults-v3/components/details/VaultDetailsHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,39 +65,39 @@ function VaultHeaderLineItem({label, children, legend}: TVaultHeaderLineItemProp
);
}

function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): ReactElement {
const extraAPR = apr.extra.stakingRewardsAPR + apr.extra.gammaRewardAPR;
const monthlyAPR = apr.points.monthAgo;
const weeklyAPR = apr.points.weekAgo;
const netAPR = apr.netAPR + extraAPR;
const currentAPR = apr.forwardAPR.netAPR + extraAPR;
function VaultAPY({apr, source}: {apr: TYDaemonVault['apr']; source: string}): ReactElement {
const extraAPY = apr.extra.stakingRewardsAPR + apr.extra.gammaRewardAPR;
const monthlyAPY = apr.points.monthAgo;
const weeklyAPY = apr.points.weekAgo;
const netAPY = apr.netAPR + extraAPY;
const currentAPY = apr.forwardAPR.netAPR + extraAPY;
const isSourceVeYFI = source === 'VeYFI';

if (apr.forwardAPR.type === '' && extraAPR === 0) {
if (apr.forwardAPR.type === '' && extraAPY === 0) {
return (
<VaultHeaderLineItem label={'Historical APR'}>
<VaultHeaderLineItem label={'Historical APY'}>
<RenderAmount
value={apr.netAPR + extraAPR}
value={netAPY}
symbol={'percent'}
decimals={6}
/>
</VaultHeaderLineItem>
);
}

if (apr.forwardAPR.type !== '' && extraAPR !== 0 && !isSourceVeYFI) {
const boostedAPR = apr.forwardAPR.netAPR + extraAPR;
if (apr.forwardAPR.type !== '' && extraAPY !== 0 && !isSourceVeYFI) {
const boostedAPY = apr.forwardAPR.netAPR + extraAPY;
return (
<VaultHeaderLineItem
label={'Historical APR'}
label={'Historical APY'}
legend={
<span className={'tooltip'}>
<div className={'flex flex-row items-center space-x-2'}>
<div>
{'Est. APR: '}
{'Est. APY: '}
<RenderAmount
shouldHideTooltip={boostedAPR === 0}
value={boostedAPR}
shouldHideTooltip={boostedAPY === 0}
value={boostedAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -113,13 +113,13 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between text-wrap text-left text-neutral-400 md:w-80 md:text-xs'
}>
{'Estimated APR for the next period based on current data.'}
{'Estimated APY for the next period based on current data.'}
</p>
<div
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap py-1 text-neutral-400 md:text-xs'
}>
<p>{'• Base APR '}</p>
<p>{'• Base APY '}</p>
<RenderAmount
shouldHideTooltip
value={apr.forwardAPR.netAPR}
Expand All @@ -132,10 +132,10 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap text-neutral-400 md:text-xs'
}>
<p>{'• Rewards APR '}</p>
<p>{'• Rewards APY '}</p>
<RenderAmount
shouldHideTooltip
value={extraAPR}
value={extraAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -148,7 +148,7 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
shouldRender={!apr?.type.includes('new')}
fallback={'New'}>
<RenderAmount
value={isZero(monthlyAPR) ? weeklyAPR : monthlyAPR}
value={isZero(monthlyAPY) ? weeklyAPY : monthlyAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -158,34 +158,34 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
}

if (isSourceVeYFI) {
const sumOfRewardsAPR = apr.extra.stakingRewardsAPR + apr.extra.gammaRewardAPR;
const veYFIRange = [apr.extra.stakingRewardsAPR / 10 + apr.extra.gammaRewardAPR, sumOfRewardsAPR] as [
const sumOfRewardsAPY = apr.extra.stakingRewardsAPR + apr.extra.gammaRewardAPR;
const veYFIRange = [apr.extra.stakingRewardsAPR / 10 + apr.extra.gammaRewardAPR, sumOfRewardsAPY] as [
number,
number
];
const estAPRRange = [veYFIRange[0] + apr.forwardAPR.netAPR, veYFIRange[1] + apr.forwardAPR.netAPR] as [
const estAPYRange = [veYFIRange[0] + apr.forwardAPR.netAPR, veYFIRange[1] + apr.forwardAPR.netAPR] as [
number,
number
];
return (
<VaultHeaderLineItem
label={'Historical APR'}
label={'Historical APY'}
legend={
<span className={'tooltip'}>
<div className={'flex flex-row items-center space-x-2'}>
<div>
{'Est. APR: '}
{'Est. APY: '}
<Fragment>
<RenderAmount
shouldHideTooltip
value={estAPRRange[0]}
value={estAPYRange[0]}
symbol={'percent'}
decimals={6}
/>
&nbsp;&rarr;&nbsp;
<RenderAmount
shouldHideTooltip
value={estAPRRange[1]}
value={estAPYRange[1]}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -202,13 +202,13 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between text-wrap text-left text-neutral-400 md:w-80 md:text-xs'
}>
{'Estimated APR for the next period based on current data.'}
{'Estimated APY for the next period based on current data.'}
</p>
<div
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap py-1 text-neutral-400 md:text-xs'
}>
<p>{'• Base APR '}</p>
<p>{'• Base APY '}</p>
<RenderAmount
shouldHideTooltip
value={apr.forwardAPR.netAPR}
Expand All @@ -221,7 +221,7 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap text-neutral-400 md:text-xs'
}>
<p>{'• Rewards APR '}</p>
<p>{'• Rewards APY '}</p>
<div>
<RenderAmount
shouldHideTooltip
Expand All @@ -246,7 +246,7 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
shouldRender={!apr?.type.includes('new')}
fallback={'New'}>
<RenderAmount
value={isZero(monthlyAPR) ? weeklyAPR : monthlyAPR}
value={isZero(monthlyAPY) ? weeklyAPY : monthlyAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -257,14 +257,14 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R

return (
<VaultHeaderLineItem
label={'Historical APR'}
label={'Historical APY'}
legend={
<span className={'tooltip'}>
<div className={'flex flex-row items-center space-x-2'}>
<div>
{'Est. APR: '}
{'Est. APY: '}
<RenderAmount
value={isZero(currentAPR) ? netAPR : currentAPR}
value={isZero(currentAPY) ? netAPY : currentAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -280,16 +280,16 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between text-wrap text-left text-neutral-400 md:w-80 md:text-xs'
}>
{'Estimated APR for the next period based on current data.'}
{'Estimated APY for the next period based on current data.'}
</p>
<div
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap py-1 text-neutral-400 md:text-xs'
}>
<p>{'• Base APR '}</p>
<p>{'• Base APY '}</p>
<RenderAmount
shouldHideTooltip
value={isZero(currentAPR) ? netAPR : currentAPR}
value={isZero(currentAPY) ? netAPY : currentAPY}
symbol={'percent'}
decimals={6}
/>
Expand All @@ -299,7 +299,7 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
className={
'font-number flex w-full flex-row justify-between space-x-4 whitespace-nowrap text-neutral-400 md:text-xs'
}>
<p>{'• Rewards APR '}</p>
<p>{'• Rewards APY '}</p>
<p>{'N/A'}</p>
</div>
</div>
Expand All @@ -310,7 +310,7 @@ function VaultAPR({apr, source}: {apr: TYDaemonVault['apr']; source: string}): R
shouldRender={!apr?.type.includes('new')}
fallback={'New'}>
<RenderAmount
value={isZero(monthlyAPR) ? weeklyAPR : monthlyAPR}
value={isZero(monthlyAPY) ? weeklyAPY : monthlyAPY}
symbol={'percent'}
decimals={6}
/>
Expand Down Expand Up @@ -766,7 +766,7 @@ export function VaultDetailsHeader({currentVault}: {currentVault: TYDaemonVault}
</div>

<div className={'w-full'}>
<VaultAPR
<VaultAPY
apr={apr}
source={currentVault.staking.source}
/>
Expand Down
2 changes: 1 addition & 1 deletion apps/vaults-v3/components/details/actions/QuickActionsTo.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ export function VaultDetailsQuickActionsTo(): ReactElement {
<legend
className={'font-number inline text-xs text-neutral-900/50 md:hidden'}
suppressHydrationWarning>
{`APR ${formatPercent(
{`APY ${formatPercent(
(currentVault.apr.netAPR + currentVault.apr.extra.stakingRewardsAPR) * 100,
2,
2,
Expand Down
2 changes: 1 addition & 1 deletion apps/vaults-v3/components/details/tabs/VaultDetailsAbout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export function VaultDetailsAbout({currentVault}: {currentVault: TYDaemonVault})
<div className={'col-span-12 mt-6 w-full space-y-10 md:col-span-5 md:mt-0'}>
<div className={'grid grid-cols-1 gap-x-12 md:grid-cols-1'}>
<div className={'mb-4 md:mb-10'}>
<b className={'text-neutral-900'}>{'APR'}</b>
<b className={'text-neutral-900'}>{'APY'}</b>
<div className={'mt-4 grid grid-cols-3 gap-8'}>
<YearnFeesLineItem label={'Last 7 days'}>
<b className={'font-number text-xl text-neutral-900'}>
Expand Down
4 changes: 2 additions & 2 deletions apps/vaults-v3/components/details/tabs/VaultDetailsStrategies.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,8 +91,8 @@ export function VaultDetailsStrategies({currentVault}: {currentVault: TYDaemonVa
}}
items={[
{label: 'Vault', value: 'name', sortable: true, className: 'col-span-2'},
{label: 'Est. APR', value: 'estAPR', sortable: true, className: 'col-span-2'},
{label: 'Hist. APR', value: 'apr', sortable: true, className: 'col-span-2'},
{label: 'Est. APY', value: 'estAPY', sortable: true, className: 'col-span-2'},
{label: 'Hist. APY', value: 'APY', sortable: true, className: 'col-span-2'},
{label: 'Available', value: 'available', sortable: true, className: 'col-span-2'},
{label: 'Holdings', value: 'deposited', sortable: true, className: 'col-span-2'},
{label: 'Deposits', value: 'tvl', sortable: true, className: 'col-span-2'}
Expand Down
Loading

0 comments on commit 520f0c9

Please sign in to comment.