diff --git a/components/DepositModal.tsx b/components/DepositModal.tsx index 44b6f5d..233cb1f 100644 --- a/components/DepositModal.tsx +++ b/components/DepositModal.tsx @@ -100,11 +100,11 @@ const DepositModal = ({ isOpen, onClose }) => { Number(inputAmount) ) .then(async (_response: string) => { - await sleep(1000) - actions.fetchWalletBalances() - actions.fetchMarginAccounts() setSubmitting(false) onClose() + await sleep(750) + actions.fetchWalletBalances() + actions.fetchMarginAccounts() }) .catch((err) => { setSubmitting(false) diff --git a/hooks/useHydrateStore.tsx b/hooks/useHydrateStore.tsx index 239b509..538ec21 100644 --- a/hooks/useHydrateStore.tsx +++ b/hooks/useHydrateStore.tsx @@ -1,6 +1,6 @@ import { useEffect } from 'react' import { Market } from '@project-serum/serum' -import { AccountInfo } from '@solana/web3.js' +import { AccountInfo, PublicKey } from '@solana/web3.js' import useConnection from './useConnection' import useMangoStore from '../stores/useMangoStore' import useSerumStore from '../stores/useSerumStore' @@ -12,14 +12,16 @@ const _SLOW_REFRESH_INTERVAL = 60 * SECONDS const mangoGroupMarketsSelector = (s) => s.selectedMangoGroup.markets const websocketConnectionSelector = (s) => s.connection.websocket +const selectedMarketAddressSelector = (s) => s.selectedMarket.address const useHydrateStore = () => { const setMangoStore = useMangoStore((s) => s.set) const setSerumStore = useSerumStore((s) => s.set) const marketsForSelectedMangoGroup = useMangoStore(mangoGroupMarketsSelector) const websocketConnection = useMangoStore(websocketConnectionSelector) + const selectedMarketAddress = useMangoStore(selectedMarketAddressSelector) const actions = useMangoStore((s) => s.actions) - const { connection } = useConnection() + const { connection, dexProgramId } = useConnection() const { marketList } = useMarketList() useEffect(() => { @@ -31,6 +33,35 @@ const useHydrateStore = () => { actions.fetchMangoGroup() }, 60 * SECONDS) + // load the selected market and orderbook + useEffect(() => { + Market.load( + connection, + new PublicKey(selectedMarketAddress), + {}, + new PublicKey(dexProgramId) + ) + .then(async (market) => { + const bidAccount = market['_decoded'].bids + const bidInfo = await connection.getAccountInfo(bidAccount) + const askAccount = market['_decoded'].asks + const askInfo = await connection.getAccountInfo(askAccount) + + setMangoStore((state) => { + state.selectedMarket.current = market + state.accountInfos[askAccount.toString()] = askInfo + state.accountInfos[bidAccount.toString()] = bidInfo + }) + }) + .catch((e) => { + console.log({ + message: 'Error loading market', + description: e.message, + type: 'error', + }) + }) + }, [selectedMarketAddress]) + // load all markets for mangoGroup useEffect(() => { Promise.all( diff --git a/hooks/useWallet.tsx b/hooks/useWallet.tsx index a9f6b51..dc66f54 100644 --- a/hooks/useWallet.tsx +++ b/hooks/useWallet.tsx @@ -9,6 +9,7 @@ import { } from '../utils/wallet-adapters' import { WalletAdapter } from '../@types/types' import useInterval from './useInterval' +import { sleep } from '@blockworks-foundation/mango-client' const SECONDS = 1000 const ASSET_URL = @@ -105,6 +106,7 @@ export default function useWallet() { '...' + wallet.publicKey.toString().substr(-5), }) + sleep(500) // wait for margin account before fetching trade history await actions.fetchMarginAccounts() actions.fetchWalletBalances()