@goodaofi/bonds-sdk 3.0.175 → 3.0.176

package/dist/main.js

@@ -65974,7 +65974,6 @@ const YourBondsModal = ({ onDismiss, bill }) => {
     const lastBlockTimestamp = parseInt(userBill?.lastBlockTimestamp ?? '0');
     const isPendingCliff = vestingCliff ? currentTime - lastBlockTimestamp < vestingCliff : false;
     const cliffCountdown = getTimePeriods(lastBlockTimestamp + (vestingCliff ?? 0) - currentTime, true);
-    const showImage = false;
     const handleClaim = async (billId, billAddress) => {
         const address = billAddress;
         const isVestingNft = billAddress?.toLowerCase() === VESTING_NFT_ADDRESS.toLowerCase();
@@ -66028,7 +66027,10 @@ const YourBondsModal = ({ onDismiss, bill }) => {
     };
     const earnTokenPrice = useCurrencyPrice(userBill?.bond?.earnToken ?? null, userBill?.bond?.chainId ?? null);
     const BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation'];
-    bondNFTData?.attributes?.filter((attrib) => BILL_ATTRIBUTES.includes(attrib.trait_type));
+    const attributes = bondNFTData?.attributes?.filter((attrib) => BILL_ATTRIBUTES.includes(attrib.trait_type));
+    const handleImageLoad = () => {
+        setImgLoaded(true);
+    };
     const [onTransferBondModal] = useModal(jsx$2(TransferBondModal, { userBill: userBill }), true, true, `transferModal${userBill?.id}}`);
     useEffect(() => {
         if (isConfirmed) {
@@ -66037,9 +66039,32 @@ const YourBondsModal = ({ onDismiss, bill }) => {
         }
         /* eslint-disable react-hooks/exhaustive-deps */
     }, [isConfirmed]);
-    return (jsx$2(Modal, { className: "modal", children: jsxs(Flex$1, { className: "yourbondsmodal-content", children: [jsx$2(Flex$1, { className: "yourbondsmodal-header", children: jsx$2(Flex$1, { className: "svg-close", onClick: onDismiss, children: jsx$2(Svg, { icon: "close" }) }) }), jsxs(Flex$1, { className: "yourbondsmodal table-container", children: [showImage, jsxs(Flex$1, { className: "yourbondsmodal yourbondinfo", children: [jsxs(Flex$1, { className: "yourbondinfo title-container", children: [jsx$2(Flex$1, { className: "title-container bondicon", children: userBill && (jsx$2(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 40, chain: userBill?.bond?.chainId })) }), jsx$2(Flex$1, { className: "title-container tokenname", children: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol }), jsx$2(Flex$1, { className: "title-container tokentags", children: userBill?.bond?.tags?.slice(0, 1).map((tag) => {
+    return (jsx$2(Modal, { className: "modal", children: jsxs(Flex$1, { className: "yourbondsmodal-content", children: [jsx$2(Flex$1, { className: "yourbondsmodal-header", children: jsx$2(Flex$1, { className: "svg-close", onClick: onDismiss, children: jsx$2(Svg, { icon: "close" }) }) }), jsxs(Flex$1, { className: "yourbondsmodal table-container", children: [(jsxs(Flex$1, { className: "yourbondsmodal bondimage", children: [bondNFTData?.image && (jsx$2("img", { src: `${bondNFTData?.image}?img-width=720`, onLoad: handleImageLoad, style: { zIndex: 2 } })), !imgLoaded && (jsx$2(Flex$1, { sx: {
+                                        position: 'absolute',
+                                        top: 'calc(50% - 24px)',
+                                        right: 'calc(50% - 50px)',
+                                        justifyContent: 'center',
+                                        alignItems: 'center',
+                                        zIndex: 1,
+                                    }, children: jsx$2(Spinner, { width: 100 }) }))] })), jsxs(Flex$1, { className: "yourbondsmodal yourbondinfo", children: [jsxs(Flex$1, { className: "yourbondinfo title-container", children: [jsx$2(Flex$1, { className: "title-container bondicon", children: userBill && (jsx$2(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 40, chain: userBill?.bond?.chainId })) }), jsx$2(Flex$1, { className: "title-container tokenname", children: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken.symbol }), jsx$2(Flex$1, { className: "title-container tokentags", children: userBill?.bond?.tags?.slice(0, 1).map((tag) => {
                                                 return (jsx$2(Flex$1, { sx: { marginRight: '10px' }, children: jsx$2(ListTag, { text: tag?.toUpperCase() }) }, tag));
-                                            }) }), jsxs(Text, { sx: { color: 'text', opacity: '0.6', fontSize: ['12px', '12px', '12px', '16px'] }, children: ["#", userBill?.id] })] }), jsxs(Flex$1, { className: "yourbondinfo blocks-container", children: [showImage, bondNFTData?.data?.deposit && (jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "You Spent" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.YouSpent }), width: "270px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsx$2(Flex$1, { className: "yourbondinfo-block info", children: jsx$2(Flex$1, { className: "block-info text", children: jsxs(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: ["$", bondNFTData?.data?.dollarValue.toFixed(2)] }) }) })] })), jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon" }), jsx$2(Flex$1, { className: "block-info text", children: jsxs(Flex$1, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: [vestingTimeRemainingString(userBill), isPendingCliff && (jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex$1, { children: ["Bond will be claimable in", ' ', `${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`, "."] }), width: "180px", placement: "bottomRight", transformTip: "translate(13%, 0%)", children: jsx$2(Flex$1, { sx: { opacity: 0.6, ml: '6px' }, children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }))] }) })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-pending", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Pending" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: userBill && (jsx$2(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 25, chain: userBill?.bond?.chainId })) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
+                                            }) }), jsxs(Text, { sx: { color: 'text', opacity: '0.6', fontSize: ['12px', '12px', '12px', '16px'] }, children: ["#", userBill?.id] })] }), jsxs(Flex$1, { className: "yourbondinfo blocks-container", children: [(jsxs(Flex$1, { className: "attributes-container", children: [jsxs(Flex$1, { className: "attributes-header", sx: {
+                                                        borderRadius: `${isOpenTraits ? '6px 6px 0px 0px' : 'normal'}`,
+                                                    }, onClick: () => setIsOpenTraits(!isOpenTraits), children: [jsxs(Flex$1, { sx: { gap: '10px', alignItems: 'center' }, children: [jsx$2(Svg, { icon: "tag", direction: "down" }), jsx$2(Text, { sx: { fontSize: '12px', fontWeight: 400, color: 'text', opacity: '0.6' }, children: "Traits" })] }), jsx$2(Svg, { icon: "caret", direction: isOpenTraits ? 'up' : 'down' })] }), userBill?.bond?.billType === 'staking' && (jsxs(Flex$1, { sx: {
+                                                        p: '5px 10px',
+                                                        width: '100%',
+                                                        background: '#8E568F',
+                                                        borderRadius: 'normal',
+                                                        mt: '10px',
+                                                        fontSize: '12px',
+                                                        fontWeight: 400,
+                                                        justifyContent: 'center',
+                                                        display: 'block',
+                                                    }, children: ["Tokens bought through this bond went directly to the", ' ', jsx$2("span", { onClick: () => window.open('https://basepad.finance/earn', '_blank'), style: { textDecoration: 'underline', cursor: 'pointer', color: 'blue' }, children: "$BPAD staking pool" }), ' ', "with a 365 days lock."] })), jsx$2(AnimatePresence, { children: isOpenTraits && (jsx$2(motion.div, { initial: { height: 0 }, animate: { height: 'fit-content' }, transition: { opacity: { duration: 0.2 } }, exit: { height: 0 }, sx: { overflow: 'hidden', width: '100%' }, children: jsx$2(Flex$1, { sx: { flexDirection: 'column', gap: '1px' }, children: attributes
+                                                                ? attributes.map((a) => (jsxs(Flex$1, { sx: { background: 'white4', width: '100%', padding: '2px 8px' }, children: [jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a?.trait_type }), jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a?.value })] }, a.value)))
+                                                                : BILL_ATTRIBUTES.map((attrib) => {
+                                                                    return (jsxs(Flex$1, { sx: { background: 'white4', width: '100%', padding: '2px 8px' }, children: [jsx$2(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: attrib }), jsx$2(Skeleton, { width: "150px" })] }, attrib));
+                                                                }) }) })) })] })), bondNFTData?.data?.deposit && (jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "You Spent" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.YouSpent }), width: "270px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsx$2(Flex$1, { className: "yourbondinfo-block info", children: jsx$2(Flex$1, { className: "block-info text", children: jsxs(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: ["$", bondNFTData?.data?.dollarValue.toFixed(2)] }) }) })] })), jsxs(Flex$1, { className: "yourbondinfo-block row-vested", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon" }), jsx$2(Flex$1, { className: "block-info text", children: jsxs(Flex$1, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: [vestingTimeRemainingString(userBill), isPendingCliff && (jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex$1, { children: ["Bond will be claimable in", ' ', `${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`, "."] }), width: "180px", placement: "bottomRight", transformTip: "translate(13%, 0%)", children: jsx$2(Flex$1, { sx: { opacity: 0.6, ml: '6px' }, children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }))] }) })] })] }), jsxs(Flex$1, { className: "yourbondinfo-block row-pending", children: [jsxs(Flex$1, { className: "yourbondinfo-block header", children: [jsx$2(Flex$1, { className: "yourbondinfo-block header-title", children: "Pending" }), jsx$2(Flex$1, { className: "yourbondinfo-block header-tooltip", children: jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex$1, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex$1, { className: "block-header icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), jsxs(Flex$1, { className: "yourbondinfo-block info", children: [jsx$2(Flex$1, { className: "block-info icon", children: userBill && (jsx$2(TokenImage, { symbol: userBill?.bond?.showcaseTokenName ?? userBill?.bond?.earnToken?.symbol, size: 25, chain: userBill?.bond?.chainId })) }), jsxs(Flex$1, { className: "block-info text", children: [jsx$2(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), jsx$2(Text, { sx: {
                                                                         fontSize: ['10px', '10px', '10px', '12px'],
                                                                         fontWeight: [500, 500, 500, 400],
                                                                         paddingLeft: '10px',
@@ -73119,7 +73144,7 @@ const useSoulZapTokenQuote = (typedValue, inputCurrency, outputToken, chainId, a
     const contractAddress = outputToken?.address[chainId];
     const chain = getChainParam(chainId);
     const isLP = outputToken?.lpToken ?? false;
-    const liquidityDex = outputToken?.liquidityDex?.[chainId];
+    const liquidityDex = outputToken?.liquiditySource?.[chainId] ?? outputToken?.liquidityDex?.[chainId];
     const protocol = main.dexFactories[chainId]?.[liquidityDex]?.protocol;
     const lpType = outputToken?.lpToken ? getLpType(protocol) : 'single';
     const ichiUnderlyingDex = outputToken?.ichiUnderlyingDex;
@@ -73220,6 +73245,139 @@ const useSoulZapTokenQuote = (typedValue, inputCurrency, outputToken, chainId, a
     return [isLoading, response, estimateOutput, zapError];
 };
 
+const useSoulZapBondQuote = (typedValue, inputCurrency, bond, account, tierProofSig) => {
+    const debouncedInput = useDebounce(typedValue, 400);
+    const [slippage] = useSlippage();
+    const principalToken = bond?.lpToken;
+    const bondContractAddress = bond?.contractAddress[bond?.chainId];
+    const chainId = bond?.chainId;
+    const inputCurrencyString = inputCurrency === 'NATIVE' ? '0x0000000000000000000000000000000000000000' : inputCurrency?.address[chainId];
+    const inputCurrencyDecimals = inputCurrency === 'NATIVE' ? 18 : inputCurrency?.decimals[chainId];
+    const principalContractAddress = principalToken?.address[chainId];
+    const chainName = getChainParam(chainId);
+    const isReserveBond = bond?.billType === 'reserve' || bond?.billType === 'staking';
+    const liquidityDex = principalToken?.liquiditySource?.[chainId] ?? principalToken?.liquidityDex?.[chainId];
+    const protocol = main.dexFactories[chainId]?.[liquidityDex]?.protocol;
+    const lpType = isReserveBond ? 'single' : getLpType(protocol);
+    const ichiUnderlyingDex = principalToken?.ichiUnderlyingDex;
+    const vault = principalToken?.address?.[chainId];
+    const router = main.dexFactories[chainId]?.[liquidityDex]?.router;
+    // Validates that the user did not pass an amount with 19 decimals or more
+    const validated18DecimalAmount = new BigNumber$1(debouncedInput ?? '0').toFixed(18, 5);
+    const bigishInputAmount = new BigNumber$1(validated18DecimalAmount ?? '0')
+        .times(new BigNumber$1(10).pow(inputCurrencyDecimals ?? 18))
+        .toString();
+    const zapInputData = useMemo(() => {
+        if (inputCurrencyString &&
+            inputCurrencyDecimals &&
+            bigishInputAmount !== 'NaN' &&
+            bigishInputAmount !== '0' &&
+            principalContractAddress &&
+            chainName &&
+            bondContractAddress &&
+            (inputCurrency === 'NATIVE' || inputCurrency?.address[chainId] !== principalToken.address[chainId])) {
+            return {
+                chain: chainName,
+                recipient: account ?? '0x0000000000000000000000000000000000000000',
+                user: account ?? '0x0000000000000000000000000000000000000000',
+                lpData: {
+                    lpType,
+                    fromToken: inputCurrencyString,
+                    fromAmount: bigishInputAmount,
+                    underlyingDex: ichiUnderlyingDex,
+                    vault: isReserveBond ? undefined : vault,
+                    slippage: slippage,
+                    lpAddress: lpType === 'solidly' || lpType === 'univ2' || lpType === 'curve' ? vault : undefined,
+                    router: lpType === 'solidly' || lpType === 'univ2' ? router : undefined,
+                    toToken: isReserveBond ? vault : undefined,
+                },
+                protocolData: {
+                    protocol: 'ApeBond',
+                    bond: bondContractAddress,
+                    depositer: account ?? '0x0000000000000000000000000000000000000000',
+                    tierProofSignature: bond.billVersion === main.BillVersion.V4 && tierProofSig ? tierProofSig : undefined,
+                },
+            };
+        }
+        else {
+            return null;
+        }
+        /* eslint-disable react-hooks/exhaustive-deps */
+    }, [
+        bigishInputAmount,
+        principalContractAddress,
+        chainName,
+        account,
+        ichiUnderlyingDex,
+        vault,
+        lpType,
+        router,
+        slippage,
+    ]);
+    const queryKey = useMemo(() => {
+        if (!zapInputData)
+            return null;
+        return [
+            'zapBondDetails',
+            zapInputData.chain,
+            zapInputData.user,
+            zapInputData.lpData.lpType,
+            zapInputData.lpData.fromToken,
+            zapInputData.lpData.fromAmount,
+            zapInputData.lpData.underlyingDex ?? '',
+            zapInputData.lpData.vault,
+            zapInputData.lpData.slippage,
+            zapInputData.lpData.lpAddress,
+            zapInputData.lpData.router ?? '',
+        ];
+    }, [zapInputData]);
+    const fetchZapDetails = async () => {
+        const response = await axios.post(SOUL_ZAP_API, {
+            '0': zapInputData,
+        });
+        return response.data?.[0]?.result?.data;
+    };
+    const { data: response, isLoading, isFetching, error, } = useQuery({
+        queryKey: [QUERY_KEYS.ZAP_TOKEN_QUOTE, queryKey],
+        queryFn: fetchZapDetails,
+        refetchInterval: 60000, // i.e. 60 sec
+        enabled: !!queryKey,
+        retry: 1,
+    });
+    const zapError = !!error;
+    const tokenList = zapInputTokens[chainId] ? zapInputTokens[chainId] : [];
+    // toToken0 data
+    const toToken0Estimate = response?.lpQuote?.token0?.fromAmountEstimate;
+    const toToken0 = [...tokenList, principalToken]?.find((token) => token?.address?.[chainId]?.toLowerCase() === response?.lpQuote?.token0?.address?.toLowerCase());
+    const toToken0Price = useCurrencyPrice(toToken0 ?? null, chainId);
+    // toToken1 data
+    const toToken1Estimate = response?.lpQuote?.token1?.fromAmountEstimate;
+    const toToken1 = zapInputTokens[chainId]?.find((token) => token.address[chainId]?.toLowerCase() === response?.lpQuote?.token1?.address?.toLowerCase());
+    const toToken1Price = useCurrencyPrice(toToken1 ?? null, chainId);
+    let toToken0USD = new BigNumber$1(toToken0Estimate ?? '0')
+        ?.div(new BigNumber$1(10).pow(toToken0?.decimals[chainId] ?? 18)) // this is amount of swap output
+        ?.times(new BigNumber$1(toToken0Price?.price ?? 0)); // convert it to usd price
+    if (response?.lpQuote?.token0?.fromAmountUSD) {
+        toToken0USD = new BigNumber$1(response?.lpQuote?.token0?.fromAmountUSD);
+    }
+    let toToken1USD = new BigNumber$1(toToken1Estimate ?? '0')
+        ?.div(new BigNumber$1(10).pow(toToken1?.decimals[chainId] ?? 18)) // this is amount of swap output
+        ?.times(new BigNumber$1(toToken1Price?.price ?? 0)); // convert it to usd price
+    if (response?.lpQuote?.token1?.fromAmountUSD) {
+        toToken1USD = new BigNumber$1(response?.lpQuote?.token1?.fromAmountUSD);
+    }
+    const youSpendUSD = toToken0USD.plus(toToken1USD); // youSpendUSD
+    const estimatedDepositAmount = youSpendUSD.div(bond?.principalTokenPrice ?? '0');
+    const isWrap = inputCurrency === 'NATIVE' &&
+        bond?.lpToken?.address?.[chainId]?.toLowerCase() === WNATIVE[chainId]?.address?.[chainId]?.toLowerCase();
+    const estimatedDepositAmountToReturn = isWrap ? typedValue : estimatedDepositAmount.toString();
+    const trueBondPrice = response?.protocolQuote?.trueBondPrice;
+    const zapLoading = isLoading || isFetching;
+    if (zapLoading)
+        return [true, undefined, '', false, undefined];
+    return [zapLoading, response, estimatedDepositAmountToReturn, zapError, trueBondPrice];
+};
+
 function useCurrencyBalance(currency, account, chainId) {
     return useQuery({
         queryKey: [
@@ -74296,7 +74454,7 @@ const SlippageModal = () => {
                                             }, children: jsx$2(Text, { weight: 700, children: "%" }) })] })] })] }) }) }) }));
 };
 
-const ZapModal = ({ onDismiss, outputToken, account, chainId }) => {
+const ZapModal = ({ onDismiss, outputToken, account, chainId, bondData }) => {
     // State
     const [pendingTx, setPendingTx] = useState(false);
     const [typedValue, setTypedValue] = useState('');
@@ -74320,8 +74478,14 @@ const ZapModal = ({ onDismiss, outputToken, account, chainId }) => {
     const isWrap = inputTokenString === 'NATIVE' &&
         outputToken?.address?.[chainId]?.toLowerCase() === WNATIVE[chainId]?.address?.[chainId]?.toLowerCase();
     const outputTokenBalanceString = outputTokenBalance ? new BigNumber$1(outputTokenBalance).toPrecision(5) : 'loading';
-    // Zap Quote
-    const [fetchingQuote, zapData, outputValue, zapError] = useSoulZapTokenQuote(typedValue, inputToken, outputToken, chainId, account);
+    // Zap Quote - use bond quote when bondData is present, token quote otherwise
+    const [tokenFetchingQuote, tokenZapData, tokenOutputValue, tokenZapError] = useSoulZapTokenQuote(typedValue, inputToken, bondData ? undefined : outputToken, chainId, account);
+    const [bondFetchingQuote, bondZapData, bondDepositAmount, bondZapError] = useSoulZapBondQuote(typedValue, inputToken, bondData, account);
+    const isBondZap = !!bondData;
+    const fetchingQuote = isBondZap ? bondFetchingQuote : tokenFetchingQuote;
+    const zapData = isBondZap ? bondZapData : tokenZapData;
+    const outputValue = isBondZap ? parseFloat(bondDepositAmount || '0') : tokenOutputValue;
+    const zapError = isBondZap ? bondZapError : tokenZapError;
     // Functions
     const handleCurrencySelect = useCallback((newInputToken) => {
         setTypedValue('');
@@ -74409,139 +74573,6 @@ const ZapModal = ({ onDismiss, outputToken, account, chainId }) => {
                                         : 'BUY' })) }), jsx$2(Flex, { sx: { marginTop: '10px', justifyContent: 'center' }, children: jsx$2(Link, { href: "https://docs.ape.bond/apebond/products-and-features/zap", target: "_blank", rel: "noopener noreferrer", sx: { textDecoration: 'none' }, children: jsxs(Text, { style: { fontSize: '12px', lineHeight: '18px', fontWeight: 400, borderBottom: '1px solid' }, children: ["Learn more", '>'] }) }) })] })] }));
 };
 
