diff --git a/components/stats/StatsPage.tsx b/components/stats/StatsPage.tsx index 2a6b8836..9b96bb68 100644 --- a/components/stats/StatsPage.tsx +++ b/components/stats/StatsPage.tsx @@ -6,18 +6,19 @@ import { useViewport } from 'hooks/useViewport' import { useRouter } from 'next/router' import { useEffect, useMemo, useState } from 'react' import { breakpoints } from 'utils/theme' -import MangoStats from './MangoStats' -import PerpStats from './PerpStats' -import PerpStatsPage from './PerpStatsPage' -import SpotMarketsTable from './SpotMarketsTable' -import TokenStats from './TokenStats' +import MangoStats from './mango/MangoStats' +import PerpStats from './perps/PerpStats' +import PerpStatsPage from './perps/PerpStatsPage' +import SpotMarketsTable from './spot/SpotMarketsTable' +import TokenStats from './tokens/TokenStats' const TABS = ['tokens', 'perp-markets', 'spot-markets', 'mango-stats'] +const actions = mangoStore.getState().actions const StatsPage = () => { const [activeTab, setActiveTab] = useState('tokens') - const actions = mangoStore.getState().actions const perpStats = mangoStore((s) => s.perpStats.data) + const initialStatsLoad = mangoStore((s) => s.tokenStats.initialLoad) const perpPositionsStatsNotLoaded = mangoStore( (s) => s.perpStats.positions.initialLoad, ) @@ -40,6 +41,13 @@ const StatsPage = () => { } }, [group, perpPositionsStatsNotLoaded]) + useEffect(() => { + if (group && !initialStatsLoad) { + const actions = mangoStore.getState().actions + actions.fetchTokenStats() + } + }, [group, initialStatsLoad]) + const tabsWithCount: [string, number][] = useMemo(() => { return TABS.map((t) => [t, 0]) }, []) diff --git a/components/stats/MangoStats.tsx b/components/stats/mango/MangoStats.tsx similarity index 59% rename from components/stats/MangoStats.tsx rename to components/stats/mango/MangoStats.tsx index e4ffbe42..bb761e75 100644 --- a/components/stats/MangoStats.tsx +++ b/components/stats/mango/MangoStats.tsx @@ -1,5 +1,5 @@ -import MangoPerpStatsCharts from './MangoPerpStatsCharts' -import TokenStatsCharts from './TokenStatsCharts' +import MangoPerpStatsCharts from '../perps/MangoPerpStatsCharts' +import TokenStatsCharts from '../tokens/TokenStatsCharts' const MangoStats = () => { return ( diff --git a/components/stats/AverageFundingChart.tsx b/components/stats/perps/AverageFundingChart.tsx similarity index 100% rename from components/stats/AverageFundingChart.tsx rename to components/stats/perps/AverageFundingChart.tsx diff --git a/components/stats/MangoPerpStatsCharts.tsx b/components/stats/perps/MangoPerpStatsCharts.tsx similarity index 100% rename from components/stats/MangoPerpStatsCharts.tsx rename to components/stats/perps/MangoPerpStatsCharts.tsx diff --git a/components/stats/PerpMarketDetails.tsx b/components/stats/perps/PerpMarketDetails.tsx similarity index 100% rename from components/stats/PerpMarketDetails.tsx rename to components/stats/perps/PerpMarketDetails.tsx diff --git a/components/stats/PerpMarketDetailsTable.tsx b/components/stats/perps/PerpMarketDetailsTable.tsx similarity index 98% rename from components/stats/PerpMarketDetailsTable.tsx rename to components/stats/perps/PerpMarketDetailsTable.tsx index 1c791601..8e4f4704 100644 --- a/components/stats/PerpMarketDetailsTable.tsx +++ b/components/stats/perps/PerpMarketDetailsTable.tsx @@ -1,8 +1,6 @@ import { useTranslation } from 'next-i18next' -import { useViewport } from '../../hooks/useViewport' import mangoStore from '@store/mangoStore' -import { breakpoints } from '../../utils/theme' -import ContentBox from '../shared/ContentBox' +import ContentBox from '@components/shared/ContentBox' import MarketLogos from '@components/trade/MarketLogos' import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements' import { @@ -17,6 +15,8 @@ import { goToPerpMarketDetails } from './PerpMarketsOverviewTable' import { useRouter } from 'next/router' import { LinkButton } from '@components/shared/Button' import SoonBadge from '@components/shared/SoonBadge' +import { useViewport } from 'hooks/useViewport' +import { breakpoints } from 'utils/theme' const PerpMarketDetailsTable = () => { const { t } = useTranslation(['common', 'trade']) diff --git a/components/stats/PerpMarketParams.tsx b/components/stats/perps/PerpMarketParams.tsx similarity index 100% rename from components/stats/PerpMarketParams.tsx rename to components/stats/perps/PerpMarketParams.tsx diff --git a/components/stats/PerpMarketsOverviewTable.tsx b/components/stats/perps/PerpMarketsOverviewTable.tsx similarity index 98% rename from components/stats/PerpMarketsOverviewTable.tsx rename to components/stats/perps/PerpMarketsOverviewTable.tsx index 3474f803..fc7d687c 100644 --- a/components/stats/PerpMarketsOverviewTable.tsx +++ b/components/stats/perps/PerpMarketsOverviewTable.tsx @@ -1,9 +1,9 @@ import { PerpMarket } from '@blockworks-foundation/mango-v4' import { useTranslation } from 'next-i18next' -import { useViewport } from '../../hooks/useViewport' -import { COLORS } from '../../styles/colors' -import { breakpoints } from '../../utils/theme' -import ContentBox from '../shared/ContentBox' +import { useViewport } from '../../../hooks/useViewport' +import { COLORS } from '../../../styles/colors' +import { breakpoints } from '../../../utils/theme' +import ContentBox from '../../shared/ContentBox' import MarketLogos from '@components/trade/MarketLogos' import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements' import { diff --git a/components/stats/PerpMarketsPositions.tsx b/components/stats/perps/PerpMarketsPositions.tsx similarity index 100% rename from components/stats/PerpMarketsPositions.tsx rename to components/stats/perps/PerpMarketsPositions.tsx diff --git a/components/stats/PerpPositionsStatsTable.tsx b/components/stats/perps/PerpPositionsStatsTable.tsx similarity index 100% rename from components/stats/PerpPositionsStatsTable.tsx rename to components/stats/perps/PerpPositionsStatsTable.tsx diff --git a/components/stats/PerpStats.tsx b/components/stats/perps/PerpStats.tsx similarity index 100% rename from components/stats/PerpStats.tsx rename to components/stats/perps/PerpStats.tsx diff --git a/components/stats/PerpStatsPage.tsx b/components/stats/perps/PerpStatsPage.tsx similarity index 100% rename from components/stats/PerpStatsPage.tsx rename to components/stats/perps/PerpStatsPage.tsx diff --git a/components/stats/PerpVolumeChart.tsx b/components/stats/perps/PerpVolumeChart.tsx similarity index 100% rename from components/stats/PerpVolumeChart.tsx rename to components/stats/perps/PerpVolumeChart.tsx diff --git a/components/stats/SpotMarketsTable.tsx b/components/stats/spot/SpotMarketsTable.tsx similarity index 98% rename from components/stats/SpotMarketsTable.tsx rename to components/stats/spot/SpotMarketsTable.tsx index 9003506a..719876d5 100644 --- a/components/stats/SpotMarketsTable.tsx +++ b/components/stats/spot/SpotMarketsTable.tsx @@ -1,9 +1,9 @@ import { useTranslation } from 'next-i18next' import { useCallback } from 'react' -import { useViewport } from '../../hooks/useViewport' -import { COLORS } from '../../styles/colors' -import { breakpoints } from '../../utils/theme' -import ContentBox from '../shared/ContentBox' +import { useViewport } from '../../../hooks/useViewport' +import { COLORS } from '../../../styles/colors' +import { breakpoints } from '../../../utils/theme' +import ContentBox from '../../shared/ContentBox' import MarketLogos from '@components/trade/MarketLogos' import useMangoGroup from 'hooks/useMangoGroup' import { diff --git a/components/stats/TokenDetailsTable.tsx b/components/stats/tokens/TokenDetailsTable.tsx similarity index 99% rename from components/stats/TokenDetailsTable.tsx rename to components/stats/tokens/TokenDetailsTable.tsx index 6798a399..30f72bd2 100644 --- a/components/stats/TokenDetailsTable.tsx +++ b/components/stats/tokens/TokenDetailsTable.tsx @@ -5,9 +5,9 @@ import { ChevronRightIcon, } from '@heroicons/react/20/solid' import { useTranslation } from 'next-i18next' -import { useViewport } from '../../hooks/useViewport' -import { breakpoints } from '../../utils/theme' -import ContentBox from '../shared/ContentBox' +import { useViewport } from '../../../hooks/useViewport' +import { breakpoints } from '../../../utils/theme' +import ContentBox from '../../shared/ContentBox' import Tooltip from '@components/shared/Tooltip' import { Bank } from '@blockworks-foundation/mango-v4' import { diff --git a/components/stats/TokenOverviewTable.tsx b/components/stats/tokens/TokenOverviewTable.tsx similarity index 98% rename from components/stats/TokenOverviewTable.tsx rename to components/stats/tokens/TokenOverviewTable.tsx index 9264b68f..2c29c684 100644 --- a/components/stats/TokenOverviewTable.tsx +++ b/components/stats/tokens/TokenOverviewTable.tsx @@ -1,10 +1,10 @@ import { Disclosure, Transition } from '@headlessui/react' import { ChevronDownIcon, ChevronRightIcon } from '@heroicons/react/20/solid' import { useTranslation } from 'next-i18next' -import { useViewport } from '../../hooks/useViewport' -import { breakpoints } from '../../utils/theme' -import { LinkButton } from '../shared/Button' -import ContentBox from '../shared/ContentBox' +import { useViewport } from '../../../hooks/useViewport' +import { breakpoints } from '../../../utils/theme' +import { LinkButton } from '../../shared/Button' +import ContentBox from '../../shared/ContentBox' import Tooltip from '@components/shared/Tooltip' import { Bank, toUiDecimals } from '@blockworks-foundation/mango-v4' import { NextRouter, useRouter } from 'next/router' diff --git a/components/stats/TokenStats.tsx b/components/stats/tokens/TokenStats.tsx similarity index 100% rename from components/stats/TokenStats.tsx rename to components/stats/tokens/TokenStats.tsx diff --git a/components/stats/TokenStatsCharts.tsx b/components/stats/tokens/TokenStatsCharts.tsx similarity index 90% rename from components/stats/TokenStatsCharts.tsx rename to components/stats/tokens/TokenStatsCharts.tsx index 64f3631d..7855bba5 100644 --- a/components/stats/TokenStatsCharts.tsx +++ b/components/stats/tokens/TokenStatsCharts.tsx @@ -1,30 +1,20 @@ import mangoStore from '@store/mangoStore' import { useTranslation } from 'next-i18next' -import { useEffect, useMemo, useState } from 'react' +import { useMemo, useState } from 'react' import dayjs from 'dayjs' import { formatYAxis } from 'utils/formatting' import useBanksWithBalances from 'hooks/useBanksWithBalances' -import useMangoGroup from 'hooks/useMangoGroup' import { toUiDecimals } from '@blockworks-foundation/mango-v4' import DetailedAreaOrBarChart from '@components/shared/DetailedAreaOrBarChart' const TokenStatsCharts = () => { const { t } = useTranslation(['common', 'token', 'trade']) - const { group } = useMangoGroup() const mangoStats = mangoStore((s) => s.tokenStats.mangoStats) - const initialStatsLoad = mangoStore((s) => s.tokenStats.initialLoad) const loadingStats = mangoStore((s) => s.tokenStats.loading) const [borrowDaysToShow, setBorrowDaysToShow] = useState('30') const [depositDaysToShow, setDepositDaysToShow] = useState('30') const banks = useBanksWithBalances() - useEffect(() => { - if (group && !initialStatsLoad) { - const actions = mangoStore.getState().actions - actions.fetchTokenStats() - } - }, [group, initialStatsLoad]) - const [ currentTotalDepositValue, currentTotalBorrowValue, diff --git a/components/token/ChartTabs.tsx b/components/token/ChartTabs.tsx index eb4eac08..1a9d0af4 100644 --- a/components/token/ChartTabs.tsx +++ b/components/token/ChartTabs.tsx @@ -1,9 +1,8 @@ import { Bank } from '@blockworks-foundation/mango-v4' import TabButtons from '@components/shared/TabButtons' import mangoStore from '@store/mangoStore' -import useMangoGroup from 'hooks/useMangoGroup' import { useTranslation } from 'next-i18next' -import { useEffect, useMemo, useState } from 'react' +import { useMemo, useState } from 'react' import { TokenStatsItem } from 'types' import { formatYAxis } from 'utils/formatting' import DetailedAreaOrBarChart from '@components/shared/DetailedAreaOrBarChart' @@ -18,16 +17,7 @@ const ChartTabs = ({ bank }: { bank: Bank }) => { const [depositRateDaysToShow, setDepositRateDaysToShow] = useState('30') const [borrowRateDaysToShow, setBorrowRateDaysToShow] = useState('30') const tokenStats = mangoStore((s) => s.tokenStats.data) - const initialStatsLoad = mangoStore((s) => s.tokenStats.initialLoad) const loadingTokenStats = mangoStore((s) => s.tokenStats.loading) - const actions = mangoStore.getState().actions - const { group } = useMangoGroup() - - useEffect(() => { - if (group && !initialStatsLoad) { - actions.fetchTokenStats() - } - }, [group]) const statsHistory = useMemo(() => { if (!tokenStats?.length) return [] diff --git a/yarn.lock b/yarn.lock index 68d7627c..f9e48ecb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1014,7 +1014,7 @@ resolved "https://registry.yarnpkg.com/@noble/ed25519/-/ed25519-1.7.3.tgz#57e1677bf6885354b466c38e2b620c62f45a7123" integrity sha512-iR8GBkDt0Q3GyaVcIu7mSsVIqnFbkbRzGLWlvhwunacoLwt4J3swfKhfaM6rN6WY+TBGoYT1GtT1mIh2/jGbRQ== -"@noble/hashes@1.3.1", "@noble/hashes@^1.1.3", "@noble/hashes@^1.3.0", "@noble/hashes@^1.3.1", "@noble/hashes@~1.3.0", "@noble/hashes@~1.3.1": +"@noble/hashes@1.3.1", "@noble/hashes@^1.1.3", "@noble/hashes@^1.3.1", "@noble/hashes@~1.3.0", "@noble/hashes@~1.3.1": version "1.3.1" resolved "https://registry.yarnpkg.com/@noble/hashes/-/hashes-1.3.1.tgz#8831ef002114670c603c458ab8b11328406953a9" integrity sha512-EbqwksQwz9xDRGfDST86whPBgM65E0OH/pCgqW0GBVzO22bNE+NuIbeTb714+IfSjU3aRk47EUvXIb5bTsenKA== @@ -3044,7 +3044,7 @@ agent-base@6: dependencies: debug "4" -agentkeepalive@^4.2.1, agentkeepalive@^4.3.0: +agentkeepalive@^4.3.0: version "4.5.0" resolved "https://registry.yarnpkg.com/agentkeepalive/-/agentkeepalive-4.5.0.tgz#2673ad1389b3c418c5a20c5d7364f93ca04be923" integrity sha512-5GG/5IbQQpC9FpkRGsSvZI5QYeSCzlJHdpBQntCsuTOxhKD8lqKhrleg2Yi7yvMIf82Ycmmqln9U8V9qwEiJew== @@ -4240,7 +4240,7 @@ dayjs@1.11.3: resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.3.tgz#4754eb694a624057b9ad2224b67b15d552589258" integrity sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A== -debug@4, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.3, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2: +debug@4, debug@^4.1.1, debug@^4.3.2, debug@^4.3.3, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2: version "4.3.4" resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==