@ape.swap/bonds-sdk 3.0.29 → 3.0.31-test

package/dist/config/constants/queryKeys.d.ts

@@ -35,4 +35,5 @@ export declare const QUERY_KEYS: {
     POP_UPS: string;
     GEO_FENCING: string;
     TIER_PROOF_SIG: string;
+    ACTIVE_VIEW: string;
 };

package/dist/main.js

@@ -18808,7 +18808,6 @@ const TokenImage = ({ symbol, symbol2, size, chain, }) => {
 
 const QUERY_KEYS = {
     TIERS: 'tiers',
-    AB_TEST_VALUE: 'ABTestValue',
     // used values on SDK
     BOND_API_STATS: 'ApeBond-SDK-bondApiStats',
     SDK_CONFIG: 'ApeBond-SDK-sdkConfig',
@@ -18830,6 +18829,7 @@ const QUERY_KEYS = {
     POP_UPS: 'ApeBond-SDK-popUps',
     GEO_FENCING: 'ApeBond-SDK-geoFencing',
     TIER_PROOF_SIG: 'ApeBond-SDK-tierProofSig',
+    ACTIVE_VIEW: 'ApeBond-SDK-activeView',
 };
 
 function useCookie(key, defaultValue) {
@@ -18989,7 +18989,8 @@ const formatNumber$3 = (number, minPrecision = 2, maxPrecision = 2) => {
     return number.toLocaleString('en-US', options);
 };
 // Formats a number with SI (International System of Units) sufixes
-const formatNumberSI = (number, digits = 2) => {
+const formatNumberSI = (num, digits = 2) => {
+    const number = typeof num === 'string' ? parseFloat(num) : num;
     const lookupSI = [
         { value: 1, symbol: '' },
         { value: 1e6, symbol: 'M' },
@@ -76438,7 +76439,7 @@ const BondCards = ({ bondData }) => {
                         borderBottomRightRadius: 'normal',
                         borderBottomLeftRadius: 'normal',
                     },
-                }, children: [jsxs("div", { className: "bond-card-title", children: ["Max Buy", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.MaxBuy((_b = bondData === null || bondData === void 0 ? void 0 : bondData.earnToken) === null || _b === void 0 ? void 0 : _b.symbol) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2("div", { className: "bond-card-tooltip", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), jsxs("div", { className: "bond-card-content", children: [jsx$2("div", { style: { paddingRight: '3px' }, children: jsx$2(TokenImage, { symbol: (_c = bondData.showcaseTokenName) !== null && _c !== void 0 ? _c : bondData.earnToken.symbol, size: 20 }) }), formatNumberSI(maxBuy(bondData).toNumber(), 0)] })] })] }));
+                }, children: [jsxs("div", { className: "bond-card-title", children: ["Max Buy", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.MaxBuy((_b = bondData === null || bondData === void 0 ? void 0 : bondData.earnToken) === null || _b === void 0 ? void 0 : _b.symbol) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2("div", { className: "bond-card-tooltip", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), jsxs("div", { className: "bond-card-content", children: [jsx$2("div", { style: { paddingRight: '3px' }, children: jsx$2(TokenImage, { symbol: (_c = bondData.showcaseTokenName) !== null && _c !== void 0 ? _c : bondData.earnToken.symbol, size: 20 }) }), formatNumberSI(maxBuy(bondData).toFixed(0), 2)] })] })] }));
 };
 
 const Estimations = ({ depositAmount, bondData, youSpendString, isZap, fetchingZapQuote, zapError, }) => {
@@ -76475,32 +76476,9 @@ const Estimations = ({ depositAmount, bondData, youSpendString, isZap, fetchingZ
                         } }), jsxs(Flex, { className: "row-container premium", sx: { zIndex: 1 }, children: [jsx$2("img", { src: `/images/launch/${tierName === null || tierName === void 0 ? void 0 : tierName.toLowerCase()}.png`, alt: "minTier", style: { width: '21px', height: '21px', marginRight: '3px', zIndex: 1 } }), jsx$2(Flex, { sx: { color: 'success', mr: '3px', fontWeight: 700 }, children: boostMap[userTier] }), "Boost:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsx$2(Flex, { children: TooltipText.Boost }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, 0%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: `row-container premium-val premium-positive`, children: ["$ ", formatUSDNumber(boostAmount.toString())] }))] })), !!bondData.feeInPayout && (jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container premium", children: ["Fee:", jsx$2(TooltipBubble, { className: "tooltip-bubble", body: jsxs(Flex, { children: ["This is the platform fee (", bondData.feeInPayout, "%)."] }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: jsx$2(Flex, { className: "row-container premium-icon", children: jsx$2(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: `row-container premium-val`, children: ["$ ", formatUSDNumber(feeUSD.toString())] }))] })), jsxs(Flex, { className: "text-container row", children: [jsxs(Flex, { className: "row-container get", children: ["You Get (over ", vestingTime(((_c = bondData === null || bondData === void 0 ? void 0 : bondData.vestingTerm) !== null && _c !== void 0 ? _c : 0) - ((_d = bondData.vestingCliff) !== null && _d !== void 0 ? _d : 0)).days, " days):"] }), isZap && fetchingZapQuote ? (jsx$2(Dots, {})) : isZap && zapError ? ('-') : (jsxs(Flex, { className: "row-container get-val", children: [formatNumber$1(estimatedOutputAmount.toString()), " ", bondData === null || bondData === void 0 ? void 0 : bondData.showcaseTokenName, " = $", ' ', formatUSDNumber(estimatedOutputUSD.toString())] }))] })] }));
 };
 