-const useSoulZapBondQuote = (typedValue, inputCurrency, bond, account, tierProofSig) => {
-    const debouncedInput = useDebounce(typedValue, 400);
-    const [slippage] = useSlippage();
-    const principalToken = bond?.lpToken;
-    const bondContractAddress = bond?.contractAddress[bond?.chainId];
-    const chainId = bond?.chainId;
-    const inputCurrencyString = inputCurrency === 'NATIVE' ? '0x0000000000000000000000000000000000000000' : inputCurrency?.address[chainId];
-    const inputCurrencyDecimals = inputCurrency === 'NATIVE' ? 18 : inputCurrency?.decimals[chainId];
-    const principalContractAddress = principalToken?.address[chainId];
-    const chainName = getChainParam(chainId);
-    const isReserveBond = bond?.billType === 'reserve' || bond?.billType === 'staking';
-    const liquidityDex = principalToken?.liquiditySource?.[chainId] ?? principalToken?.liquidityDex?.[chainId];
-    const protocol = main.dexFactories[chainId]?.[liquidityDex]?.protocol;
-    const lpType = isReserveBond ? 'single' : getLpType(protocol);
-    const ichiUnderlyingDex = principalToken?.ichiUnderlyingDex;
-    const vault = principalToken?.address?.[chainId];
-    const router = main.dexFactories[chainId]?.[liquidityDex]?.router;
-    // Validates that the user did not pass an amount with 19 decimals or more
-    const validated18DecimalAmount = new BigNumber$1(debouncedInput ?? '0').toFixed(18, 5);
-    const bigishInputAmount = new BigNumber$1(validated18DecimalAmount ?? '0')
-        .times(new BigNumber$1(10).pow(inputCurrencyDecimals ?? 18))
-        .toString();
-    const zapInputData = useMemo(() => {
-        if (inputCurrencyString &&
-            inputCurrencyDecimals &&
-            bigishInputAmount !== 'NaN' &&
-            bigishInputAmount !== '0' &&
-            principalContractAddress &&
-            chainName &&
-            bondContractAddress &&
-            (inputCurrency === 'NATIVE' || inputCurrency?.address[chainId] !== principalToken.address[chainId])) {
-            return {
-                chain: chainName,
-                recipient: account ?? '0x0000000000000000000000000000000000000000',
-                user: account ?? '0x0000000000000000000000000000000000000000',
-                lpData: {
-                    lpType,
-                    fromToken: inputCurrencyString,
-                    fromAmount: bigishInputAmount,
-                    underlyingDex: ichiUnderlyingDex,
-                    vault: isReserveBond ? undefined : vault,
-                    slippage: slippage,
-                    lpAddress: lpType === 'solidly' || lpType === 'univ2' || lpType === 'curve' ? vault : undefined,
-                    router: lpType === 'solidly' || lpType === 'univ2' ? router : undefined,
-                    toToken: isReserveBond ? vault : undefined,
-                },
-                protocolData: {
-                    protocol: 'ApeBond',
-                    bond: bondContractAddress,
-                    depositer: account ?? '0x0000000000000000000000000000000000000000',
-                    tierProofSignature: bond.billVersion === main.BillVersion.V4 && tierProofSig ? tierProofSig : undefined,
-                },
-            };
-        }
-        else {
-            return null;
-        }
-        /* eslint-disable react-hooks/exhaustive-deps */
-    }, [
-        bigishInputAmount,
-        principalContractAddress,
-        chainName,
-        account,
-        ichiUnderlyingDex,
-        vault,
-        lpType,
-        router,
-        slippage,
-    ]);
-    const queryKey = useMemo(() => {
-        if (!zapInputData)
-            return null;
-        return [
-            'zapBondDetails',
-            zapInputData.chain,
-            zapInputData.user,
-            zapInputData.lpData.lpType,
-            zapInputData.lpData.fromToken,
-            zapInputData.lpData.fromAmount,
-            zapInputData.lpData.underlyingDex ?? '',
-            zapInputData.lpData.vault,
-            zapInputData.lpData.slippage,
-            zapInputData.lpData.lpAddress,
-            zapInputData.lpData.router ?? '',
-        ];
-    }, [zapInputData]);
-    const fetchZapDetails = async () => {
-        const response = await axios.post(SOUL_ZAP_API, {
-            '0': zapInputData,
-        });
-        return response.data?.[0]?.result?.data;
-    };
-    const { data: response, isLoading, isFetching, error, } = useQuery({
-        queryKey: [QUERY_KEYS.ZAP_TOKEN_QUOTE, queryKey],
-        queryFn: fetchZapDetails,
-        refetchInterval: 60000, // i.e. 60 sec
-        enabled: !!queryKey,
-        retry: 1,
-    });
-    const zapError = !!error;
-    const tokenList = zapInputTokens[chainId] ? zapInputTokens[chainId] : [];
-    // toToken0 data
-    const toToken0Estimate = response?.lpQuote?.token0?.fromAmountEstimate;
-    const toToken0 = [...tokenList, principalToken]?.find((token) => token?.address?.[chainId]?.toLowerCase() === response?.lpQuote?.token0?.address?.toLowerCase());
-    const toToken0Price = useCurrencyPrice(toToken0 ?? null, chainId);
-    // toToken1 data
-    const toToken1Estimate = response?.lpQuote?.token1?.fromAmountEstimate;
-    const toToken1 = zapInputTokens[chainId]?.find((token) => token.address[chainId]?.toLowerCase() === response?.lpQuote?.token1?.address?.toLowerCase());
-    const toToken1Price = useCurrencyPrice(toToken1 ?? null, chainId);
-    let toToken0USD = new BigNumber$1(toToken0Estimate ?? '0')
-        ?.div(new BigNumber$1(10).pow(toToken0?.decimals[chainId] ?? 18)) // this is amount of swap output
-        ?.times(new BigNumber$1(toToken0Price?.price ?? 0)); // convert it to usd price
-    if (response?.lpQuote?.token0?.fromAmountUSD) {
-        toToken0USD = new BigNumber$1(response?.lpQuote?.token0?.fromAmountUSD);
-    }
-    let toToken1USD = new BigNumber$1(toToken1Estimate ?? '0')
-        ?.div(new BigNumber$1(10).pow(toToken1?.decimals[chainId] ?? 18)) // this is amount of swap output
-        ?.times(new BigNumber$1(toToken1Price?.price ?? 0)); // convert it to usd price
-    if (response?.lpQuote?.token1?.fromAmountUSD) {
-        toToken1USD = new BigNumber$1(response?.lpQuote?.token1?.fromAmountUSD);
-    }
-    const youSpendUSD = toToken0USD.plus(toToken1USD); // youSpendUSD
-    const estimatedDepositAmount = youSpendUSD.div(bond?.principalTokenPrice ?? '0');
-    const isWrap = inputCurrency === 'NATIVE' &&
-        bond?.lpToken?.address?.[chainId]?.toLowerCase() === WNATIVE[chainId]?.address?.[chainId]?.toLowerCase();
-    const estimatedDepositAmountToReturn = isWrap ? typedValue : estimatedDepositAmount.toString();
-    const trueBondPrice = response?.protocolQuote?.trueBondPrice;
-    const zapLoading = isLoading || isFetching;
-    if (zapLoading)
-        return [true, undefined, '', false, undefined];
-    return [zapLoading, response, estimatedDepositAmountToReturn, zapError, trueBondPrice];
-};
-
 const useSendReferenceId = () => {
     const config = useSDKConfig();
     const apiV2URL = useURLByEnvironment('apiV2');
@@ -75425,7 +75456,7 @@ const BuyBond$1 = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isP
     // Modals
     const [openNewRateModal] = useModal(jsx$2(NewRateModal$1, { bond: bondData, zapTrueBondPrice: zapTrueBondPrice, depositAmount: depositAmount, youSpendString: youSpendString, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), true, false, 'newRateModal');
     const [openTxModal] = useModal(jsx$2(TransactionModal$2, { txChain: bondChain, approvalState: approvalState, approveCallback: handleApprove, loadingTx: loadingTx, txCallback: handleBothPurchases, bondData: bondData, inputToken: inputToken, inputValue: inputValue, depositAmount: depositAmount, buyTxHash: buyTxHash, rateChanged: rateChanged }), false, true, 'transactionModal');
-    const [onOpenZapModal] = useModal(jsx$2(ZapModal, { outputToken: bondData?.lpToken, account: account, chainId: bondData?.chainId }), true, true, 'zapModal');
+    const [onOpenZapModal] = useModal(jsx$2(ZapModal, { outputToken: bondData?.lpToken, account: account, chainId: bondData?.chainId, bondData: bondData }), true, true, 'zapModal');
     const [openNoBonusModal] = useModal(jsx$2(NoBonusModal, { onAcknowledge: openTxModal, showcaseTokenName: bondData?.showcaseTokenName }), true, true, 'NoBonusModal');
     // Effects
     const [hasChecked, setHasChecked] = useState(false);
@@ -99885,7 +99916,7 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
     // Modals
     useModal(jsx$2(NewRateModal, { bond: bondData, zapTrueBondPrice: zapTrueBondPrice, depositAmount: depositAmount, youSpendString: youSpendString, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), true, false, 'newRateModal');
     const [openTxModal] = useModal(jsx$2(TransactionModal$1, { txChain: bondChain, approvalState: approvalState, approveCallback: handleApprove, loadingTx: loadingTx, txCallback: handleBothPurchases, bondData: bondData, inputToken: inputToken, inputValue: inputValue, depositAmount: depositAmount, buyTxHash: buyTxHash, rateChanged: rateChanged, onDismiss: onDismiss }), false, true, 'transactionModal');
-    useModal(jsx$2(ZapModal, { outputToken: bondData?.lpToken, account: account, chainId: bondData?.chainId }), true, true, 'zapModal');
+    useModal(jsx$2(ZapModal, { outputToken: bondData?.lpToken, account: account, chainId: bondData?.chainId, bondData: bondData }), true, true, 'zapModal');
     // Effects
     const [hasChecked, setHasChecked] = useState(false);
     const [hasCheckedTrack, setHasCheckedTrack] = useState(false);

package/dist/views/ZapModal/index.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { ChainId, Token } from '@ape.swap/apeswap-lists';
+import { BondsData } from '../../types/bonds';
 /**
  * @param chainId this is the chainId of the outputToken
  */
@@ -8,6 +9,7 @@ interface ZapModalProps {
     outputToken: Token;
     chainId: ChainId;
     account?: string;
+    bondData?: BondsData;
 }
-declare const ZapModal: ({ onDismiss, outputToken, account, chainId }: ZapModalProps) => React.JSX.Element;
+declare const ZapModal: ({ onDismiss, outputToken, account, chainId, bondData }: ZapModalProps) => React.JSX.Element;
 export default ZapModal;

package/package.json

@@ -3,7 +3,7 @@
   "description": "Goo Money Bond SDK",
   "author": "Goo Money",
   "license": "MIT",
-  "version": "3.0.175",
+  "version": "3.0.176",
   "proxy": "https://realtime-api-pr-99.herokuapp.com",
   "module": "dist/main.js",
   "type": "module",