Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: [GSW-458] feat: Integrate Pool Card data #238

Merged
merged 4 commits into from
Dec 1, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/swap-router/.ultra.cache.json
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"files":{".vscode":"1700971955685.2515","build":"1701256570289.2512","node_modules":"1700891704503.8325",".eslintignore":"7de3bd702df2dee92c033c49abbedd0b0f7452e6",".eslintrc.js":"ca4815a5cf5cffa1d3fb4a014c8c602f852b002a",".gitignore":"c87c9b392c0200d9c9dafc444386ad3e15a85c64",".prettierignore":"47bb4656eb55860a075be7799cba7fa955b68141",".prettierrc":"fe5f744c7a08b128c935d1e1aed3e8a577e74507","jest.config.json":"2e496ee6bd64eb237161dcd69a6957eff2df584d","package.json":"4dda70ca76fb6022f6cb20852ecd8d2d95d638d2","src/common/array.util.ts":"9482ab121d34cc7e08a0cd33b49173b0b85823d8","src/common/bigint.util.ts":"343f4c85ca1f6c840ade68c259ed82bf5b159fb0","src/common/index.ts":"861a3167cddfc93e9eb1b6a4ae8229bb9dc2f8fd","src/common/mapper.ts":"f7d7b491dff443911a978b34e4cb378bee46c2b7","src/common/queue.ts":"ad096fefbe1c5a7339b536b0b8d39dba661b520e","src/common/test.util.ts":"3e500df6ec27ba98606acbfcaec9243e22862e43","src/constants/index.ts":"9605b149deb525c25f6e93420bbc433ff1c75cd0","src/constants/math.constant.ts":"b617851527cabcc9c3bce2c8e39208001d379ad6","src/constants/swap.constant.ts":"53e280147c68acfba490bc1f9a0b7bb1580e7280","src/index.ts":"691efb21a28bd3f0e6437edcb16192789dbbb7f6","src/swap-router/index.ts":"effaf28a826bdf1441437643e8343e7fbd8026b1","src/swap-router/swap-router-default.spec.ts":"f980bc94753df130c950eb80d8709b62ec3276fa","src/swap-router/swap-router-multi-higher-range-position-pool.spec.ts":"683ce3a82d73e915018e772723700905c3ff7c92","src/swap-router/swap-router-multi-lower-range-position-pool.spec.ts":"93bfd18d0a297f3c66743cddcf2fe10c3764e250","src/swap-router/swap-router-multi-pair-pools.spec.ts":"5fbd55be39012d46adbdc91a1111dca2aafd314d","src/swap-router/swap-router-multi-route.spec.ts":"771df497876b6bc027dc7b65d03e53209538bf2e","src/swap-router/swap-router-single-pair-pools.spec.ts":"3954e9057ef9534a3724dc960c291281d1a4ef52","src/swap-router/swap-router.ts":"606de3d518665d58f5cbafb55f45d92c30dab77d","src/swap-router/swap-router.types.ts":"2a48987217df238256a0721d227952142a37ce08","src/swap-router/utility/index.ts":"4973874904dd9d77d037d72b1ec8aed397716a38","src/swap-router/utility/route.util.ts":"d492418c9184e42d3ef29d7760eb18fa013f54c6","src/swap-simulator/index.ts":"ef493c5977bdf1123d1197b804f2344ee463870c","src/swap-simulator/swap-simulator-default.spec.ts":"867788b12ccc70abe676010aeed5d6b2b58e8036","src/swap-simulator/swap-simulator.ts":"48cc4c90a2622d806659fa2f8c4f48d600a2b2db","src/swap-simulator/swap-simulator.types.ts":"2b03d7e389ab8875852330c8fddf5a9bfe96f1c6","src/swap-simulator/utility/cache.util.ts":"c5af86d350610a80a6690846657a35635bbc752a","src/swap-simulator/utility/index.ts":"7272f5d23dfa7af2895fca9bb0b17985234ab6e1","src/swap-simulator/utility/math.util.ts":"96fbe38cbabe344f6f58220f46c20103e6df4225","src/swap-simulator/utility/swap-util.spec.ts":"b7fe082f3fef7e5a912959925924f56f8c36e020","src/swap-simulator/utility/swap.util.ts":"f49236f0d22f72b9283244e870d34401d42fe009","src/swap-simulator/utility/tick.util.ts":"4d9bf8ed782f07587c71009ad13cd249b5e3a840","tsconfig.json":"55467bd5c5eb1b501abe50b952d5f2d9fa0a0d69"},"deps":{}}
{"files":{".vscode":"1700971955685.2515","build":"1701412916671.3086","node_modules":"1700891704503.8325",".eslintignore":"7de3bd702df2dee92c033c49abbedd0b0f7452e6",".eslintrc.js":"ca4815a5cf5cffa1d3fb4a014c8c602f852b002a",".gitignore":"c87c9b392c0200d9c9dafc444386ad3e15a85c64",".prettierignore":"47bb4656eb55860a075be7799cba7fa955b68141",".prettierrc":"fe5f744c7a08b128c935d1e1aed3e8a577e74507","jest.config.json":"2e496ee6bd64eb237161dcd69a6957eff2df584d","package.json":"4dda70ca76fb6022f6cb20852ecd8d2d95d638d2","src/common/array.util.ts":"9482ab121d34cc7e08a0cd33b49173b0b85823d8","src/common/bigint.util.ts":"343f4c85ca1f6c840ade68c259ed82bf5b159fb0","src/common/index.ts":"861a3167cddfc93e9eb1b6a4ae8229bb9dc2f8fd","src/common/mapper.ts":"f7d7b491dff443911a978b34e4cb378bee46c2b7","src/common/queue.ts":"ad096fefbe1c5a7339b536b0b8d39dba661b520e","src/common/test.util.ts":"3e500df6ec27ba98606acbfcaec9243e22862e43","src/constants/index.ts":"9605b149deb525c25f6e93420bbc433ff1c75cd0","src/constants/math.constant.ts":"b617851527cabcc9c3bce2c8e39208001d379ad6","src/constants/swap.constant.ts":"53e280147c68acfba490bc1f9a0b7bb1580e7280","src/index.ts":"691efb21a28bd3f0e6437edcb16192789dbbb7f6","src/swap-router/index.ts":"effaf28a826bdf1441437643e8343e7fbd8026b1","src/swap-router/swap-router-default.spec.ts":"f980bc94753df130c950eb80d8709b62ec3276fa","src/swap-router/swap-router-multi-higher-range-position-pool.spec.ts":"683ce3a82d73e915018e772723700905c3ff7c92","src/swap-router/swap-router-multi-lower-range-position-pool.spec.ts":"93bfd18d0a297f3c66743cddcf2fe10c3764e250","src/swap-router/swap-router-multi-pair-pools.spec.ts":"5fbd55be39012d46adbdc91a1111dca2aafd314d","src/swap-router/swap-router-multi-route.spec.ts":"771df497876b6bc027dc7b65d03e53209538bf2e","src/swap-router/swap-router-single-pair-pools.spec.ts":"3954e9057ef9534a3724dc960c291281d1a4ef52","src/swap-router/swap-router.ts":"606de3d518665d58f5cbafb55f45d92c30dab77d","src/swap-router/swap-router.types.ts":"2a48987217df238256a0721d227952142a37ce08","src/swap-router/utility/index.ts":"4973874904dd9d77d037d72b1ec8aed397716a38","src/swap-router/utility/route.util.ts":"d492418c9184e42d3ef29d7760eb18fa013f54c6","src/swap-simulator/index.ts":"ef493c5977bdf1123d1197b804f2344ee463870c","src/swap-simulator/swap-simulator-default.spec.ts":"867788b12ccc70abe676010aeed5d6b2b58e8036","src/swap-simulator/swap-simulator.ts":"48cc4c90a2622d806659fa2f8c4f48d600a2b2db","src/swap-simulator/swap-simulator.types.ts":"2b03d7e389ab8875852330c8fddf5a9bfe96f1c6","src/swap-simulator/utility/cache.util.ts":"c5af86d350610a80a6690846657a35635bbc752a","src/swap-simulator/utility/index.ts":"7272f5d23dfa7af2895fca9bb0b17985234ab6e1","src/swap-simulator/utility/math.util.ts":"96fbe38cbabe344f6f58220f46c20103e6df4225","src/swap-simulator/utility/swap-util.spec.ts":"b7fe082f3fef7e5a912959925924f56f8c36e020","src/swap-simulator/utility/swap.util.ts":"f49236f0d22f72b9283244e870d34401d42fe009","src/swap-simulator/utility/tick.util.ts":"4d9bf8ed782f07587c71009ad13cd249b5e3a840","tsconfig.json":"55467bd5c5eb1b501abe50b952d5f2d9fa0a0d69"},"deps":{}}
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import PoolGraph, { type PoolGraphProps } from "./PoolGraph";
import { Meta, StoryObj } from "@storybook/react";
import POOLS from "@repositories/pool/mock/pools.json";
import { PoolModel } from "@models/pool/pool-model";

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

