show apys upfront

This commit is contained in:
saml33 2024-07-17 21:08:38 +10:00
parent 1a8a11084e
commit 22e7f53605
5 changed files with 239 additions and 182 deletions

View File

@ -1,23 +1,19 @@
import Link from 'next/link'
import DiscordIcon from './icons/DiscordIcon'
import { XIcon } from './icons/XIcon'
import MangoMade from './icons/MangoMade'
const Footer = () => {
return (
<>
<div className="my-6 flex items-center justify-between rounded-xl border-2 border-th-fgd-1 bg-th-bkg-1 px-6 py-4">
<a
className="flex items-center space-x-1"
href="https://app.mango.markets"
rel="noopener noreferrer"
className="text-th-fgd-4 focus:outline-none md:hover:text-th-fgd-2"
href="https://mango.markets"
rel="noreferrer noopener"
target="_blank"
>
<span className="font-bold text-th-fgd-1">Powered by</span>
<img
className="h-5 w-5 shrink-0"
src={'/images/mango.svg'}
alt="logo"
/>
<MangoMade className="h-4 w-auto" />
</a>
<div className="flex items-center space-x-4">
<a

View File

@ -112,7 +112,7 @@ const HeroTokenButton = ({
<p className="mb-2">
The max APY is favorable right now. Rates can change
very quickly. Make sure you understand the risks
before boosting.
before using this product.
</p>
<Link href="/risks" shallow>
Risks

View File

@ -8,7 +8,6 @@ import { EnterBottomExitBottom } from './shared/Transitions'
import TokenSelect from './TokenSelect'
import { IconButton } from './shared/Button'
import HeroTokenButton from './HeroTokenButton'
import Image from 'next/image'
import useStakeableTokens, { StakeableToken } from 'hooks/useStakeableTokens'
import { useTheme } from 'next-themes'
@ -28,14 +27,11 @@ export const SOL_YIELD = [
'mangoSOL',
'compassSOL',
]
const USDC_YIELD = ['JLP', 'USDC']
const Stake = () => {
const { theme } = useTheme()
const [tokensToShow, setTokensToShow] = useState('')
const [showTokenSelect, setShowTokenSelect] = useState(false)
const selectedToken = mangoStore((s) => s.selectedToken)
// const walletTokens = mangoStore((s) => s.wallet.tokens)
const { stakeableTokens } = useStakeableTokens()
const handleTokenSelect = useCallback((token: string) => {
@ -47,33 +43,8 @@ const Stake = () => {
const selectableTokens = useMemo(() => {
return stakeableTokens.sort((a: StakeableToken, b: StakeableToken) => {
// const aClientContext = getStakableTokensDataForTokenName(
// a.token.symbol,
// ).clientContext
// const aWalletBalance = walletBalanceForToken(
// walletTokens,
// a.token.symbol,
// aClientContext,
// )
// const bClientContext = getStakableTokensDataForTokenName(
// b.token.symbol,
// ).clientContext
// const bWalletBalance = walletBalanceForToken(
// walletTokens,
// b.token.symbol,
// bClientContext,
// )
// const aMaxAmount = aWalletBalance.maxAmount
// const bMaxAmount = bWalletBalance.maxAmount
const aApy = a.estNetApy
const bApy = b.estNetApy
// if (bMaxAmount !== aMaxAmount) {
// return bMaxAmount - aMaxAmount
// } else {
// return bApy - aApy
// }
return bApy - aApy
})
}, [stakeableTokens])
@ -136,92 +107,26 @@ const Stake = () => {
: `bg-[url('/images/zigzag-repeat-dark.svg')]`
} bg-contain opacity-20`}
/>
<div className="w-full py-6 md:py-8">
<h2 className="mb-3 text-center text-lg font-normal">
I want to earn
</h2>
<div className="grid grid-cols-2 gap-4 text-lg font-bold">
<button
className={`${YIELD_BUTTON_CLASSES} ${
tokensToShow === 'SOL'
? 'after:bg-th-bkg-2 after:md:hover:bg-th-bkg-2'
: ''
}`}
onClick={() => setTokensToShow('SOL')}
>
<div className="mt-1 flex w-full flex-col items-center group-hover:mt-2 group-active:mt-3">
<div className="rounded-full border-4 border-th-bkg-1">
<Image
src={`/icons/sol.svg`}
width={40}
height={40}
alt="Select a token"
/>
</div>
<span className="mt-3 leading-none">SOL</span>
</div>
</button>
<button
className={`${YIELD_BUTTON_CLASSES} ${
tokensToShow === 'USDC'
? 'after:bg-th-bkg-2 after:md:hover:bg-th-bkg-2'
: ''
}`}
onClick={() => setTokensToShow('USDC')}
>
<div className="mt-1 flex w-full flex-col items-center group-hover:mt-2 group-active:mt-3">
<div className="rounded-full border-4 border-th-bkg-1">
<Image
src={`/icons/usdc.svg`}
width={40}
height={40}
alt="Select a token"
/>
</div>
<span className="mt-3 leading-none">USDC</span>
</div>
</button>
</div>
</div>
</div>
{tokensToShow ? (
<>
<div
className={`bg-x-repeat h-2 w-full ${
theme === 'Light'
? `bg-[url('/images/zigzag-repeat.svg')]`
: `bg-[url('/images/zigzag-repeat-dark.svg')]`
} bg-contain opacity-20`}
/>
<div className="space-y-3 pt-6 md:pt-8">
<h2 className="text-center text-lg font-normal">
By adding leverage to
</h2>
{selectableTokens
.filter((t) => {
if (tokensToShow === 'SOL') {
return SOL_YIELD.includes(t.token.symbol)
} else if (tokensToShow === 'USDC') {
return USDC_YIELD.includes(t.token.symbol)
} else return
})
.map((token) => {
const { symbol } = token.token
return (
<HeroTokenButton
key={symbol}
onClick={() =>
set((state) => {
state.selectedToken = symbol
})
}
tokenInfo={token}
/>
)
})}
</div>
</>
) : null}
<div className="space-y-3 pt-6 md:pt-8">
<h2 className="text-center text-lg font-normal">
Select to earn leveraged yield
</h2>
{selectableTokens.map((token) => {
const { symbol } = token.token
return (
<HeroTokenButton
key={symbol}
onClick={() =>
set((state) => {
state.selectedToken = symbol
})
}
tokenInfo={token}
/>
)
})}
</div>
</>
) : (
<>
@ -266,36 +171,6 @@ const Stake = () => {
)}
</div>
</div>
{/* {selectedToken ? (
<div className="fixed bottom-0 left-0 z-20 w-full lg:bottom-8 lg:left-8 lg:w-auto">
{isDesktop ? (
<a
className="raised-button text-shadow group flex h-20 w-20 cursor-pointer items-center justify-center p-3 text-center text-base font-extrabold after:rounded-full"
href={swapUrl}
rel="noopener noreferrer"
target="_blank"
>
<div className="group-hover:mt-1 group-active:mt-2">
<p className="text-th-bkg-1">Buy</p>
<p className="-mt-1.5 text-th-bkg-1">
{formatTokenSymbol(selectedToken)}
</p>
</div>
</a>
) : (
<div className="flex justify-end border-t-2 border-th-fgd-1 bg-th-bkg-1 px-4 py-3">
<a href={swapUrl} rel="noopener noreferrer" target="_blank">
<div className="flex items-center">
<span className="mr-1.5 font-bold">{`Buy ${formatTokenSymbol(
selectedToken,
)}`}</span>
<ArrowTopRightOnSquareIcon className="-mt-0.5 h-5 w-5" />
</div>
</a>
</div>
)}
</div>
) : null} */}
</>
)
}

View File

@ -0,0 +1,176 @@
const MangoMade = ({ className }: { className?: string }) => {
return (
<svg
className={`${className}`}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 160 20"
fill="currentColor"
>
<g clip-path="url(#clip0_238_56)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M79.2508 5.57714C79.2508 5.57724 79.2509 5.57703 79.2508 5.57714C79.8851 5.90256 80.5793 6.01374 81.2435 6.01181C81.6294 6.36625 81.9504 6.78256 82.2521 7.21006C82.3772 7.38863 82.49 7.5755 82.5898 7.76931C82.8204 8.21356 82.9901 8.68356 83.1618 9.15906C83.2121 9.29856 83.2626 9.4385 83.3149 9.57838C83.3313 9.63825 83.3484 9.69819 83.3662 9.75813L83.3671 9.75788C83.6323 10.6673 84.0194 11.6386 84.5381 12.4407C84.7097 12.7041 84.9014 12.9538 85.1124 13.1869C85.1539 13.2319 85.1964 13.2764 85.2389 13.3209C85.4376 13.529 85.6378 13.7388 85.7513 14.001C85.8924 14.3279 85.8816 14.7038 85.7967 15.0497C85.3959 16.6799 83.8259 17.1083 82.3255 17.1478L82.3262 17.1459C81.7636 17.1571 81.2049 17.1152 80.7096 17.0644C80.7096 17.0644 78.3203 16.8171 76.2949 15.3364L76.2296 15.2879C75.9932 15.1117 75.7677 14.9214 75.5543 14.7179C74.9866 14.1761 74.4815 13.5616 74.0953 12.887C74.0979 12.8844 74.1004 12.8818 74.103 12.8793C74.0573 12.797 74.0135 12.7139 73.9715 12.6299C73.5979 11.8821 73.3701 11.068 73.3598 10.2027C73.3422 8.75075 73.839 7.26381 74.7831 6.18577C74.7828 6.18488 74.7825 6.18398 74.7821 6.18309C75.2933 5.62312 75.9323 5.18322 76.6888 4.93277C77.1629 4.77432 77.6608 4.69824 78.1607 4.70784C78.4649 5.06502 78.835 5.36016 79.2508 5.57714ZM78.0869 15.0771C78.4288 14.9523 78.7526 14.7846 79.0546 14.5778C78.7507 14.7831 78.4264 14.9511 78.0869 15.0771Z"
fill="url(#paint0_linear_238_56)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M84.2102 4.39452C84.2105 4.39452 84.2107 4.39452 84.211 4.39451L84.2316 4.38122C81.5677 -0.162882 78.0845 3.41472 78.0845 3.41472L78.0894 3.42348C78.0896 3.42342 78.0892 3.42354 78.0894 3.42348C80.0924 6.93523 83.8985 4.59479 84.2102 4.39452Z"
fill="url(#paint1_linear_238_56)"
/>
<path
d="M80.9079 12.2213C80.1738 13.976 78.7644 15.1379 77.0569 15.3139C77.0202 15.3188 76.5529 15.3557 76.2949 15.3366C78.3202 16.8173 80.7095 17.0646 80.7095 17.0646C81.221 17.1171 81.8 17.1601 82.3812 17.1448C82.5859 16.6106 82.701 15.9988 82.668 15.3048C82.5913 13.6929 83.526 12.8653 84.538 12.4408C84.0194 11.6387 83.6322 10.6674 83.3671 9.75806C82.5768 9.96831 81.573 10.6294 80.9079 12.2213Z"
fill="url(#paint2_linear_238_56)"
/>
<path
d="M82.6362 15.2932C82.6695 15.9872 82.5304 16.6135 82.3257 17.1477C83.8261 17.1082 85.3961 16.6798 85.7969 15.0496C85.8818 14.7037 85.8926 14.3278 85.7514 14.001C85.6137 13.6825 85.3482 13.4416 85.1126 13.1868C84.8922 12.9434 84.6924 12.6821 84.5151 12.4056C83.5038 12.8303 82.5596 13.6815 82.6362 15.2932Z"
fill="url(#paint3_linear_238_56)"
/>
<path
d="M83.3148 9.57836C83.0843 8.96142 82.888 8.34379 82.5896 7.76929C82.4899 7.57542 82.3771 7.38861 82.252 7.21004C81.9503 6.78254 81.6293 6.36623 81.2434 6.01179C80.5793 6.01371 79.8852 5.90221 79.2509 5.57678C78.6085 6.48804 77.8734 8.03392 78.5463 9.79842C79.5399 12.4043 77.5235 14.1852 76.2295 15.2879L76.2949 15.3364C76.5374 15.3554 76.7813 15.3519 77.0233 15.326C78.7306 15.1498 80.2216 13.9599 80.9557 12.2054C81.6211 10.6135 82.5889 10.0089 83.3782 9.79842C83.3559 9.72504 83.3348 9.65167 83.3148 9.57836Z"
fill="url(#paint4_linear_238_56)"
/>
<path
d="M74.8526 6.10828C73.8634 7.19188 73.3418 8.7157 73.3598 10.2029C73.3701 11.0682 73.5979 11.8823 73.9715 12.6301C74.0276 12.7423 74.087 12.853 74.1498 12.9622C76.2294 10.8747 75.4781 7.76426 74.8526 6.10828Z"
fill="url(#paint5_linear_238_56)"
/>
<path
d="M78.5818 9.79844C77.9089 8.03325 78.6275 6.4975 79.2692 5.58642C78.846 5.3686 78.4697 5.07014 78.1611 4.70784C77.6612 4.69824 77.1633 4.77432 76.6892 4.93277C75.9327 5.18322 75.2938 5.62312 74.7826 6.18309C75.3943 7.80269 76.1294 10.8453 74.0957 12.887C74.482 13.5616 74.987 14.1761 75.5547 14.7179C75.7786 14.9314 76.0158 15.1304 76.265 15.3138C77.559 14.2116 79.5753 12.4043 78.5818 9.79844Z"
fill="url(#paint6_linear_238_56)"
/>
<path
d="M81.0904 3.7043C82.4985 4.2599 83.4847 4.41038 84.1997 4.38888L84.2204 4.3756C81.5564 -0.168495 78.0732 3.40911 78.0732 3.40911L78.0783 3.41802C78.8297 3.28484 79.9216 3.24342 81.0904 3.7043Z"
fill="url(#paint7_linear_238_56)"
/>
<path
d="M81.1078 3.67278C79.9398 3.2126 78.8415 3.23008 78.0776 3.41796C80.0807 6.92983 83.8876 4.58894 84.199 4.38882C83.4835 4.41032 82.5159 4.22838 81.1078 3.67278Z"
fill="url(#paint8_linear_238_56)"
/>
<path d="M64.2891 2C65.0781 2 65.793 2.11679 66.4336 2.35036C67.0742 2.58394 67.6172 2.90316 68.0625 3.30803C68.5156 3.7129 68.8633 4.18783 69.1055 4.73285C69.3477 5.27007 69.4688 5.84234 69.4688 6.44963V13.5504C69.4688 14.1577 69.3477 14.7338 69.1055 15.2788C68.8633 15.8161 68.5156 16.2871 68.0625 16.692C67.6172 17.0968 67.0742 17.4161 66.4336 17.6496C65.793 17.8832 65.0781 18 64.2891 18H60.6797C59.8906 18 59.1758 17.8832 58.5352 17.6496C57.8945 17.4161 57.3477 17.0968 56.8945 16.692C56.4492 16.2871 56.1055 15.8161 55.8633 15.2788C55.6211 14.7338 55.5 14.1577 55.5 13.5504V6.44963C55.5 5.84234 55.6211 5.27007 55.8633 4.73285C56.1055 4.18783 56.4492 3.7129 56.8945 3.30803C57.3477 2.90316 57.8945 2.58394 58.5352 2.35036C59.1758 2.11679 59.8906 2 60.6797 2H64.2891ZM66.7031 4.94307L66.5391 3.96204L65.8008 3.2146L64.5938 3.05109H61.4531L60.2578 3.2146L59.5078 3.96204L59.3672 4.94307V10.8292L59.5078 11.8336L60.2812 12.5693L61.4531 12.7095H64.5938L65.8008 12.5693L66.5391 11.8336L66.7031 10.8292V4.94307ZM65.2969 11.3547L64.5234 11.4715H61.5234L60.7617 11.3547L60.5859 10.654V5.05985L60.7031 4.41752L61.5234 4.28905H64.5234L65.3438 4.41752L65.4609 5.10657V10.7007L65.2969 11.3547Z" />
<path d="M47.8125 4.26569H50.8594L52.0664 4.46423L52.3008 3.2146L50.9414 3.05109H47.7891L46.5938 3.23796L45.8438 3.9854L45.6797 4.96642V10.8292L45.8438 11.8336L46.6172 12.5693L47.7891 12.7095H50.7188L51.9023 12.5693L52.6641 11.8336L52.8281 10.8292V7.75766H49.4297V9.0073H51.5859V10.654C51.5469 10.7786 51.5195 10.8954 51.5039 11.0044C51.4883 11.1134 51.4609 11.2302 51.4219 11.3547L50.6484 11.4715H47.8125L47.0977 11.3547L46.9336 10.6073V5.08321L47.0508 4.44088L47.8125 4.26569ZM50.4141 2C51.2031 2 51.918 2.11679 52.5586 2.35036C53.1992 2.58394 53.7422 2.90316 54.1875 3.30803C54.6406 3.7129 54.9883 4.18783 55.2305 4.73285C55.4727 5.27007 55.5938 5.84234 55.5938 6.44963V13.5504C55.5938 14.1577 55.4727 14.7338 55.2305 15.2788C54.9883 15.8161 54.6406 16.2871 54.1875 16.692C53.7422 17.0968 53.1992 17.4161 52.5586 17.6496C51.918 17.8832 51.2031 18 50.4141 18H46.8047C46.0156 18 45.3008 17.8832 44.6602 17.6496C44.0195 17.4161 43.4727 17.0968 43.0195 16.692C42.5742 16.2871 42.2305 15.8161 41.9883 15.2788C41.7461 14.7338 41.625 14.1577 41.625 13.5504V6.44963C41.625 5.84234 41.7461 5.27007 41.9883 4.73285C42.2305 4.18783 42.5742 3.7129 43.0195 3.30803C43.4727 2.90316 44.0195 2.58394 44.6602 2.35036C45.3008 2.11679 46.0156 2 46.8047 2H50.4141Z" />
<path d="M38.7188 4.91971L38.5547 3.93869L37.8047 3.19124L36.6094 3.05109H33.6797L31.5703 3.34307V12.7095H32.8125V4.41752L33.7266 4.26569H36.5391L37.3477 4.39416L37.4648 5.08321V12.7095H38.7188V4.91971ZM36.5391 2C37.3281 2 38.043 2.11679 38.6836 2.35036C39.3242 2.58394 39.8672 2.90316 40.3125 3.30803C40.7656 3.7129 41.1133 4.18783 41.3555 4.73285C41.5977 5.27007 41.7188 5.84234 41.7188 6.44963V13.5504C41.7188 14.1577 41.5977 14.7338 41.3555 15.2788C41.1133 15.8161 40.7656 16.2871 40.3125 16.692C39.8672 17.0968 39.3242 17.4161 38.6836 17.6496C38.043 17.8832 37.3281 18 36.5391 18H32.9297C32.1406 18 31.4258 17.8832 30.7852 17.6496C30.1445 17.4161 29.5977 17.0968 29.1445 16.692C28.6992 16.2871 28.3555 15.8161 28.1133 15.2788C27.8711 14.7338 27.75 14.1577 27.75 13.5504V6.44963C27.75 5.84234 27.8711 5.27007 28.1133 4.73285C28.3555 4.18783 28.6992 3.7129 29.1445 3.30803C29.5977 2.90316 30.1445 2.58394 30.7852 2.35036C31.4258 2.11679 32.1406 2 32.9297 2H36.5391Z" />
<path d="M8.78906 2C9.57812 2 10.293 2.11679 10.9336 2.35036C11.5742 2.58394 12.1172 2.90316 12.5625 3.30803C13.0156 3.7129 13.3633 4.18783 13.6055 4.73285C13.8477 5.27007 13.9688 5.84234 13.9688 6.44963V13.5504C13.9688 14.1577 13.8477 14.7338 13.6055 15.2788C13.3633 15.8161 13.0156 16.2871 12.5625 16.692C12.1172 17.0968 11.5742 17.4161 10.9336 17.6496C10.293 17.8832 9.57812 18 8.78906 18H5.17969C4.39062 18 3.67578 17.8832 3.03516 17.6496C2.39453 17.4161 1.84766 17.0968 1.39453 16.692C0.949219 16.2871 0.605469 15.8161 0.363281 15.2788C0.121094 14.7338 0 14.1577 0 13.5504V6.44963C0 5.84234 0.121094 5.27007 0.363281 4.73285C0.605469 4.18783 0.949219 3.7129 1.39453 3.30803C1.84766 2.90316 2.39453 2.58394 3.03516 2.35036C3.67578 2.11679 4.39062 2 5.17969 2H8.78906ZM6.96094 3.23796L6.31641 3.05109H4.78125L3.79688 3.2146L3.04688 3.96204V12.7095H4.30078V4.39416C4.41016 4.3708 4.50781 4.35523 4.59375 4.34745C4.67969 4.33966 4.77344 4.32019 4.875 4.28905H6.21094C6.29688 4.32019 6.37891 4.33966 6.45703 4.34745C6.54297 4.35523 6.62891 4.3708 6.71484 4.39416V9.34599H7.96875V4.39416L8.47266 4.28905H9.82031C9.91406 4.32019 10.0078 4.33966 10.1016 4.34745C10.1953 4.35523 10.293 4.3708 10.3945 4.39416V12.7095H11.6367V3.96204L10.8984 3.2146L9.91406 3.05109H8.37891L7.74609 3.23796L7.34766 4.0438L6.96094 3.23796Z" />
<path d="M22.7422 1.94531C23.5312 1.94531 24.2461 2.0625 24.8867 2.29688C25.5273 2.53125 26.0703 2.85156 26.5156 3.25781C26.9688 3.66406 27.3164 4.14062 27.5586 4.6875C27.8008 5.22656 27.9219 5.80078 27.9219 6.41016V13.5352C27.9219 14.1445 27.8008 14.7227 27.5586 15.2695C27.3164 15.8086 26.9688 16.2812 26.5156 16.6875C26.0703 17.0938 25.5273 17.4141 24.8867 17.6484C24.2461 17.8828 23.5312 18 22.7422 18H19.1328C18.3438 18 17.6289 17.8828 16.9883 17.6484C16.3477 17.4141 15.8008 17.0938 15.3477 16.6875C14.9023 16.2812 14.5586 15.8086 14.3164 15.2695C14.0742 14.7227 13.9531 14.1445 13.9531 13.5352V6.41016C13.9531 5.80078 14.0742 5.22656 14.3164 4.6875C14.5586 4.14062 14.9023 3.66406 15.3477 3.25781C15.8008 2.85156 16.3477 2.53125 16.9883 2.29688C17.6289 2.0625 18.3438 1.94531 19.1328 1.94531H22.7422ZM23.8203 12.6914H25.1562L24.2305 3.96094L23.5039 3.23438L21.9453 3H20.6914L19.1328 3.23438L18.418 3.96094L17.457 12.6914H18.8516L19.0391 10.1953L19.1562 9.11719H23.4805L23.5977 10.1953L23.8203 12.6914ZM23 4.41797C23.0547 5.05078 23.1172 5.64844 23.1875 6.21094C23.2578 6.77344 23.3242 7.36719 23.3867 7.99219H19.2617L19.6133 4.41797C19.832 4.39453 20.0195 4.36719 20.1758 4.33594C20.3398 4.30469 20.5312 4.27344 20.75 4.24219H21.8984L23 4.41797Z" />
<path d="M150.332 9.16448L153.369 11.7115L156.421 9.15134H156.426V4.39416C156.324 4.3708 156.227 4.35523 156.133 4.34745C156.039 4.33966 155.945 4.32019 155.852 4.28905H154.504L154 4.39416V6.3562H152.746V4.39416C152.66 4.3708 152.574 4.35523 152.488 4.34745C152.41 4.33966 152.328 4.32019 152.242 4.28905H150.906C150.805 4.32019 150.711 4.33966 150.625 4.34745C150.539 4.35523 150.441 4.3708 150.332 4.39416V9.16448Z" />
<path
fillRule="evenodd"
clipRule="evenodd"
d="M156.965 2.35036C156.324 2.11679 155.609 2 154.82 2H151.211C150.422 2 149.707 2.11679 149.066 2.35036C148.426 2.58394 147.879 2.90316 147.426 3.30803C146.98 3.7129 146.637 4.18783 146.395 4.73285C146.152 5.27007 146.031 5.84234 146.031 6.44963V13.5504C146.031 14.1577 146.152 14.7338 146.395 15.2788C146.637 15.8161 146.98 16.2871 147.426 16.692C147.879 17.0968 148.426 17.4161 149.066 17.6496C149.707 17.8832 150.422 18 151.211 18H154.82C155.609 18 156.324 17.8832 156.965 17.6496C157.605 17.4161 158.148 17.0968 158.594 16.692C159.047 16.2871 159.395 15.8161 159.637 15.2788C159.879 14.7338 160 14.1577 160 13.5504V6.44963C160 5.84234 159.879 5.27007 159.637 4.73285C159.395 4.18783 159.047 3.7129 158.594 3.30803C158.148 2.90316 157.605 2.58394 156.965 2.35036ZM152.348 3.05109L152.992 3.23796L153.379 4.0438L153.777 3.23796L154.41 3.05109H155.945L156.93 3.2146L157.668 3.96204V9.42774L157.664 9.43141V9.48552L154.219 12.3747L154.145 12.4253L154.059 12.4876C153.374 13.0053 153.369 13.0015 152.542 12.3925L152.523 12.3786L149.078 9.48942V3.96204L149.828 3.2146L150.812 3.05109H152.348Z"
/>
<path d="M140.852 2C141.641 2 142.355 2.11679 142.996 2.35036C143.637 2.58394 144.18 2.90316 144.625 3.30803C145.078 3.7129 145.426 4.18783 145.668 4.73285C145.91 5.27007 146.031 5.84234 146.031 6.44963V13.5504C146.031 14.1577 145.91 14.7338 145.668 15.2788C145.426 15.8161 145.078 16.2871 144.625 16.692C144.18 17.0968 143.637 17.4161 142.996 17.6496C142.355 17.8832 141.641 18 140.852 18H137.242C136.453 18 135.738 17.8832 135.098 17.6496C134.457 17.4161 133.91 17.0968 133.457 16.692C133.012 16.2871 132.668 15.8161 132.426 15.2788C132.184 14.7338 132.062 14.1577 132.062 13.5504V6.44963C132.062 5.84234 132.184 5.27007 132.426 4.73285C132.668 4.18783 133.012 3.7129 133.457 3.30803C133.91 2.90316 134.457 2.58394 135.098 2.35036C135.738 2.11679 136.453 2 137.242 2H140.852ZM142.387 4.91971L142.211 3.93869L141.473 3.19124L140.289 3.05109H137.746L136.574 3.19124L135.836 3.93869L135.66 4.91971V10.4672L135.836 11.4482L136.574 12.1839L137.746 12.3358H140.699L142.07 12.1606L141.777 10.8993L140.676 11.0861H137.828L137.078 10.9693L136.914 10.2686V7.86277H142.387V4.91971ZM136.914 6.6365V5.05985L137.008 4.39416L137.828 4.26569H140.219L141.016 4.39416L141.133 5.08321V6.6365H136.914Z" />
<path d="M126.977 2C127.766 2 128.48 2.11679 129.121 2.35036C129.762 2.58394 130.305 2.90316 130.75 3.30803C131.203 3.7129 131.551 4.18783 131.793 4.73285C132.035 5.27007 132.156 5.84234 132.156 6.44963V13.5504C132.156 14.1577 132.035 14.7338 131.793 15.2788C131.551 15.8161 131.203 16.2871 130.75 16.692C130.305 17.0968 129.762 17.4161 129.121 17.6496C128.48 17.8832 127.766 18 126.977 18H123.367C122.578 18 121.863 17.8832 121.223 17.6496C120.582 17.4161 120.035 17.0968 119.582 16.692C119.137 16.2871 118.793 15.8161 118.551 15.2788C118.309 14.7338 118.188 14.1577 118.188 13.5504V6.44963C118.188 5.84234 118.309 5.27007 118.551 4.73285C118.793 4.18783 119.137 3.7129 119.582 3.30803C120.035 2.90316 120.582 2.58394 121.223 2.35036C121.863 2.11679 122.578 2 123.367 2H126.977ZM129.414 4.94307L129.25 3.96204L128.512 3.2146L127.305 3.05109H122.078V12.7095H127.305L128.512 12.5693L129.25 11.8336L129.414 10.8292V4.94307ZM128.008 11.3547L127.234 11.4715H123.297V4.28905H127.234L128.055 4.41752L128.172 5.10657V10.7007L128.008 11.3547Z" />
<path d="M99.2266 2C100.016 2 100.73 2.11679 101.371 2.35036C102.012 2.58394 102.555 2.90316 103 3.30803C103.453 3.7129 103.801 4.18783 104.043 4.73285C104.285 5.27007 104.406 5.84234 104.406 6.44963V13.5504C104.406 14.1577 104.285 14.7338 104.043 15.2788C103.801 15.8161 103.453 16.2871 103 16.692C102.555 17.0968 102.012 17.4161 101.371 17.6496C100.73 17.8832 100.016 18 99.2266 18H95.6172C94.8281 18 94.1133 17.8832 93.4727 17.6496C92.832 17.4161 92.2852 17.0968 91.832 16.692C91.3867 16.2871 91.043 15.8161 90.8008 15.2788C90.5586 14.7338 90.4375 14.1577 90.4375 13.5504V6.44963C90.4375 5.84234 90.5586 5.27007 90.8008 4.73285C91.043 4.18783 91.3867 3.7129 91.832 3.30803C92.2852 2.90316 92.832 2.58394 93.4727 2.35036C94.1133 2.11679 94.8281 2 95.6172 2H99.2266ZM97.3984 3.23796L96.7539 3.05109H95.2188L94.2344 3.2146L93.4844 3.96204V12.7095H94.7383V4.39416C94.8477 4.3708 94.9453 4.35523 95.0312 4.34745C95.1172 4.33966 95.2109 4.32019 95.3125 4.28905H96.6484C96.7344 4.32019 96.8164 4.33966 96.8945 4.34745C96.9805 4.35523 97.0664 4.3708 97.1523 4.39416V9.34599H98.4062V4.39416L98.9102 4.28905H100.258C100.352 4.32019 100.445 4.33966 100.539 4.34745C100.633 4.35523 100.73 4.3708 100.832 4.39416V12.7095H102.074V3.96204L101.336 3.2146L100.352 3.05109H98.8164L98.1836 3.23796L97.7852 4.0438L97.3984 3.23796Z" />
<path d="M113.18 1.94531C113.969 1.94531 114.684 2.0625 115.324 2.29688C115.965 2.53125 116.508 2.85156 116.953 3.25781C117.406 3.66406 117.754 4.14062 117.996 4.6875C118.238 5.22656 118.359 5.80078 118.359 6.41016V13.5352C118.359 14.1445 118.238 14.7227 117.996 15.2695C117.754 15.8086 117.406 16.2812 116.953 16.6875C116.508 17.0938 115.965 17.4141 115.324 17.6484C114.684 17.8828 113.969 18 113.18 18H109.57C108.781 18 108.066 17.8828 107.426 17.6484C106.785 17.4141 106.238 17.0938 105.785 16.6875C105.34 16.2812 104.996 15.8086 104.754 15.2695C104.512 14.7227 104.391 14.1445 104.391 13.5352V6.41016C104.391 5.80078 104.512 5.22656 104.754 4.6875C104.996 4.14062 105.34 3.66406 105.785 3.25781C106.238 2.85156 106.785 2.53125 107.426 2.29688C108.066 2.0625 108.781 1.94531 109.57 1.94531H113.18ZM114.258 12.6914H115.594L114.668 3.96094L113.941 3.23438L112.383 3H111.129L109.57 3.23438L108.855 3.96094L107.895 12.6914H109.289L109.477 10.1953L109.594 9.11719H113.918L114.035 10.1953L114.258 12.6914ZM113.438 4.41797C113.492 5.05078 113.555 5.64844 113.625 6.21094C113.695 6.77344 113.762 7.36719 113.824 7.99219H109.699L110.051 4.41797C110.27 4.39453 110.457 4.36719 110.613 4.33594C110.777 4.30469 110.969 4.27344 111.188 4.24219H112.336L113.438 4.41797Z" />
</g>
<defs>
<linearGradient
id="paint0_linear_238_56"
x1="71.8012"
y1="6.83919"
x2="88.09"
y2="16.6003"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#E54033" />
<stop offset="0.489583" stop-color="#FECA1A" />
<stop offset="1" stop-color="#AFD803" />
</linearGradient>
<linearGradient
id="paint1_linear_238_56"
x1="4680.92"
y1="546.556"
x2="3661.19"
y2="-502.379"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.15" stop-color="#6CBF00" />
<stop offset="1" stop-color="#AFD803" />
</linearGradient>
<linearGradient
id="paint2_linear_238_56"
x1="74.6138"
y1="15.4597"
x2="84.8205"
y2="12.9779"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.21" stop-color="#E54033" />
<stop offset="0.84" stop-color="#FECA1A" />
</linearGradient>
<linearGradient
id="paint3_linear_238_56"
x1="82.6555"
y1="14.771"
x2="85.8049"
y2="14.7946"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#FECA1A" />
<stop offset="0.4" stop-color="#FECA1A" />
<stop offset="1" stop-color="#AFD803" />
</linearGradient>
<linearGradient
id="paint4_linear_238_56"
x1="75.5264"
y1="15.5231"
x2="81.9834"
y2="6.78148"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.16" stop-color="#E54033" />
<stop offset="0.84" stop-color="#FECA1A" />
</linearGradient>
<linearGradient
id="paint5_linear_238_56"
x1="74.5862"
y1="6.83745"
x2="74.3003"
y2="12.4836"
gradientUnits="userSpaceOnUse"
>
<stop stop-color="#FECA1A" />
<stop offset="0.76" stop-color="#E54033" />
</linearGradient>
<linearGradient
id="paint6_linear_238_56"
x1="77.7453"
y1="5.3711"
x2="76.0208"
y2="11.9193"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.16" stop-color="#FECA1A" />
<stop offset="1" stop-color="#E54033" />
</linearGradient>
<linearGradient
id="paint7_linear_238_56"
x1="78.4128"
y1="2.23603"
x2="84.7978"
y2="4.58952"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.15" stop-color="#6CBF00" />
<stop offset="1" stop-color="#AFD803" />
</linearGradient>
<linearGradient
id="paint8_linear_238_56"
x1="4680.9"
y1="546.551"
x2="3661.17"
y2="-502.385"
gradientUnits="userSpaceOnUse"
>
<stop offset="0.15" stop-color="#6CBF00" />
<stop offset="1" stop-color="#AFD803" />
</linearGradient>
<clipPath id="clip0_238_56">
<rect width="160" height="20" />
</clipPath>
</defs>
</svg>
)
}
export default MangoMade

View File

@ -1,12 +1,17 @@
import { useQuery } from '@tanstack/react-query'
import { OHLCVPairItem, fetchOHLCPair } from 'apis/birdeye/helpers'
import { SOL_MINT, STAKEABLE_TOKENS_DATA, USDC_MINT } from 'utils/constants'
import {
SOL_MINT,
STAKEABLE_TOKENS_DATA,
StakeableTokensData,
USDC_MINT,
} from 'utils/constants'
const avgOpenClose = (i: OHLCVPairItem) => (i.c + i.o) * 0.5
const sum = (x: number, y: number) => x + y
const ANNUAL_SECONDS = 60 * 60 * 24 * 365
const calculateRate = (ohlcvs: OHLCVPairItem[]) => {
const calculateRateFromOhlcv = (ohlcvs: OHLCVPairItem[]) => {
if (ohlcvs && ohlcvs?.length > 30) {
// basic least squares regression:
// https://www.ncl.ac.uk/webtemplate/ask-assets/external/maths-resources/statistics/regression-and-correlation/simple-linear-regression.html
@ -41,25 +46,16 @@ const fetchRates = async () => {
const dailyCandles = await fetchOHLCPair(t.mint_address, quoteMint, '90')
return dailyCandles
})
const monthlyLstPriceChanges = await fetchApyToSol(STAKEABLE_TOKENS_DATA)
const [
jlpPrices,
msolPrices,
jitoPrices,
bsolPrices,
jsolPrices,
infPrices,
hubSOLPrices,
digitSOLPrices,
dualSOLPrices,
mangoSOLPrices,
compassSOLPrices,
jsolPrices,
] = await Promise.all(promises)
console.log({
digitSOLPrices,
dualSOLPrices,
mangoSOLPrices,
compassSOLPrices,
})
// may be null if the price range cannot be calculated
/*
@ -69,21 +65,20 @@ const fetchRates = async () => {
const lidoRange = getPriceRangeFromPeriod(lidoPrices, PERIOD.DAYS_30)
*/
console.log(monthlyLstPriceChanges)
const rateData: Record<string, number> = {}
rateData.jlp = calculateRate(jlpPrices)?.rate ?? rateData.jlp
rateData.msol = calculateRate(msolPrices)?.rate ?? rateData.msol
rateData.jitosol = calculateRate(jitoPrices)?.rate ?? rateData.jitosol
rateData.bsol = calculateRate(bsolPrices)?.rate ?? rateData.bsol
rateData.jsol = calculateRate(jsolPrices)?.rate ?? rateData.jsol
rateData.inf = calculateRate(infPrices)?.rate ?? rateData.inf
rateData.hubsol = calculateRate(hubSOLPrices)?.rate ?? rateData.hubsol
rateData.digitsol = calculateRate(digitSOLPrices)?.rate ?? rateData.digitsol
rateData.dualsol = calculateRate(dualSOLPrices)?.rate ?? rateData.dualsol
rateData.mangosol = calculateRate(mangoSOLPrices)?.rate ?? rateData.mangosol
rateData.compasssol =
calculateRate(compassSOLPrices)?.rate ?? rateData.compasssol
rateData.jlp = calculateRateFromOhlcv(jlpPrices)?.rate ?? rateData.jlp
rateData.msol = calculateRateFromOhlcv(msolPrices)?.rate ?? rateData.msol
rateData.jitosol =
calculateRateFromOhlcv(jitoPrices)?.rate ?? rateData.jitosol
rateData.bsol = calculateRateFromOhlcv(bsolPrices)?.rate ?? rateData.bsol
rateData.inf = calculateRateFromOhlcv(infPrices)?.rate ?? rateData.inf
rateData.jsol = calculateRateFromOhlcv(jsolPrices)?.rate ?? rateData.jsol
rateData.hubsol = monthlyLstPriceChanges['hubsol'] ?? 0
rateData.digitsol = monthlyLstPriceChanges['digitsol'] ?? 0
rateData.dualsol = monthlyLstPriceChanges['dualsol'] ?? 0
rateData.mangosol = monthlyLstPriceChanges['mangosol'] ?? 0
rateData.compasssol = monthlyLstPriceChanges['compasssol'] ?? 0
return rateData
} catch (e) {
return {}
@ -103,3 +98,18 @@ export default function useStakeRates() {
isLoading: response.isFetching || response.isLoading,
}
}
async function fetchApyToSol(tokensData: StakeableTokensData[]) {
const resp = await fetch(
'https://api.mngo.cloud/data/boost/stats/monthly-sol-price',
)
const json: { data: { mint: string; monthly_price_change: number }[] } =
await resp.json()
const tokenToApy: { [key: string]: number } = {}
for (const token of tokensData) {
const record = json.data.find((x) => x.mint === token.mint_address)
const apy = (1 + (record?.monthly_price_change || 0)) ** 12 - 1
tokenToApy[token.symbol.toLowerCase()] = apy
}
return tokenToApy
}