import { MinusSmallIcon } from '@heroicons/react/20/solid'
import { DownTriangle, UpTriangle } from './DirectionTriangles'
import FormatNumericValue from './FormatNumericValue'
import { PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
import use24HourChange from 'hooks/use24HourChange'
import { useMemo } from 'react'
import SheenLoader from './SheenLoader'
const MarketChange = ({
market,
size,
}: {
market: PerpMarket | Serum3Market | undefined
size?: 'small'
}) => {
const { loading, spotChange, perpChange } = use24HourChange(market)
const change = useMemo(() => {
if (!market) return
return market instanceof PerpMarket ? perpChange : spotChange
}, [perpChange, spotChange])
return loading ? (
0
? 'text-th-up'
: change < 0
? 'text-th-down'
: 'text-th-fgd-4'
}`}
>
–
) } export default MarketChange