add vault stats to contribution modal (#2)
This commit is contained in:
parent
655bb78305
commit
cdd965071d
|
@ -11,6 +11,8 @@ import Slider from './Slider'
|
|||
import Loading from './Loading'
|
||||
import WalletIcon from './WalletIcon'
|
||||
import useLargestAccounts from '../hooks/useLargestAccounts'
|
||||
import useVaults from '../hooks/useVaults'
|
||||
import moment from 'moment'
|
||||
|
||||
const StyledModalWrapper = styled.div`
|
||||
height: 414px;
|
||||
|
@ -44,6 +46,14 @@ const ContributionModal = () => {
|
|||
const connected = useWalletStore((s) => s.connected)
|
||||
const wallet = useWalletStore((s) => s.current)
|
||||
const largestAccounts = useLargestAccounts()
|
||||
const vaults = useVaults()
|
||||
|
||||
const pool = useWalletStore((s) => s.pool)
|
||||
const startIdo = pool ? moment.unix(pool.startIdoTs.toNumber()) : undefined
|
||||
const endIdo = pool ? moment.unix(pool.endIdoTs.toNumber()) : undefined
|
||||
const endDeposits = pool
|
||||
? moment.unix(pool.endDepositsTs.toNumber())
|
||||
: undefined
|
||||
|
||||
const usdcBalance = largestAccounts.usdc?.balance || 0
|
||||
const redeemableBalance = largestAccounts.redeemable?.balance || 0
|
||||
|
@ -280,6 +290,23 @@ const ContributionModal = () => {
|
|||
)}
|
||||
</StyledModalWrapper>
|
||||
<StyledModalBorder animate={submitted && connected} />
|
||||
<p>
|
||||
Start: {startIdo?.fromNow()} ({startIdo?.format()})
|
||||
</p>
|
||||
<p>
|
||||
End Deposits: {endDeposits?.fromNow()} ({endDeposits?.format()})
|
||||
</p>
|
||||
<p>
|
||||
End Withdraws: {endIdo?.fromNow()} ({endIdo?.format()})
|
||||
</p>
|
||||
<p>Current USDC in Pool: {vaults.usdc?.balance || 'N/A'}</p>
|
||||
<p>Locked MNGO in Pool: {vaults.mango?.balance || 'N/A'}</p>
|
||||
<p>
|
||||
Estimated Price per Token:{' '}
|
||||
{vaults.usdc && vaults.mango
|
||||
? vaults.usdc.balance / vaults.mango.balance
|
||||
: 'N/A'}
|
||||
</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,19 +1,7 @@
|
|||
import BN from 'bn.js'
|
||||
import useWalletStore from '../stores/useWalletStore'
|
||||
import { calculateBalance } from '../utils/balance'
|
||||
import { ProgramAccount, TokenAccount } from '../utils/tokens'
|
||||
|
||||
function fixedPointToNumber(value: BN, decimals: number) {
|
||||
const divisor = new BN(10).pow(new BN(decimals))
|
||||
const quotient = value.div(divisor)
|
||||
const remainder = value.mod(divisor)
|
||||
return quotient.toNumber() + remainder.toNumber() / divisor.toNumber()
|
||||
}
|
||||
|
||||
function calculateBalance(mints, account: TokenAccount): number {
|
||||
const mint = mints[account.mint.toBase58()]
|
||||
return mint ? fixedPointToNumber(account.amount, mint.decimals) : 0
|
||||
}
|
||||
|
||||
export function findLargestBalanceAccountForMint(
|
||||
mints,
|
||||
tokenAccounts: ProgramAccount<TokenAccount>[],
|
||||
|
|
|
@ -0,0 +1,26 @@
|
|||
import { useMemo } from 'react'
|
||||
import useWalletStore from '../stores/useWalletStore'
|
||||
import { calculateBalance } from '../utils/balance'
|
||||
|
||||
export default function useVaults() {
|
||||
const mints = useWalletStore((s) => s.mints)
|
||||
const usdcVault = useWalletStore((s) => s.usdcVault)
|
||||
const mangoVault = useWalletStore((s) => s.mangoVault)
|
||||
|
||||
const usdc = useMemo(
|
||||
() =>
|
||||
usdcVault
|
||||
? { account: usdcVault, balance: calculateBalance(mints, usdcVault) }
|
||||
: undefined,
|
||||
[usdcVault, mints]
|
||||
)
|
||||
const mango = useMemo(
|
||||
() =>
|
||||
mangoVault
|
||||
? { account: mangoVault, balance: calculateBalance(mints, mangoVault) }
|
||||
: undefined,
|
||||
[mangoVault, mints]
|
||||
)
|
||||
|
||||
return { usdc, mango }
|
||||
}
|
|
@ -103,10 +103,7 @@ export default function useWallet() {
|
|||
wallet.publicKey.toString().substr(-5),
|
||||
})
|
||||
await actions.fetchPool()
|
||||
await Promise.all([
|
||||
actions.fetchWalletTokenAccounts(),
|
||||
actions.fetchMints(),
|
||||
])
|
||||
await actions.fetchWalletTokenAccounts()
|
||||
})
|
||||
wallet.on('disconnect', () => {
|
||||
setWalletStore((state) => {
|
||||
|
@ -129,8 +126,17 @@ export default function useWallet() {
|
|||
}
|
||||
}, [wallet, setWalletStore])
|
||||
|
||||
// fetch pool on page load
|
||||
useEffect(() => {
|
||||
(async () => {
|
||||
await actions.fetchPool()
|
||||
actions.fetchMints()
|
||||
})()
|
||||
}, [])
|
||||
|
||||
// refresh usdc vault regularly
|
||||
useInterval(async () => {
|
||||
await actions.fetchUsdcVault()
|
||||
actions.fetchUsdcVault()
|
||||
}, 20 * SECONDS)
|
||||
|
||||
return { connected, wallet }
|
||||
|
|
|
@ -30,6 +30,7 @@
|
|||
"@solana/spl-token": "^0.1.3",
|
||||
"@solana/web3.js": "^1.5.0",
|
||||
"immer": "^9.0.1",
|
||||
"moment": "^2.29.1",
|
||||
"next": "latest",
|
||||
"next-themes": "^0.0.14",
|
||||
"rc-slider": "^9.7.2",
|
||||
|
|
|
@ -108,12 +108,11 @@ const useWalletStore = create<WalletStore>((set, get) => ({
|
|||
actions: {
|
||||
async fetchPool() {
|
||||
const connection = get().connection.current
|
||||
const connected = get().connected
|
||||
const wallet = get().current
|
||||
const programId = get().connection.programId
|
||||
|
||||
console.log('fetchPool', connected, poolIdl)
|
||||
if (connection && connected) {
|
||||
console.log('fetchPool', connection, poolIdl)
|
||||
if (connection) {
|
||||
const provider = new anchor.Provider(
|
||||
connection,
|
||||
wallet,
|
||||
|
@ -292,6 +291,7 @@ const useWalletStore = create<WalletStore>((set, get) => ({
|
|||
}
|
||||
|
||||
await actions.fetchWalletTokenAccounts()
|
||||
actions.fetchUsdcVault()
|
||||
},
|
||||
},
|
||||
set: (fn) => set(produce(fn)),
|
||||
|
|
|
@ -0,0 +1,17 @@
|
|||
import BN from 'bn.js'
|
||||
import { MintAccount, TokenAccount } from './tokens'
|
||||
|
||||
function fixedPointToNumber(value: BN, decimals: number) {
|
||||
const divisor = new BN(10).pow(new BN(decimals))
|
||||
const quotient = value.div(divisor)
|
||||
const remainder = value.mod(divisor)
|
||||
return quotient.toNumber() + remainder.toNumber() / divisor.toNumber()
|
||||
}
|
||||
|
||||
export function calculateBalance(
|
||||
mints: { [pk: string]: MintAccount },
|
||||
account: TokenAccount
|
||||
): number {
|
||||
const mint = mints[account.mint.toBase58()]
|
||||
return mint ? fixedPointToNumber(account.amount, mint.decimals) : 0
|
||||
}
|
|
@ -4227,6 +4227,11 @@ modern-normalize@^1.0.0:
|
|||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/modern-normalize/-/modern-normalize-1.0.0.tgz#539d84a1e141338b01b346f3e27396d0ed17601e"
|
||||
|
||||
moment@^2.29.1:
|
||||
version "2.29.1"
|
||||
resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
|
||||
integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
|
||||
|
||||
ms@2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
|
||||
|
|
Loading…
Reference in New Issue