-var ABTestKeys;
-(function (ABTestKeys) {
-    ABTestKeys["BOND_DESCRIPTION"] = "bondDescription";
-})(ABTestKeys || (ABTestKeys = {}));
-function useABTesting({ key, defaultValue = (Math.random() < 0.5).toString(), }) {
-    const { cookie, updateCookie } = useCookie(QUERY_KEYS.AB_TEST_VALUE, null);
-    let abTestValue = '';
-    let parseCookie = null;
-    if (cookie === null || cookie === undefined || cookie[key] === undefined) {
-        parseCookie = Object.assign(Object.assign({}, cookie), { [key]: defaultValue.toString() });
-        abTestValue = defaultValue.toString();
-        updateCookie(parseCookie);
-    }
-    if (cookie) {
-        parseCookie = cookie;
-        if (parseCookie && parseCookie[key]) {
-            abTestValue = parseCookie[key].toString();
-        }
-    }
-    return { abTestValue };
-}
-
 const ProjectDescription = ({ description, isProjectView }) => {
     const [isOpen, setIsOpen] = useState(false);
-    const { abTestValue } = useABTesting({ key: ABTestKeys.BOND_DESCRIPTION });
-    return (jsx$2(Flex, { className: "description-container", children: (abTestValue === 'true' || isProjectView) && (jsxs(Fragment$1, { children: [jsxs(Flex, { sx: { display: ['flex', 'flex', 'flex', 'none'], flexDirection: 'column' }, children: [jsx$2(Text, { sx: {
+    return (jsx$2(Flex, { className: "description-container", children: isProjectView && (jsxs(Fragment$1, { children: [jsxs(Flex, { sx: { display: ['flex', 'flex', 'flex', 'none'], flexDirection: 'column' }, children: [jsx$2(Text, { sx: {
                                 fontSize: ['12px', '12px', '12px', '14px'],
                                 mt: '10px',
                                 lineHeight: ['18px', '18px', '18px', '21px'],
@@ -76670,9 +76648,7 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
     const sendReferenceId = useSendReferenceId();
     const { data: userPoints } = useTierPoints();
     const bondData = bonds === null || bonds === void 0 ? void 0 : bonds.find((bond) => { var _a; return ((_a = bond === null || bond === void 0 ? void 0 : bond.billAddress) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); });
-    const { abTestValue } = useABTesting({ key: ABTestKeys.BOND_DESCRIPTION });
-    const reason = abTestValue === 'true' ? 'bondDescription' : 'noBondDescription';
-    const isGoldRush = 'billArt' in bondData ? bondData.billArt.collection === types.BillArtCollection.GoldenTicket_Collection1 : false;
+    const isMobile = useIsMobile();
     // Tier Gating
     const userTier = getUserTier(userPoints !== null && userPoints !== void 0 ? userPoints : '0');
     const minTier = (bondData === null || bondData === void 0 ? void 0 : bondData.minTier) !== undefined ? bondData.minTier : null;
@@ -76684,7 +76660,6 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
     const [buyTxHash, setBuyTxHash] = useState();
     const [inputValue, setInputValue] = useState('');
     const [inputTokenString, setInputTokenString] = useState((_b = (_a = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _a === void 0 ? void 0 : _a.address) === null || _b === void 0 ? void 0 : _b[bondData.chainId]);
-    const zapEnabled = supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId);
     // On-chain Data
     const inputToken = useTokenFromZapList(inputTokenString, bondData === null || bondData === void 0 ? void 0 : bondData.chainId, bondData === null || bondData === void 0 ? void 0 : bondData.lpToken);
     const isZap = (inputTokenString === null || inputTokenString === void 0 ? void 0 : inputTokenString.toLowerCase()) !== ((_e = (_d = (_c = bondData === null || bondData === void 0 ? void 0 : bondData.lpToken) === null || _c === void 0 ? void 0 : _c.address) === null || _d === void 0 ? void 0 : _d[bondData === null || bondData === void 0 ? void 0 : bondData.chainId]) === null || _e === void 0 ? void 0 : _e.toLowerCase());
@@ -76696,6 +76671,11 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
     const depositAmount = isZap ? zapDepositAmount : inputValue;
     const youSpendString = `${formatNumber$1(inputValue)} ${getSymbol(inputToken, bondData === null || bondData === void 0 ? void 0 : bondData.chainId)} = 
                   $${formatUSDNumber((parseFloat(inputValue) * ((_g = inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price) !== null && _g !== void 0 ? _g : 0)).toString())}`;
+    // Validations
+    const isGoldRush = bondData.billArt.collection === types.BillArtCollection.GoldenTicket_Collection1;
+    const zapEnabled = supportedByLIFI.includes(bondData === null || bondData === void 0 ? void 0 : bondData.chainId);
+    const exceedsMaxBuy = maxBuy(bondData).lt(getPayoutAmount(bondData, depositAmount, userPoints !== null && userPoints !== void 0 ? userPoints : '0'));
+    const exceedsBalance = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0').lt(inputValue);
     // Loading State
     const [loadingTx, setLoadingTx] = useState(false);
     const { addToastError } = usePopups();
@@ -76762,7 +76742,7 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
             });
             if (hash) {
                 setBuyTxHash(hash);
-                yield sendReferenceId(billAddress, userChainId, hash, isProjectView ? undefined : reason);
+                yield sendReferenceId(billAddress, userChainId, hash);
                 handlePurchasedBond === null || handlePurchasedBond === void 0 ? void 0 : handlePurchasedBond(hash);
                 track({
                     event: 'bond',
@@ -76809,7 +76789,7 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
                 });
                 if (hash) {
                     setBuyTxHash(hash);
-                    yield sendReferenceId((_d = bondData === null || bondData === void 0 ? void 0 : bondData.billAddress) !== null && _d !== void 0 ? _d : '', userChainId, hash, reason);
+                    yield sendReferenceId((_d = bondData === null || bondData === void 0 ? void 0 : bondData.billAddress) !== null && _d !== void 0 ? _d : '', userChainId, hash);
                     handlePurchasedBond === null || handlePurchasedBond === void 0 ? void 0 : handlePurchasedBond(hash);
                     track({
                         event: 'zap',
@@ -76908,18 +76888,18 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
             console.log('change to native');
         }
     }, [inputCurrencyBalance]);
-    return bondData ? (jsxs(Flex, { className: `modal-content ${isGoldRush ? 'gold-rush' : ''}`, children: [jsx$2("div", { className: "gold-ribbon" }), jsxs(Flex, { className: "modaltable-container", children: [jsx$2(BondModalHeader, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }), jsx$2(ProjectDescription, { description: bondData.shortDescription, isProjectView: true }), jsx$2(Flex, { sx: { width: '100%', display: isProjectView ? ['flex', 'flex', 'flex', 'none'] : 'flex' }, children: jsx$2(BondCards, { bondData: bondData }) }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: zapEnabled, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, inputDisabled: isUserRestricted }), SDKConfig.useTiers && jsx$2(GetUpToComponent, { bond: bondData, depositAmount: depositAmount }), (bondData === null || bondData === void 0 ? void 0 : bondData.warningCard) && (jsx$2(Flex, { sx: {
+    return bondData ? (jsxs(Flex, { className: `modal-content ${isGoldRush ? 'gold-rush' : ''}`, children: [!isProjectView && jsx$2("div", { className: "gold-ribbon" }), jsxs(Flex, { className: "modaltable-container", children: [jsx$2(BondModalHeader, { bondData: bondData, onDismiss: onDismiss, showProjectInfoButton: (SDKConfig === null || SDKConfig === void 0 ? void 0 : SDKConfig.referenceId) === 'apebond' }), jsx$2(ProjectDescription, { description: bondData.shortDescription, isProjectView: true }), jsx$2(Flex, { sx: { width: '100%', display: isProjectView ? ['flex', 'flex', 'flex', 'none'] : 'flex' }, children: jsx$2(BondCards, { bondData: bondData }) }), jsx$2(Estimations, { depositAmount: depositAmount, bondData: bondData, youSpendString: youSpendString, isZap: isZap, fetchingZapQuote: fetchingZapQuote, zapError: zapError }), jsx$2(TokenSelectorPanel, { typedValue: inputValue, setTypedValue: setInputValue, selectedToken: inputToken, handleValueBtn: () => { var _a; return setInputValue((_a = new BigNumber$1(inputCurrencyBalance !== null && inputCurrencyBalance !== void 0 ? inputCurrencyBalance : '0')) === null || _a === void 0 ? void 0 : _a.toString()); }, handleCurrencySelect: handleCurrencySelect, chainId: bondData === null || bondData === void 0 ? void 0 : bondData.chainId, enableZap: zapEnabled, bondPrincipalToken: bondData === null || bondData === void 0 ? void 0 : bondData.lpToken, tokenBalance: inputCurrencyBalance, selectedTokenPrice: inputTokenPrice === null || inputTokenPrice === void 0 ? void 0 : inputTokenPrice.price, inputDisabled: isUserRestricted }), SDKConfig.useTiers && jsx$2(GetUpToComponent, { bond: bondData, depositAmount: depositAmount }), (bondData === null || bondData === void 0 ? void 0 : bondData.warningCard) && (jsx$2(Flex, { sx: {
                             width: '100%',
                             background: '#DE62F366',
                             justifyContent: 'center',
-                            mt: '15px',
+                            mt: '10px',
                             borderRadius: 'normal',
                         }, children: jsx$2(Text, { sx: { fontSize: '12px', fontWeight: 400, p: '2px 10px' }, children: jsx$2(SafeHTMLComponent, { html: bondData === null || bondData === void 0 ? void 0 : bondData.warningCard }) }) })), jsxs(Flex, { className: "modaltable-container button-container", children: [account && (jsx$2(Flex, { className: "button-container get", children: jsx$2(Button, { className: "action-button", onClick: () => bondData.billVersion === types.BillVersion.V4 && SDKConfig.useTiers
                                         ? window.open('http://ape.bond/tier-staking', '_blank')
                                         : zapEnabled
                                             ? handleOpenZapModal()
                                             : openExternal(), variant: "secondary", fullWidth: true, children: bondData.billVersion === types.BillVersion.V4 && SDKConfig.useTiers
-                                        ? `Get your Tier`
+                                        ? `Get ${!isMobile ? 'your' : ''} Tier`
                                         : `Get ${getSymbol(bondData === null || bondData === void 0 ? void 0 : bondData.lpToken)}` }) })), jsx$2(Flex, { className: "button-container buy", children: !account ? (jsx$2(ConnectButton, {})) : isUserRestricted ? (jsx$2(Button, { className: "action-button", disabled: true, children: "INSUFFICIENT TIER" })) : userChainId !== bondData.chainId ? (jsx$2(Button, { className: "action-button", disabled: loadingTx || isConfirming || (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut), onClick: (event) => {
                                         event.stopPropagation();
                                         switchChain({ chainId: bondData.chainId });
@@ -76929,7 +76909,15 @@ const BuyBond = ({ onDismiss, bondAddress, bondChain, handlePurchasedBond, isPro
                                         !inputValue ||
                                         parseFloat(inputValue) === 0 ||
                                         fetchingZapQuote ||
-                                        zapError, onClick: handleOpenModal, children: zapError ? 'something went wrong' : `buy` })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
+                                        zapError ||
+                                        exceedsMaxBuy ||
+                                        exceedsBalance, onClick: handleOpenModal, children: exceedsMaxBuy
+                                        ? 'Exceeds Max Buy'
+                                        : exceedsBalance
+                                            ? 'Exceeds balance'
+                                            : zapError
+                                                ? 'something went wrong'
+                                                : `buy` })) : (jsx$2(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING, disabled: approvalState === ApprovalState.PENDING ||
                                         (bondData === null || bondData === void 0 ? void 0 : bondData.soldOut) ||
                                         !account ||
                                         !inputValue ||
@@ -77142,9 +77130,10 @@ function useHotBondContracts() {
     return useQuery({
         queryKey: [QUERY_KEYS.HOT_BONDS_CONTRACTS],
         queryFn: getHotBondsContracts,
+        staleTime: Infinity,
         refetchOnWindowFocus: false,
+        refetchOnMount: false,
         retry: 1,
-        initialData: [],
     });
 }
 function useHotBonds() {
@@ -77154,13 +77143,14 @@ function useHotBonds() {
         queryKey: [QUERY_KEYS.HOT_BONDS, bondsData === null || bondsData === void 0 ? void 0 : bondsData.length, hotBondContracts === null || hotBondContracts === void 0 ? void 0 : hotBondContracts.length],
         queryFn: () => getHotBonds(bondsData, hotBondContracts),
         refetchOnWindowFocus: false,
-        retry: 1,
-        initialData: [],
-        enabled: !!bondsData && !!hotBondContracts,
+        refetchInterval: 30000,
+        enabled: !!bondsData && bondsData.length > 0 && !!hotBondContracts && hotBondContracts.length > 0,
+        retry: 0,
     });
 }
 const getHotBondsContracts = () => __awaiter$9(void 0, void 0, void 0, function* () {
     try {
+        console.log('call!');
         const response = yield axios.get(`${STRAPI_URL}/hot-bonds`);
         return response.data.map((bond) => bond.BondAddress.toLowerCase());
     }
@@ -77519,32 +77509,47 @@ const Bonds = () => {
                 }, children: [jsx$2(Svg, { icon: "StarFilled", width: 75, height: 75 }), jsx$2(Flex$1, { sx: { mt: '10px' }, children: `You don't have any Favorite Bonds yet!` }), jsx$2(Flex$1, { sx: { fontSize: '12px', fontWeight: 400, color: 'textDisabledButton', mt: '10px' }, children: `Click on the 'star' or 'fire' icon to add Bonds to the list.` })] })) : (jsx$2(Flex$1, { className: "bonds-spinner", children: jsx$2(Spinner, { size: 100 }) })), SDKConfig.useHotBonds && jsx$2(RecommendationCards$1, {}), jsx$2(Flex$1, { sx: { width: '100%', justifyContent: 'center', my: '15px' }, children: jsx$2("img", { src: "https://res.cloudinary.com/dswmrqgwy/image/upload/v1741643990/poweredbyapebondsdk_cxiouj.png", alt: "powered-by-apebond", style: { width: '200px', height: 'auto' } }) })] }));
 };
 
-var BondsViewOptions;
+var BondsViewOptions$1;
 (function (BondsViewOptions) {
     BondsViewOptions["BONDSMARKET"] = "Bonds Market";
     BondsViewOptions["YOURBONDS"] = "Your Bonds";
-})(BondsViewOptions || (BondsViewOptions = {}));
-const FullBondsView = () => {
-    const [activeView, setActiveView] = useState(BondsViewOptions.BONDSMARKET);
-    const handleToogle = () => {
-        const newOption = activeView === BondsViewOptions.YOURBONDS ? BondsViewOptions.BONDSMARKET : BondsViewOptions.YOURBONDS;
+})(BondsViewOptions$1 || (BondsViewOptions$1 = {}));
+const useActiveView = () => {
+    // Query to fetch the activeView's current state
+    const { data: activeView = BondsViewOptions$1.BONDSMARKET } = useQuery({
+        queryKey: [QUERY_KEYS.ACTIVE_VIEW],
+        queryFn: () => {
+            // Initialize from the URL if on first load
+            if (typeof window !== 'undefined') {
+                const isYourBonds = window.location.search === '?yourBonds';
+                return isYourBonds ? BondsViewOptions$1.YOURBONDS : BondsViewOptions$1.BONDSMARKET;
+            }
+            return BondsViewOptions$1.BONDSMARKET;
+        },
+    });
+    const queryClient = useQueryClient();
+    const handleToogle = (newView) => {
+        queryClient.setQueryData([QUERY_KEYS.ACTIVE_VIEW], newView); // Update cache
         if (typeof window !== 'undefined') {
             const currentPath = window.location.pathname;
-            if (newOption === BondsViewOptions.YOURBONDS) {
-                // window.location.pathname = '/yourBonds'
+            if (newView === BondsViewOptions$1.YOURBONDS) {
                 window.history.pushState({}, '', `${currentPath}?yourBonds`);
             }
             else {
                 window.history.pushState({}, '', `${currentPath}`);
             }
         }
-        setActiveView(newOption);
     };
-    useEffect(() => {
-        if (window.location.search === '?yourBonds') {
-            setActiveView(BondsViewOptions.YOURBONDS);
-        }
-    }, []);
+    return { activeView, handleToogle };
+};
+
+var BondsViewOptions;
+(function (BondsViewOptions) {
+    BondsViewOptions["BONDSMARKET"] = "Bonds Market";
+    BondsViewOptions["YOURBONDS"] = "Your Bonds";
+})(BondsViewOptions || (BondsViewOptions = {}));
+const FullBondsView = () => {
+    const { activeView, handleToogle } = useActiveView();
     return (jsxs("div", { className: "full-bonds-view-container", children: [jsx$2("div", { className: "toggle-container", children: jsx$2(Toggle, { options: [BondsViewOptions.BONDSMARKET, BondsViewOptions.YOURBONDS], activeOption: activeView, handleToggle: handleToogle }) }), jsx$2(Flex, { sx: { width: '100%' }, children: activeView === BondsViewOptions.BONDSMARKET ? jsx$2(Bonds, {}) : jsx$2(YourBonds, {}) })] }));
 };
 

package/dist/state/activeView/index.d.ts

@@ -0,0 +1,9 @@
+export declare enum BondsViewOptions {
+    BONDSMARKET = "Bonds Market",
+    YOURBONDS = "Your Bonds"
+}
+declare const useActiveView: () => {
+    activeView: BondsViewOptions;
+    handleToogle: (newView: string) => void;
+};
+export default useActiveView;

package/dist/state/bonds/useHotBonds.d.ts

@@ -1,6 +1,6 @@
 import { UseQueryResult } from '@tanstack/react-query';
 import { BondsData } from '../../types/bonds';
-export declare function useHotBondContracts(): import("@tanstack/react-query").DefinedUseQueryResult<string[], Error>;
+export declare function useHotBondContracts(): UseQueryResult<string[], Error>;
 export default function useHotBonds(): UseQueryResult<BondsData[]>;
 export declare const getHotBondsContracts: () => Promise<string[]>;
 export declare const getHotBonds: (bondData: BondsData[], hotBondContracts: string[]) => Promise<BondsData[]>;

package/dist/styles.css

@@ -477,7 +477,7 @@
   align-items: center;
   cursor: pointer;
   width: 45%;
-  min-width: 130px;
+  min-width: 110px;
 }
 .button-container.get .action-button {
   margin-right: 10px;
@@ -1028,7 +1028,7 @@ span.flex-inline {
 }
 @media screen and (min-width: 1000px) {
   .your-bonds .token-info-container {
-    width: 40%;
+    width: 45%;
   }
 }
 .your-bonds .token-info-container .tooltip-column {
@@ -1051,7 +1051,7 @@ span.flex-inline {
 }
 @media screen and (min-width: 1000px) {
   .your-bonds .your-bonds-columns-container {
-    width: 60%;
+    width: 55%;
     justify-content: space-between;
     flex-direction: row;
     padding-right: 20px;

package/dist/utils/formatNumber.d.ts

@@ -1,2 +1,2 @@
 export declare const formatNumber: (number: number, minPrecision?: number, maxPrecision?: number) => string;
-export declare const formatNumberSI: (number: number, digits?: number) => string;
+export declare const formatNumberSI: (num: number | string, digits?: number) => string;

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "3.0.29",
+  "version": "3.0.31-test",
   "module": "dist/main.js",
   "type": "module",
   "types": "dist/main.d.ts",