fix market select search
This commit is contained in:
saml33
parent
e38ce34d55
commit
094b3f5d9e
|
|
@ -67,7 +67,7 @@ const startSearch = (
|
|||
}
|
||||
|
||||
const MarketSelectDropdown = () => {
|
||||
const { t } = useTranslation('common')
|
||||
const { t } = useTranslation(['common', 'trade'])
|
||||
const { selectedMarket } = useSelectedMarket()
|
||||
const [spotOrPerp, setSpotOrPerp] = useState(
|
||||
selectedMarket instanceof PerpMarket ? 'perp' : 'spot',
|
||||
|
|
@ -307,7 +307,7 @@ const MarketSelectDropdown = () => {
|
|||
})}
|
||||
</>
|
||||
) : null}
|
||||
{spotOrPerp === 'spot' && serumMarketsToShow.length ? (
|
||||
{spotOrPerp === 'spot' ? (
|
||||
<>
|
||||
<div className="mb-3 flex items-center justify-between px-4">
|
||||
<div className="relative w-1/2">
|
||||
|
|
@ -372,104 +372,110 @@ const MarketSelectDropdown = () => {
|
|||
/>
|
||||
</p>
|
||||
</div>
|
||||
{serumMarketsToShow.map((m) => {
|
||||
const baseBank = group?.getFirstBankByTokenIndex(
|
||||
m.baseTokenIndex,
|
||||
)
|
||||
const quoteBank = group?.getFirstBankByTokenIndex(
|
||||
m.quoteTokenIndex,
|
||||
)
|
||||
const market = group?.getSerum3ExternalMarket(
|
||||
m.serumMarketExternal,
|
||||
)
|
||||
let leverage
|
||||
if (group) {
|
||||
leverage = m.maxBidLeverage(group)
|
||||
}
|
||||
let price
|
||||
if (baseBank && market && quoteBank) {
|
||||
price = floorToDecimal(
|
||||
baseBank.uiPrice / quoteBank.uiPrice,
|
||||
getDecimalCount(market.tickSize),
|
||||
).toNumber()
|
||||
}
|
||||
{serumMarketsToShow.length ? (
|
||||
serumMarketsToShow.map((m) => {
|
||||
const baseBank = group?.getFirstBankByTokenIndex(
|
||||
m.baseTokenIndex,
|
||||
)
|
||||
const quoteBank = group?.getFirstBankByTokenIndex(
|
||||
m.quoteTokenIndex,
|
||||
)
|
||||
const market = group?.getSerum3ExternalMarket(
|
||||
m.serumMarketExternal,
|
||||
)
|
||||
let leverage
|
||||
if (group) {
|
||||
leverage = m.maxBidLeverage(group)
|
||||
}
|
||||
let price
|
||||
if (baseBank && market && quoteBank) {
|
||||
price = floorToDecimal(
|
||||
baseBank.uiPrice / quoteBank.uiPrice,
|
||||
getDecimalCount(market.tickSize),
|
||||
).toNumber()
|
||||
}
|
||||
|
||||
const volumeData = m?.marketData?.quote_volume_24h
|
||||
const volumeData = m?.marketData?.quote_volume_24h
|
||||
|
||||
const volume = volumeData ? volumeData : 0
|
||||
const volume = volumeData ? volumeData : 0
|
||||
|
||||
return (
|
||||
<div className="flex w-full items-center" key={m.name}>
|
||||
<Link
|
||||
className={MARKET_LINK_CLASSES}
|
||||
href={{
|
||||
pathname: '/trade',
|
||||
query: { name: m.name },
|
||||
}}
|
||||
onClick={() => {
|
||||
close()
|
||||
setSearch('')
|
||||
}}
|
||||
shallow={true}
|
||||
>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<div className="hidden sm:block">
|
||||
<MarketLogos market={m} size="small" />
|
||||
return (
|
||||
<div className="flex w-full items-center" key={m.name}>
|
||||
<Link
|
||||
className={MARKET_LINK_CLASSES}
|
||||
href={{
|
||||
pathname: '/trade',
|
||||
query: { name: m.name },
|
||||
}}
|
||||
onClick={() => {
|
||||
close()
|
||||
setSearch('')
|
||||
}}
|
||||
shallow={true}
|
||||
>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<div className="hidden sm:block">
|
||||
<MarketLogos market={m} size="small" />
|
||||
</div>
|
||||
<span className="mr-1.5 text-xs text-th-fgd-2">
|
||||
{m.name}
|
||||
</span>
|
||||
{leverage ? (
|
||||
<LeverageBadge leverage={leverage} />
|
||||
) : null}
|
||||
</div>
|
||||
<span className="mr-1.5 text-xs text-th-fgd-2">
|
||||
{m.name}
|
||||
</span>
|
||||
{leverage ? (
|
||||
<LeverageBadge leverage={leverage} />
|
||||
) : null}
|
||||
<div className="col-span-1 flex justify-end">
|
||||
{price && market?.tickSize ? (
|
||||
<span className="font-mono text-xs text-th-fgd-2">
|
||||
{quoteBank?.name === 'USDC' ? '$' : ''}
|
||||
{getDecimalCount(market.tickSize) <= 6
|
||||
? formatNumericValue(
|
||||
price,
|
||||
getDecimalCount(market.tickSize),
|
||||
)
|
||||
: price.toExponential(3)}
|
||||
{quoteBank?.name !== 'USDC' ? (
|
||||
<span className="font-body text-th-fgd-3">
|
||||
{' '}
|
||||
{quoteBank?.name}
|
||||
</span>
|
||||
) : null}
|
||||
</span>
|
||||
) : null}
|
||||
</div>
|
||||
<div className="col-span-1 flex justify-end">
|
||||
<MarketChange market={m} size="small" />
|
||||
</div>
|
||||
<div className="col-span-1 hidden sm:flex sm:justify-end">
|
||||
{loadingMarketData ? (
|
||||
<SheenLoader className="mt-0.5">
|
||||
<div className="h-3.5 w-12 bg-th-bkg-2" />
|
||||
</SheenLoader>
|
||||
) : (
|
||||
<span className="font-mono text-xs text-th-fgd-2">
|
||||
{quoteBank?.name === 'USDC' ? '$' : ''}
|
||||
{volume ? numberCompacter.format(volume) : 0}
|
||||
{quoteBank?.name !== 'USDC' ? (
|
||||
<span className="font-body text-th-fgd-3">
|
||||
{' '}
|
||||
{quoteBank?.name}
|
||||
</span>
|
||||
) : null}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
<div className="px-3">
|
||||
<FavoriteMarketButton market={m} />
|
||||
</div>
|
||||
<div className="col-span-1 flex justify-end">
|
||||
{price && market?.tickSize ? (
|
||||
<span className="font-mono text-xs text-th-fgd-2">
|
||||
{quoteBank?.name === 'USDC' ? '$' : ''}
|
||||
{getDecimalCount(market.tickSize) <= 6
|
||||
? formatNumericValue(
|
||||
price,
|
||||
getDecimalCount(market.tickSize),
|
||||
)
|
||||
: price.toExponential(3)}
|
||||
{quoteBank?.name !== 'USDC' ? (
|
||||
<span className="font-body text-th-fgd-3">
|
||||
{' '}
|
||||
{quoteBank?.name}
|
||||
</span>
|
||||
) : null}
|
||||
</span>
|
||||
) : null}
|
||||
</div>
|
||||
<div className="col-span-1 flex justify-end">
|
||||
<MarketChange market={m} size="small" />
|
||||
</div>
|
||||
<div className="col-span-1 hidden sm:flex sm:justify-end">
|
||||
{loadingMarketData ? (
|
||||
<SheenLoader className="mt-0.5">
|
||||
<div className="h-3.5 w-12 bg-th-bkg-2" />
|
||||
</SheenLoader>
|
||||
) : (
|
||||
<span className="font-mono text-xs text-th-fgd-2">
|
||||
{quoteBank?.name === 'USDC' ? '$' : ''}
|
||||
{volume ? numberCompacter.format(volume) : 0}
|
||||
{quoteBank?.name !== 'USDC' ? (
|
||||
<span className="font-body text-th-fgd-3">
|
||||
{' '}
|
||||
{quoteBank?.name}
|
||||
</span>
|
||||
) : null}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
<div className="px-3">
|
||||
<FavoriteMarketButton market={m} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
)
|
||||
})
|
||||
) : (
|
||||
<p className="mb-2 mt-4 text-center">
|
||||
{t('trade:no-markets-found')}
|
||||
</p>
|
||||
)}
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -53,6 +53,7 @@
|
|||
"min-order-size-error": "Min order size is {{minSize}} {{symbol}}",
|
||||
"more-details": "More Details",
|
||||
"no-balances": "No balances",
|
||||
"no-markets-found": "No markets found...",
|
||||
"no-orders": "No open orders",
|
||||
"no-positions": "No perp positions",
|
||||
"no-unsettled": "No unsettled funds",
|
||||
|
|
|
|||
|
|
@ -53,6 +53,7 @@
|
|||
"min-order-size-error": "Min order size is {{minSize}} {{symbol}}",
|
||||
"more-details": "More Details",
|
||||
"no-balances": "No balances",
|
||||
"no-markets-found": "No markets found...",
|
||||
"no-orders": "No open orders",
|
||||
"no-positions": "No perp positions",
|
||||
"no-unsettled": "No unsettled funds",
|
||||
|
|
|
|||
|
|
@ -53,6 +53,7 @@
|
|||
"min-order-size-error": "Min order size is {{minSize}} {{symbol}}",
|
||||
"more-details": "More Details",
|
||||
"no-balances": "No balances",
|
||||
"no-markets-found": "No markets found...",
|
||||
"no-orders": "No open orders",
|
||||
"no-positions": "No perp positions",
|
||||
"no-unsettled": "No unsettled funds",
|
||||
|
|
|
|||
|
|
@ -53,6 +53,7 @@
|
|||
"min-order-size-error": "订单的最小数量是 {{minSize}} {{symbol}}",
|
||||
"more-details": "看细节",
|
||||
"no-balances": "无余额",
|
||||
"no-markets-found": "No markets found...",
|
||||
"no-orders": "无订单",
|
||||
"no-positions": "无持仓",
|
||||
"no-unsettled": "无未结清余额",
|
||||
|
|
|
|||
|
|
@ -53,6 +53,7 @@
|
|||
"min-order-size-error": "訂單的最小數量是 {{minSize}} {{symbol}}",
|
||||
"more-details": "看細節",
|
||||
"no-balances": "無餘額",
|
||||
"no-markets-found": "No markets found...",
|
||||
"no-orders": "無訂單",
|
||||
"no-positions": "無持倉",
|
||||
"no-unsettled": "無未結清餘額",
|
||||
|
|
|
|||
Loading…
Reference in New Issue