From ad4a891394460e1ce1caa805ed954c1531d56c94 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 8 Feb 2025 14:41:47 +0900 Subject: [PATCH 01/16] restore useRewardData --- hooks/graph/useRewardData.ts | 29 +++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) create mode 100644 hooks/graph/useRewardData.ts diff --git a/hooks/graph/useRewardData.ts b/hooks/graph/useRewardData.ts new file mode 100644 index 0000000..9caef4d --- /dev/null +++ b/hooks/graph/useRewardData.ts @@ -0,0 +1,29 @@ +import { useEffect, useState } from "react"; +import usePoolData from "hooks/pool/usePoolData"; +import { PoolConfig } from "interfaces/pool"; + +const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { + const [tempRewardData, setTempRewardData] = useState({ + borrow: undefined, + earn: undefined, + }); + const { priceFeedData, totalPoolData } = usePoolData(); + + useEffect(() => { + const totalSupply = + (totalPoolData?.totalBaseSupplyBalance ?? 0) >= + poolData?.baseMinForRewards + ? totalPoolData?.totalBaseSupplyBalance ?? 0 + : 0; + const totalBorrow = + (totalPoolData?.totalBaseBorrowBalance ?? 0) >= + poolData?.baseMinForRewards + ? totalPoolData?.totalBaseBorrowBalance ?? 0 + : 0; + + }, [priceFeedData, totalPoolData]); + + return tempRewardData; +}; + +export default useRewardData; \ No newline at end of file From 03ef8444d7987617c7db387c50275bb703220e16 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 8 Feb 2025 14:44:01 +0900 Subject: [PATCH 02/16] restore RewardDataProps --- interfaces/graph.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/interfaces/graph.ts b/interfaces/graph.ts index 0b76d54..4b84c60 100644 --- a/interfaces/graph.ts +++ b/interfaces/graph.ts @@ -29,3 +29,8 @@ export interface RenderGraphSectionProps { GraphComponent: React.FC<{ poolData: PoolConfig }>; poolData: PoolConfig; } + +export interface RewardDataProps { + borrow: number | undefined; + earn: number | undefined; +} \ No newline at end of file From 9e53fa4b8df41df014ebebd6ee4870296884033f Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 8 Feb 2025 14:58:40 +0900 Subject: [PATCH 03/16] restore calculateTotalBalance and calculateRewardData --- hooks/graph/useRewardData.ts | 1 + hooks/util/graph.ts | 23 +++++++++++++++++++++++ 2 files changed, 24 insertions(+) diff --git a/hooks/graph/useRewardData.ts b/hooks/graph/useRewardData.ts index 9caef4d..36bfdf7 100644 --- a/hooks/graph/useRewardData.ts +++ b/hooks/graph/useRewardData.ts @@ -1,6 +1,7 @@ import { useEffect, useState } from "react"; import usePoolData from "hooks/pool/usePoolData"; import { PoolConfig } from "interfaces/pool"; +import { RewardDataProps } from "interfaces/graph"; const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { const [tempRewardData, setTempRewardData] = useState({ diff --git a/hooks/util/graph.ts b/hooks/util/graph.ts index 25583cb..c227b1f 100644 --- a/hooks/util/graph.ts +++ b/hooks/util/graph.ts @@ -103,3 +103,26 @@ export const getTransform = ( : "translateX(-50%)"; } }; + +export const calculateTotalBalance = ( + balance: number | undefined, + priceFeedData: PriceFeedData | undefined, +) => + balance !== undefined && + balance > 0 && + priceFeedData?.baseAsset !== undefined && + priceFeedData.baseAsset > 0 + ? balance * priceFeedData.baseAsset + : 0; + +export const calculateRewardData = ( + trackingRewardSpeed: number, + totalBalance: number, + rewardAsset: number | undefined, +) => + totalBalance > 0 + ? ((trackingRewardSpeed * DAYS_IN_YEAR * (rewardAsset || 0)) / + totalBalance) * + OneHundred * + REWARD_BONUS_RATE_VALUE + : 0; \ No newline at end of file From 1cda3c210b2ea83be6b870dfd1f042267cfd1678 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 15 Feb 2025 14:32:11 +0900 Subject: [PATCH 04/16] restore useRewardData --- hooks/graph/useRewardData.ts | 28 ++++++++++++++++++++++++++-- 1 file changed, 26 insertions(+), 2 deletions(-) diff --git a/hooks/graph/useRewardData.ts b/hooks/graph/useRewardData.ts index 36bfdf7..d91571b 100644 --- a/hooks/graph/useRewardData.ts +++ b/hooks/graph/useRewardData.ts @@ -2,9 +2,10 @@ import { useEffect, useState } from "react"; import usePoolData from "hooks/pool/usePoolData"; import { PoolConfig } from "interfaces/pool"; import { RewardDataProps } from "interfaces/graph"; +import { calculateTotalBalance, calculateRewardData } from "hooks/util/graph"; const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { - const [tempRewardData, setTempRewardData] = useState({ + const [tempRewardData, setTempRewardData] = useState({ borrow: undefined, earn: undefined, }); @@ -21,10 +22,33 @@ const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { poolData?.baseMinForRewards ? totalPoolData?.totalBaseBorrowBalance ?? 0 : 0; + const totalBaseSupplyBalance = calculateTotalBalance( + totalSupply, + priceFeedData, + ); + const totalBaseBorrowBalance = calculateTotalBalance( + totalBorrow, + priceFeedData, + ); + const tempSupplyRewardData = calculateRewardData( + poolData.baseTrackingRewardSpeed, + totalBaseSupplyBalance, + priceFeedData?.rewardAsset, + ); + const tempBorrowRewardData = calculateRewardData( + poolData.baseTrackingRewardSpeed, + totalBaseBorrowBalance, + priceFeedData?.rewardAsset, + ); + + setTempRewardData({ + borrow: tempBorrowRewardData, + earn: tempSupplyRewardData, + }); }, [priceFeedData, totalPoolData]); return tempRewardData; }; -export default useRewardData; \ No newline at end of file +export default useRewardData; From 8f5afd2308482f6c1a766d0226b3010c0e0684fd Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 15 Feb 2025 15:39:06 +0900 Subject: [PATCH 05/16] modify GraphModel, RewardGraph useRewardData --- components/pool/graph/GraphModel.tsx | 7 +++++-- components/pool/graph/RewardGraph.tsx | 1 + hooks/graph/useRewardData.ts | 6 +++++- interfaces/graph.ts | 1 + 4 files changed, 12 insertions(+), 3 deletions(-) diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index 46871b5..b88b665 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -34,8 +34,10 @@ import usePoolData from "hooks/pool/usePoolData"; import useInitialUtilization from "hooks/graph/useInitialUtilization"; import { OneHundred } from "constants/graph"; import { truncateTo3DecimalPlaces } from "utils/bigUtils"; +import useRewardData from "hooks/graph/useRewardData"; const GraphModel: React.FC = ({ + poolData, dataKeys, labels, rewardAPRValue, @@ -58,6 +60,7 @@ const GraphModel: React.FC = ({ undefined, ); const [rewardEarn, setRewardEarn] = useState(undefined); + const tempRewardData = useRewardData({ poolData }); useEffect(() => { if (rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0) { @@ -67,9 +70,9 @@ const GraphModel: React.FC = ({ OneHundred, ); } - if (rewardAPRValue?.earn || rewardAPRValue?.earn === 0) { + if (tempRewardData?.earn || tempRewardData?.earn === 0) { setRewardEarn( - (truncateTo3DecimalPlaces(rewardAPRValue?.earn) * hoverData.earnValue) / + (tempRewardData.earn * hoverData.earnValue) / OneHundred, ); } diff --git a/components/pool/graph/RewardGraph.tsx b/components/pool/graph/RewardGraph.tsx index a7e568a..cc822ea 100644 --- a/components/pool/graph/RewardGraph.tsx +++ b/components/pool/graph/RewardGraph.tsx @@ -26,6 +26,7 @@ const RewardGraph = ({ poolData }: { poolData: PoolConfig }) => { return ( { const { priceFeedData, totalPoolData } = usePoolData(); useEffect(() => { + if (!poolData) { + return; + } + const totalSupply = (totalPoolData?.totalBaseSupplyBalance ?? 0) >= poolData?.baseMinForRewards @@ -46,7 +50,7 @@ const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { borrow: tempBorrowRewardData, earn: tempSupplyRewardData, }); - }, [priceFeedData, totalPoolData]); + }, [priceFeedData, totalPoolData, poolData]); return tempRewardData; }; diff --git a/interfaces/graph.ts b/interfaces/graph.ts index 4b84c60..979efa1 100644 --- a/interfaces/graph.ts +++ b/interfaces/graph.ts @@ -15,6 +15,7 @@ export interface DataKeys { } export interface GraphModelProps { + poolData: PoolConfig; dataKeys: DataKeys; labels: { borrow: string; earn: string }; rewardAPRValue?: { borrow: number | undefined; earn: number | undefined }; From 19a46dfccf456ed4d55f41b863c670a9d2830f25 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 15 Feb 2025 20:17:55 +0900 Subject: [PATCH 06/16] excute format --- components/pool/CollateralAssetRow.tsx | 2 +- components/pool/graph/GraphModel.tsx | 5 +---- components/pool/graph/RewardGraph.tsx | 2 +- hooks/pool/shared/usePriceFeed.ts | 26 +++++++++++++------------- hooks/util/graph.ts | 2 +- interfaces/graph.ts | 2 +- 6 files changed, 18 insertions(+), 21 deletions(-) diff --git a/components/pool/CollateralAssetRow.tsx b/components/pool/CollateralAssetRow.tsx index 179ffcf..4c14335 100644 --- a/components/pool/CollateralAssetRow.tsx +++ b/components/pool/CollateralAssetRow.tsx @@ -128,7 +128,7 @@ const CollateralAssetRow = ({ crossAxisAlignment="center" width={isMobile ? "33%" : "20%"} > - {collateralValue !== undefined ? ( + {collateralValue !== undefined ? ( <> {smallUsdPriceFormatter( diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index b88b665..88ae9fe 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -71,10 +71,7 @@ const GraphModel: React.FC = ({ ); } if (tempRewardData?.earn || tempRewardData?.earn === 0) { - setRewardEarn( - (tempRewardData.earn * hoverData.earnValue) / - OneHundred, - ); + setRewardEarn((tempRewardData.earn * hoverData.earnValue) / OneHundred); } }, [rewardAPRValue, hoverData]); diff --git a/components/pool/graph/RewardGraph.tsx b/components/pool/graph/RewardGraph.tsx index cc822ea..1eec56b 100644 --- a/components/pool/graph/RewardGraph.tsx +++ b/components/pool/graph/RewardGraph.tsx @@ -26,7 +26,7 @@ const RewardGraph = ({ poolData }: { poolData: PoolConfig }) => { return ( { formatUnits(rewardPrice, poolData.rewardToken.priceFeedDecimals), ) : undefined; - const collateralAssets: { [key: string]: number | undefined } = {}; - for (const assetConfig of poolData.assetConfigs) { - if (assetConfig.priceFeed === AddressZero) { - collateralAssets[assetConfig.symbol] = 0; - } else { - const assetPrice = await fetchPriceFeed( - assetConfig.priceFeed, - poolData.chainId, - ); - collateralAssets[assetConfig.symbol] = assetPrice - ? Number(formatUnits(assetPrice, assetConfig.priceFeedDecimals)) - : undefined; - } + const collateralAssets: { [key: string]: number | undefined } = {}; + for (const assetConfig of poolData.assetConfigs) { + if (assetConfig.priceFeed === AddressZero) { + collateralAssets[assetConfig.symbol] = 0; + } else { + const assetPrice = await fetchPriceFeed( + assetConfig.priceFeed, + poolData.chainId, + ); + collateralAssets[assetConfig.symbol] = assetPrice + ? Number(formatUnits(assetPrice, assetConfig.priceFeedDecimals)) + : undefined; } + } setPriceFeedData({ usdjpy, diff --git a/hooks/util/graph.ts b/hooks/util/graph.ts index c227b1f..4b8ec67 100644 --- a/hooks/util/graph.ts +++ b/hooks/util/graph.ts @@ -125,4 +125,4 @@ export const calculateRewardData = ( totalBalance) * OneHundred * REWARD_BONUS_RATE_VALUE - : 0; \ No newline at end of file + : 0; diff --git a/interfaces/graph.ts b/interfaces/graph.ts index 979efa1..e074996 100644 --- a/interfaces/graph.ts +++ b/interfaces/graph.ts @@ -34,4 +34,4 @@ export interface RenderGraphSectionProps { export interface RewardDataProps { borrow: number | undefined; earn: number | undefined; -} \ No newline at end of file +} From 589ddb4fc41e49f912321f34fba3904813d8ff50 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sat, 15 Feb 2025 20:20:05 +0900 Subject: [PATCH 07/16] remove REWARD_BONUS_RATE_VALUE --- constants/graph.ts | 1 - hooks/util/graph.ts | 4 +--- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/constants/graph.ts b/constants/graph.ts index 1f8c278..1d13883 100644 --- a/constants/graph.ts +++ b/constants/graph.ts @@ -8,7 +8,6 @@ export const HoverPositionLowerThresholdMobile = 70; export const HoverPositionUpperThresholdMobile = 180; export const rateSlopeLow = 0; export const DAYS_IN_YEAR = 365; -export const REWARD_BONUS_RATE_VALUE = 1; //PNDが1ドルを下回った時に発生するボーナス倍率 export const LightGrayColorCode = "#949494"; export const LightBlackColorCode = "#3a4450"; export const PinkColorCode = "#FF2E6C"; diff --git a/hooks/util/graph.ts b/hooks/util/graph.ts index 4b8ec67..5255e67 100644 --- a/hooks/util/graph.ts +++ b/hooks/util/graph.ts @@ -2,7 +2,6 @@ import { GenerateDataProps } from "interfaces/graph"; import { OneHundred, DAYS_IN_YEAR, - REWARD_BONUS_RATE_VALUE, } from "constants/graph"; import { HoverPositionLowerThreshold, @@ -123,6 +122,5 @@ export const calculateRewardData = ( totalBalance > 0 ? ((trackingRewardSpeed * DAYS_IN_YEAR * (rewardAsset || 0)) / totalBalance) * - OneHundred * - REWARD_BONUS_RATE_VALUE + OneHundred : 0; From c05079680e783c314eebbf437c1dfadf433bb32d Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 11:03:08 +0900 Subject: [PATCH 08/16] The data was rounded off to the fourth decimal place, but can now be truncated to the fourth decimal place. --- components/pool/graph/APRGraph.tsx | 1 + components/pool/graph/GraphModel.tsx | 21 ++++++++++++++------- 2 files changed, 15 insertions(+), 7 deletions(-) diff --git a/components/pool/graph/APRGraph.tsx b/components/pool/graph/APRGraph.tsx index 870e99a..2098ee3 100644 --- a/components/pool/graph/APRGraph.tsx +++ b/components/pool/graph/APRGraph.tsx @@ -19,6 +19,7 @@ const APRGraph = ({ poolData }: { poolData: PoolConfig }) => { return ( diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index 88ae9fe..f1a9d3c 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -60,7 +60,7 @@ const GraphModel: React.FC = ({ undefined, ); const [rewardEarn, setRewardEarn] = useState(undefined); - const tempRewardData = useRewardData({ poolData }); + // const tempRewardData = useRewardData({ poolData }); useEffect(() => { if (rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0) { @@ -70,8 +70,11 @@ const GraphModel: React.FC = ({ OneHundred, ); } - if (tempRewardData?.earn || tempRewardData?.earn === 0) { - setRewardEarn((tempRewardData.earn * hoverData.earnValue) / OneHundred); + if (rewardAPRValue?.earn || rewardAPRValue?.earn === 0) { + setRewardEarn( + (truncateTo3DecimalPlaces(rewardAPRValue?.earn) * hoverData.earnValue) / + OneHundred, + ); } }, [rewardAPRValue, hoverData]); @@ -104,6 +107,10 @@ const GraphModel: React.FC = ({ setHoverData(initialData); }, [initialData]); + const formatValue = (value: number | undefined) => { + return value !== undefined ? `${(Math.floor(value * 1000) / 1000).toFixed(3)}%` : "-"; + }; + return ( <> {totalPoolData ? ( @@ -123,8 +130,8 @@ const GraphModel: React.FC = ({ {hoverData ? rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 - ? `${rewardBorrow?.toFixed(3)}%` - : `${hoverData.borrowValue.toFixed(3)}%` + ? formatValue(rewardBorrow) + : formatValue(hoverData.borrowValue) : "-"} @@ -135,8 +142,8 @@ const GraphModel: React.FC = ({ {hoverData ? rewardAPRValue?.earn || rewardAPRValue?.earn === 0 - ? `${rewardEarn?.toFixed(3)}%` - : `${hoverData.earnValue.toFixed(3)}%` + ? formatValue(rewardEarn) + : formatValue(hoverData.earnValue) : "-"} From 17082df2e42769f06806f38bae7b004468461f51 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 11:13:52 +0900 Subject: [PATCH 09/16] move the RowndDownToTheFourthDecimalPlace function to hooks/util/graph --- components/pool/graph/GraphModel.tsx | 13 +++++-------- constants/graph.ts | 1 + hooks/util/graph.ts | 11 +++++++---- 3 files changed, 13 insertions(+), 12 deletions(-) diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index f1a9d3c..49c9b8c 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -18,6 +18,7 @@ import { calculateInitialData, calculateYDomain, getTransform, + roundDownToTheFourthDecimalPlace, } from "hooks/util/graph"; import { AxisRange, @@ -107,10 +108,6 @@ const GraphModel: React.FC = ({ setHoverData(initialData); }, [initialData]); - const formatValue = (value: number | undefined) => { - return value !== undefined ? `${(Math.floor(value * 1000) / 1000).toFixed(3)}%` : "-"; - }; - return ( <> {totalPoolData ? ( @@ -130,8 +127,8 @@ const GraphModel: React.FC = ({ {hoverData ? rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 - ? formatValue(rewardBorrow) - : formatValue(hoverData.borrowValue) + ? roundDownToTheFourthDecimalPlace(rewardBorrow) + : roundDownToTheFourthDecimalPlace(hoverData.borrowValue) : "-"} @@ -142,8 +139,8 @@ const GraphModel: React.FC = ({ {hoverData ? rewardAPRValue?.earn || rewardAPRValue?.earn === 0 - ? formatValue(rewardEarn) - : formatValue(hoverData.earnValue) + ? roundDownToTheFourthDecimalPlace(rewardEarn) + : roundDownToTheFourthDecimalPlace(hoverData.earnValue) : "-"} diff --git a/constants/graph.ts b/constants/graph.ts index 1d13883..82ec7f9 100644 --- a/constants/graph.ts +++ b/constants/graph.ts @@ -1,4 +1,5 @@ export const OneHundred = 100; +export const OneThousand = 1000; export const AxisRange = [0, 100]; export const LeftMin = 20; export const LeftMax = 80; diff --git a/hooks/util/graph.ts b/hooks/util/graph.ts index 5255e67..b279069 100644 --- a/hooks/util/graph.ts +++ b/hooks/util/graph.ts @@ -1,8 +1,5 @@ import { GenerateDataProps } from "interfaces/graph"; -import { - OneHundred, - DAYS_IN_YEAR, -} from "constants/graph"; +import { OneHundred, OneThousand, DAYS_IN_YEAR } from "constants/graph"; import { HoverPositionLowerThreshold, HoverPositionUpperThreshold, @@ -124,3 +121,9 @@ export const calculateRewardData = ( totalBalance) * OneHundred : 0; + +export const roundDownToTheFourthDecimalPlace = (value: number | undefined) => { + return value !== undefined + ? `${(Math.floor(value * OneThousand) / OneThousand).toFixed(3)}%` + : "-"; +}; From d0115ebec2c60e3d4e5bde63e1261b4a61c65692 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 11:20:02 +0900 Subject: [PATCH 10/16] modify GraphModel --- components/pool/graph/GraphModel.tsx | 28 ++++++++++++++++++---------- 1 file changed, 18 insertions(+), 10 deletions(-) diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index 49c9b8c..0714ba5 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -125,11 +125,15 @@ const GraphModel: React.FC = ({ {t(labels.borrow)} - {hoverData - ? rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 - ? roundDownToTheFourthDecimalPlace(rewardBorrow) - : roundDownToTheFourthDecimalPlace(hoverData.borrowValue) - : "-"} + {hoverData ? ( + roundDownToTheFourthDecimalPlace( + rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 + ? rewardBorrow + : hoverData.borrowValue + ) + ) : ( + "-" + )} @@ -137,11 +141,15 @@ const GraphModel: React.FC = ({ {t(labels.earn)} - {hoverData - ? rewardAPRValue?.earn || rewardAPRValue?.earn === 0 - ? roundDownToTheFourthDecimalPlace(rewardEarn) - : roundDownToTheFourthDecimalPlace(hoverData.earnValue) - : "-"} + {hoverData ? ( + roundDownToTheFourthDecimalPlace( + rewardAPRValue?.earn || rewardAPRValue?.earn === 0 + ? rewardEarn + : hoverData.earnValue + ) + ) : ( + "-" + )} From caca00469fa6ae7819ff2d832d6a9da537b056b6 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 11:34:44 +0900 Subject: [PATCH 11/16] =?UTF-8?q?modify=20where=20=E2=80=9Cconst=20{=20poo?= =?UTF-8?q?lConfig:=20poolData=20}=20=3D=20usePool();=E2=80=9D=20is=20call?= =?UTF-8?q?ed?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/PoolPage.tsx | 2 +- components/pool/DisplayGraph.tsx | 6 +++--- components/pool/graph/APRGraph.tsx | 7 ++++++- components/pool/graph/RenderGraphSections.tsx | 7 ++----- components/pool/graph/RewardGraph.tsx | 6 +++++- interfaces/graph.ts | 3 +-- 6 files changed, 18 insertions(+), 13 deletions(-) diff --git a/components/PoolPage.tsx b/components/PoolPage.tsx index 3c6a4b0..6a38b13 100644 --- a/components/PoolPage.tsx +++ b/components/PoolPage.tsx @@ -49,7 +49,7 @@ const PoolContents = () => { {poolData ? ( - + ) : (
diff --git a/components/pool/DisplayGraph.tsx b/components/pool/DisplayGraph.tsx index 236bff3..bb423b2 100644 --- a/components/pool/DisplayGraph.tsx +++ b/components/pool/DisplayGraph.tsx @@ -6,7 +6,7 @@ import { ModalDivider } from "components/shared/Modal"; import { PoolConfig } from "interfaces/pool"; import RenderGraphSections from "components/pool/graph/RenderGraphSections"; -const DisplayGraph = ({ poolData }: { poolData: PoolConfig }) => { +const DisplayGraph = () => { const { t } = useTranslation(); const isMobile = useIsMobile(); @@ -28,7 +28,7 @@ const DisplayGraph = ({ poolData }: { poolData: PoolConfig }) => { crossAxisAlignment="flex-start" width="100%" > - {RenderGraphSections(poolData)} + {RenderGraphSections()} ) : ( { px={4} my={4} > - {RenderGraphSections(poolData)} + {RenderGraphSections()} )} diff --git a/components/pool/graph/APRGraph.tsx b/components/pool/graph/APRGraph.tsx index 2098ee3..a91539e 100644 --- a/components/pool/graph/APRGraph.tsx +++ b/components/pool/graph/APRGraph.tsx @@ -1,8 +1,13 @@ import React from "react"; import { PoolConfig } from "interfaces/pool"; import GraphModel from "./GraphModel"; +import usePool from "hooks/pool/usePool"; + +const APRGraph = () => { + const { poolConfig: poolData } = usePool(); + + if (!poolData) return null; -const APRGraph = ({ poolData }: { poolData: PoolConfig }) => { const dataKeys = { earn: { supplyRateSlopeLow: poolData.supplyPerYearInterestRateSlopeLow, diff --git a/components/pool/graph/RenderGraphSections.tsx b/components/pool/graph/RenderGraphSections.tsx index 1495d38..35887a1 100644 --- a/components/pool/graph/RenderGraphSections.tsx +++ b/components/pool/graph/RenderGraphSections.tsx @@ -10,7 +10,6 @@ import { RenderGraphSectionProps } from "interfaces/graph"; const RenderGraphSection = ({ title, GraphComponent, - poolData, }: RenderGraphSectionProps) => { const { t } = useTranslation(); const isMobile = useIsMobile(); @@ -31,22 +30,20 @@ const RenderGraphSection = ({ > {t(title)} - + ); }; -const RenderGraphSections = (poolData: PoolConfig) => ( +const RenderGraphSections = () => ( <> ); diff --git a/components/pool/graph/RewardGraph.tsx b/components/pool/graph/RewardGraph.tsx index 1eec56b..a62a7a0 100644 --- a/components/pool/graph/RewardGraph.tsx +++ b/components/pool/graph/RewardGraph.tsx @@ -3,9 +3,13 @@ import { PoolConfig } from "interfaces/pool"; import GraphModel from "./GraphModel"; import { OneHundred, rateSlopeLow } from "constants/graph"; import usePoolData from "hooks/pool/usePoolData"; +import usePool from "hooks/pool/usePool"; -const RewardGraph = ({ poolData }: { poolData: PoolConfig }) => { +const RewardGraph = () => { const { tokenRewardData } = usePoolData(); + const { poolConfig: poolData } = usePool(); + + if (!poolData) return null; const rateSlopeHigh = parseFloat( (OneHundred / (OneHundred - poolData.rewardKink)).toFixed(2), diff --git a/interfaces/graph.ts b/interfaces/graph.ts index e074996..8a5e151 100644 --- a/interfaces/graph.ts +++ b/interfaces/graph.ts @@ -27,8 +27,7 @@ export interface GenerateDataProps { export interface RenderGraphSectionProps { title: string; - GraphComponent: React.FC<{ poolData: PoolConfig }>; - poolData: PoolConfig; + GraphComponent: React.FC<{}>; } export interface RewardDataProps { From a07f7d12c46d040ae7327910d8827b346644ce80 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 11:49:35 +0900 Subject: [PATCH 12/16] add const tempRewardData = useRewardData({ poolData }); and modify GraphModel --- components/pool/graph/GraphModel.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index 0714ba5..b1c128d 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -61,7 +61,7 @@ const GraphModel: React.FC = ({ undefined, ); const [rewardEarn, setRewardEarn] = useState(undefined); - // const tempRewardData = useRewardData({ poolData }); + const tempRewardData = useRewardData({ poolData }); useEffect(() => { if (rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0) { @@ -71,13 +71,13 @@ const GraphModel: React.FC = ({ OneHundred, ); } - if (rewardAPRValue?.earn || rewardAPRValue?.earn === 0) { + if (tempRewardData?.earn || tempRewardData?.earn === 0) { setRewardEarn( - (truncateTo3DecimalPlaces(rewardAPRValue?.earn) * hoverData.earnValue) / + (truncateTo3DecimalPlaces(tempRewardData?.earn) * hoverData.earnValue) / OneHundred, ); } - }, [rewardAPRValue, hoverData]); + }, [rewardAPRValue, hoverData, tempRewardData]); const handleMouseMove = (state: any) => { if (state.isTooltipActive) { From bc563434660c939cbce061c29a87a4511aa776fd Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 13:38:02 +0900 Subject: [PATCH 13/16] rename APRGraph to InterestAPRGraph --- components/pool/graph/{APRGraph.tsx => InterestAPRGraph.tsx} | 4 ++-- components/pool/graph/RenderGraphSections.tsx | 5 ++--- 2 files changed, 4 insertions(+), 5 deletions(-) rename components/pool/graph/{APRGraph.tsx => InterestAPRGraph.tsx} (93%) diff --git a/components/pool/graph/APRGraph.tsx b/components/pool/graph/InterestAPRGraph.tsx similarity index 93% rename from components/pool/graph/APRGraph.tsx rename to components/pool/graph/InterestAPRGraph.tsx index a91539e..7f45052 100644 --- a/components/pool/graph/APRGraph.tsx +++ b/components/pool/graph/InterestAPRGraph.tsx @@ -3,7 +3,7 @@ import { PoolConfig } from "interfaces/pool"; import GraphModel from "./GraphModel"; import usePool from "hooks/pool/usePool"; -const APRGraph = () => { +const InterestAPRGraph = () => { const { poolConfig: poolData } = usePool(); if (!poolData) return null; @@ -31,4 +31,4 @@ const APRGraph = () => { ); }; -export default APRGraph; +export default InterestAPRGraph; diff --git a/components/pool/graph/RenderGraphSections.tsx b/components/pool/graph/RenderGraphSections.tsx index 35887a1..cf7e478 100644 --- a/components/pool/graph/RenderGraphSections.tsx +++ b/components/pool/graph/RenderGraphSections.tsx @@ -2,9 +2,8 @@ import React from "react"; import { Box } from "@chakra-ui/react"; import { useTranslation } from "react-i18next"; import { Column, useIsMobile } from "utils/chakraUtils"; -import APRGraph from "components/pool/graph/APRGraph"; +import InterestAPRGraph from "components/pool/graph/InterestAPRGraph"; import RewardGraph from "components/pool/graph/RewardGraph"; -import { PoolConfig } from "interfaces/pool"; import { RenderGraphSectionProps } from "interfaces/graph"; const RenderGraphSection = ({ @@ -39,7 +38,7 @@ const RenderGraphSections = () => ( <> Date: Sun, 16 Feb 2025 13:42:30 +0900 Subject: [PATCH 14/16] rename RewardGraph to RewardAPRGraph --- components/pool/graph/InterestAPRGraph.tsx | 1 - components/pool/graph/RenderGraphSections.tsx | 4 ++-- .../pool/graph/{RewardGraph.tsx => RewardAPRGraph.tsx} | 5 ++--- 3 files changed, 4 insertions(+), 6 deletions(-) rename components/pool/graph/{RewardGraph.tsx => RewardAPRGraph.tsx} (91%) diff --git a/components/pool/graph/InterestAPRGraph.tsx b/components/pool/graph/InterestAPRGraph.tsx index 7f45052..2cd4b72 100644 --- a/components/pool/graph/InterestAPRGraph.tsx +++ b/components/pool/graph/InterestAPRGraph.tsx @@ -1,5 +1,4 @@ import React from "react"; -import { PoolConfig } from "interfaces/pool"; import GraphModel from "./GraphModel"; import usePool from "hooks/pool/usePool"; diff --git a/components/pool/graph/RenderGraphSections.tsx b/components/pool/graph/RenderGraphSections.tsx index cf7e478..9575169 100644 --- a/components/pool/graph/RenderGraphSections.tsx +++ b/components/pool/graph/RenderGraphSections.tsx @@ -3,7 +3,7 @@ import { Box } from "@chakra-ui/react"; import { useTranslation } from "react-i18next"; import { Column, useIsMobile } from "utils/chakraUtils"; import InterestAPRGraph from "components/pool/graph/InterestAPRGraph"; -import RewardGraph from "components/pool/graph/RewardGraph"; +import RewardAPRGraph from "components/pool/graph/RewardAPRGraph"; import { RenderGraphSectionProps } from "interfaces/graph"; const RenderGraphSection = ({ @@ -42,7 +42,7 @@ const RenderGraphSections = () => ( /> ); diff --git a/components/pool/graph/RewardGraph.tsx b/components/pool/graph/RewardAPRGraph.tsx similarity index 91% rename from components/pool/graph/RewardGraph.tsx rename to components/pool/graph/RewardAPRGraph.tsx index a62a7a0..a586778 100644 --- a/components/pool/graph/RewardGraph.tsx +++ b/components/pool/graph/RewardAPRGraph.tsx @@ -1,11 +1,10 @@ import React from "react"; -import { PoolConfig } from "interfaces/pool"; import GraphModel from "./GraphModel"; import { OneHundred, rateSlopeLow } from "constants/graph"; import usePoolData from "hooks/pool/usePoolData"; import usePool from "hooks/pool/usePool"; -const RewardGraph = () => { +const RewardAPRGraph = () => { const { tokenRewardData } = usePoolData(); const { poolConfig: poolData } = usePool(); @@ -41,4 +40,4 @@ const RewardGraph = () => { ); }; -export default RewardGraph; +export default RewardAPRGraph; From 74f09655eb4053838d34650735fdfc66f51e2b4d Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 13:55:10 +0900 Subject: [PATCH 15/16] remove borrow from tempRewardData --- hooks/graph/useRewardData.ts | 16 ---------------- interfaces/graph.ts | 1 - 2 files changed, 17 deletions(-) diff --git a/hooks/graph/useRewardData.ts b/hooks/graph/useRewardData.ts index c318f76..4549c7a 100644 --- a/hooks/graph/useRewardData.ts +++ b/hooks/graph/useRewardData.ts @@ -6,7 +6,6 @@ import { calculateTotalBalance, calculateRewardData } from "hooks/util/graph"; const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { const [tempRewardData, setTempRewardData] = useState({ - borrow: undefined, earn: undefined, }); const { priceFeedData, totalPoolData } = usePoolData(); @@ -21,33 +20,18 @@ const useRewardData = ({ poolData }: { poolData: PoolConfig }) => { poolData?.baseMinForRewards ? totalPoolData?.totalBaseSupplyBalance ?? 0 : 0; - const totalBorrow = - (totalPoolData?.totalBaseBorrowBalance ?? 0) >= - poolData?.baseMinForRewards - ? totalPoolData?.totalBaseBorrowBalance ?? 0 - : 0; const totalBaseSupplyBalance = calculateTotalBalance( totalSupply, priceFeedData, ); - const totalBaseBorrowBalance = calculateTotalBalance( - totalBorrow, - priceFeedData, - ); const tempSupplyRewardData = calculateRewardData( poolData.baseTrackingRewardSpeed, totalBaseSupplyBalance, priceFeedData?.rewardAsset, ); - const tempBorrowRewardData = calculateRewardData( - poolData.baseTrackingRewardSpeed, - totalBaseBorrowBalance, - priceFeedData?.rewardAsset, - ); setTempRewardData({ - borrow: tempBorrowRewardData, earn: tempSupplyRewardData, }); }, [priceFeedData, totalPoolData, poolData]); diff --git a/interfaces/graph.ts b/interfaces/graph.ts index 8a5e151..3961799 100644 --- a/interfaces/graph.ts +++ b/interfaces/graph.ts @@ -31,6 +31,5 @@ export interface RenderGraphSectionProps { } export interface RewardDataProps { - borrow: number | undefined; earn: number | undefined; } From 0f4111cfb10070fe29d3fa5f26e5329f2e608cd4 Mon Sep 17 00:00:00 2001 From: yosuke Date: Sun, 16 Feb 2025 13:56:14 +0900 Subject: [PATCH 16/16] excute format --- components/pool/graph/GraphModel.tsx | 32 ++++++++++------------ components/pool/graph/InterestAPRGraph.tsx | 2 +- 2 files changed, 15 insertions(+), 19 deletions(-) diff --git a/components/pool/graph/GraphModel.tsx b/components/pool/graph/GraphModel.tsx index b1c128d..8a3d258 100644 --- a/components/pool/graph/GraphModel.tsx +++ b/components/pool/graph/GraphModel.tsx @@ -125,15 +125,13 @@ const GraphModel: React.FC = ({ {t(labels.borrow)} - {hoverData ? ( - roundDownToTheFourthDecimalPlace( - rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 - ? rewardBorrow - : hoverData.borrowValue - ) - ) : ( - "-" - )} + {hoverData + ? roundDownToTheFourthDecimalPlace( + rewardAPRValue?.borrow || rewardAPRValue?.borrow === 0 + ? rewardBorrow + : hoverData.borrowValue, + ) + : "-"} @@ -141,15 +139,13 @@ const GraphModel: React.FC = ({ {t(labels.earn)} - {hoverData ? ( - roundDownToTheFourthDecimalPlace( - rewardAPRValue?.earn || rewardAPRValue?.earn === 0 - ? rewardEarn - : hoverData.earnValue - ) - ) : ( - "-" - )} + {hoverData + ? roundDownToTheFourthDecimalPlace( + rewardAPRValue?.earn || rewardAPRValue?.earn === 0 + ? rewardEarn + : hoverData.earnValue, + ) + : "-"} diff --git a/components/pool/graph/InterestAPRGraph.tsx b/components/pool/graph/InterestAPRGraph.tsx index 2cd4b72..2e5f58b 100644 --- a/components/pool/graph/InterestAPRGraph.tsx +++ b/components/pool/graph/InterestAPRGraph.tsx @@ -4,7 +4,7 @@ import usePool from "hooks/pool/usePool"; const InterestAPRGraph = () => { const { poolConfig: poolData } = usePool(); - + if (!poolData) return null; const dataKeys = {