-
);
diff --git a/packages/web/src/components/earn/incentivized-pool-card-list/IncentivizedPoolCardList.tsx b/packages/web/src/components/earn/incentivized-pool-card-list/IncentivizedPoolCardList.tsx
index 1c4f03443..5d4e41e33 100644
--- a/packages/web/src/components/earn/incentivized-pool-card-list/IncentivizedPoolCardList.tsx
+++ b/packages/web/src/components/earn/incentivized-pool-card-list/IncentivizedPoolCardList.tsx
@@ -3,22 +3,22 @@ import {
IncentivizedWrapper,
PoolListWrapper,
} from "./IncentivizedPoolCardList.styles";
-import { type PoolListProps } from "@containers/incentivized-pool-card-list-container/IncentivizedPoolCardListContainer";
import IncentivizedPoolCard from "@components/earn/incentivized-pool-card/IncentivizedPoolCard";
import { SHAPE_TYPES, skeletonStyle } from "@constants/skeleton.constant";
import LoadMoreButton from "@components/common/load-more-button/LoadMoreButton";
+import { PoolCardInfo } from "@models/pool/info/pool-card-info";
export interface IncentivizedPoolCardListProps {
- list: Array
{currentIndex}
/
- {list.length}
+ {incentivizedPools.length}
)}
-
-
@@ -38,8 +45,8 @@ const IncentivizedPoolCard: React.FC = ({
{POOL_CONTENT_TITLE.APR}
- {item.liquidity}
- {item.apr}
+ {pool.liquidity}
+ {pool.apr}
- {item.volume24h}
- {item.fees24h}
+ {pool.volume24h}
+ {pool.fees24h}
- {`1 ${item.name[0]}`}
+ {`1 ${pool.tokenA.symbol}`}
-
);
diff --git a/packages/web/src/components/earn/pool-info/PoolInfo.tsx b/packages/web/src/components/earn/pool-info/PoolInfo.tsx
index 5ba832b6c..2820ab288 100644
--- a/packages/web/src/components/earn/pool-info/PoolInfo.tsx
+++ b/packages/web/src/components/earn/pool-info/PoolInfo.tsx
@@ -3,39 +3,51 @@
import BarGraph from "@components/common/bar-graph/BarGraph";
import DoubleLogo from "@components/common/double-logo/DoubleLogo";
import { POOL_TD_WIDTH } from "@constants/skeleton.constant";
-import { type Pool } from "@containers/pool-list-container/PoolListContainer";
-import React from "react";
+import React, { useMemo } from "react";
import { PoolInfoWrapper, TableColumn } from "./PoolInfo.styles";
+import { PoolListInfo } from "@models/pool/info/pool-list-info";
+import { SwapFeeTierInfoMap } from "@constants/option.constant";
interface PoolInfoProps {
- pool: Pool;
- routeItem: (id: number) => void;
+ pool: PoolListInfo;
+ routeItem: (id: string) => void;
}
const PoolInfo: React.FC
diff --git a/packages/web/src/components/earn/pool-list-table/PoolListTable.stories.tsx b/packages/web/src/components/earn/pool-list-table/PoolListTable.stories.tsx
index b628e23eb..023a5c730 100644
--- a/packages/web/src/components/earn/pool-list-table/PoolListTable.stories.tsx
+++ b/packages/web/src/components/earn/pool-list-table/PoolListTable.stories.tsx
@@ -2,8 +2,60 @@ import React from "react";
import { ComponentStory, ComponentMeta } from "@storybook/react";
import PoolListTable from "./PoolListTable";
-import { dummyPoolList } from "@containers/pool-list-container/PoolListContainer";
import { action } from "@storybook/addon-actions";
+import { PoolCardInfo } from "@models/pool/info/pool-card-info";
+
+const pool: PoolCardInfo = {
+ poolId: "bar_foo_500",
+ tokenA: {
+ chainId: "dev",
+ createdAt: "2023-10-12T06:56:10+09:00",
+ name: "Bar",
+ address: "g1w8wqgrp08cqhtupzx98n4jtm8kqy7vadfmmyd0",
+ path: "gno.land/r/bar",
+ decimals: 4,
+ symbol: "BAR",
+ logoURI: "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ priceId: "gno.land/r/bar"
+ },
+ tokenB: {
+ chainId: "dev",
+ createdAt: "2023-10-12T06:56:08+09:00",
+ name: "Foo",
+ address: "g1evezrh92xaucffmtgsaa3rvmz5s8kedffsg469",
+ path: "gno.land/r/foo",
+ decimals: 4,
+ symbol: "FOO",
+ logoURI: "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ priceId: "gno.land/r/foo"
+ },
+ feeTier: "FEE_500",
+ liquidity: "$1,182,797",
+ apr: "0.12%",
+ volume24h: "$1,182,797",
+ fees24h: "$131.937491",
+ rewards: [
+ {
+ token: {
+ chainId: "dev",
+ createdAt: "2023-10-12T06:56:12+09:00",
+ name: "Gnoswap",
+ address: "g1sqaft388ruvsseu97r04w4rr4szxkh4nn6xpax",
+ path: "gno.land/r/gnos",
+ decimals: 4,
+ symbol: "GNOS",
+ logoURI: "/gnos.svg",
+ priceId: "gno.land/r/gnos"
+ },
+ amount: 10
+ }
+ ],
+ incentiveType: "Incentivized",
+ tickInfo: {
+ currentTick: 1.498590,
+ ticks: []
+ }
+};
export default {
title: "earn/PoolList/PoolListTable",
@@ -16,7 +68,7 @@ const Template: ComponentStory = args => (
export const Default = Template.bind({});
Default.args = {
- pools: dummyPoolList,
+ pools: [pool],
isFetched: true,
routeItem: action("routeItem"),
sortOption: undefined,
@@ -34,8 +86,8 @@ Skeleton.args = {
isSortOption: () => true,
};
-export const NotFount = Template.bind({});
-NotFount.args = {
+export const NotFound = Template.bind({});
+NotFound.args = {
pools: [],
isFetched: true,
routeItem: action("routeItem"),
diff --git a/packages/web/src/components/earn/pool-list-table/PoolListTable.tsx b/packages/web/src/components/earn/pool-list-table/PoolListTable.tsx
index b72838633..fc7323e89 100644
--- a/packages/web/src/components/earn/pool-list-table/PoolListTable.tsx
+++ b/packages/web/src/components/earn/pool-list-table/PoolListTable.tsx
@@ -1,6 +1,5 @@
import React, { useCallback } from "react";
import {
- Pool,
PoolSortOption,
TABLE_HEAD,
} from "@containers/pool-list-container/PoolListContainer";
@@ -11,14 +10,15 @@ import TableSkeleton from "@components/common/table-skeleton/TableSkeleton";
import { POOL_INFO, POOL_TD_WIDTH } from "@constants/skeleton.constant";
import IconTriangleArrowUp from "@components/common/icons/IconTriangleArrowUp";
import IconTriangleArrowDown from "@components/common/icons/IconTriangleArrowDown";
+import { PoolListInfo } from "@models/pool/info/pool-list-info";
interface PoolListTableProps {
- pools: Pool[];
+ pools: PoolListInfo[];
isFetched: boolean;
sortOption: PoolSortOption | undefined;
sort: (head: TABLE_HEAD) => void;
isSortOption: (head: TABLE_HEAD) => boolean;
- routeItem: (id: number) => void;
+ routeItem: (id: string) => void;
}
const PoolListTable: React.FC = ({
diff --git a/packages/web/src/components/earn/pool-list/PoolList.stories.tsx b/packages/web/src/components/earn/pool-list/PoolList.stories.tsx
index c51cb4ca2..f0eaf1c0a 100644
--- a/packages/web/src/components/earn/pool-list/PoolList.stories.tsx
+++ b/packages/web/src/components/earn/pool-list/PoolList.stories.tsx
@@ -5,7 +5,6 @@ import { action } from "@storybook/addon-actions";
import PoolList from "./PoolList";
import {
POOL_TYPE,
- dummyPoolList,
} from "@containers/pool-list-container/PoolListContainer";
import { DEVICE_TYPE } from "@styles/media";
@@ -20,7 +19,7 @@ const Template: ComponentStory = args => (
export const Default = Template.bind({});
Default.args = {
- pools: dummyPoolList,
+ pools: [],
poolType: POOL_TYPE.ALL,
changePoolType: action("changePoolType"),
search: action("search"),
diff --git a/packages/web/src/components/earn/pool-list/PoolList.tsx b/packages/web/src/components/earn/pool-list/PoolList.tsx
index 38d29ba2a..82dcda3d1 100644
--- a/packages/web/src/components/earn/pool-list/PoolList.tsx
+++ b/packages/web/src/components/earn/pool-list/PoolList.tsx
@@ -11,12 +11,12 @@ import PoolListHeader from "@components/earn/pool-list-header/PoolListHeader";
import PoolListTable from "@components/earn/pool-list-table/PoolListTable";
import Pagination from "@components/common/pagination/Pagination";
import { PoolListWrapper } from "./PoolList.styles";
-import { DeviceSize, DEVICE_TYPE } from "@styles/media";
+import { DEVICE_TYPE } from "@styles/media";
+import { PoolListInfo } from "@models/pool/info/pool-list-info";
interface TokenListProps {
- pools: Pool[];
+ pools: PoolListInfo[];
isFetched: boolean;
- error: Error | null;
poolType?: POOL_TYPE;
changePoolType: (newType: string) => void;
search: (e: React.ChangeEvent) => void;
@@ -30,13 +30,12 @@ interface TokenListProps {
searchIcon: boolean;
onTogleSearch: () => void;
breakpoint: DEVICE_TYPE;
- routeItem: (id: number) => void;
+ routeItem: (id: string) => void;
}
const PoolList: React.FC = ({
pools,
isFetched,
- error,
poolType = POOL_TYPE.ALL,
changePoolType,
search,
diff --git a/packages/web/src/components/home/card-list/CardList.tsx b/packages/web/src/components/home/card-list/CardList.tsx
index 12313c877..ff38847e5 100644
--- a/packages/web/src/components/home/card-list/CardList.tsx
+++ b/packages/web/src/components/home/card-list/CardList.tsx
@@ -4,6 +4,7 @@ import { CardListWrapper, ListItem } from "./CardList.styles";
import DoubleLogo from "@components/common/double-logo/DoubleLogo";
import { CardListPoolInfo, CardListTokenInfo } from "@models/common/card-list-item-info";
import { useCallback, useMemo } from "react";
+import { SwapFeeTierInfoMap } from "@constants/option.constant";
interface CardListProps {
list: Array;
@@ -57,7 +58,10 @@ const CardListPoolItem: React.FC = ({ index, item, onClic
const poolFeeRate = useMemo(() => {
const pool = item.pool;
- return `${pool.fee}%`;
+ const feeRate =
+ Object.values(SwapFeeTierInfoMap).find(model => `${model.fee}` === pool.fee)
+ ?.rateStr || "-";
+ return feeRate;
}, [item]);
const pairLogo = useMemo(() => {
diff --git a/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.stories.tsx b/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.stories.tsx
index f9ee0eaa2..721f38681 100644
--- a/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.stories.tsx
+++ b/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.stories.tsx
@@ -1,8 +1,8 @@
-import { toPoolSelectItemInfo } from "@models/pool/info/pool-select-item-info";
import PoolIncentivizeSelectPoolItem, { type PoolIncentivizeSelectPoolItemProps } from "./PoolIncentivizeSelectPoolItem";
import { Meta, StoryObj } from "@storybook/react";
import React from "react";
import { PoolRepositoryMock } from "@repositories/pool";
+import { PoolMapper } from "@models/pool/mapper/pool-mapper";
const poolRepository = new PoolRepositoryMock();
const pools = (await poolRepository.getPools()).pools;
@@ -21,7 +21,7 @@ export default {
} as Meta;
-const poolSelectItem = toPoolSelectItemInfo(pools[0]);
+const poolSelectItem = PoolMapper.toPoolSelectItemInfo(pools[0]);
export const Default: StoryObj = {
args: {
diff --git a/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.tsx b/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.tsx
index d99d8c665..36ba9705c 100644
--- a/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.tsx
+++ b/packages/web/src/components/incentivize/pool-incentivize-select-pool-item/PoolIncentivizeSelectPoolItem.tsx
@@ -41,8 +41,7 @@ const PoolIncentivizeSelectPoolItem: React.FC {
diff --git a/packages/web/src/components/incentivize/pool-incentivize-select-pool/PoolIncentivizeSelectPool.stories.tsx b/packages/web/src/components/incentivize/pool-incentivize-select-pool/PoolIncentivizeSelectPool.stories.tsx
index 935295d2c..23d839f90 100644
--- a/packages/web/src/components/incentivize/pool-incentivize-select-pool/PoolIncentivizeSelectPool.stories.tsx
+++ b/packages/web/src/components/incentivize/pool-incentivize-select-pool/PoolIncentivizeSelectPool.stories.tsx
@@ -2,10 +2,11 @@ import PoolIncentivizeSelectPool from "./PoolIncentivizeSelectPool";
import { ComponentStory, Meta } from "@storybook/react";
import { useCallback, useState } from "react";
import { PoolRepositoryMock } from "@repositories/pool";
-import { PoolSelectItemInfo, toPoolSelectItemInfo } from "@models/pool/info/pool-select-item-info";
+import { PoolSelectItemInfo } from "@models/pool/info/pool-select-item-info";
+import { PoolMapper } from "@models/pool/mapper/pool-mapper";
const poolRepository = new PoolRepositoryMock();
-const pools = (await poolRepository.getPools()).pools.map(toPoolSelectItemInfo);
+const pools = (await poolRepository.getPools()).pools.map(PoolMapper.toPoolSelectItemInfo);
export default {
title: "incentivize/PoolIncentivizeSelectPool",
diff --git a/packages/web/src/components/incentivize/pool-incentivize/PoolIncentivize.tsx b/packages/web/src/components/incentivize/pool-incentivize/PoolIncentivize.tsx
index 86b374e90..c4629c4f3 100644
--- a/packages/web/src/components/incentivize/pool-incentivize/PoolIncentivize.tsx
+++ b/packages/web/src/components/incentivize/pool-incentivize/PoolIncentivize.tsx
@@ -8,8 +8,9 @@ import { PoolIncentivizeWrapper } from "./PoolIncentivize.styles";
import PoolIncentivizeSelectPool from "../pool-incentivize-select-pool/PoolIncentivizeSelectPool";
import { PoolModel } from "@models/pool/pool-model";
import { TokenBalanceInfo } from "@models/token/token-balance-info";
-import { PoolSelectItemInfo, toPoolSelectItemInfo } from "@models/pool/info/pool-select-item-info";
+import { PoolSelectItemInfo } from "@models/pool/info/pool-select-item-info";
import { PoolDetailModel } from "@models/pool/pool-detail-model";
+import { PoolMapper } from "@models/pool/mapper/pool-mapper";
export interface DistributionPeriodDate {
year: number;
@@ -54,11 +55,11 @@ const PoolIncentivize: React.FC = ({
}) => {
const selectedItem = useMemo((): PoolSelectItemInfo | null => {
- return selectedPool ? toPoolSelectItemInfo(selectedPool) : null;
+ return selectedPool ? PoolMapper.toPoolSelectItemInfo(selectedPool) : null;
}, [selectedPool]);
const poolSelectItems = useMemo((): PoolSelectItemInfo[] => {
- return pools.map(toPoolSelectItemInfo);
+ return pools.map(PoolMapper.toPoolSelectItemInfo);
}, [pools]);
return (
diff --git a/packages/web/src/components/remove/remove-liquidity-select-list-item/RemoveLiquiditySelectListItem.stories.tsx b/packages/web/src/components/remove/remove-liquidity-select-list-item/RemoveLiquiditySelectListItem.stories.tsx
deleted file mode 100644
index d6270c065..000000000
--- a/packages/web/src/components/remove/remove-liquidity-select-list-item/RemoveLiquiditySelectListItem.stories.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import React, { useState } from "react";
-import { ComponentStory, ComponentMeta } from "@storybook/react";
-import RemoveLiquiditySelectListItem from "./RemoveLiquiditySelectListItem";
-import { action } from "@storybook/addon-actions";
-import LPPositionData from "@repositories/position/mock/positions.json";
-
-export default {
- title: "remove liquidity/RemoveLiquiditySelectListItem",
- component: RemoveLiquiditySelectListItem,
-} as ComponentMeta;
-
-
-const Template: ComponentStory = args => {
- const [selected, setSelected] = useState(false);
- return (
- setSelected(!selected)}
- />
- );
-};
-
-export const Default = Template.bind({});
-Default.args = {
- lpPosition: LPPositionData.stakedPositions[0],
- selected: false,
- select: action("select"),
-};
diff --git a/packages/web/src/components/remove/remove-liquidity-select-list/RemoveLiquiditySelectList.stories.tsx b/packages/web/src/components/remove/remove-liquidity-select-list/RemoveLiquiditySelectList.stories.tsx
deleted file mode 100644
index c9918a7f3..000000000
--- a/packages/web/src/components/remove/remove-liquidity-select-list/RemoveLiquiditySelectList.stories.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useCallback, useMemo, useState } from "react";
-import { ComponentStory, ComponentMeta } from "@storybook/react";
-import RemoveLiquiditySelectList from "./RemoveLiquiditySelectList";
-import LPPositionData from "@repositories/position/mock/positions.json";
-
-export default {
- title: "remove lpPosition/RemoveLiquiditySelectList",
- component: RemoveLiquiditySelectList,
-} as ComponentMeta;
-
-const Template: ComponentStory = args => {
- const [selectedIds, setSelectedIds] = useState([]);
-
- const unstakedLiquidities = useMemo(() => {
- return args.lpPositions;
- }, [args.lpPositions]);
-
- const selectedAll = useMemo(() => {
- return unstakedLiquidities.length === selectedIds.length;
- }, [selectedIds.length, unstakedLiquidities.length]);
-
- const selectAll = useCallback(() => {
- if (selectedAll) {
- setSelectedIds([]);
- return;
- }
- const selectedIds = unstakedLiquidities.map(lpPosition => lpPosition.lpRewardId);
- setSelectedIds(selectedIds);
- }, [selectedAll, unstakedLiquidities]);
-
- const select = useCallback((id: string) => {
- if (selectedIds.includes(id)) {
- setSelectedIds(selectedIds.filter((selectedId => selectedId !== id)));
- return;
- }
- setSelectedIds([...selectedIds, id]);
- }, [selectedIds]);
-
- return (
- ;
-
-const Template: ComponentStory = args => (
- ;
-
-const Template: ComponentStory = (args) => {
- const [selectedIds, setSelectedIds] = useState([]);
-
- const unstakedLiquidities = useMemo(() => {
- return args.lpPositions;
- }, [args.lpPositions]);
-
- const selectedAll = useMemo(() => {
- return unstakedLiquidities.length === selectedIds.length;
- }, [selectedIds.length, unstakedLiquidities.length]);
-
- const selectAll = useCallback(() => {
- if (selectedAll) {
- setSelectedIds([]);
- return;
- }
- const selectedIds = unstakedLiquidities.map(position => position.lpRewardId);
- setSelectedIds(selectedIds);
- }, [selectedAll, unstakedLiquidities]);
-
- const select = useCallback((id: string) => {
- if (selectedIds.includes(id)) {
- setSelectedIds(selectedIds.filter((selectedId => selectedId !== id)));
- return;
- }
- setSelectedIds([...selectedIds, id]);
- }, [selectedIds]);
-
- return (
- = {
FEE_500: 500,
FEE_3000: 3000,
FEE_10000: 10000,
+ NONE: 0,
} as const;
export const SwapFeeTierInfoMap: Record = {
FEE_100: {
+ type: "FEE_100",
fee: 100,
rateStr: "0.01%",
description: "Best for very stable pairs",
},
FEE_500: {
+ type: "FEE_500",
fee: 500,
rateStr: "0.05%",
description: "Best for stable pairs",
},
FEE_3000: {
+ type: "FEE_3000",
fee: 3000,
rateStr: "0.3%",
description: "Best for most pairs",
},
FEE_10000: {
+ type: "FEE_10000",
fee: 10000,
rateStr: "1%",
description: "Best for exotic pairs",
},
+ NONE: {
+ type: "NONE",
+ fee: 0,
+ rateStr: "-",
+ description: "-",
+ },
} as const;
export const FEE_RATE_OPTION = {
diff --git a/packages/web/src/containers/earn-my-position-container/EarnMyPositionContainer.tsx b/packages/web/src/containers/earn-my-position-container/EarnMyPositionContainer.tsx
index f3af9b63a..5d53322c4 100644
--- a/packages/web/src/containers/earn-my-position-container/EarnMyPositionContainer.tsx
+++ b/packages/web/src/containers/earn-my-position-container/EarnMyPositionContainer.tsx
@@ -1,7 +1,8 @@
-import { generateBarAreaDatas } from "@common/utils/test-util";
import EarnMyPositions from "@components/earn/earn-my-positions/EarnMyPositions";
+import { usePoolData } from "@hooks/pool/use-pool-data";
+import { useWallet } from "@hooks/wallet/use-wallet";
import { useRouter } from "next/router";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect } from "react";
import { ValuesType } from "utility-types";
export const POSITION_CONTENT_LABEL = {
@@ -54,111 +55,6 @@ export interface PoolPosition {
ticks: string[];
}
-export const dummyPosition: PoolPosition[] = [
- {
- tokenPair: {
- tokenA: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- tokenB: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "USDCoin",
- symbol: "USDC",
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png",
- },
- },
- rewards: [],
- feeRate: "0.05%",
- stakeType: "Unstaked",
- value: "$18,500.10",
- apr: "108.21%",
- inRange: false,
- currentPriceAmount: "1184.24 GNOS per ETH",
- minPriceAmount: "1.75 GNOT Per GNOS",
- maxPriceAmount: "2.25 GNOT Per GNOS",
- currentTick: 18,
- minTick: 10,
- maxTick: 110,
- minLabel: "-80%",
- maxLabel: "-10%",
- ticks: generateBarAreaDatas()
- },
- {
- tokenPair: {
- tokenA: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- tokenB: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "USDCoin",
- symbol: "USDC",
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png",
- },
- },
- rewards: [
- {
- token: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- amount: {
- value: "18,500.18",
- denom: "gnot",
- },
- },
- ],
- feeRate: "0.05%",
- stakeType: "Staked",
- value: "$18,500.10",
- apr: "108.21%",
- inRange: true,
- currentPriceAmount: "1184.24 GNOS per ETH",
- minPriceAmount: "1.75 GNOT Per GNOS",
- maxPriceAmount: "2.25 GNOT Per GNOS",
- currentTick: 24,
- minTick: 120,
- maxTick: 200,
- minLabel: "-30%",
- maxLabel: "50%",
- ticks: generateBarAreaDatas()
- },
-];
-
-export const dummyPositionList = () => [...dummyPosition, ...dummyPosition];
-
interface EarnMyPositionContainerProps {
loadMore?: boolean;
}
@@ -167,19 +63,16 @@ const EarnMyPositionContainer: React.FC<
EarnMyPositionContainerProps
> = () => {
const router = useRouter();
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
- const [currentIndex, setCurrentIndex] = useState(0);
- const [connected, setConnected] = useState(true);
- const [positions, setPositions] = useState([]);
+ const { connected, connectAdenaClient } = useWallet();
+ const { isFetchedPositions, myPositions, updatePositions } = usePoolData();
useEffect(() => {
- const dummyPositions = dummyPositionList();
- setPositions(dummyPositions);
+ updatePositions();
}, []);
const connect = useCallback(() => {
- setConnected(true);
- }, []);
+ connectAdenaClient();
+ }, [connectAdenaClient]);
const moveEarnAdd = useCallback(() => {
router.push("/earn/add");
@@ -193,8 +86,8 @@ const EarnMyPositionContainer: React.FC<
;
const IncentivizedPoolCardListContainer: React.FC = () => {
- const [currentIndex, setCurrentIndex] = useState(0);
+ const [currentIndex] = useState(0);
+ const [page, setPage] = useState(1);
const router = useRouter();
- const [width, setWidth] = useState(Number);
const [mobile, setMobile] = useState(false);
+ const { incentivizedPools, isFetchedPools } = usePoolData();
const handleResize = () => {
if (typeof window !== "undefined") {
@@ -44,15 +45,19 @@ const IncentivizedPoolCardListContainer: React.FC = () => {
};
}, []);
- const routeItem = (id: number) => {
+ const loadMore = useMemo(() => {
+ return incentivizedPools.length > page * 8;
+ }, [incentivizedPools.length, page]);
+
+ const routeItem = (id: string) => {
router.push(`/earn/pool/${id}`);
};
return (
{ }}
currentIndex={currentIndex}
routeItem={routeItem}
diff --git a/packages/web/src/containers/pool-list-container/PoolListContainer.tsx b/packages/web/src/containers/pool-list-container/PoolListContainer.tsx
index 71c4539ac..950a3194e 100644
--- a/packages/web/src/containers/pool-list-container/PoolListContainer.tsx
+++ b/packages/web/src/containers/pool-list-container/PoolListContainer.tsx
@@ -1,13 +1,12 @@
-import React, { useCallback, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
import { type FeeOptions } from "@common/values/data-constant";
import PoolList from "@components/earn/pool-list/PoolList";
import { type TokenPairInfo } from "@models/token/token-pair-info";
-import { useQuery } from "@tanstack/react-query";
import { ValuesType } from "utility-types";
import { useAtom } from "jotai";
import { CommonState } from "@states/index";
import { useRouter } from "next/router";
-import { generateBarAreaDatas } from "@common/utils/test-util";
+import { usePoolData } from "@hooks/pool/use-pool-data";
export interface Pool {
poolId: string;
@@ -50,135 +49,33 @@ export const POOL_TYPE = {
export type POOL_TYPE = ValuesType;
-const SORT_PARAMS: { [key in TABLE_HEAD]: string } = {
- "Pool Name": "name",
- Liquidity: "liquidity",
- "Volume (24h)": "volume",
- "Fees (24h)": "fees",
- APR: "apr",
- Rewards: "rewards",
- "Liquidity Plot": "liquidity_plot",
-};
-
-export const dummyPoolList: Pool[] = [
- {
- poolId: Math.floor(Math.random() * 50 + 1).toString(),
- tokenPair: {
- tokenA: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- tokenB: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "USDCoin",
- symbol: "USDC",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png",
- },
- },
- feeRate: "0.01%",
- liquidity: "$12,090.41M",
- apr: "$311,421.12M",
- volume24h: "$311,421.12M",
- fees24h: "$311,421.12M",
- rewards: [
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xdAC17F958D2ee523a2206206994597C13D831ec7/logo.png",
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984/logo.png",
- ],
- incentiveType: POOL_TYPE.INCENTIVIZED,
- tickInfo: {
- currentTick: 22,
- ticks: generateBarAreaDatas()
- }
- },
- {
- poolId: "2",
- tokenPair: {
- tokenA: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- tokenB: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "USDCoin",
- symbol: "USDC",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png",
- },
- },
- feeRate: "0.05%",
- liquidity: "$12,090.41M",
- apr: "$311,421.12M",
- volume24h: "$311,421.12M",
- fees24h: "$311,421.12M",
- rewards: [
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x4E15361FD6b4BB609Fa63C81A2be19d873717870/logo.png",
- "https://assets.coingecko.com/coins/images/29223/large/Favicon_200x200px.png?1677480836",
- ],
- incentiveType: POOL_TYPE.ALL,
- tickInfo: {
- currentTick: 29,
- ticks: generateBarAreaDatas()
- }
- },
- {
- poolId: "3",
- tokenPair: {
- tokenA: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "HEX",
- symbol: "HEX",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png",
- },
- tokenB: {
- path: Math.floor(Math.random() * 50 + 1).toString(),
- name: "USDCoin",
- symbol: "USDC",
- logoURI:
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png",
- },
- },
- feeRate: "0.3%",
- liquidity: "$12,090.41M",
- apr: "$311,421.12M",
- volume24h: "$311,421.12M",
- fees24h: "$311,421.12M",
- rewards: [
- "https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x4E15361FD6b4BB609Fa63C81A2be19d873717870/logo.png",
- "https://assets.coingecko.com/coins/images/29223/large/Favicon_200x200px.png?1677480836",
- ],
- incentiveType: POOL_TYPE.NON_INCENTIVIZED,
- tickInfo: {
- currentTick: 14,
- ticks: generateBarAreaDatas()
- }
- },
-];
-
-async function fetchPools(
- type: POOL_TYPE, // eslint-disable-line
- page: number, // eslint-disable-line
- keyword: string, // eslint-disable-line
- sortKey?: string, // eslint-disable-line
- direction?: string, // eslint-disable-line
-): Promise {
- return new Promise(resolve => setTimeout(resolve, 2000)).then(() =>
- Promise.resolve([
- ...dummyPoolList,
- ...dummyPoolList,
- ...dummyPoolList,
- ...dummyPoolList,
- ...dummyPoolList,
- ]),
- );
-}
+// const SORT_PARAMS: { [key in TABLE_HEAD]: string } = {
+// "Pool Name": "name",
+// Liquidity: "liquidity",
+// "Volume (24h)": "volume",
+// "Fees (24h)": "fees",
+// APR: "apr",
+// Rewards: "rewards",
+// "Liquidity Plot": "liquidity_plot",
+// };
+
+// async function fetchPools(
+// type: POOL_TYPE, // eslint-disable-line
+// page: number, // eslint-disable-line
+// keyword: string, // eslint-disable-line
+// sortKey?: string, // eslint-disable-line
+// direction?: string, // eslint-disable-line
+// ): Promise {
+// return new Promise(resolve => setTimeout(resolve, 2000)).then(() =>
+// Promise.resolve([
+// ...dummyPoolList,
+// ...dummyPoolList,
+// ...dummyPoolList,
+// ...dummyPoolList,
+// ...dummyPoolList,
+// ]),
+// );
+// }
const PoolListContainer: React.FC = () => {
const [poolType, setPoolType] = useState(POOL_TYPE.ALL);
@@ -188,37 +85,38 @@ const PoolListContainer: React.FC = () => {
const [searchIcon, setSearchIcon] = useState(false);
const [breakpoint] = useAtom(CommonState.breakpoint);
const router = useRouter();
+ const { poolListInfos, isFetchedPools, updatePools } = usePoolData();
- const routeItem = (id: number) => {
+ useEffect(() => {
+ updatePools();
+ }, []);
+
+ const sortedPoolListInfos = useMemo(() => {
+ return poolListInfos.filter(info => {
+ if (poolType !== "All") {
+ return info.incentiveType === poolType;
+ }
+ if (keyword !== "") {
+ return info.tokenA.name.toLowerCase().includes(keyword.toLowerCase()) ||
+ info.tokenB.name.toLowerCase().includes(keyword.toLowerCase()) ||
+ info.tokenA.symbol.toLowerCase().includes(keyword.toLowerCase()) ||
+ info.tokenB.symbol.toLowerCase().includes(keyword.toLowerCase());
+ }
+ return true;
+ });
+ }, [keyword, poolListInfos, poolType]);
+
+ const totalPage = useMemo(() => {
+ return sortedPoolListInfos.length / 20 + 1;
+ }, [sortedPoolListInfos.length]);
+
+ const routeItem = (id: string) => {
router.push(`/earn/pool/${id}`);
};
const onTogleSearch = () => {
setSearchIcon(prev => !prev);
};
- const {
- isFetched,
- error,
- data: pools,
- } = useQuery({
- queryKey: [
- "pools",
- poolType,
- page,
- keyword,
- sortOption?.key,
- sortOption?.direction,
- ],
- queryFn: () =>
- fetchPools(
- poolType,
- page,
- keyword,
- sortOption && SORT_PARAMS[sortOption.key],
- sortOption?.direction,
- ),
- });
-
const changePoolType = useCallback((newType: string) => {
switch (newType) {
case POOL_TYPE.ALL:
@@ -268,15 +166,14 @@ const PoolListContainer: React.FC = () => {
return (
{
const { poolRepository } = useGnoswapContext();
const [pools, setPools] = useAtom(PoolState.pools);
+ const [isFetchedPools, setIsFetchedPools] = useAtom(PoolState.isFetchedPools);
+ const [isFetchedPositions, setIsFetchedPositions] = useAtom(PoolState.isFetchedPositions);
+
+ const poolListInfos = useMemo(() => {
+ return pools.map(PoolMapper.toListInfo);
+ }, [pools]);
const higestAPRs: CardListPoolInfo[] = useMemo(() => {
const sortedTokens = pools.sort((p1, p2) => {
@@ -15,17 +24,38 @@ export const usePoolData = () => {
return sortedTokens.map(pool => ({
pool,
upDown: "none",
- content: `${pool.topBin.annualizedFeeGrowth}%`
+ content: `${pool.topBin.annualizedFeeGrowth || 0}%`
}));
}, [pools]);
+ const myPositions: PoolPosition[] = useMemo(() => {
+ return [];
+ }, []);
+ async function updatePositions() {
+ setIsFetchedPositions(true);
+ }
+
+ const incentivizedPools: PoolCardInfo[] = useMemo(() => {
+ return pools
+ .map(PoolMapper.toCardInfo)
+ .filter(info => info.incentiveType === "Incentivized");
+ }, [pools]);
+
async function updatePools() {
const response = await poolRepository.getPools();
setPools(response.pools);
+ setIsFetchedPools(true);
}
return {
+ isFetchedPools,
higestAPRs,
+ isFetchedPositions,
+ myPositions,
+ pools,
+ poolListInfos,
+ incentivizedPools,
updatePools,
+ updatePositions,
};
};
\ No newline at end of file
diff --git a/packages/web/src/hooks/token/use-earn-add-liquidity-confirm-modal.tsx b/packages/web/src/hooks/token/use-earn-add-liquidity-confirm-modal.tsx
index ebf191104..4ad8e6636 100644
--- a/packages/web/src/hooks/token/use-earn-add-liquidity-confirm-modal.tsx
+++ b/packages/web/src/hooks/token/use-earn-add-liquidity-confirm-modal.tsx
@@ -95,9 +95,9 @@ export const useEarnAddLiquidityConfirmModal = ({
setModalContent(null);
}, [setModalContent, setOpenedModal]);
- const moveMain = useCallback(() => {
+ const moveEarn = useCallback(() => {
close();
- navigator.push("/");
+ navigator.push("/earn");
}, [close, navigator]);
const confirm = useCallback(() => {
@@ -113,8 +113,8 @@ export const useEarnAddLiquidityConfirmModal = ({
slippage,
startPrice: currentPrice,
swapFeeTier,
- }).then(result => result && moveMain());
- }, [createPool, currentPrice, moveMain, priceRange, slippage, swapFeeTier, tokenA, tokenAAmountInput.amount, tokenB, tokenBAmountInput.amount]);
+ }).then(result => result && moveEarn());
+ }, [createPool, currentPrice, moveEarn, priceRange, slippage, swapFeeTier, tokenA, tokenAAmountInput.amount, tokenB, tokenBAmountInput.amount]);
const openModal = useCallback(() => {
if (!amountInfo || !priceRangeInfo) {
diff --git a/packages/web/src/models/pool/info/pool-card-info.ts b/packages/web/src/models/pool/info/pool-card-info.ts
new file mode 100644
index 000000000..daf1fe6c2
--- /dev/null
+++ b/packages/web/src/models/pool/info/pool-card-info.ts
@@ -0,0 +1,32 @@
+import { SwapFeeTierType } from "@constants/option.constant";
+import { POOL_TYPE } from "@containers/pool-list-container/PoolListContainer";
+import { TokenModel } from "@models/token/token-model";
+import { PoolRewardInfo } from "./pool-reward-info";
+
+export interface PoolCardInfo {
+ poolId: string;
+
+ tokenA: TokenModel;
+
+ tokenB: TokenModel;
+
+ feeTier: SwapFeeTierType;
+
+ liquidity: string;
+
+ apr: string;
+
+ volume24h: string;
+
+ fees24h: string;
+
+ rewards: PoolRewardInfo[];
+
+ incentiveType: POOL_TYPE;
+
+ tickInfo: {
+ ticks: string[];
+
+ currentTick: number;
+ };
+}
diff --git a/packages/web/src/models/pool/info/pool-list-info.ts b/packages/web/src/models/pool/info/pool-list-info.ts
new file mode 100644
index 000000000..c18fd99ba
--- /dev/null
+++ b/packages/web/src/models/pool/info/pool-list-info.ts
@@ -0,0 +1,32 @@
+import { SwapFeeTierType } from "@constants/option.constant";
+import { POOL_TYPE } from "@containers/pool-list-container/PoolListContainer";
+import { TokenModel } from "@models/token/token-model";
+import { PoolRewardInfo } from "./pool-reward-info";
+
+export interface PoolListInfo {
+ poolId: string;
+
+ tokenA: TokenModel;
+
+ tokenB: TokenModel;
+
+ feeTier: SwapFeeTierType;
+
+ liquidity: string;
+
+ apr: string;
+
+ volume24h: string;
+
+ fees24h: string;
+
+ rewards: PoolRewardInfo[];
+
+ incentiveType: POOL_TYPE;
+
+ tickInfo: {
+ ticks: string[];
+
+ currentTick: number;
+ };
+}
diff --git a/packages/web/src/models/pool/info/pool-reward-info.ts b/packages/web/src/models/pool/info/pool-reward-info.ts
new file mode 100644
index 000000000..a4e5fa57e
--- /dev/null
+++ b/packages/web/src/models/pool/info/pool-reward-info.ts
@@ -0,0 +1,6 @@
+import { TokenModel } from "@models/token/token-model";
+
+export interface PoolRewardInfo {
+ token: TokenModel;
+ amount: number;
+}
diff --git a/packages/web/src/models/pool/info/pool-select-item-info.ts b/packages/web/src/models/pool/info/pool-select-item-info.ts
index f726065ce..e362aa0c0 100644
--- a/packages/web/src/models/pool/info/pool-select-item-info.ts
+++ b/packages/web/src/models/pool/info/pool-select-item-info.ts
@@ -1,11 +1,9 @@
-import { PoolModel } from "@models/pool/pool-model";
import { TokenModel } from "@models/token/token-model";
-import BigNumber from "bignumber.js";
export interface PoolSelectItemInfo {
poolId: string;
- feeRate: number;
+ feeRate: string;
liquidityAmount: string;
@@ -13,13 +11,3 @@ export interface PoolSelectItemInfo {
tokenB: TokenModel;
}
-
-export function toPoolSelectItemInfo(pool: PoolModel): PoolSelectItemInfo {
- return {
- poolId: pool.id,
- liquidityAmount: BigNumber(pool.price).toFixed(),
- feeRate: pool.fee,
- tokenA: pool.tokenA,
- tokenB: pool.tokenB,
- };
-}
diff --git a/packages/web/src/models/pool/mapper/pool-mapper.ts b/packages/web/src/models/pool/mapper/pool-mapper.ts
new file mode 100644
index 000000000..a047c5491
--- /dev/null
+++ b/packages/web/src/models/pool/mapper/pool-mapper.ts
@@ -0,0 +1,123 @@
+import BigNumber from "bignumber.js";
+import { PoolListInfo } from "../info/pool-list-info";
+import { PoolModel } from "../pool-model";
+import { SwapFeeTierInfoMap } from "@constants/option.constant";
+import { PoolRewardInfo } from "../info/pool-reward-info";
+import { PoolCardInfo } from "../info/pool-card-info";
+import { PoolSelectItemInfo } from "../info/pool-select-item-info";
+
+export class PoolMapper {
+ public static toListInfo(poolModel: PoolModel): PoolListInfo {
+ const {
+ id,
+ price,
+ tokenA,
+ tokenB,
+ volume,
+ totalVolume,
+ fee,
+ feeVolume,
+ apr,
+ } = poolModel;
+
+ const feeTierInfo = Object.values(SwapFeeTierInfoMap).find(
+ info => `${info.fee}` === fee,
+ );
+
+ const defaultReward: PoolRewardInfo = {
+ token: {
+ chainId: "dev",
+ createdAt: "2023-10-12T06:56:12+09:00",
+ name: "Gnoswap",
+ address: "g1sqaft388ruvsseu97r04w4rr4szxkh4nn6xpax",
+ path: "gno.land/r/gnos",
+ decimals: 4,
+ symbol: "GNOS",
+ logoURI: "/gnos.svg",
+ priceId: "gno.land/r/gnos",
+ },
+ amount: 10,
+ };
+
+ return {
+ poolId: id,
+ tokenA,
+ tokenB,
+ feeTier: feeTierInfo?.type || "NONE",
+ liquidity: `$${BigNumber(totalVolume.amount).toFormat()}`,
+ apr: `${BigNumber(apr).toFormat(2)}%`,
+ volume24h: `$${BigNumber(volume.amount).toFormat()}`,
+ fees24h: `$${BigNumber(feeVolume).toFormat()}`,
+ rewards: [defaultReward],
+ incentiveType: "Incentivized",
+ tickInfo: {
+ currentTick: price,
+ ticks: [],
+ },
+ };
+ }
+
+ public static toPoolSelectItemInfo(pool: PoolModel): PoolSelectItemInfo {
+ const feeRate =
+ Object.values(SwapFeeTierInfoMap).find(info => `${info.fee}` === pool.fee)
+ ?.rateStr || "-";
+
+ return {
+ poolId: pool.id,
+ liquidityAmount: BigNumber(pool.price).toFixed(),
+ feeRate,
+ tokenA: pool.tokenA,
+ tokenB: pool.tokenB,
+ };
+ }
+
+ public static toCardInfo(poolModel: PoolModel): PoolCardInfo {
+ const {
+ id,
+ price,
+ tokenA,
+ tokenB,
+ volume,
+ totalVolume,
+ fee,
+ feeVolume,
+ apr,
+ } = poolModel;
+
+ const feeTierInfo = Object.values(SwapFeeTierInfoMap).find(
+ info => `${info.fee}` === fee,
+ );
+
+ const defaultReward: PoolRewardInfo = {
+ token: {
+ chainId: "dev",
+ createdAt: "2023-10-12T06:56:12+09:00",
+ name: "Gnoswap",
+ address: "g1sqaft388ruvsseu97r04w4rr4szxkh4nn6xpax",
+ path: "gno.land/r/gnos",
+ decimals: 4,
+ symbol: "GNOS",
+ logoURI: "/gnos.svg",
+ priceId: "gno.land/r/gnos",
+ },
+ amount: 10,
+ };
+
+ return {
+ poolId: id,
+ tokenA,
+ tokenB,
+ feeTier: feeTierInfo?.type || "NONE",
+ liquidity: `$${BigNumber(totalVolume.amount).toFormat()}`,
+ apr: `${BigNumber(apr).toFormat(2)}%`,
+ volume24h: `$${BigNumber(volume.amount).toFormat()}`,
+ fees24h: `$${BigNumber(feeVolume).toFormat()}`,
+ rewards: [defaultReward],
+ incentiveType: "Incentivized",
+ tickInfo: {
+ currentTick: price,
+ ticks: [],
+ },
+ };
+ }
+}
diff --git a/packages/web/src/models/pool/pool-model.ts b/packages/web/src/models/pool/pool-model.ts
index 7c8acda2b..7c6515361 100644
--- a/packages/web/src/models/pool/pool-model.ts
+++ b/packages/web/src/models/pool/pool-model.ts
@@ -35,7 +35,7 @@ export interface PoolModel {
totalVolume: AmountModel;
- fee: number;
+ fee: string;
feeVolume: number;
diff --git a/packages/web/src/repositories/pool/mock/pool-detail.json b/packages/web/src/repositories/pool/mock/pool-detail.json
index 1848a1ddf..d1614c43f 100644
--- a/packages/web/src/repositories/pool/mock/pool-detail.json
+++ b/packages/web/src/repositories/pool/mock/pool-detail.json
@@ -1,106 +1,63 @@
{
"pool": {
- "name": "1inch_weth_500",
+ "name": "bar_foo_500",
"tokenA": {
- "chainId": "test3",
- "address": "0x111111111117dC0aa78b770fA6A738034120C302",
- "path": "gno.land/r/demo/1inch",
- "name": "1inch",
- "symbol": "1INCH",
- "decimals": 6,
- "logoURI": "https://assets.coingecko.com/coins/images/13469/thumb/1inch-token.png?1608803028",
- "priceId": "1inch",
- "createdAt": "2023-09-26T05:36:37+09:00"
+ "chainId": "dev",
+ "createdAt": "2023-10-12T06:56:10+09:00",
+ "name": "Bar",
+ "address": "g1w8wqgrp08cqhtupzx98n4jtm8kqy7vadfmmyd0",
+ "path": "gno.land/r/bar",
+ "decimals": 4,
+ "symbol": "BAR",
+ "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ "priceId": "gno.land/r/bar"
},
"tokenB": {
- "name": "Wrapped Ether",
- "address": "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2",
- "path": "gno.land/r/demo/weth",
- "symbol": "WETH",
- "decimals": 6,
- "chainId": "test3",
- "priceId": "weth",
- "createdAt": "2023-09-26T05:36:37+09:00",
- "isWrappedGasToken": true,
- "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/2396.png"
+ "chainId": "dev",
+ "createdAt": "2023-10-12T06:56:08+09:00",
+ "name": "Foo",
+ "address": "g1evezrh92xaucffmtgsaa3rvmz5s8kedffsg469",
+ "path": "gno.land/r/foo",
+ "decimals": 4,
+ "symbol": "FOO",
+ "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ "priceId": "gno.land/r/foo"
},
"tvl": {
- "amount": 10621.170589130697,
+ "amount": 1182782.0,
"currency": "USD"
},
- "tvlChange": 0,
+ "tvlChange": 118278200.0,
"volume": {
- "amount": 0,
+ "amount": 1182797.0,
"currency": "USD"
},
- "volumeChange": -1,
+ "volumeChange": 118279700.0,
"totalVolume": {
- "amount": 133703.0054829442,
+ "amount": 1182797.0,
"currency": "USD"
},
- "id": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "fee": 0.05,
- "feeVolume": 0,
- "feeChange": -1,
- "currentTick": 15,
- "price": 1.0619905601291797,
- "tokenABalance": 49.981458116220594,
- "tokenBBalance": 24049.763462426952,
- "tickSpacing": 40,
- "resolvedBins": [
- {
- "binId": "1",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 15,
- "reserveA": 49.981458116220594,
- "reserveB": 1223.4471028043677,
- "lpTokenId": "1",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- },
- {
- "binId": "2",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 16,
- "reserveA": 0,
- "reserveB": 1264.593283181672,
- "lpTokenId": "2",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- }
- ],
- "bins": [
- {
- "binId": "1",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 15,
- "reserveA": 49.981458116220594,
- "reserveB": 1223.4471028043677,
- "lpTokenId": "1",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- },
- {
- "binId": "2",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 16,
- "reserveA": 0,
- "reserveB": 1264.593283181672,
- "lpTokenId": "2",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- }
- ],
+ "id": "bar_foo_500",
+ "apr": 0.12345,
+ "fee": "500",
+ "feeVolume": 131.937491,
+ "feeChange": 13193.749143,
+ "currentTick": 8090,
+ "price": 1.49859,
+ "tokenABalance": 591391,
+ "tokenBBalance": 2777571,
+ "tickSpacing": 10,
+ "bins": [],
+ "resolvedBins": [],
"topBin": {
- "binId": "1",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 15,
- "reserveA": 49.981458116220594,
- "reserveB": 1223.4471028058367,
- "lpTokenId": "3",
+ "binId": "",
+ "poolId": "",
+ "currentTick": 0,
+ "reserveA": 0,
+ "reserveB": 0,
+ "lpTokenId": "",
"timestamp": "0001-01-01T00:00:00Z",
"annualizedFeeGrowth": 0
- },
- "apr": 148.07
+ }
}
}
diff --git a/packages/web/src/repositories/pool/mock/pools.json b/packages/web/src/repositories/pool/mock/pools.json
index 26cf6c719..29421667c 100644
--- a/packages/web/src/repositories/pool/mock/pools.json
+++ b/packages/web/src/repositories/pool/mock/pools.json
@@ -1,90 +1,68 @@
{
"meta": {
- "height": 18177740,
- "timestamp": "2023-09-26T05:36:37+09:00"
+ "height": 0,
+ "timestamp": "2023-10-12T10:33:10+09:00"
},
"pools": [
{
- "name": "1inch_weth_500",
+ "name": "bar_foo_500",
"tokenA": {
- "chainId": "test3",
- "address": "0x111111111117dC0aa78b770fA6A738034120C302",
- "path": "gno.land/r/demo/1inch",
- "name": "1inch",
- "symbol": "1INCH",
- "decimals": 6,
- "logoURI": "https://assets.coingecko.com/coins/images/13469/thumb/1inch-token.png?1608803028",
- "priceId": "1inch",
- "createdAt": "2023-09-26T05:36:37+09:00"
+ "chainId": "dev",
+ "createdAt": "2023-10-12T06:56:10+09:00",
+ "name": "Bar",
+ "address": "g1w8wqgrp08cqhtupzx98n4jtm8kqy7vadfmmyd0",
+ "path": "gno.land/r/bar",
+ "decimals": 4,
+ "symbol": "BAR",
+ "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ "priceId": "gno.land/r/bar"
},
"tokenB": {
- "name": "Wrapped Ether",
- "address": "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2",
- "path": "gno.land/r/demo/weth",
- "symbol": "WETH",
- "decimals": 6,
- "chainId": "test3",
- "priceId": "weth",
- "createdAt": "2023-09-26T05:36:37+09:00",
- "isWrappedGasToken": true,
- "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/2396.png"
+ "chainId": "dev",
+ "createdAt": "2023-10-12T06:56:08+09:00",
+ "name": "Foo",
+ "address": "g1evezrh92xaucffmtgsaa3rvmz5s8kedffsg469",
+ "path": "gno.land/r/foo",
+ "decimals": 4,
+ "symbol": "FOO",
+ "logoURI": "https://s2.coinmarketcap.com/static/img/coins/64x64/5994.png",
+ "priceId": "gno.land/r/foo"
},
"tvl": {
- "amount": 10621.170589130697,
+ "amount": 1182782.0,
"currency": "USD"
},
- "tvlChange": 0,
+ "tvlChange": 118278200.0,
"volume": {
- "amount": 0,
+ "amount": 1182797.0,
"currency": "USD"
},
- "volumeChange": -1,
+ "volumeChange": 118279700.0,
"totalVolume": {
- "amount": 133703.0054829442,
+ "amount": 1182797.0,
"currency": "USD"
},
- "id": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "fee": 0.05,
- "feeVolume": 0,
- "feeChange": -1,
- "currentTick": 15,
- "price": 1.0619905601291797,
- "tokenABalance": 49.981458116220594,
- "tokenBBalance": 24049.763462426952,
- "tickSpacing": 40,
- "bins": [
- {
- "binId": "1",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 15,
- "reserveA": 49.981458116220594,
- "reserveB": 1223.4471028043677,
- "lpTokenId": "1",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- },
- {
- "binId": "2",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 16,
- "reserveA": 0,
- "reserveB": 1264.593283181672,
- "lpTokenId": "2",
- "timestamp": "0001-01-01T00:00:00Z",
- "annualizedFeeGrowth": 0
- }
- ],
+ "id": "bar_foo_500",
+ "apr": 0.12345,
+ "fee": "500",
+ "feeVolume": 131.937491,
+ "feeChange": 13193.749143,
+ "currentTick": 8090,
+ "price": 1.49859,
+ "tokenABalance": 591391,
+ "tokenBBalance": 2777571,
+ "tickSpacing": 10,
+ "bins": [],
"topBin": {
- "binId": "1",
- "poolId": "0x001903de96a72d11d27cd8c2bee003a730e032a8",
- "currentTick": 15,
- "reserveA": 49.981458116220594,
- "reserveB": 1223.4471028058367,
- "lpTokenId": "3",
+ "binId": "",
+ "poolId": "",
+ "currentTick": 0,
+ "reserveA": 0,
+ "reserveB": 0,
+ "lpTokenId": "",
"timestamp": "0001-01-01T00:00:00Z",
"annualizedFeeGrowth": 0
- },
- "apr": 148.07
+ }
}
]
}
diff --git a/packages/web/src/repositories/position/position-repository-mock.ts b/packages/web/src/repositories/position/position-repository-mock.ts
deleted file mode 100644
index 496317289..000000000
--- a/packages/web/src/repositories/position/position-repository-mock.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { PositionRepository } from "./position-repository";
-import { PositionListResponse, PositionDetailResponse } from "./response";
-
-import PositionListData from "./mock/positions.json";
-import PositionDetailData from "./mock/position-detail.json";
-
-export class PositionRepositoryMock implements PositionRepository {
- getPositions = async (): Promise => {
- return PositionListData as PositionListResponse;
- };
-
- getPositionDetailByPositionId = async (): Promise => {
- return PositionDetailData as PositionDetailResponse;
- };
-}
diff --git a/packages/web/src/states/pool.ts b/packages/web/src/states/pool.ts
index db2eb1a5b..bec181fa7 100644
--- a/packages/web/src/states/pool.ts
+++ b/packages/web/src/states/pool.ts
@@ -1,4 +1,11 @@
import { PoolModel } from "@models/pool/pool-model";
+import { PositionModel } from "@models/position/position-model";
import { atom } from "jotai";
+export const isFetchedPools = atom(false);
+
export const pools = atom([]);
+
+export const isFetchedPositions = atom(false);
+
+export const positions = atom([]);