export default {
title: "common/PoolGraph",
Expand Down
15 changes: 7 additions & 8 deletions packages/web/src/components/common/pool-graph/PoolGraph.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import { PoolGraphWrapper } from "./PoolGraph.styles";
import * as d3 from "d3";
import { PoolBinModel } from "@models/pool/pool-bin-model";
import { MAX_TICK, MIN_TICK } from "@constants/swap.constant";
import BigNumber from "bignumber.js";
import { renderToStaticMarkup } from "react-dom/server";
import { TokenModel } from "@models/token/token-model";
import { toMillionFormat } from "@utils/number-utils";
Expand Down Expand Up @@ -86,8 +85,8 @@ const PoolGraph: React.FC<PoolGraphProps> = ({
const xAxis = d3
.axisBottom(scaleX)
.tickSize(0)
.tickFormat(v => BigNumber(1.001 ** (v.valueOf() / 2)).toFormat(4));
const [minX, maxX] = d3.extent(bins, (bin) => bin.currentTick);
.tickFormat(v => v.toString());
const [minX, maxX] = d3.extent(bins, (bin) => bin.minTick);
const [, max] = d3.extent(bins, (bin) => bin.liquidity);

const scaleY = useMemo(() => {
Expand Down Expand Up @@ -152,7 +151,7 @@ const PoolGraph: React.FC<PoolGraphProps> = ({
if (bins.length === 2) {
return 20;
}
const spacing = scaleX(bins[1].currentTick) - scaleX(bins[0].currentTick);
const spacing = scaleX(bins[1].minTick) - scaleX(bins[0].minTick);
if (spacing < 2) {
return spacing;
}
Expand All @@ -166,7 +165,7 @@ const PoolGraph: React.FC<PoolGraphProps> = ({

// Retrieves the colour of the chart bar at the current tick.
function fillByBin(bin: PoolBinModel) {
if (currentTick && scaleX(bin.currentTick) < centerPosition) {
if (currentTick && (bin.minTick) < currentTick) {
return "url(#gradient-bar-green)";
}
return "url(#gradient-bar-red)";
Expand All @@ -184,7 +183,7 @@ const PoolGraph: React.FC<PoolGraphProps> = ({
.append("rect")
.style("fill", bin => fillByBin(bin))
.attr("class", "rects")
.attr("x", bin => scaleX(bin.currentTick))
.attr("x", bin => scaleX(bin.minTick))
.attr("y", bin => scaleY(bin.liquidity))
.attr("width", tickSpacing)
.attr("height", bin => boundsHeight - scaleY(bin.liquidity))
Expand Down Expand Up @@ -227,8 +226,8 @@ const PoolGraph: React.FC<PoolGraphProps> = ({
<PoolGraphBinTooptip
tokenA={tokenA}
tokenB={tokenB}
tokenAAmount={bin.tokenAAmount}
tokenBAmount={bin.tokenBAmount}
tokenAAmount={bin.reserveTokenA}
tokenBAmount={bin.reserveTokenB}
tokenARange={tokenARange}
tokenBRange={tokenBRange}
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import PoolSelectionGraph, { type PoolSelectionGraphProps } from "./PoolSelectio
import { ComponentStory, Meta, StoryObj } from "@storybook/react";
import POOLS from "@repositories/pool/mock/pools.json";
import { tickToPrice } from "@utils/swap-utils";
import { PoolModel } from "@models/pool/pool-model";


const test = [
Expand Down Expand Up @@ -1832,7 +1833,7 @@ const test = [
}
];

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

export default {
title: "common/PoolSelectionGraph",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -156,16 +156,16 @@ const PoolSelectionGraph: React.FC<PoolSelectionGraphProps> = ({
const boundsHeight = height - margin.top - margin.bottom - labelHeight - paddingHeight;
const tickAmount = 10000;

const [, maxX] = d3.extent(bins.map(bin => bin.currentTick));
const [, maxX] = d3.extent(bins.map(bin => bin.minTick));
const maxXTick = tickToPrice(maxX ?? 1) * 10000;
const binRange = maxXTick / tickAmount;
const currentPrice = tickToPrice(currentTick || 0);

const { redColor, greenColor } = useColorGraph();

const resolvedBins = () => {
const sortedBins = bins.sort((b1, b2) => b1.currentTick - b2.currentTick)
.map(bin => ({ ...bin, currentPrice: tickToPrice(bin.currentTick) }));
const sortedBins = bins.sort((b1, b2) => b1.minTick - b2.minTick)
.map(bin => ({ ...bin, currentPrice: tickToPrice(bin.minTick) }));
console.log(sortedBins);
return Array.from(
{ length: tickAmount },
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,9 @@ import IncentivizedPoolCardList from "../incentivized-pool-card-list/Incentivize
import POOLS from "@repositories/pool/mock/pools.json";
import { PoolMapper } from "@models/pool/mapper/pool-mapper";
import { action } from "@storybook/addon-actions";
import { PoolModel } from "@models/pool/pool-model";

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

const cardInfo = PoolMapper.toCardInfo(pool);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@ import IncentivizedPoolCardList from "./IncentivizedPoolCardList";
import { action } from "@storybook/addon-actions";
import POOLS from "@repositories/pool/mock/pools.json";
import { PoolMapper } from "@models/pool/mapper/pool-mapper";
import { PoolModel } from "@models/pool/pool-model";

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

const cardInfo = PoolMapper.toCardInfo(pool);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@ import IncentivizedPoolCard from "./IncentivizedPoolCard";
import { action } from "@storybook/addon-actions";
import POOLS from "@repositories/pool/mock/pools.json";
import { PoolMapper } from "@models/pool/mapper/pool-mapper";
import { PoolModel } from "@models/pool/pool-model";

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

const cardInfo = PoolMapper.toCardInfo(pool);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -86,8 +86,8 @@ const IncentivizedPoolCard: React.FC<IncentivizedPoolCardProps> = ({
<PoolGraph
tokenA={pool.tokenA}
tokenB={pool.tokenB}
bins={[]}
currentTick={20}
bins={pool.bins}
currentTick={pool.currentTick}
width={258}
height={80.62}
mouseover
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ const pool: PoolCardInfo = {
amount: 10
}
],
incentiveType: "Incentivized",
incentivizedType: "INCENTIVIZED",
jinoosss marked this conversation as resolved.
Show resolved Hide resolved
currentTick: 0,
price: 0,
bins: []
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@ import PoolListTable from "./PoolListTable";
import { action } from "@storybook/addon-actions";
import POOLS from "@repositories/pool/mock/pools.json";
import { PoolMapper } from "@models/pool/mapper/pool-mapper";
import { PoolModel } from "@models/pool/pool-model";

const pool = POOLS.pools[0];
const pool = POOLS.pools[0] as PoolModel;

const listInfo = PoolMapper.toListInfo(pool);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { PoolRepositoryMock } from "@repositories/pool";
import { PoolMapper } from "@models/pool/mapper/pool-mapper";

const poolRepository = new PoolRepositoryMock();
const pools = (await poolRepository.getPools()).pools;
const pools = (await poolRepository.getPools());

const Template: React.FC<PoolIncentivizeSelectPoolItemProps> = (args) => {
return (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ 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(PoolMapper.toPoolSelectItemInfo);
const pools = (await poolRepository.getPools()).map(PoolMapper.toPoolSelectItemInfo);

export default {
title: "incentivize/PoolIncentivizeSelectPool",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const tokenB = {
const tokens = [tokenA, tokenB];


const pools = (await poolRepository.getPools()).pools;
const pools = (await poolRepository.getPools());

const details = (await poolRepository.getPoolDetailByPoolId()).pool;

Expand Down
5 changes: 0 additions & 5 deletions packages/web/src/constants/option.constant.ts
Original file line number Diff line number Diff line change
Expand Up @@ -112,11 +112,6 @@ export const CHART_TYPE = {
} as const;
export type CHART_TYPE = ValuesType<typeof CHART_TYPE>;

export type IncentivizedOptions =
r3v4s marked this conversation as resolved.
Show resolved Hide resolved
| "INCENTIVIZED"
| "NON_INCENTIVIZED"
| "EXTERNAL_INCENTIVIZED";

export type AddLiquidityType = "POOL" | "LIQUIDITY";

export type PriceRangeType = "Active" | "Passive" | "Custom";
Expand Down
7 changes: 4 additions & 3 deletions packages/web/src/constants/swap.constant.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
export const MIN_PRICE_X96 = "4295128740";
export const MAX_PRICE_X96 =
"1461446703485210103287273052203988822378723970341";
export const MIN_PRICE_X96 = 4295128740n;
export const MAX_PRICE_X96 = 1461446703485210103287273052203988822378723970341n;

export const MIN_TICK = -887272 as const;
export const MAX_TICK = 887272 as const;

export const X96 = 7.9228163e28 as const;
export const Q96 = 79228162514264337593543950336n as const;
export const Q128 = 340282366920938463463374607431768211456n as const;
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { useWallet } from "@hooks/wallet/use-wallet";
export const dummyDisclaimer =
"This feature enables you to provide incentives as staking rewards for a specific liquidity pool. Before you proceed, ensure that you understand the mechanics of external incentives and acknowledge that you cannot withdraw the rewards once you complete this step.<br /><br />The incentives you add will be automatically distributed by the contract and may draw more liquidity providers.";

const pools: PoolModel[] = POOLS.pools;
const pools = POOLS.pools as PoolModel[];
const tokenBalances: TokenBalanceInfo[] = [];
const periods = [90, 180, 365];

Expand All @@ -34,7 +34,7 @@ const PoolAddIncentivizeContainer: React.FC = () => {
const [token, setToken] = useState<TokenModel | null>(null);
const tokenAmountInput = useTokenAmountInput(token);
const { updateTokenPrices } = useTokenData();

useEffect(() => {
setPool(pools[0]);
}, []);
Expand All @@ -54,7 +54,7 @@ const PoolAddIncentivizeContainer: React.FC = () => {
}, []);

useEffect(() => {
setPoolDetail(PoolDetailData.pool);
setPoolDetail(PoolDetailData.pool as PoolDetailModel);
}, []);

const selectPool = useCallback((poolId: string) => {
Expand All @@ -63,7 +63,7 @@ const PoolAddIncentivizeContainer: React.FC = () => {
setCurrentPool(pool);
}
}, [setCurrentPool]);

const selectToken = useCallback((path: string) => {
const token = tokenBalances.find(token => token.path === path);
if (token) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { useWallet } from "@hooks/wallet/use-wallet";
export const dummyDisclaimer =
"This feature enables you to provide incentives as staking rewards for a specific liquidity pool. Before you proceed, ensure that you understand the mechanics of external incentives and acknowledge that you cannot withdraw the rewards once you complete this step.<br /><br />The incentives you add will be automatically distributed by the contract and may draw more liquidity providers.";

const pools: PoolModel[] = POOLS.pools;
const pools: PoolModel[] = POOLS.pools as PoolModel[];
const tokenBalances: TokenBalanceInfo[] = [];
const periods = [90, 180, 365];

Expand All @@ -33,7 +33,7 @@ const PoolIncentivizeContainer: React.FC = () => {
const [token, setToken] = useState<TokenModel | null>(null);
const tokenAmountInput = useTokenAmountInput(token);
const { updateTokenPrices } = useTokenData();

useEffect(() => {
setDataModal(tokenAmountInput);
}, [tokenAmountInput.amount, token]);
Expand All @@ -50,7 +50,7 @@ const PoolIncentivizeContainer: React.FC = () => {
}, []);

useEffect(() => {
setPoolDetail(PoolDetailData.pool);
setPoolDetail(PoolDetailData.pool as PoolDetailModel);
}, []);

const selectPool = useCallback((poolId: string) => {
Expand All @@ -59,7 +59,7 @@ const PoolIncentivizeContainer: React.FC = () => {
setCurrentPool(pool);
}
}, [setCurrentPool]);

const selectToken = useCallback((path: string) => {
const token = tokenBalances.find(token => token.path === path);
if (token) {
Expand Down
Loading