diff --git a/src/components/common/Table/poolsColumns.tsx b/src/components/common/Table/poolsColumns.tsx index 37fff62f..da46fde5 100644 --- a/src/components/common/Table/poolsColumns.tsx +++ b/src/components/common/Table/poolsColumns.tsx @@ -116,6 +116,15 @@ export const poolsColumns: ColumnDef[] = [ ), cell: ({ getValue }) => formatUSD.format(getValue() as number), }, + { + accessorKey: "fees24USD", + header: ({ column }) => ( + column.toggleSorting(column.getIsSorted() === "asc")} isAsc={column.getIsSorted() === "asc"}> + Fees 24H + + ), + cell: ({ getValue }) => formatUSD.format(getValue() as number), + }, { accessorKey: "avgApr", header: ({ column }) => ( diff --git a/src/components/common/Table/poolsTable.tsx b/src/components/common/Table/poolsTable.tsx index 7174d075..5a2b1ab6 100644 --- a/src/components/common/Table/poolsTable.tsx +++ b/src/components/common/Table/poolsTable.tsx @@ -152,7 +152,7 @@ const PoolsTable = ({ }} > {row.getVisibleCells().map((cell: any) => ( - + {flexRender(cell.column.columnDef.cell, cell.getContext())} ))} @@ -164,13 +164,15 @@ const PoolsTable = ({ {showPagination && (
-

- {`${table.getState().pagination.pageIndex * table.getState().pagination.pageSize + 1} - + {table.getFilteredRowModel().rows.length > 0 && ( +

+ {`${table.getState().pagination.pageIndex * table.getState().pagination.pageSize + 1} - ${Math.min( table.getState().pagination.pageSize * (table.getState().pagination.pageIndex + 1), table.getFilteredRowModel().rows.length )} of ${table.getFilteredRowModel().rows.length}`} -

+

+ )} diff --git a/src/components/pools/PoolsList/index.tsx b/src/components/pools/PoolsList/index.tsx index 5995bb31..2c5b7cb3 100644 --- a/src/components/pools/PoolsList/index.tsx +++ b/src/components/pools/PoolsList/index.tsx @@ -1,5 +1,5 @@ import { poolsColumns } from "@/components/common/Table/poolsColumns"; -import { useActiveFarmingsQuery, usePoolsListQuery, usePoolsVolumeDataQuery } from "@/graphql/generated/graphql"; +import { useActiveFarmingsQuery, usePoolsListQuery } from "@/graphql/generated/graphql"; import { useMemo } from "react"; import { Address } from "viem"; import { ETERNAL_FARMINGS_API, POOL_AVG_APR_API, POOL_MAX_APR_API, fetcher } from "@/constants/api"; @@ -11,44 +11,41 @@ import { farmingClient } from "@/graphql/clients"; const PoolsList = () => { const { data: pools, loading: isPoolsListLoading } = usePoolsListQuery(); - const { data: poolsVolume, loading: isPoolsVolumeLoading } = usePoolsVolumeDataQuery(); - - const { data: poolsMaxApr, isLoading: isPoolsMaxAprLoading } = useSWR(POOL_MAX_APR_API, fetcher); - const { data: poolsAvgApr, isLoading: isPoolsAvgAprLoading } = useSWR(POOL_AVG_APR_API, fetcher); - const { data: farmingsAPR } = useSWR(ETERNAL_FARMINGS_API, fetcher); - const { data: activeFarmings, loading: isFarmingsLoading } = useActiveFarmingsQuery({ client: farmingClient, }); - const { positions, loading: isPositionsLoading } = usePositions(); + const { data: poolsMaxApr, isLoading: isPoolsMaxAprLoading } = useSWR(POOL_MAX_APR_API, fetcher); + const { data: poolsAvgApr, isLoading: isPoolsAvgAprLoading } = useSWR(POOL_AVG_APR_API, fetcher); + const { data: farmingsAPR, isLoading: isFarmingsAPRLoading } = useSWR(ETERNAL_FARMINGS_API, fetcher); + const isLoading = isPoolsListLoading || - isPoolsVolumeLoading || isPoolsMaxAprLoading || isPoolsAvgAprLoading || isPositionsLoading || - isFarmingsLoading; + isFarmingsLoading || + isFarmingsAPRLoading; const formattedPools = useMemo(() => { - if (isLoading || !pools || !poolsVolume || !positions) return []; + if (isLoading || !pools) return []; - return pools.pools.map(({ id, token0, token1, fee, totalValueLockedUSD }) => { - const currentPool = poolsVolume.poolDayDatas.find((currPool) => currPool.pool.id === id); + return pools.pools.map(({ id, token0, token1, fee, totalValueLockedUSD, poolDayData }) => { + const currentPool = poolDayData[0]; const lastDate = currentPool ? currentPool.date * 1000 : 0; const currentDate = new Date().getTime(); + /* time difference calculations here to ensure that the graph provides information for the last 24 hours */ const timeDifference = currentDate - lastDate; const msIn24Hours = 24 * 60 * 60 * 1000; - const openPositions = positions.filter((position) => position.pool.toLowerCase() === id.toLowerCase()); + const openPositions = positions?.filter((position) => position.pool.toLowerCase() === id.toLowerCase()); const activeFarming = activeFarmings?.eternalFarmings.find((farming) => farming.pool === id); - const hasActiveFarming = Boolean(activeFarming); - const poolMaxApr = poolsMaxApr[id] ? Number(poolsMaxApr[id].toFixed(2)) : 0; - const poolAvgApr = poolsAvgApr[id] ? Number(poolsAvgApr[id].toFixed(2)) : 0; - const farmApr = activeFarming ? farmingsAPR[activeFarming.id] : 0; + const poolMaxApr = poolsMaxApr && poolsMaxApr[id] ? Number(poolsMaxApr[id].toFixed(2)) : 0; + const poolAvgApr = poolsAvgApr && poolsAvgApr[id] ? Number(poolsAvgApr[id].toFixed(2)) : 0; + const farmApr = activeFarming && farmingsAPR ? farmingsAPR[activeFarming.id] : 0; const avgApr = farmApr + poolAvgApr; @@ -60,16 +57,17 @@ const PoolsList = () => { }, fee: Number(fee) / 10_000, tvlUSD: Number(totalValueLockedUSD), - volume24USD: timeDifference <= msIn24Hours && currentPool ? currentPool.volumeUSD : 0, + volume24USD: timeDifference <= msIn24Hours ? currentPool.volumeUSD : 0, + fees24USD: timeDifference <= msIn24Hours ? currentPool.feesUSD : 0, poolMaxApr, poolAvgApr, farmApr, avgApr, - isMyPool: openPositions?.length > 0, - hasActiveFarming, + isMyPool: Boolean(openPositions?.length), + hasActiveFarming: Boolean(activeFarming), }; }); - }, [isLoading, pools, poolsVolume, positions, activeFarmings, poolsMaxApr, poolsAvgApr, farmingsAPR]); + }, [isLoading, pools, positions, activeFarmings, poolsMaxApr, poolsAvgApr, farmingsAPR]); return (
diff --git a/src/graphql/queries/pools.ts b/src/graphql/queries/pools.ts index f9fd719d..3d3c6d9b 100644 --- a/src/graphql/queries/pools.ts +++ b/src/graphql/queries/pools.ts @@ -1,4 +1,4 @@ -import { gql } from '@apollo/client'; +import { gql } from "@apollo/client"; export const POOL_FRAGMENT = gql` fragment PoolFields on Pool { @@ -21,7 +21,7 @@ export const POOL_FRAGMENT = gql` token0Price token1Price } -` +`; export const TICK_FRAGMENT = gql` fragment TickFields on Tick { tickIdx @@ -30,25 +30,31 @@ export const TICK_FRAGMENT = gql` price0 price1 } -` +`; export const POOL_FEE_DATA_FRAGMENT = gql` - fragment PoolFeeDataFields on PoolFeeData { - fee - timestamp + fragment PoolFeeDataFields on PoolDayData { + feesUSD } -` +`; export const POOL_DAY_DATA_FRAGMENT = gql` fragment PoolDayDataFields on PoolDayData { feesUSD + tvlUSD + volumeUSD + id + date } -` +`; export const POOLS_LIST = gql` query PoolsList { pools { ...PoolFields + poolDayData(first: 1, orderBy: date, orderDirection: desc) { + ...PoolDayDataFields + } } } `; @@ -59,7 +65,7 @@ export const ALL_TICKS = gql` ...TickFields } } -` +`; export const SINGLE_POOL = gql` query SinglePool($poolId: ID!) { @@ -67,7 +73,7 @@ export const SINGLE_POOL = gql` ...PoolFields } } -` +`; export const MULTIPLE_POOLS = gql` query MultiplePools($poolIds: [ID!]) { @@ -75,24 +81,25 @@ export const MULTIPLE_POOLS = gql` ...PoolFields } } -` +`; export const POOL_FEE_DATA = gql` query PoolFeeData($poolId: String) { poolDayDatas(where: { pool: $poolId }, orderBy: date, orderDirection: desc) { - ...PoolDayDataFields + ...PoolFeeDataFields } } -` +`; -export const POOLS_VOLUME_DATA = gql` - query PoolsVolumeData { - poolDayDatas(orderBy: date, orderDirection: desc) { - date - volumeUSD - pool { - id - } - } - } -`; \ No newline at end of file +// export const POOLS_DAY_DATAS = gql` +// query PoolsVolumeData { +// poolDayDatas(orderBy: date, orderDirection: desc) { +// date +// pool { +// id +// } +// volumeUSD +// ...PoolDayDataFields +// } +// } +// `; diff --git a/src/utils/positions/getPositionAPR.ts b/src/utils/positions/getPositionAPR.ts index 3057c62b..05b656a0 100644 --- a/src/utils/positions/getPositionAPR.ts +++ b/src/utils/positions/getPositionAPR.ts @@ -1,13 +1,13 @@ import { getAlgebraPool } from "@/generated" import { Position } from "@cryptoalgebra/integral-sdk" -import { PoolDayDataFieldsFragment, PoolFieldsFragment } from "@/graphql/generated/graphql" +import { PoolFeeDataFieldsFragment, PoolFieldsFragment } from "@/graphql/generated/graphql" import { Address } from "wagmi" export async function getPositionAPR( poolId: Address, position: Position, pool: PoolFieldsFragment | undefined | null, - poolFeeData: PoolDayDataFieldsFragment[] | undefined, + poolFeeData: PoolFeeDataFieldsFragment[] | undefined, nativePrice: string | undefined ) {