add function to get logos from market
This commit is contained in:
saml33
parent
1c5bc07351
commit
512ba74009
|
|
@ -7,6 +7,7 @@ import { useTranslation } from 'next-i18next'
|
|||
import { useCallback, useMemo } from 'react'
|
||||
import { DEFAULT_MARKET_NAME } from 'utils/constants'
|
||||
import { formatFixedDecimals } from 'utils/numbers'
|
||||
import { getJupiterLogosAndInfoForMarket } from 'utils/tokens'
|
||||
import MarketLogos from './MarketLogos'
|
||||
|
||||
const MarketSelectDropdown = () => {
|
||||
|
|
@ -28,19 +29,13 @@ const MarketSelectDropdown = () => {
|
|||
|
||||
const [baseLogoURI, quoteLogoURI] = useMemo(() => {
|
||||
if (jupiterTokens.length && selectedMarket && group) {
|
||||
const baseSymbol = group.getFirstBankByTokenIndex(
|
||||
selectedMarket.baseTokenIndex
|
||||
).name
|
||||
const quoteSymbol = group.getFirstBankByTokenIndex(
|
||||
selectedMarket.quoteTokenIndex
|
||||
).name
|
||||
const baseURI = jupiterTokens.find(
|
||||
(t) => t.symbol === baseSymbol
|
||||
)!.logoURI
|
||||
const quoteURI = jupiterTokens.find(
|
||||
(t) => t.symbol === quoteSymbol
|
||||
)!.logoURI
|
||||
return [baseURI, quoteURI]
|
||||
const marketInfo = getJupiterLogosAndInfoForMarket(
|
||||
group!,
|
||||
jupiterTokens,
|
||||
undefined,
|
||||
selectedMarket
|
||||
)
|
||||
return [marketInfo.baseLogoURI, marketInfo.quoteLogoURI]
|
||||
} else {
|
||||
return ['', '']
|
||||
}
|
||||
|
|
@ -65,21 +60,17 @@ const MarketSelectDropdown = () => {
|
|||
<Popover.Panel className="absolute -left-5 top-[46px] z-50 mr-4 w-screen border border-l-0 border-th-bkg-3 bg-th-bkg-1 py-2 sm:w-56 md:top-[37px]">
|
||||
{serumMarkets?.length
|
||||
? serumMarkets.map((m) => {
|
||||
let baseLogoURI = ''
|
||||
let quoteLogoURI = ''
|
||||
const baseSymbol = group?.getFirstBankByTokenIndex(
|
||||
m.baseTokenIndex
|
||||
).name
|
||||
const quoteSymbol = group?.getFirstBankByTokenIndex(
|
||||
m.quoteTokenIndex
|
||||
).name
|
||||
let baseLogo = ''
|
||||
let quoteLogo = ''
|
||||
if (jupiterTokens.length) {
|
||||
baseLogoURI = jupiterTokens.find(
|
||||
(t) => t.symbol === baseSymbol
|
||||
)!.logoURI
|
||||
quoteLogoURI = jupiterTokens.find(
|
||||
(t) => t.symbol === quoteSymbol
|
||||
)!.logoURI
|
||||
const marketInfo = getJupiterLogosAndInfoForMarket(
|
||||
group!,
|
||||
jupiterTokens,
|
||||
undefined,
|
||||
m
|
||||
)
|
||||
baseLogo = marketInfo.baseLogoURI
|
||||
quoteLogo = marketInfo.quoteLogoURI
|
||||
}
|
||||
return (
|
||||
<div
|
||||
|
|
@ -87,10 +78,7 @@ const MarketSelectDropdown = () => {
|
|||
className="flex items-center bg-th-bkg-1 py-2 px-4 hover:cursor-pointer hover:bg-th-bkg-2"
|
||||
onClick={() => handleSelectMarket(m, close)}
|
||||
>
|
||||
<MarketLogos
|
||||
baseURI={baseLogoURI}
|
||||
quoteURI={quoteLogoURI}
|
||||
/>
|
||||
<MarketLogos baseURI={baseLogo} quoteURI={quoteLogo} />
|
||||
<span
|
||||
className={
|
||||
m.name === selectedMarket?.name
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@ import Image from 'next/image'
|
|||
import { useCallback, useMemo, useState } from 'react'
|
||||
import { notify } from 'utils/notifications'
|
||||
import { formatDecimal, formatFixedDecimals } from 'utils/numbers'
|
||||
import { getJupiterLogosAndInfoForMarket } from 'utils/tokens'
|
||||
import MarketLogos from './MarketLogos'
|
||||
|
||||
const TABS = ['Balances', 'Orders']
|
||||
|
|
@ -196,33 +197,19 @@ const OpenOrders = () => {
|
|||
.map(([marketPk, orders]) => {
|
||||
return orders.map((o) => {
|
||||
const group = mangoStore.getState().group
|
||||
const market = group?.getSerum3MarketByPk(
|
||||
const marketInfo = getJupiterLogosAndInfoForMarket(
|
||||
group!,
|
||||
jupiterTokens,
|
||||
new PublicKey(marketPk)
|
||||
)
|
||||
let baseLogoURI = ''
|
||||
let quoteLogoURI = ''
|
||||
const baseSymbol = group?.getFirstBankByTokenIndex(
|
||||
market!.baseTokenIndex
|
||||
).name
|
||||
const quoteSymbol = group?.getFirstBankByTokenIndex(
|
||||
market!.quoteTokenIndex
|
||||
).name
|
||||
if (jupiterTokens.length) {
|
||||
baseLogoURI = jupiterTokens.find(
|
||||
(t) => t.symbol === baseSymbol
|
||||
)!.logoURI
|
||||
quoteLogoURI = jupiterTokens.find(
|
||||
(t) => t.symbol === quoteSymbol
|
||||
)!.logoURI
|
||||
}
|
||||
return (
|
||||
<tr key={`${o.side}${o.size}${o.price}`} className="my-1 p-2">
|
||||
<td className="flex items-center">
|
||||
<MarketLogos
|
||||
baseURI={baseLogoURI}
|
||||
quoteURI={quoteLogoURI}
|
||||
baseURI={marketInfo.baseLogoURI}
|
||||
quoteURI={marketInfo.quoteLogoURI}
|
||||
/>
|
||||
{market?.name}
|
||||
{marketInfo.marketName}
|
||||
</td>
|
||||
<td className="text-right">
|
||||
<SideBadge side={o.side} />
|
||||
|
|
@ -231,7 +218,9 @@ const OpenOrders = () => {
|
|||
<td className="text-right">
|
||||
<span>
|
||||
{o.price}{' '}
|
||||
<span className="text-th-fgd-4">{quoteSymbol}</span>
|
||||
<span className="text-th-fgd-4">
|
||||
{marketInfo.quoteSymbol}
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
<td className="text-right">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,12 @@ import {
|
|||
AccountInfo,
|
||||
} from '@solana/web3.js'
|
||||
import { TokenInstructions } from '@project-serum/serum'
|
||||
import { toUiDecimals } from '@blockworks-foundation/mango-v4'
|
||||
import {
|
||||
Group,
|
||||
Serum3Market,
|
||||
toUiDecimals,
|
||||
} from '@blockworks-foundation/mango-v4'
|
||||
import { Token } from 'types/jupiter'
|
||||
|
||||
export class TokenAccount {
|
||||
publicKey!: PublicKey
|
||||
|
|
@ -97,3 +102,30 @@ export const fetchNftsFromHolaplexIndexer = async (owner: PublicKey) => {
|
|||
const body = await result.json()
|
||||
return body.data
|
||||
}
|
||||
|
||||
export const getJupiterLogosAndInfoForMarket = (
|
||||
group: Group,
|
||||
jupiterTokens: Token[],
|
||||
marketPk?: PublicKey,
|
||||
serumMarket?: Serum3Market
|
||||
) => {
|
||||
const market = serumMarket
|
||||
? serumMarket
|
||||
: group.getSerum3MarketByPk(marketPk!)
|
||||
const baseBank = group.getFirstBankByTokenIndex(market!.baseTokenIndex)
|
||||
const quoteBank = group.getFirstBankByTokenIndex(market!.quoteTokenIndex)
|
||||
const baseLogoURI = jupiterTokens.find(
|
||||
(t) => t.address === baseBank.mint.toString()
|
||||
)!.logoURI
|
||||
const quoteLogoURI = jupiterTokens.find(
|
||||
(t) => t.address === quoteBank.mint.toString()
|
||||
)!.logoURI
|
||||
const marketName = market?.name
|
||||
return {
|
||||
baseLogoURI,
|
||||
baseSymbol: baseBank.name,
|
||||
marketName,
|
||||
quoteLogoURI,
|
||||
quoteSymbol: quoteBank.name,
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue