fix: pancake pool price (#2901)

* fix: pancake pool price

* fix version

Author: tienkane

packages/pancake-liquidity-widgets/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyberswap/pancake-liquidity-widgets",
-  "version": "2.0.4",
+  "version": "2.0.5",
   "license": "MIT",
   "type": "module",
   "exports": {

packages/pancake-liquidity-widgets/src/components/Content/EstLiqValue.tsx

@@ -31,7 +31,7 @@ import {
 import { useMemo } from "react";
 import { NetworkInfo } from "@/constants";
 import defaultTokenLogo from "@/assets/question.svg?url";
-import { tickToPrice } from "@kyber/utils/uniswapv3";
+import { sqrtToPrice } from "@kyber/utils/uniswapv3";
 
 export default function EstLiqValue() {
   const { zapInfo, source, marketPrice, revertPrice, tokensIn } = useZapState();
@@ -249,8 +249,8 @@ export default function EstLiqValue() {
     newPool &&
     Math.abs(
       marketPrice /
-        +tickToPrice(
-          newPool.tickCurrent,
+        +sqrtToPrice(
+          BigInt(newPool.sqrtRatioX96 || 0),
           newPool.token0.decimals,
           newPool.token1.decimals,
           false
@@ -265,8 +265,8 @@ export default function EstLiqValue() {
       : false;
 
   const price = newPool
-    ? tickToPrice(
-        newPool.tickCurrent,
+    ? sqrtToPrice(
+        BigInt(newPool.sqrtRatioX96 || 0),
         newPool.token0.decimals,
         newPool.token1.decimals,
         revertPrice

packages/pancake-liquidity-widgets/src/components/Content/PriceInfo.tsx

@@ -2,7 +2,7 @@ import { useWidgetInfo } from "@/hooks/useWidgetInfo";
 import { useZapState } from "@/hooks/useZapInState";
 import { formatNumber } from "@/utils";
 import SwitchIcon from "@/assets/switch.svg";
-import { tickToPrice } from "@kyber/utils/uniswapv3";
+import { sqrtToPrice } from "@kyber/utils/uniswapv3";
 import { formatDisplayNumber } from "@kyber/utils/number";
 
 export default function PriceInfo() {
@@ -12,8 +12,8 @@ export default function PriceInfo() {
   if (loading) return <div className="text-textSecondary">Loading...</div>;
 
   const poolPrice = pool
-    ? tickToPrice(
-        pool.tickCurrent,
+    ? sqrtToPrice(
+        BigInt(pool.sqrtRatioX96 || 0),
         pool.token0?.decimals,
         pool.token1?.decimals,
         revertPrice
@@ -25,8 +25,8 @@ export default function PriceInfo() {
     pool &&
     Math.abs(
       marketPrice /
-        +tickToPrice(
-          pool.tickCurrent,
+        +sqrtToPrice(
+          BigInt(pool.sqrtRatioX96 || 0),
           pool.token0.decimals,
           pool.token1.decimals,
           false

packages/pancake-liquidity-widgets/src/components/Content/index.tsx

@@ -35,7 +35,7 @@ import {
   POSITION_MANAGER_CONTRACT,
   CoreProtocol,
 } from "@/constants";
-import { tickToPrice } from "@kyber/utils/uniswapv3";
+import { sqrtToPrice } from "@kyber/utils/uniswapv3";
 import { useNftApproval } from "@/hooks/useNftApproval";
 
 export default function Content({
@@ -275,8 +275,8 @@ export default function Content({
   }, [snapshotState, onTogglePreview]);
 
   const currentPoolPrice = pool
-    ? tickToPrice(
-        pool.tickCurrent,
+    ? sqrtToPrice(
+        BigInt(pool.sqrtRatioX96 || 0),
         pool.token0.decimals,
         pool.token1.decimals,
         revertPrice

packages/pancake-liquidity-widgets/src/components/Preview/index.tsx

@@ -44,7 +44,7 @@ import {
   AccordionTrigger,
 } from "@kyber/ui";
 import defaultTokenLogo from "@/assets/question.svg?url";
-import { tickToPrice } from "@kyber/utils/uniswapv3";
+import { sqrtToPrice } from "@kyber/utils/uniswapv3";
 import { formatDisplayNumber } from "@kyber/utils/number";
 import { fetchTokenPrice } from "@kyber/utils";
 
@@ -183,8 +183,8 @@ export default function Preview({
     0;
 
   const price = pool
-    ? tickToPrice(
-        pool.tickCurrent,
+    ? sqrtToPrice(
+        BigInt(pool.sqrtRatioX96 || 0),
         pool.token0.decimals,
         pool.token1.decimals,
         revert
@@ -623,29 +623,34 @@ export default function Preview({
       <div className="pcs-lw-card mt-4 border border-inputBorder bg-inputBackground">
         <div>Zap-in Amount</div>
 
-        {tokensIn.map((token: PancakeTokenAdvanced, index: number) => (
-          <div
-            className="flex items-center gap-3 text-sm text-textSecondary mt-2"
-            key={index}
-          >
-            <img
-              src={token.logoURI}
-              className="w-[18px] h-[18px]"
-              onError={({ currentTarget }) => {
-                currentTarget.onerror = null;
-                currentTarget.src = defaultTokenLogo;
-              }}
-            />
-            <div className="text-textPrimary text-base">
-              {formatNumber(+listAmountsIn[index])} {token.symbol}
-              <span className="text-textSecondary font-normal text-sm ml-2">
-                {formatCurrency(
-                  (token.price || 0) * parseFloat(listAmountsIn[index])
-                )}
-              </span>
+        {tokensIn.map((token: PancakeTokenAdvanced, index: number) => {
+          const amount = listAmountsIn[index];
+          if (!amount) return null;
+
+          return (
+            <div
+              className="flex items-center gap-3 text-sm text-textSecondary mt-2"
+              key={index}
+            >
+              <img
+                src={token.logoURI}
+                className="w-[18px] h-[18px] rounded-full"
+                onError={({ currentTarget }) => {
+                  currentTarget.onerror = null;
+                  currentTarget.src = defaultTokenLogo;
+                }}
+              />
+              <div className="text-textPrimary text-base">
+                {formatNumber(+listAmountsIn[index])} {token.symbol}
+                <span className="text-textSecondary font-normal text-sm ml-2">
+                  {formatCurrency(
+                    (token.price || 0) * parseFloat(listAmountsIn[index])
+                  )}
+                </span>
+              </div>
             </div>
-          </div>
-        ))}
+          );
+        })}
       </div>
 
       <div className="pcs-lw-card mt-3 text-sm">