remove market section stats
This commit is contained in:
parent
4227e97a79
commit
545be5abe7
|
@ -6,12 +6,7 @@ import {
|
||||||
} from '../../../contentful/tokenPage'
|
} from '../../../contentful/tokenPage'
|
||||||
import ButtonLink from '../shared/ButtonLink'
|
import ButtonLink from '../shared/ButtonLink'
|
||||||
import SectionWrapper from '../shared/SectionWrapper'
|
import SectionWrapper from '../shared/SectionWrapper'
|
||||||
import HeroStat from './HeroStat'
|
import { fetchMangoTokensData } from '../../utils/mango'
|
||||||
import {
|
|
||||||
fetchAppStatsData,
|
|
||||||
fetchMangoMarketData,
|
|
||||||
fetchMangoTokensData,
|
|
||||||
} from '../../utils/mango'
|
|
||||||
import { useMemo } from 'react'
|
import { useMemo } from 'react'
|
||||||
import SheenLoader from '../shared/SheenLoader'
|
import SheenLoader from '../shared/SheenLoader'
|
||||||
import { CUSTOM_TOKEN_ICONS } from '../../utils/constants'
|
import { CUSTOM_TOKEN_ICONS } from '../../utils/constants'
|
||||||
|
@ -24,7 +19,7 @@ import {
|
||||||
QuestionMarkCircleIcon,
|
QuestionMarkCircleIcon,
|
||||||
RocketLaunchIcon,
|
RocketLaunchIcon,
|
||||||
} from '@heroicons/react/20/solid'
|
} from '@heroicons/react/20/solid'
|
||||||
import { formatNumericValue, numberCompacter } from '../../utils/numbers'
|
import { formatNumericValue } from '../../utils/numbers'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
import relativeTime from 'dayjs/plugin/relativeTime'
|
import relativeTime from 'dayjs/plugin/relativeTime'
|
||||||
import PythLogo from '../icons/PythLogo'
|
import PythLogo from '../icons/PythLogo'
|
||||||
|
@ -32,15 +27,15 @@ import SwitchboardLogo from '../icons/SwitchboardLogo'
|
||||||
dayjs.extend(relativeTime)
|
dayjs.extend(relativeTime)
|
||||||
|
|
||||||
const Markets = () => {
|
const Markets = () => {
|
||||||
const { data: markets, isLoading: loadingMarkets } = useQuery({
|
// const { data: markets, isLoading: loadingMarkets } = useQuery({
|
||||||
queryKey: ['markets-data'],
|
// queryKey: ['markets-data'],
|
||||||
queryFn: () => fetchMangoMarketData(),
|
// queryFn: () => fetchMangoMarketData(),
|
||||||
})
|
// })
|
||||||
|
|
||||||
const { data: appStatsData, isLoading: loadingAppStatsData } = useQuery({
|
// const { data: appStatsData, isLoading: loadingAppStatsData } = useQuery({
|
||||||
queryKey: ['app-stats-data'],
|
// queryKey: ['app-stats-data'],
|
||||||
queryFn: () => fetchAppStatsData(),
|
// queryFn: () => fetchAppStatsData(),
|
||||||
})
|
// })
|
||||||
|
|
||||||
const { data: tokens, isLoading: loadingTokens } = useQuery({
|
const { data: tokens, isLoading: loadingTokens } = useQuery({
|
||||||
queryKey: ['cms-tokens-data'],
|
queryKey: ['cms-tokens-data'],
|
||||||
|
@ -48,8 +43,8 @@ const Markets = () => {
|
||||||
staleTime: 1000 * 60 * 10,
|
staleTime: 1000 * 60 * 10,
|
||||||
})
|
})
|
||||||
|
|
||||||
const numberOfMarkets =
|
// const numberOfMarkets =
|
||||||
(markets?.spot.length || 0) + (markets?.perp.length || 0)
|
// (markets?.spot.length || 0) + (markets?.perp.length || 0)
|
||||||
|
|
||||||
const [gainers, losers] = useMemo(() => {
|
const [gainers, losers] = useMemo(() => {
|
||||||
if (!tokens?.length) return [[], []]
|
if (!tokens?.length) return [[], []]
|
||||||
|
@ -99,32 +94,32 @@ const Markets = () => {
|
||||||
return [gainers, losers.reverse()]
|
return [gainers, losers.reverse()]
|
||||||
}, [tokens])
|
}, [tokens])
|
||||||
|
|
||||||
const formattedAppStatsData = useMemo(() => {
|
// const formattedAppStatsData = useMemo(() => {
|
||||||
if (!appStatsData || !Object.keys(appStatsData).length)
|
// if (!appStatsData || !Object.keys(appStatsData).length)
|
||||||
return { totalVol24h: 0, totalTrades24h: 0, weeklyActiveTraders: 0 }
|
// return { totalVol24h: 0, totalTrades24h: 0, weeklyActiveTraders: 0 }
|
||||||
// volume
|
// // volume
|
||||||
const spotVol24h = appStatsData?.openbook_volume_usd_24h || 0
|
// const spotVol24h = appStatsData?.openbook_volume_usd_24h || 0
|
||||||
const perpVol24h = appStatsData?.perp_volume_usd_24h || 0
|
// const perpVol24h = appStatsData?.perp_volume_usd_24h || 0
|
||||||
const swapVol24h = appStatsData?.swap_volume_usd_24h || 0
|
// const swapVol24h = appStatsData?.swap_volume_usd_24h || 0
|
||||||
const totalVol24h = spotVol24h + perpVol24h + swapVol24h
|
// const totalVol24h = spotVol24h + perpVol24h + swapVol24h
|
||||||
|
|
||||||
// number of trades
|
// // number of trades
|
||||||
const spotTrades24h = appStatsData?.num_openbook_fills_24h || 0
|
// const spotTrades24h = appStatsData?.num_openbook_fills_24h || 0
|
||||||
const perpTrades24h = appStatsData?.num_perp_fills_24h || 0
|
// const perpTrades24h = appStatsData?.num_perp_fills_24h || 0
|
||||||
const swapTrades24h = appStatsData?.num_swaps_24h || 0
|
// const swapTrades24h = appStatsData?.num_swaps_24h || 0
|
||||||
const totalTrades24h = spotTrades24h + perpTrades24h + swapTrades24h
|
// const totalTrades24h = spotTrades24h + perpTrades24h + swapTrades24h
|
||||||
|
|
||||||
const weeklyActiveTraders = appStatsData?.weekly_active_mango_accounts || 0
|
// const weeklyActiveTraders = appStatsData?.weekly_active_mango_accounts || 0
|
||||||
|
|
||||||
return { totalVol24h, totalTrades24h, weeklyActiveTraders }
|
// return { totalVol24h, totalTrades24h, weeklyActiveTraders }
|
||||||
}, [appStatsData])
|
// }, [appStatsData])
|
||||||
return (
|
return (
|
||||||
<SectionWrapper className="pb-12 md:pb-24 lg:pb-32" noPaddingY>
|
<SectionWrapper className="pb-12 md:pb-24 lg:pb-32" noPaddingY>
|
||||||
<div className="flex items-center justify-between mb-8 md:mb-10">
|
<div className="flex items-center justify-between mb-8 md:mb-10">
|
||||||
<h2>Markets</h2>
|
<h2>Markets</h2>
|
||||||
<ButtonLink path="/explore/tokens" linkText="Explore" size="large" />
|
<ButtonLink path="/explore/tokens" linkText="Explore" size="large" />
|
||||||
</div>
|
</div>
|
||||||
<div className="grid grid-cols-3 gap-4 lg:gap-6">
|
{/* <div className="grid grid-cols-3 gap-4 lg:gap-6">
|
||||||
<HeroStat
|
<HeroStat
|
||||||
title="Markets"
|
title="Markets"
|
||||||
value={numberOfMarkets.toString()}
|
value={numberOfMarkets.toString()}
|
||||||
|
@ -144,7 +139,7 @@ const Markets = () => {
|
||||||
value={formatNumericValue(formattedAppStatsData.totalTrades24h)}
|
value={formatNumericValue(formattedAppStatsData.totalTrades24h)}
|
||||||
loading={loadingAppStatsData}
|
loading={loadingAppStatsData}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div> */}
|
||||||
<div className="grid grid-cols-3 gap-4 lg:gap-6 mt-4 lg:mt-6">
|
<div className="grid grid-cols-3 gap-4 lg:gap-6 mt-4 lg:mt-6">
|
||||||
<RecentlyListed tokens={tokens} />
|
<RecentlyListed tokens={tokens} />
|
||||||
<GainersLosers tokens={gainers} isGainers loading={loadingTokens} />
|
<GainersLosers tokens={gainers} isGainers loading={loadingTokens} />
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue