@ape.swap/bonds-sdk 1.0.360 → 1.0.362

package/dist/components/BondModal/BondModal.js

@@ -59,13 +59,13 @@ import { useNavigate } from 'react-router-dom';
 import { isNumber } from '../../utils/numbers';
 import { TooltipBubble, Button, Svg, ListTag } from '../uikit-sdk';
 import { TooltipText } from '../../enum/tooltips';
-import { formatNumberSI } from '../../utils/formatNumber';
 import { ethers } from 'ethers';
 import { adjustDecimals } from "../../utils/convertToTokenValue";
 import TokenImage from '../uikit-sdk/TokenImage';
 import '../../scss/BondModal.scss';
 import BOND_ABI from '../../config/abi/bond.json';
 import ERC_20_ABI from '../../config/abi/bond.json';
+import { formatUSDNumber, getPremiumColor, premium, youGet, youGetUSD, youSpend, youSpendUSD } from './helper';
 var BondModal = function (_a) {
     var isOpen = _a.isOpen, onClose = _a.onClose, bondAddress = _a.bondAddress;
     if (!isOpen)
@@ -116,62 +116,6 @@ var BondModal = function (_a) {
         setSelectedBond(bond);
         navigate("/bondsingle/".concat(bond.billAddress));
     };
-    //Note to Gordon: Can we put all this in a helper file or something so the code in here is less?
-    /////////////////////
-    function formatNumber(input) {
-        var number = new BigNumber(input);
-        if (number.isNaN())
-            return '0';
-        return number.gt(1000000)
-            ? formatNumberSI(number.toNumber())
-            : number.gt(1000)
-                ? number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 })
-                : number.gt(0.01)
-                    ? parseFloat(number.toFixed(2)).toLocaleString(undefined)
-                    : parseFloat(number.toPrecision(5)).toLocaleString(undefined);
-    }
-    function formatUSDNumber(input) {
-        var number = new BigNumber(input);
-        if (number.isNaN())
-            return '0';
-        // If the number is greater than 0 but less than 0.01
-        if (number.gt(0) && number.lt(0.01)) {
-            return '< 0.01';
-        }
-        // If the number is greater than 1k, round to no decimals.
-        if (number.gt(1000)) {
-            return number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 });
-        }
-        // Note: Between 1k and 0.01 show 2 decimals
-        return parseFloat(number.toFixed(2)).toLocaleString(undefined);
-    }
-    var youSpend = formatNumber(inputValue);
-    var youSpendUSD = function (bond) {
-        return (parseFloat(inputValue) * parseFloat(bond.principalTokenPrice)).toString();
-    };
-    var youGet = function (bond) {
-        var _a;
-        var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
-        var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
-        return formatNumber(billValue.toString());
-    };
-    var youGetUSD = function (bond) {
-        var _a;
-        var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
-        var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
-        return (billValue.toNumber() * parseFloat(bond.payoutTokenPrice)).toString();
-    };
-    var premium = function (bond) {
-        var premiumUSD = parseFloat(youGetUSD(bond)) - parseFloat(youSpendUSD(bond));
-        return formatUSDNumber(premiumUSD.toString());
-    };
-    var getPremiumColor = function (bond) {
-        var getPremium = premium(bond);
-        return parseFloat(getPremium) < 0 ? 'premium-negative' : 'premium-positive';
-    };
-    ////////////////////////////////////////////////////////////////////////////////////
-    ////////////////////////////////////////////////////////////////////////////////////
-    ////////////////////////////////////////////////////////////////////////////////////
     var handleBuy = function () { return __awaiter(void 0, void 0, void 0, function () {
         var provider, signer, bondContract, maxPrice, amount, tx, error_1;
         return __generator(this, function (_a) {
@@ -249,7 +193,7 @@ var BondModal = function (_a) {
     }); };
     return (_jsx(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: bondData.map(function (bond) {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-            return (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "modal modal-backdrop" }, { children: _jsxs(Flex, __assign({ className: "modal modal-content" }, { children: [isActive && account && (_jsxs("p", { children: ["Wallet Address: ", account] })), _jsx(Flex, __assign({ className: "modal modal-header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "modal-container table-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-container title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsx(TokenImage, { symbol: (_a = bond.showcaseTokenName) !== null && _a !== void 0 ? _a : bond.payoutTokenName, size: 50 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName })), _jsxs(Flex, __assign({ className: "title-container price-container" }, { children: [_jsxs(Flex, __assign({ className: "price-container price" }, { children: ["$", earnTokenPrice(bond)] })), _jsxs(Flex, __assign({ className: "price-container discounted" }, { children: ["$", discountEarnTokenPrice(bond)] }))] })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_b = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _b === void 0 ? void 0 : _b[0], variant: ((_c = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _c === void 0 ? void 0 : _c[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) }))] })), _jsx(Flex, __assign({ className: "modal-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "modal-container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-block column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Discount", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), "".concat((_d = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _d === void 0 ? void 0 : _d.toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-arr" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["ARR", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), "".concat(((((_e = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _e !== void 0 ? _e : 0) * 365) / vestingTime((_f = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _f !== void 0 ? _f : 0).days).toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-term" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Terms", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), vestingTime((_g = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _g !== void 0 ? _g : 0).days ? "".concat(vestingTime((_h = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _h !== void 0 ? _h : 0).days, " D") : '-'] })), _jsxs(Flex, __assign({ className: "modal-block column-maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Max Buy", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.MaxBuy(bond.payoutTokenName) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), (_j = parseFloat(maxBuy(bond).toFixed(0))) === null || _j === void 0 ? void 0 : _j.toLocaleString('en-US')] }))] })), _jsxs(Flex, __assign({ className: "modal-container text-container" }, { children: [_jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx(Flex, __assign({ className: "row-container spend" }, { children: "You spend:" })), _jsxs(Flex, __assign({ className: "row-container spend-val" }, { children: [youSpend, " ", bond.principalTokenName, " = $ ", formatUSDNumber(youSpendUSD(bond))] }))] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs(Flex, __assign({ className: "row-container premium" }, { children: ["Premium:", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "row-container premium-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "row-container premium-val ".concat(getPremiumColor(bond)) }, { children: ["$ ", premium(bond)] }))] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs(Flex, __assign({ className: "row-container get" }, { children: ["You get (over ", vestingTime((_k = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _k !== void 0 ? _k : 0).days, " days):"] })), _jsxs(Flex, __assign({ className: "row-container get-val" }, { children: [youGet(bond), " ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ ", formatUSDNumber(youGetUSD(bond))] }))] }))] })), _jsxs(Flex, __assign({ className: "modal-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(Input, { placeholder: "0.0", value: inputValue, pattern: "^[0-9]*[.,]?[0-9]*$", onChange: handleInputChange, onInput: function (v) {
+            return (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "modal modal-backdrop" }, { children: _jsxs(Flex, __assign({ className: "modal modal-content" }, { children: [isActive && account && (_jsxs("p", { children: ["Wallet Address: ", account] })), _jsx(Flex, __assign({ className: "modal modal-header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "modal-container table-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-container title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsx(TokenImage, { symbol: (_a = bond.showcaseTokenName) !== null && _a !== void 0 ? _a : bond.payoutTokenName, size: 50 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName })), _jsxs(Flex, __assign({ className: "title-container price-container" }, { children: [_jsxs(Flex, __assign({ className: "price-container price" }, { children: ["$", earnTokenPrice(bond)] })), _jsxs(Flex, __assign({ className: "price-container discounted" }, { children: ["$", discountEarnTokenPrice(bond)] }))] })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_b = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _b === void 0 ? void 0 : _b[0], variant: ((_c = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _c === void 0 ? void 0 : _c[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) }))] })), _jsx(Flex, __assign({ className: "modal-container description-container" }, { children: bond === null || bond === void 0 ? void 0 : bond.shortDescription })), _jsxs(Flex, __assign({ className: "modal-container blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "modal-block column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Discount", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), "".concat((_d = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _d === void 0 ? void 0 : _d.toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-arr" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["ARR", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), "".concat(((((_e = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _e !== void 0 ? _e : 0) * 365) / vestingTime((_f = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _f !== void 0 ? _f : 0).days).toFixed(2), "%")] })), _jsxs(Flex, __assign({ className: "modal-block column-term" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Terms", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), vestingTime((_g = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _g !== void 0 ? _g : 0).days ? "".concat(vestingTime((_h = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _h !== void 0 ? _h : 0).days, " D") : '-'] })), _jsxs(Flex, __assign({ className: "modal-block column-maxbuy" }, { children: [_jsxs(Flex, __assign({ className: "block-header header" }, { children: ["Max Buy", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.MaxBuy(bond.payoutTokenName) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), (_j = parseFloat(maxBuy(bond).toFixed(0))) === null || _j === void 0 ? void 0 : _j.toLocaleString('en-US')] }))] })), _jsxs(Flex, __assign({ className: "modal-container text-container" }, { children: [_jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsx(Flex, __assign({ className: "row-container spend" }, { children: "You spend:" })), _jsxs(Flex, __assign({ className: "row-container spend-val" }, { children: [youSpend(inputValue), " ", bond.principalTokenName, " = $ ", formatUSDNumber(youSpendUSD(bond, inputValue))] }))] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs(Flex, __assign({ className: "row-container premium" }, { children: ["Premium:", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "row-container premium-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "row-container premium-val ".concat(getPremiumColor(bond, inputValue)) }, { children: ["$ ", premium(bond, inputValue)] }))] })), _jsxs(Flex, __assign({ className: "text-container row" }, { children: [_jsxs(Flex, __assign({ className: "row-container get" }, { children: ["You get (over ", vestingTime((_k = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _k !== void 0 ? _k : 0).days, " days):"] })), _jsxs(Flex, __assign({ className: "row-container get-val" }, { children: [youGet(bond, inputValue), " ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ ", formatUSDNumber(youGetUSD(bond, inputValue))] }))] }))] })), _jsxs(Flex, __assign({ className: "modal-container input-container" }, { children: [_jsx(Flex, __assign({ className: "input-container input" }, { children: _jsx(Input, { placeholder: "0.0", value: inputValue, pattern: "^[0-9]*[.,]?[0-9]*$", onChange: handleInputChange, onInput: function (v) {
                                                         if (v.currentTarget.value.includes(',')) {
                                                             v.currentTarget.value = v.currentTarget.value.replace(/,/g, '.');
                                                         }

package/dist/components/BondModal/helper.d.ts

@@ -0,0 +1,9 @@
+import { BondsDataResponse } from "../../types/bonds";
+export declare function formatNumber(input: string): string;
+export declare function formatUSDNumber(input: string): string;
+export declare const youSpend: (inputValue: string) => string;
+export declare const youSpendUSD: (bond: BondsDataResponse, inputValue: string) => string;
+export declare const youGet: (bond: BondsDataResponse, inputValue: string) => string;
+export declare const youGetUSD: (bond: BondsDataResponse, inputValue: string) => string;
+export declare const premium: (bond: BondsDataResponse, inputValue: string) => string;
+export declare const getPremiumColor: (bond: BondsDataResponse, inputValue: string) => string;

package/dist/components/BondModal/helper.js

@@ -0,0 +1,53 @@
+import BigNumber from "bignumber.js";
+import { formatNumberSI } from "../../utils/formatNumber";
+export function formatNumber(input) {
+    var number = new BigNumber(input);
+    if (number.isNaN())
+        return '0';
+    return number.gt(1000000)
+        ? formatNumberSI(number.toNumber())
+        : number.gt(1000)
+            ? number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 })
+            : number.gt(0.01)
+                ? parseFloat(number.toFixed(2)).toLocaleString(undefined)
+                : parseFloat(number.toPrecision(5)).toLocaleString(undefined);
+}
+export function formatUSDNumber(input) {
+    var number = new BigNumber(input);
+    if (number.isNaN())
+        return '0';
+    // If the number is greater than 0 but less than 0.01
+    if (number.gt(0) && number.lt(0.01)) {
+        return '< 0.01';
+    }
+    // If the number is greater than 1k, round to no decimals.
+    if (number.gt(1000)) {
+        return number.toNumber().toLocaleString(undefined, { maximumFractionDigits: 0 });
+    }
+    // Note: Between 1k and 0.01 show 2 decimals
+    return parseFloat(number.toFixed(2)).toLocaleString(undefined);
+}
+export var youSpend = function (inputValue) { return formatNumber(inputValue); };
+export var youSpendUSD = function (bond, inputValue) {
+    return (parseFloat(inputValue) * parseFloat(bond.principalTokenPrice)).toString();
+};
+export var youGet = function (bond, inputValue) {
+    var _a;
+    var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
+    var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
+    return formatNumber(billValue.toString());
+};
+export var youGetUSD = function (bond, inputValue) {
+    var _a;
+    var bigValue = new BigNumber(inputValue).times(new BigNumber(10).pow(18));
+    var billValue = bigValue.div(new BigNumber((_a = bond.trueBillPrice) !== null && _a !== void 0 ? _a : 0));
+    return (billValue.toNumber() * parseFloat(bond.payoutTokenPrice)).toString();
+};
+export var premium = function (bond, inputValue) {
+    var premiumUSD = parseFloat(youGetUSD(bond, inputValue)) - parseFloat(youSpendUSD(bond, inputValue));
+    return formatUSDNumber(premiumUSD.toString());
+};
+export var getPremiumColor = function (bond, inputValue) {
+    var getPremium = premium(bond, inputValue);
+    return parseFloat(getPremium) < 0 ? 'premium-negative' : 'premium-positive';
+};

package/dist/components/YourBonds/YourBonds.js

@@ -56,20 +56,16 @@ import getTimePeriods from '../../utils/getTimePeriods';
 import { defaultTheme } from '../../theme';
 import '../../scss/YourBonds.scss';
 import { BigNumber } from 'bignumber.js';
-import { BillVersion } from '../../enum/apeswaplists';
 import { Text, Button } from '../uikit-sdk';
 import { MAINNET_CHAINS } from '../../config/constants/chains';
 import TokenInfoAndName from '../TokenInfoAndName';
-import { ACF_TO_ABOND } from '../../config/constants/addresses';
-import multicall from '../../utils/multicall';
-import billAbi from '../../config/abi/bond.json';
 import { getBalanceNumber } from '../../utils/getBalanceNumber';
 import { getFirstNonZeroDigits } from '../../utils/roundNumber';
 import { formatNumberSI } from '../../utils/formatNumber';
 import useCurrentTime from '../../hooks/useTimer';
 import { getPendingVesting } from '../../hooks/usePendingVesting';
 import axios from 'axios';
-import { fetchUserOwnedBillNftData } from './fetchBillsUser';
+import { fetchUserOwnedBillsDataAsync } from './fetchBillsUser';
 var YourBonds = function (_a) {
     var connectionString = _a.connectionString;
     var _b = useWeb3React(), account = _b.account, isActive = _b.isActive;
@@ -120,145 +116,18 @@ var YourBonds = function (_a) {
             setBondData(bonds);
         });
     }, []);
-    var _d = useState(false), isModalOpen = _d[0], setIsModalOpen = _d[1];
-    var _e = useState(null), selectedBond = _e[0], setSelectedBond = _e[1];
-    var _f = useState([]), bondData = _f[0], setBondData = _f[1];
-    var rowClick = function (bond) {
-        setSelectedBond(bond);
+    var _d = useState([]), bondData = _d[0], setBondData = _d[1];
+    var _e = useState(false), isModalOpen = _e[0], setIsModalOpen = _e[1];
+    var _f = useState(null), selectedBill = _f[0], setSelectedBill = _f[1];
+    var rowClick = function (bill) {
+        setSelectedBill(bill);
         setIsModalOpen(true);
-        navigate("/YourBonds/?bondAddress=".concat(bond.billAddress, "&bondChain=").concat(bond.chainId), { replace: true });
+        navigate("/YourBonds/?bondAddress=".concat(bill.address, "&bondChain=").concat(bill.bond.chainId), { replace: true });
     };
-    var fetchUserOwnedBillsDataAsync = function (chainId, account) { return __awaiter(void 0, void 0, void 0, function () {
-        var bonds, userOwnedBills_1, mapUserOwnedBills_1, userOwnedBillsData_1, ownedBillsData, userBillNftData_1, combinedData, error_2;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 3, , 4]);
-                    bonds = bondData.filter(function (bond) {
-                        return bond.billVersion !== BillVersion.FixedPrice &&
-                            (bond === null || bond === void 0 ? void 0 : bond.chainId) === chainId &&
-                            bond.type !== 'migration' &&
-                            bond.billAddress.toLowerCase() !== ACF_TO_ABOND.toLowerCase();
-                    });
-                    return [4 /*yield*/, fetchUserOwnedBills(chainId, account, bonds)];
-                case 1:
-                    userOwnedBills_1 = _a.sent();
-                    mapUserOwnedBills_1 = bonds.map(function (bill) {
-                        return userOwnedBills_1.filter(function (b) { return b.address.toLowerCase() === bill.billAddress.toLowerCase(); });
-                    });
-                    userOwnedBillsData_1 = bonds.map(function (bill, i) { return ({
-                        index: bill.index,
-                        userOwnedBills: mapUserOwnedBills_1[i],
-                    }); });
-                    ownedBillsData = mapUserOwnedBills_1.flatMap(function (bs) {
-                        return bs.map(function (b) {
-                            return { id: b.id, billNftAddress: b.billNftAddress, contractAddress: b.address };
-                        });
-                    });
-                    return [4 /*yield*/, fetchUserOwnedBillNftData(ownedBillsData, chainId, bonds)
-                        // Merge userBillNftData into userOwnedBillsData
-                    ];
-                case 2:
-                    userBillNftData_1 = _a.sent();
-                    combinedData = userOwnedBillsData_1.map(function (data) {
-                        var enrichedUserBills = data.userOwnedBills.map(function (bill) {
-                            var nftData = userBillNftData_1.find(function (nft) { return nft.id === parseInt(bill.id); });
-                            return __assign(__assign({}, bill), { nftData: nftData ? nftData : undefined });
-                        });
-                        return __assign(__assign({}, data), { userOwnedBills: enrichedUserBills });
-                    });
-                    console.log("combinedData");
-                    console.log(combinedData);
-                    console.log("combinedData");
-                    return [2 /*return*/, Promise.resolve(combinedData)];
-                case 3:
-                    error_2 = _a.sent();
-                    console.error('Error fetching user owned bills data:', error_2);
-                    return [2 /*return*/, Promise.reject(error_2)];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    var fetchUserOwnedBills = function (chainId, account, bonds) { return __awaiter(void 0, void 0, void 0, function () {
-        var billIdCalls, billIds, billsPendingRewardCall, billDataCalls, billVersions, billData, pendingRewardsCall, result, i, billDataPos, data;
-        var _a, _b, _c, _d, _e;
-        return __generator(this, function (_f) {
-            switch (_f.label) {
-                case 0:
-                    billIdCalls = bonds.map(function (b) { return ({
-                        address: b.billAddress,
-                        name: 'getBillIds',
-                        params: [account],
-                    }); });
-                    return [4 /*yield*/, multicall(chainId, billAbi, billIdCalls, true, 15)];
-                case 1:
-                    billIds = _f.sent();
-                    billsPendingRewardCall = [];
-                    billDataCalls = [];
-                    billVersions = [];
-                    billIds.forEach(function (idArray, index) {
-                        return idArray[0].forEach(function (id) {
-                            return id.gt(0) &&
-                                (billDataCalls.push({
-                                    address: bonds[index].billAddress,
-                                    name: bonds[index].billVersion !== BillVersion.V1 ? 'getBillInfo' : 'billInfo',
-                                    params: [id],
-                                    bond: bonds[index]
-                                }),
-                                    billDataCalls.push({ address: bonds[index].billAddress, name: 'billNft' }),
-                                    billsPendingRewardCall.push({
-                                        address: bonds[index].billAddress,
-                                        name: bonds[index].billVersion !== BillVersion.V1 ? 'claimablePayout' : 'pendingPayoutFor',
-                                        params: [id],
-                                        bond: bonds[index]
-                                    }),
-                                    billVersions.push(bonds[index].billVersion));
-                        });
-                    });
-                    return [4 /*yield*/, multicall(chainId, billAbi, billDataCalls, true, 150)];
-                case 2:
-                    billData = _f.sent();
-                    return [4 /*yield*/, multicall(chainId, billAbi, billsPendingRewardCall)];
-                case 3:
-                    pendingRewardsCall = _f.sent();
-                    result = [];
-                    for (i = 0; i < billsPendingRewardCall.length; i++) {
-                        billDataPos = i === 0 ? 0 : i * 2;
-                        data = billVersions[i] !== BillVersion.V1
-                            ? {
-                                address: billsPendingRewardCall[i].address,
-                                id: billsPendingRewardCall[i].params[0].toString(),
-                                payout: new BigNumber((_a = billData[billDataPos][0]) === null || _a === void 0 ? void 0 : _a.payout.toString())
-                                    .minus((_b = billData[billDataPos][0]) === null || _b === void 0 ? void 0 : _b.payoutClaimed.toString())
-                                    .toString(),
-                                billNftAddress: billData[billDataPos + 1][0].toString(),
-                                vesting: (_c = billData[billDataPos][0]) === null || _c === void 0 ? void 0 : _c.vesting.toString(),
-                                lastBlockTimestamp: (_d = billData[billDataPos][0]) === null || _d === void 0 ? void 0 : _d.lastClaimTimestamp.toString(),
-                                truePricePaid: (_e = billData[billDataPos][0]) === null || _e === void 0 ? void 0 : _e.truePricePaid.toString(),
-                                pendingRewards: pendingRewardsCall[i][0].toString(),
-                                bond: billsPendingRewardCall[i].bond
-                            }
-                            : {
-                                address: billsPendingRewardCall[i].address,
-                                id: billsPendingRewardCall[i].params[0].toString(),
-                                payout: billData[billDataPos][0].toString(),
-                                billNftAddress: billData[billDataPos + 1][0].toString(),
-                                vesting: billData[billDataPos][1].toString(),
-                                lastBlockTimestamp: billData[billDataPos][2].toString(),
-                                truePricePaid: billData[billDataPos][3].toString(),
-                                pendingRewards: pendingRewardsCall[i][0].toString(),
-                                bond: billsPendingRewardCall[i].bond
-                            };
-                        result.push(data);
-                    }
-                    return [2 /*return*/, result];
-            }
-        });
-    }); };
     var _g = useState([]), userOwnedBillsData = _g[0], setUserOwnedBillsData = _g[1];
     useEffect(function () {
         var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var results, error_3;
+            var results, error_2;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -266,14 +135,14 @@ var YourBonds = function (_a) {
                         _a.label = 1;
                     case 1:
                         _a.trys.push([1, 3, , 4]);
-                        return [4 /*yield*/, Promise.all(MAINNET_CHAINS.map(function (chain) { return fetchUserOwnedBillsDataAsync(chain, account); }))];
+                        return [4 /*yield*/, Promise.all(MAINNET_CHAINS.map(function (chain) { return fetchUserOwnedBillsDataAsync(chain, account, bondData); }))];
                     case 2:
                         results = _a.sent();
                         setUserOwnedBillsData(results);
                         return [3 /*break*/, 4];
                     case 3:
-                        error_3 = _a.sent();
-                        console.error('Error fetching user owned bills data:', error_3);
+                        error_2 = _a.sent();
+                        console.error('Error fetching user owned bills data:', error_2);
                         return [3 /*break*/, 4];
                     case 4: return [2 /*return*/];
                 }
@@ -314,7 +183,7 @@ var YourBonds = function (_a) {
                         });
                         return sortedBills.map(function (bill) {
                             var _a, _b;
-                            return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bill.bond); } }, { children: [_jsx(Flex, __assign({ className: "column column-tokens" }, { children: _jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: _jsx(TokenInfoAndName, { bill: bill.bond, vestEnds: "Ends in ".concat(getPendingVesting(bill.lastBlockTimestamp, bill.vesting)) }) })) })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsxs(Flex, __assign({ className: "column column-claimable" }, { children: [formatNumberSI(parseFloat(claimable(bill).toFixed(3)), 0), "($".concat((claimable(bill) * ((_a = parseFloat(earnTokenPrice(bill.bond))) !== null && _a !== void 0 ? _a : 0)).toFixed(2), ")")] })), _jsxs(Flex, __assign({ className: "column column-pending" }, { children: [formatNumberSI(parseFloat(totalPending(bill).toFixed(0)), 0), "($".concat((totalPending(bill) * ((_b = parseFloat(earnTokenPrice(bill.bond))) !== null && _b !== void 0 ? _b : 0)).toFixed(2), ")")] })), _jsx(Flex, __assign({ className: "column column-term" }, { children: "".concat(vestingTimeRemaining(bill).days, "d, ").concat(vestingTimeRemaining(bill).hours, "h, ").concat(vestingTimeRemaining(bill).minutes, "m") })), _jsx(Flex, __assign({ className: "column column-claimall" }, { children: _jsx(Flex, __assign({ className: "column-claimall button" }, { children: _jsx(Button, __assign({ disabled: !account, sx: {
+                            return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bill); } }, { children: [_jsx(Flex, __assign({ className: "column column-tokens" }, { children: _jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: _jsx(TokenInfoAndName, { bill: bill.bond, vestEnds: "Ends in ".concat(getPendingVesting(bill.lastBlockTimestamp, bill.vesting)) }) })) })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsxs(Flex, __assign({ className: "column column-claimable" }, { children: [formatNumberSI(parseFloat(claimable(bill).toFixed(3)), 0), "($".concat((claimable(bill) * ((_a = parseFloat(earnTokenPrice(bill.bond))) !== null && _a !== void 0 ? _a : 0)).toFixed(2), ")")] })), _jsxs(Flex, __assign({ className: "column column-pending" }, { children: [formatNumberSI(parseFloat(totalPending(bill).toFixed(0)), 0), "($".concat((totalPending(bill) * ((_b = parseFloat(earnTokenPrice(bill.bond))) !== null && _b !== void 0 ? _b : 0)).toFixed(2), ")")] })), _jsx(Flex, __assign({ className: "column column-term" }, { children: "".concat(vestingTimeRemaining(bill).days, "d, ").concat(vestingTimeRemaining(bill).hours, "h, ").concat(vestingTimeRemaining(bill).minutes, "m") })), _jsx(Flex, __assign({ className: "column column-claimall" }, { children: _jsx(Flex, __assign({ className: "column-claimall button" }, { children: _jsx(Button, __assign({ disabled: !account, sx: {
                                                             height: ['36px', '36px', '36px', '26px'],
                                                             lineHeight: '12px',
                                                             fontSize: '14px',

package/dist/components/YourBonds/fetchBillsUser.d.ts

@@ -1,5 +1,6 @@
-import { BondsDataResponse, CleanedBondsState, UserBill } from '../../types/bonds';
 import { ChainId } from '../../enum/apeswaplists';
+import { UserBill, UserOwnedBillsData } from '../../types/yourbonds';
+import { BondsDataResponse } from '../../types/bonds';
 /**
  * Fetches user-owned bill NFT data for a given set of owned bills data, chain ID, and bills.
  * @param ownedBillsData An array of objects containing the ID, bill NFT address, and contract address of the owned bills.
@@ -12,4 +13,5 @@ export declare const fetchUserOwnedBillNftData: (ownedBillsData: {
     billNftAddress: string;
     contractAddress: string;
 }[], chainId: ChainId, bills: BondsDataResponse[]) => Promise<any[]>;
-export declare const fetchUserOwnedBills: (chainId: ChainId, account: string, bills: CleanedBondsState[]) => Promise<UserBill[]>;
+export declare const fetchUserOwnedBillsDataAsync: (chainId: ChainId, account: string, bondData: BondsDataResponse[]) => Promise<UserOwnedBillsData[]>;
+export declare const fetchUserOwnedBills: (chainId: ChainId, account: string, bonds: BondsDataResponse[]) => Promise<UserBill[]>;

package/dist/components/YourBonds/fetchBillsUser.js

@@ -1,3 +1,14 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -39,6 +50,7 @@ import BigNumber from 'bignumber.js';
 import { getBillNftBatchData } from './getBillNftData';
 import multicall from '../../utils/multicall';
 import { BillVersion } from '../../enum/apeswaplists';
+import { ACF_TO_ABOND } from '../../config/constants/addresses';
 /**
  * Fetches user-owned bill NFT data for a given set of owned bills data, chain ID, and bills.
  * @param ownedBillsData An array of objects containing the ID, bill NFT address, and contract address of the owned bills.
@@ -97,14 +109,67 @@ export var fetchUserOwnedBillNftData = function (ownedBillsData, chainId, bills)
         }
     });
 }); };
-export var fetchUserOwnedBills = function (chainId, account, bills) { return __awaiter(void 0, void 0, void 0, function () {
+// MODIFIED FUNCTION FROM FRONTEND SPECIFICALLY FOR THE SDK
+export var fetchUserOwnedBillsDataAsync = function (chainId, account, bondData) { return __awaiter(void 0, void 0, void 0, function () {
+    var bonds, userOwnedBills_1, mapUserOwnedBills_1, userOwnedBillsData, ownedBillsData, userBillNftData_1, combinedData, error_1;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                _a.trys.push([0, 3, , 4]);
+                bonds = bondData.filter(function (bond) {
+                    return bond.billVersion !== BillVersion.FixedPrice &&
+                        (bond === null || bond === void 0 ? void 0 : bond.chainId) === chainId &&
+                        bond.type !== 'migration' &&
+                        bond.billAddress.toLowerCase() !== ACF_TO_ABOND.toLowerCase();
+                });
+                return [4 /*yield*/, fetchUserOwnedBills(chainId, account, bonds)];
+            case 1:
+                userOwnedBills_1 = _a.sent();
+                mapUserOwnedBills_1 = bonds.map(function (bill) {
+                    return userOwnedBills_1.filter(function (b) { return b.address.toLowerCase() === bill.billAddress.toLowerCase(); });
+                });
+                userOwnedBillsData = bonds.map(function (bill, i) { return ({
+                    index: bill.index,
+                    userOwnedBills: mapUserOwnedBills_1[i],
+                }); });
+                ownedBillsData = mapUserOwnedBills_1.flatMap(function (bs) {
+                    return bs.map(function (b) {
+                        return { id: b.id, billNftAddress: b.billNftAddress, contractAddress: b.address };
+                    });
+                });
+                return [4 /*yield*/, fetchUserOwnedBillNftData(ownedBillsData, chainId, bonds)
+                    // Merge userBillNftData into userOwnedBillsData
+                ];
+            case 2:
+                userBillNftData_1 = _a.sent();
+                combinedData = userOwnedBillsData.map(function (data) {
+                    var enrichedUserBills = data.userOwnedBills.map(function (bill) {
+                        var nftData = userBillNftData_1.find(function (nft) { return nft.id === parseInt(bill.id); });
+                        return __assign(__assign({}, bill), { nftData: nftData ? nftData : undefined });
+                    });
+                    return __assign(__assign({}, data), { userOwnedBills: enrichedUserBills });
+                });
+                console.log("combinedData");
+                console.log(combinedData);
+                console.log("combinedData");
+                return [2 /*return*/, Promise.resolve(combinedData)];
+            case 3:
+                error_1 = _a.sent();
+                console.error('Error fetching user owned bills data:', error_1);
+                return [2 /*return*/, Promise.reject(error_1)];
+            case 4: return [2 /*return*/];
+        }
+    });
+}); };
+// MODIFIED FUNCTION FROM FRONTEND SPECIFICALLY FOR THE SDK
+export var fetchUserOwnedBills = function (chainId, account, bonds) { return __awaiter(void 0, void 0, void 0, function () {
     var billIdCalls, billIds, billsPendingRewardCall, billDataCalls, billVersions, billData, pendingRewardsCall, result, i, billDataPos, data;
     var _a, _b, _c, _d, _e;
     return __generator(this, function (_f) {
         switch (_f.label) {
             case 0:
-                billIdCalls = bills.map(function (b) { return ({
-                    address: b.contractAddress,
+                billIdCalls = bonds.map(function (b) { return ({
+                    address: b.billAddress,
                     name: 'getBillIds',
                     params: [account],
                 }); });
@@ -118,17 +183,19 @@ export var fetchUserOwnedBills = function (chainId, account, bills) { return __a
                     return idArray[0].forEach(function (id) {
                         return id.gt(0) &&
                             (billDataCalls.push({
-                                address: bills[index].contractAddress,
-                                name: bills[index].billVersion !== BillVersion.V1 ? 'getBillInfo' : 'billInfo',
+                                address: bonds[index].billAddress,
+                                name: bonds[index].billVersion !== BillVersion.V1 ? 'getBillInfo' : 'billInfo',
                                 params: [id],
+                                bond: bonds[index]
                             }),
-                                billDataCalls.push({ address: bills[index].contractAddress, name: 'billNft' }),
+                                billDataCalls.push({ address: bonds[index].billAddress, name: 'billNft' }),
                                 billsPendingRewardCall.push({
-                                    address: bills[index].contractAddress,
-                                    name: bills[index].billVersion !== BillVersion.V1 ? 'claimablePayout' : 'pendingPayoutFor',
+                                    address: bonds[index].billAddress,
+                                    name: bonds[index].billVersion !== BillVersion.V1 ? 'claimablePayout' : 'pendingPayoutFor',
                                     params: [id],
+                                    bond: bonds[index]
                                 }),
-                                billVersions.push(bills[index].billVersion));
+                                billVersions.push(bonds[index].billVersion));
                     });
                 });
                 return [4 /*yield*/, multicall(chainId, billAbi, billDataCalls, true, 150)];
@@ -152,6 +219,7 @@ export var fetchUserOwnedBills = function (chainId, account, bills) { return __a
                             lastBlockTimestamp: (_d = billData[billDataPos][0]) === null || _d === void 0 ? void 0 : _d.lastClaimTimestamp.toString(),
                             truePricePaid: (_e = billData[billDataPos][0]) === null || _e === void 0 ? void 0 : _e.truePricePaid.toString(),
                             pendingRewards: pendingRewardsCall[i][0].toString(),
+                            bond: billsPendingRewardCall[i].bond
                         }
                         : {
                             address: billsPendingRewardCall[i].address,
@@ -162,6 +230,7 @@ export var fetchUserOwnedBills = function (chainId, account, bills) { return __a
                             lastBlockTimestamp: billData[billDataPos][2].toString(),
                             truePricePaid: billData[billDataPos][3].toString(),
                             pendingRewards: pendingRewardsCall[i][0].toString(),
+                            bond: billsPendingRewardCall[i].bond
                         };
                     result.push(data);
                 }

package/dist/components/YourBondsModal/YourBondsModal.js

@@ -57,16 +57,12 @@ import { BigNumber } from 'bignumber.js';
 import { getFirstNonZeroDigits } from '../../utils/roundNumber';
 import { TooltipBubble, Button, Svg, ListTag } from '../uikit-sdk';
 import { UserBillTooltipText } from '../../enum/tooltips';
-import billAbi from '../../config/abi/bond.json';
 import TokenImage from '../uikit-sdk/TokenImage';
 import { getBalanceNumber } from '../../utils/getBalanceNumber';
-import multicall from '../../utils/multicall';
-import { BillVersion } from '../../enum/apeswaplists';
-import { ACF_TO_ABOND } from '../../config/constants/addresses';
 import { MAINNET_CHAINS } from '../../config/constants/chains';
 import { getPendingVesting } from '../../hooks/usePendingVesting';
 import { formatNumberSI } from '../../utils/formatNumber';
-import { fetchUserOwnedBillNftData } from '../YourBonds/fetchBillsUser';
+import { fetchUserOwnedBillsDataAsync } from '../YourBonds/fetchBillsUser';
 var YourBondsModal = function (_a) {
     var isOpen = _a.isOpen, onClose = _a.onClose, bondAddress = _a.bondAddress;
     if (!isOpen)
@@ -82,136 +78,9 @@ var YourBondsModal = function (_a) {
         });
     }, [bondAddress]);
     var _d = useState([]), userOwnedBillsData = _d[0], setUserOwnedBillsData = _d[1];
-    var fetchUserOwnedBillsDataAsync = function (chainId, account) { return __awaiter(void 0, void 0, void 0, function () {
-        var bonds, userOwnedBills_1, mapUserOwnedBills_1, userOwnedBillsData_1, ownedBillsData, userBillNftData_1, combinedData, error_1;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 3, , 4]);
-                    bonds = bondData.filter(function (bond) {
-                        return bond.billVersion !== BillVersion.FixedPrice &&
-                            (bond === null || bond === void 0 ? void 0 : bond.chainId) === chainId &&
-                            bond.type !== 'migration' &&
-                            bond.billAddress.toLowerCase() !== ACF_TO_ABOND.toLowerCase();
-                    });
-                    return [4 /*yield*/, fetchUserOwnedBills(chainId, account, bonds)];
-                case 1:
-                    userOwnedBills_1 = _a.sent();
-                    mapUserOwnedBills_1 = bonds.map(function (bill) {
-                        return userOwnedBills_1.filter(function (b) { return b.address.toLowerCase() === bill.billAddress.toLowerCase(); });
-                    });
-                    userOwnedBillsData_1 = bonds.map(function (bill, i) { return ({
-                        index: bill.index,
-                        userOwnedBills: mapUserOwnedBills_1[i],
-                    }); });
-                    ownedBillsData = mapUserOwnedBills_1.flatMap(function (bs) {
-                        return bs.map(function (b) {
-                            return { id: b.id, billNftAddress: b.billNftAddress, contractAddress: b.address };
-                        });
-                    });
-                    return [4 /*yield*/, fetchUserOwnedBillNftData(ownedBillsData, chainId, bonds)
-                        // Merge userBillNftData into userOwnedBillsData
-                    ];
-                case 2:
-                    userBillNftData_1 = _a.sent();
-                    combinedData = userOwnedBillsData_1.map(function (data) {
-                        var enrichedUserBills = data.userOwnedBills.map(function (bill) {
-                            var nftData = userBillNftData_1.find(function (nft) { return nft.id === parseInt(bill.id); });
-                            return __assign(__assign({}, bill), { nftData: nftData ? nftData : undefined });
-                        });
-                        return __assign(__assign({}, data), { userOwnedBills: enrichedUserBills });
-                    });
-                    console.log("combinedData");
-                    console.log(combinedData);
-                    console.log("combinedData");
-                    return [2 /*return*/, Promise.resolve(combinedData)];
-                case 3:
-                    error_1 = _a.sent();
-                    console.error('Error fetching user owned bills data:', error_1);
-                    return [2 /*return*/, Promise.reject(error_1)];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    var fetchUserOwnedBills = function (chainId, account, bonds) { return __awaiter(void 0, void 0, void 0, function () {
-        var billIdCalls, billIds, billsPendingRewardCall, billDataCalls, billVersions, billData, pendingRewardsCall, result, i, billDataPos, data;
-        var _a, _b, _c, _d, _e;
-        return __generator(this, function (_f) {
-            switch (_f.label) {
-                case 0:
-                    billIdCalls = bonds.map(function (b) { return ({
-                        address: b.billAddress,
-                        name: 'getBillIds',
-                        params: [account],
-                    }); });
-                    return [4 /*yield*/, multicall(chainId, billAbi, billIdCalls, true, 15)];
-                case 1:
-                    billIds = _f.sent();
-                    billsPendingRewardCall = [];
-                    billDataCalls = [];
-                    billVersions = [];
-                    billIds.forEach(function (idArray, index) {
-                        return idArray[0].forEach(function (id) {
-                            return id.gt(0) &&
-                                (billDataCalls.push({
-                                    address: bonds[index].billAddress,
-                                    name: bonds[index].billVersion !== BillVersion.V1 ? 'getBillInfo' : 'billInfo',
-                                    params: [id],
-                                    bond: bonds[index]
-                                }),
-                                    billDataCalls.push({ address: bonds[index].billAddress, name: 'billNft' }),
-                                    billsPendingRewardCall.push({
-                                        address: bonds[index].billAddress,
-                                        name: bonds[index].billVersion !== BillVersion.V1 ? 'claimablePayout' : 'pendingPayoutFor',
-                                        params: [id],
-                                        bond: bonds[index]
-                                    }),
-                                    billVersions.push(bonds[index].billVersion));
-                        });
-                    });
-                    return [4 /*yield*/, multicall(chainId, billAbi, billDataCalls, true, 150)];
-                case 2:
-                    billData = _f.sent();
-                    return [4 /*yield*/, multicall(chainId, billAbi, billsPendingRewardCall)];
-                case 3:
-                    pendingRewardsCall = _f.sent();
-                    result = [];
-                    for (i = 0; i < billsPendingRewardCall.length; i++) {
-                        billDataPos = i === 0 ? 0 : i * 2;
-                        data = billVersions[i] !== BillVersion.V1
-                            ? {
-                                address: billsPendingRewardCall[i].address,
-                                id: billsPendingRewardCall[i].params[0].toString(),
-                                payout: new BigNumber((_a = billData[billDataPos][0]) === null || _a === void 0 ? void 0 : _a.payout.toString())
-                                    .minus((_b = billData[billDataPos][0]) === null || _b === void 0 ? void 0 : _b.payoutClaimed.toString())
-                                    .toString(),
-                                billNftAddress: billData[billDataPos + 1][0].toString(),
-                                vesting: (_c = billData[billDataPos][0]) === null || _c === void 0 ? void 0 : _c.vesting.toString(),
-                                lastBlockTimestamp: (_d = billData[billDataPos][0]) === null || _d === void 0 ? void 0 : _d.lastClaimTimestamp.toString(),
-                                truePricePaid: (_e = billData[billDataPos][0]) === null || _e === void 0 ? void 0 : _e.truePricePaid.toString(),
-                                pendingRewards: pendingRewardsCall[i][0].toString(),
-                                bond: billsPendingRewardCall[i].bond
-                            }
-                            : {
-                                address: billsPendingRewardCall[i].address,
-                                id: billsPendingRewardCall[i].params[0].toString(),
-                                payout: billData[billDataPos][0].toString(),
-                                billNftAddress: billData[billDataPos + 1][0].toString(),
-                                vesting: billData[billDataPos][1].toString(),
-                                lastBlockTimestamp: billData[billDataPos][2].toString(),
-                                truePricePaid: billData[billDataPos][3].toString(),
-                                pendingRewards: pendingRewardsCall[i][0].toString(),
-                                bond: billsPendingRewardCall[i].bond
-                            };
-                        result.push(data);
-                    }
-                    return [2 /*return*/, result];
-            }
-        });
-    }); };
     useEffect(function () {
         var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
-            var results, error_2;
+            var results, error_1;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -219,14 +88,14 @@ var YourBondsModal = function (_a) {
                         _a.label = 1;
                     case 1:
                         _a.trys.push([1, 3, , 4]);
-                        return [4 /*yield*/, Promise.all(MAINNET_CHAINS.map(function (chain) { return fetchUserOwnedBillsDataAsync(chain, account); }))];
+                        return [4 /*yield*/, Promise.all(MAINNET_CHAINS.map(function (chain) { return fetchUserOwnedBillsDataAsync(chain, account, bondData); }))];
                     case 2:
                         results = _a.sent();
                         setUserOwnedBillsData(results);
                         return [3 /*break*/, 4];
                     case 3:
-                        error_2 = _a.sent();
-                        console.error('Error fetching user owned bills data:', error_2);
+                        error_1 = _a.sent();
+                        console.error('Error fetching user owned bills data:', error_1);
                         return [3 /*break*/, 4];
                     case 4: return [2 /*return*/];
                 }
@@ -251,7 +120,7 @@ var YourBondsModal = function (_a) {
             var userBill = data.userOwnedBills.find(function (bill) { return bill.bond.billAddress.toLowerCase() === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); });
             console.log("USER BILL LOG");
             console.log(userBill);
-            return userBill ? (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "yourbondsmodal backdrop" }, { children: _jsxs(Flex, __assign({ className: "yourbondsmodal content" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "yourbondsmodal table-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal bondimage" }, { children: _jsx("img", { src: (_a = userBill.nftData) === null || _a === void 0 ? void 0 : _a.data.image }) })), _jsxs(Flex, __assign({ className: "yourbondsmodal yourbondinfo" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsx(TokenImage, { symbol: (_b = userBill.bond.showcaseTokenName) !== null && _b !== void 0 ? _b : userBill.bond.payoutTokenName, size: 40 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: (_c = userBill.bond) === null || _c === void 0 ? void 0 : _c.showcaseTokenName })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_e = (_d = userBill.bond) === null || _d === void 0 ? void 0 : _d.tags) === null || _e === void 0 ? void 0 : _e[0], variant: ((_g = (_f = userBill.bond) === null || _f === void 0 ? void 0 : _f.tags) === null || _g === void 0 ? void 0 : _g[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo blocks-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block row-traits" }, { children: _jsx(Flex, __assign({ className: "yourbondinfo-block header" }, { children: "Traits" })) })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-vested" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Fully Vested", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, __assign({ className: "block-info text" }, { children: getPendingVesting(userBill.lastBlockTimestamp, userBill.vesting) }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-pending" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Pending", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_h = userBill.bond.showcaseTokenName) !== null && _h !== void 0 ? _h : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4), "($".concat((totalPending(userBill) * ((_j = parseFloat(earnTokenPrice(userBill.bond))) !== null && _j !== void 0 ? _j : 0)).toFixed(2), ")")] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-claimable" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Claimable", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_k = userBill.bond.showcaseTokenName) !== null && _k !== void 0 ? _k : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4), "($".concat((claimable(userBill) * ((_l = parseFloat(earnTokenPrice(userBill.bond))) !== null && _l !== void 0 ? _l : 0)).toFixed(2), ")")] }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container claim" }, { children: _jsx(Button, { children: "CLAIM" }) })), _jsx(Flex, __assign({ className: "button-container transfer" }, { children: _jsx(Button, { children: "TRANSFER" }) }))] }))] }))] }))] })) })) }, userBill.bond.billAddress)) : null;
+            return userBill ? (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "yourbondsmodal backdrop" }, { children: _jsxs(Flex, __assign({ className: "yourbondsmodal content" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "yourbondsmodal table-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal bondimage" }, { children: _jsx("img", { src: (_a = userBill.nftData) === null || _a === void 0 ? void 0 : _a.data.image }) })), _jsxs(Flex, __assign({ className: "yourbondsmodal yourbondinfo" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsx(TokenImage, { symbol: (_b = userBill.bond.showcaseTokenName) !== null && _b !== void 0 ? _b : userBill.bond.payoutTokenName, size: 40 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: (_c = userBill.bond) === null || _c === void 0 ? void 0 : _c.showcaseTokenName })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_e = (_d = userBill.bond) === null || _d === void 0 ? void 0 : _d.tags) === null || _e === void 0 ? void 0 : _e[0], variant: ((_g = (_f = userBill.bond) === null || _f === void 0 ? void 0 : _f.tags) === null || _g === void 0 ? void 0 : _g[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) })), "#", userBill.id] })), _jsxs(Flex, __assign({ className: "yourbondinfo blocks-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block row-traits" }, { children: _jsx(Flex, __assign({ className: "yourbondinfo-block header" }, { children: "Traits" })) })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-vested" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Fully Vested", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, __assign({ className: "block-info text" }, { children: getPendingVesting(userBill.lastBlockTimestamp, userBill.vesting) }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-pending" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Pending", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_h = userBill.bond.showcaseTokenName) !== null && _h !== void 0 ? _h : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4), "($".concat((totalPending(userBill) * ((_j = parseFloat(earnTokenPrice(userBill.bond))) !== null && _j !== void 0 ? _j : 0)).toFixed(2), ")")] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-claimable" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Claimable", _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_k = userBill.bond.showcaseTokenName) !== null && _k !== void 0 ? _k : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4), "($".concat((claimable(userBill) * ((_l = parseFloat(earnTokenPrice(userBill.bond))) !== null && _l !== void 0 ? _l : 0)).toFixed(2), ")")] }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container claim" }, { children: _jsx(Button, { children: "CLAIM" }) })), _jsx(Flex, __assign({ className: "button-container transfer" }, { children: _jsx(Button, { children: "TRANSFER" }) }))] }))] }))] }))] })) })) }, userBill.bond.billAddress)) : null;
         }) })));
 };
 export default YourBondsModal;

package/dist/scss/YourBondsModal.scss

@@ -10,6 +10,7 @@
     align-items: center;
     z-index: 1000;
     overflow: auto;
+    padding: 50px;
 }
 
 .yourbondsmodal.content {
@@ -20,8 +21,8 @@
     padding: 10px;
     border-radius: 10px;
     z-index: 1001;
-    max-width: 1500px;
-    min-width: 1200px;
+    max-width: 1200px;
+    min-width: 1000px;
     overflow: auto;
 }
 
@@ -154,7 +155,7 @@
     flex-direction: row;
     height: 25px;
     padding-left: 10px;
-    width: 450px;
+    width: 100%;
     margin-bottom: 10px;
     align-items: center;
     justify-content: start;
@@ -163,7 +164,7 @@
 .yourbondinfo-block.row-vested {
     flex-direction: row;
     height: 50px;
-    width: 450px;
+    width: 100%;
     margin-bottom: 10px;
     padding-left: 10px;
     padding-right: 10px;
@@ -174,7 +175,7 @@
 .yourbondinfo-block.row-pending {
     flex-direction: row;
     height: 50px;
-    width: 450px;
+    width: 100%;
     margin-bottom: 10px;
     padding-left: 10px;
     padding-right: 10px;
@@ -185,7 +186,7 @@
 .yourbondinfo-block.row-claimable {
     flex-direction: row;
     height: 50px;
-    width: 450px;
+    width: 100%;
     margin-bottom: 10px;
     padding-left: 10px;
     padding-right: 10px;

package/dist/types/bonds.d.ts

@@ -1,4 +1,4 @@
-import { BillsConfig, BillVersion, Token, ChainId } from '../enum/apeswaplists';
+import { ChainId } from '../enum/apeswaplists';
 export interface BondsDataResponse {
     index: number;
     cmcId?: number;
@@ -38,94 +38,6 @@ export interface BondsDataResponse {
     billVersion?: string;
     earnToken?: EarnToken;
 }
-export interface UserBillNft {
-    image: string;
-    tokenId: string;
-    attributes: {
-        trait_type: string;
-        value: string;
-    }[];
-}
-export interface UserBill {
-    address: string;
-    id: string;
-    vesting: string;
-    payout: string;
-    totalPayout?: string;
-    truePricePaid: string;
-    lastBlockTimestamp: string;
-    pendingRewards: string;
-    billNftAddress: string;
-    nftData?: UserBillNft;
-}
-export interface Bills extends BillsConfig {
-    price?: string;
-    priceUsd?: string;
-    vestingTime?: string;
-    discount?: string;
-    currentDebt?: string;
-    currentFee?: string;
-    debtDecay?: string;
-    debtRatio?: string;
-    totalDebt?: string;
-    totalPayoutGiven?: string;
-    totalPrincipalBilled?: string;
-    controlVariable?: string;
-    minimumPrice?: string;
-    maxPayout?: string;
-    maxDebt?: string;
-    lpPriceUsd?: number;
-    earnTokenPrice?: number;
-    billNftAddress?: string;
-    userOwnedBillsData?: UserBill[];
-    userOwnedBillsNftData?: UserBillNft[];
-    maxTotalPayout?: string;
-    lpPrice?: number;
-    maxPayoutTokens?: string;
-    startVestingTimestamp?: string;
-    totalBonusRewards?: string;
-    featuredURLS?: string[];
-    partnersURLS?: string[];
-}
-export interface CleanedBondsState {
-    index: number;
-    cmcId: number | null;
-    chainId: ChainId;
-    vestingTerm?: number;
-    principalTokenName: string;
-    principalToken: string;
-    principalTokenDecimals: number;
-    payoutTokenName: string;
-    payoutToken: string;
-    payoutTokenDecimals: number;
-    soldOut?: boolean;
-    tags?: string[];
-    contractAddress: string;
-    billNftAddress: string;
-    inactive?: boolean;
-    showcaseTokenName?: string;
-    twitter?: string;
-    projectLink?: string;
-    audit?: string;
-    shortDescription?: string;
-    fullDescription?: string;
-    lpToken?: Token;
-    billType?: string;
-    billVersion?: BillVersion;
-    featuredURLS?: string[];
-    partnersURLS?: string[];
-    discount?: number;
-    principalTokenPrice?: string;
-    payoutTokenPrice?: string;
-    tokensRemaining?: string;
-    maxTotalPayout?: string;
-    trueBillPrice?: string;
-    maxPayout?: string;
-    totalPayoutGiven?: string;
-    isHotBond?: boolean;
-    userOwnedBillsData?: UserBill[];
-    userOwnedBillsNftData?: UserBillNft[];
-}
 export interface EarnToken {
     symbol: string;
     address: {

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "1.0.360",
+  "version": "1.0.362",
   "main": "dist/index.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",