@ape.swap/bonds-sdk 6.2.13 → 6.2.14

package/dist/views/TransactionModal/TransactionModal.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'theme-ui/jsx-runtime';
 import { useMemo, useState, useRef, useEffect } from 'react';
 import Button from '../../components/uikit-sdk/Button/Button.js';
 import Flex from '../../components/uikit-sdk/Flex/index.js';
@@ -129,11 +129,11 @@ const TransactionModal = ({ onDismiss, txChain, approvalState, approveCallback,
     const trueBondPrice = findHighestTrueBondPrice(
     // @ts-ignore
     TIERS_WEIGHT[getUserTier(promotionalPoints)] ?? '0', bondData?.trueBondPrices);
-    return (jsxs(Modal, { children: [jsx(ModalHeader, { onDismiss: onDismiss, hideDivider: true }), jsxs(Flex, { className: "ape:flex-col ape:w-full", children: [jsxs(Flex, { className: "ape:w-full ape:items-center ape:p-[10px]", children: [showSwitchChainFlow && (jsx(StepBubble, { number: 1, title: 'Switch Chain', currentStep: currentStep, loading: loadingSwitchChain })), jsx(StepBubble, { number: showSwitchChainFlow ? 2 : 1, title: 'Approve', currentStep: currentStep, loading: approveLoading || approvalState === ApprovalState.PENDING }), jsx(StepBubble, { number: showSwitchChainFlow ? 3 : 2, title: 'Buy', currentStep: currentStep, loading: loadingTx || verifyingTx, hideBar: true })] }), jsx(Flex, { className: "ape:w-full ape:mt-[40px] ape:justify-center", children: jsx(LoadingSpinner, { isLoading: loadingSwitchChain ||
+    return (jsxs(Modal, { children: [jsx(ModalHeader, { onDismiss: onDismiss, hideDivider: true }), jsxs(Flex, { sx: { flexDirection: 'column', width: '100%' }, children: [jsxs(Flex, { sx: { width: '100%', alignItems: 'center', p: '10px' }, children: [showSwitchChainFlow && (jsx(StepBubble, { number: 1, title: 'Switch Chain', currentStep: currentStep, loading: loadingSwitchChain })), jsx(StepBubble, { number: showSwitchChainFlow ? 2 : 1, title: 'Approve', currentStep: currentStep, loading: approveLoading || approvalState === ApprovalState.PENDING }), jsx(StepBubble, { number: showSwitchChainFlow ? 3 : 2, title: 'Buy', currentStep: currentStep, loading: loadingTx || verifyingTx, hideBar: true })] }), jsx(Flex, { sx: { width: '100%', mt: '40px', justifyContent: 'center' }, children: jsx(LoadingSpinner, { isLoading: loadingSwitchChain ||
                                 approveLoading ||
                                 loadingTx ||
                                 verifyingTx ||
-                                approvalState === ApprovalState.PENDING, size: 100 }) }), jsx(Flex, { className: "ape:w-full ape:justify-center ape:mt-[10px]", children: hasToSwitchChain
+                                approvalState === ApprovalState.PENDING, size: 100 }) }), jsx(Flex, { sx: { width: '100%', justifyContent: 'center', mt: '10px' }, children: hasToSwitchChain
                             ? loadingSwitchChain
                                 ? 'Switching Chain...'
                                 : 'Switch Chain'
@@ -143,25 +143,52 @@ const TransactionModal = ({ onDismiss, txChain, approvalState, approveCallback,
                                     : 'Approve Contract'
                                 : loadingTx || verifyingTx
                                     ? 'Buying...'
-                                    : 'Buy' }), bondData.billType === 'fcfs' ? (jsxs(Flex, { className: "ape:w-full ape:flex-col ape:mt-[20px]", children: [jsxs(Flex, { className: "ape:w-full ape:bg-white3 ape:p-[5px] ape:rounded-normal ape:justify-center", style: { color: 'var(--ape-color-text-disabled-button)' }, children: [bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol, !bondData.yieldBond && jsxs(Fragment, { children: ["(", getTimePeriods(bondData?.vestingTerm).months, " Mo)"] })] }), jsxs(Flex, { className: "ape:w-full ape:bg-white3 ape:p-[10px] ape:rounded-normal ape:mt-[10px]", children: [jsx(TokenImage, { symbol: bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol, size: 40, chain: txChain }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:items-center", children: [jsx(Flex, { className: "ape:flex-col ape:text-[12px] ape:ml-[10px]", children: bondData.yieldBond ? (jsx(Fragment, { children: bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol })) : (jsxs(Fragment, { children: [jsxs(Flex, { className: "ape:font-normal ape:line-through", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["$", bondData.tgePrice] }), jsxs(Flex, { className: "ape:font-semibold", style: { color: 'green' }, children: ["$", bondData.initPrice] })] })) }), jsx(Flex, { className: "ape:p-[5px] ape:rounded-normal ape:border ape:leading-[18px]", style: {
-                                                    borderColor: 'var(--ape-color-success)',
+                                    : 'Buy' }), bondData.billType === 'fcfs' ? (jsxs(Flex, { sx: { width: '100%', flexDirection: 'column', mt: '20px' }, children: [jsxs(Flex, { sx: {
+                                    width: '100%',
+                                    background: 'white3',
+                                    p: '5px',
+                                    borderRadius: 'normal',
+                                    color: 'textDisabledButton',
+                                    justifyContent: 'center',
+                                }, children: [bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol, !bondData.yieldBond && jsxs(Fragment, { children: ["(", getTimePeriods(bondData?.vestingTerm).months, " Mo)"] })] }), jsxs(Flex, { sx: { width: '100%', background: 'white3', p: '10px', borderRadius: 'normal', mt: '10px' }, children: [jsx(TokenImage, { symbol: bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol, size: 40, chain: txChain }), jsxs(Flex, { sx: { width: '100%', justifyContent: 'space-between', alignItems: 'center' }, children: [jsx(Flex, { sx: { flexDirection: 'column', fontSize: '12px', ml: '10px' }, children: bondData.yieldBond ? (jsx(Fragment, { children: bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol })) : (jsxs(Fragment, { children: [jsxs(Flex, { sx: { color: 'textDisabledButton', fontWeight: 400, textDecoration: 'line-through' }, children: ["$", bondData.tgePrice] }), jsxs(Flex, { sx: { color: 'green', fontWeight: 600 }, children: ["$", bondData.initPrice] })] })) }), jsx(Flex, { sx: {
+                                                    p: '5px',
+                                                    borderRadius: 'normal',
+                                                    border: '1px solid var(--theme-ui-colors-success)',
                                                     background: 'rgba(56, 166, 17, 0.13)',
-                                                    color: 'var(--ape-color-success)',
+                                                    color: 'success',
+                                                    lineHeight: '18px',
                                                 }, children: bondData.yieldBond
                                                     ? `${bondData.yieldData?.apr.toFixed()} % APR`
-                                                    : `${trueBondPrice?.bonusWithFee?.toFixed(2)} % Bonus` })] })] }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:mt-[10px]", children: [jsxs(Flex, { className: "ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]", children: [isArray(splited) ? (jsx(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 20, chain: txChain })) : (jsx(TokenImage, { symbol: getSymbol(inputToken, txChain), size: 20, chain: txChain })), jsx(Flex, { className: "ape:text-[14px] ape:font-semibold ape:mx-[5px]", children: formatNumberSI(inputValue, 4) ?? '0' }), jsxs(Flex, { className: "ape:text-[12px] ape:font-normal", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["(", inputTokenPrice?.price && inputValue
+                                                    : `${trueBondPrice?.bonusWithFee?.toFixed(2)} % Bonus` })] })] }), jsxs(Flex, { sx: { width: '100%', justifyContent: 'space-between', mt: '10px' }, children: [jsxs(Flex, { sx: { p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }, children: [isArray(splited) ? (jsx(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 20, chain: txChain })) : (jsx(TokenImage, { symbol: getSymbol(inputToken, txChain), size: 20, chain: txChain })), jsx(Flex, { sx: { fontSize: '14px', fontWeight: 600, mx: '5px' }, children: formatNumberSI(inputValue, 4) ?? '0' }), jsxs(Flex, { sx: { color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }, children: ["(", inputTokenPrice?.price && inputValue
                                                         ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`
-                                                        : '0.00', ")"] })] }), jsx(Arrow, { direction: 'right', width: '10px' }), jsxs(Flex, { className: "ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%] ape:gap-[5px]", children: [jsx(TokenImage, { symbol: bondData.yieldBond
+                                                        : '0.00', ")"] })] }), jsx(Arrow, { direction: 'right', width: '10px' }), jsxs(Flex, { sx: {
+                                            p: '10px',
+                                            borderRadius: 'normal',
+                                            background: 'white3',
+                                            alignItems: 'center',
+                                            width: '45%',
+                                            gap: '5px',
+                                        }, children: [jsx(TokenImage, { symbol: bondData.yieldBond
                                                     ? bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol
-                                                    : getSymbol(bondData.earnToken, txChain), chain: txChain, size: 20 }), bondData.yieldBond ? (jsxs(Flex, { className: "ape:text-[14px] ape:font-semibold", children: ["$", formatNumberSI(preTGEEstimatedOutputUSD)] })) : (jsxs(Fragment, { children: [jsx(Flex, { className: "ape:text-[14px] ape:font-semibold ape:mx-[5px]", children: formatNumberSI(preTGEEstimatedOutput, 4) }), jsxs(Flex, { className: "ape:text-[12px] ape:font-normal", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["($", formatNumberSI(preTGEEstimatedOutputUSD), ")"] })] }))] })] })] })) : (jsxs(Flex, { className: "ape:w-full ape:flex-col ape:mt-[20px]", children: [jsxs(Flex, { className: "ape:w-full ape:bg-white3 ape:p-[5px] ape:rounded-normal ape:justify-center", style: { color: 'var(--ape-color-text-disabled-button)' }, children: [bondData.earnToken.symbol, " (", getVestingTermsString(bondData), ")"] }), jsxs(Flex, { className: "ape:w-full ape:bg-white3 ape:p-[10px] ape:rounded-normal ape:mt-[10px]", children: [jsx(TokenImage, { symbol: bondData.earnToken.symbol, size: 40, chain: txChain }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:items-center", children: [jsxs(Flex, { className: "ape:flex-col ape:text-[12px] ape:ml-[10px]", children: [jsxs(Flex, { className: "ape:font-normal ape:line-through", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["$", earnTokenPrice(bondData)] }), jsxs(Flex, { className: "ape:font-semibold", style: { color: 'green' }, children: ["$", discountEarnTokenPriceForUser(bondData, SDKConfig.useTiers, getUserTier(promotionalPoints) ?? undefined)] })] }), jsxs(Flex, { className: "ape:p-[5px] ape:rounded-normal ape:border ape:leading-[18px]", style: {
-                                                    borderColor: 'var(--ape-color-success)',
+                                                    : getSymbol(bondData.earnToken, txChain), chain: txChain, size: 20 }), bondData.yieldBond ? (jsxs(Flex, { sx: { fontSize: '14px', fontWeight: 600 }, children: ["$", formatNumberSI(preTGEEstimatedOutputUSD)] })) : (jsxs(Fragment, { children: [jsx(Flex, { sx: { fontSize: '14px', fontWeight: 600, mx: '5px' }, children: formatNumberSI(preTGEEstimatedOutput, 4) }), jsxs(Flex, { sx: { color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }, children: ["($", formatNumberSI(preTGEEstimatedOutputUSD), ")"] })] }))] })] })] })) : (jsxs(Flex, { sx: { width: '100%', flexDirection: 'column', mt: '20px' }, children: [jsxs(Flex, { sx: {
+                                    width: '100%',
+                                    background: 'white3',
+                                    p: '5px',
+                                    borderRadius: 'normal',
+                                    color: 'textDisabledButton',
+                                    justifyContent: 'center',
+                                }, children: [bondData.earnToken.symbol, " (", getVestingTermsString(bondData), ")"] }), jsxs(Flex, { sx: { width: '100%', background: 'white3', p: '10px', borderRadius: 'normal', mt: '10px' }, children: [jsx(TokenImage, { symbol: bondData.earnToken.symbol, size: 40, chain: txChain }), jsxs(Flex, { sx: { width: '100%', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxs(Flex, { sx: { flexDirection: 'column', fontSize: '12px', ml: '10px' }, children: [jsxs(Flex, { sx: { color: 'textDisabledButton', fontWeight: 400, textDecoration: 'line-through' }, children: ["$", earnTokenPrice(bondData)] }), jsxs(Flex, { sx: { color: 'green', fontWeight: 600 }, children: ["$", discountEarnTokenPriceForUser(bondData, SDKConfig.useTiers, getUserTier(promotionalPoints) ?? undefined)] })] }), jsxs(Flex, { sx: {
+                                                    p: '5px',
+                                                    borderRadius: 'normal',
+                                                    border: '1px solid var(--theme-ui-colors-success)',
                                                     background: 'rgba(56, 166, 17, 0.13)',
-                                                    color: 'var(--ape-color-success)',
+                                                    color: 'success',
+                                                    lineHeight: '18px',
                                                 }, children: [bondData.earnToken.symbol.toLowerCase() === 'ireet'
                                                         ? '3.00'
-                                                        : trueBondPrice?.bonusWithFee?.toFixed(2), ' ', "% Bonus"] })] })] }), jsxs(Flex, { className: "ape:w-full ape:justify-between ape:mt-[10px]", children: [jsxs(Flex, { className: "ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]", children: [isArray(splited) ? (jsx(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 20, chain: txChain })) : (jsx(TokenImage, { symbol: getSymbol(inputToken, txChain), size: 20, chain: txChain })), jsx(Flex, { className: "ape:text-[14px] ape:font-semibold ape:mx-[5px]", children: formatNumberSI(inputValue, 4) ?? '0' }), jsxs(Flex, { className: "ape:text-[12px] ape:font-normal", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["(", inputTokenPrice?.price && inputValue
+                                                        : trueBondPrice?.bonusWithFee?.toFixed(2), ' ', "% Bonus"] })] })] }), jsxs(Flex, { sx: { width: '100%', justifyContent: 'space-between', mt: '10px' }, children: [jsxs(Flex, { sx: { p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }, children: [isArray(splited) ? (jsx(TokenImage, { symbol: splited[0], symbol2: splited[1], size: 20, chain: txChain })) : (jsx(TokenImage, { symbol: getSymbol(inputToken, txChain), size: 20, chain: txChain })), jsx(Flex, { sx: { fontSize: '14px', fontWeight: 600, mx: '5px' }, children: formatNumberSI(inputValue, 4) ?? '0' }), jsxs(Flex, { sx: { color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }, children: ["(", inputTokenPrice?.price && inputValue
                                                         ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`
-                                                        : '0.00', ")"] })] }), jsx(Arrow, { direction: 'right', width: '10px' }), jsxs(Flex, { className: "ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]", children: [jsx(TokenImage, { symbol: getSymbol(bondData.earnToken, txChain), chain: txChain, size: 20 }), jsx(Flex, { className: "ape:text-[14px] ape:font-semibold ape:mx-[5px]", children: formatNumberSI(estimatedOutputAmount, 4) }), jsxs(Flex, { className: "ape:text-[12px] ape:font-normal", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["($", formatNumberSI(estimatedOutputUSD), ")"] })] })] })] })), jsx(Flex, { className: "ape:mt-[20px]", children: hasToSwitchChain ? (jsxs(Button, { load: loadingSwitchChain, disabled: loadingSwitchChain, onClick: handleSwitchChain, fullWidth: true, children: ["switch to ", NETWORK_LABEL[txChain]] })) : !hasToApprove ? (jsx(Button, { load: loadingTx || verifyingTx, disabled: loadingTx || verifyingTx, onClick: txCallback, fullWidth: true, children: "buy" })) : (jsx(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING || approveLoading, disabled: approvalState === ApprovalState.PENDING || approveLoading, onClick: handleApprove, fullWidth: true, children: "Approve" })) })] })] }));
+                                                        : '0.00', ")"] })] }), jsx(Arrow, { direction: 'right', width: '10px' }), jsxs(Flex, { sx: { p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }, children: [jsx(TokenImage, { symbol: getSymbol(bondData.earnToken, txChain), chain: txChain, size: 20 }), jsx(Flex, { sx: { fontSize: '14px', fontWeight: 600, mx: '5px' }, children: formatNumberSI(estimatedOutputAmount, 4) }), jsxs(Flex, { sx: { color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }, children: ["($", formatNumberSI(estimatedOutputUSD), ")"] })] })] })] })), jsx(Flex, { sx: { mt: '20px' }, children: hasToSwitchChain ? (jsxs(Button, { load: loadingSwitchChain, disabled: loadingSwitchChain, onClick: handleSwitchChain, fullWidth: true, children: ["switch to ", NETWORK_LABEL[txChain]] })) : !hasToApprove ? (jsx(Button, { load: loadingTx || verifyingTx, disabled: loadingTx || verifyingTx, onClick: txCallback, fullWidth: true, children: "buy" })) : (jsx(Button, { className: "action-button", load: approvalState === ApprovalState.PENDING || approveLoading, disabled: approvalState === ApprovalState.PENDING || approveLoading, onClick: handleApprove, fullWidth: true, children: "Approve" })) })] })] }));
 };
 
 export { TransactionModal as default };

package/dist/views/TransactionModal/TransactionModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionModal.js","sources":["../../../src/views/TransactionModal/TransactionModal.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState } from 'react'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport StepBubble from '../../components/StepBubble'\nimport LoadingSpinner from '../../components/LoadingSpinner'\nimport { useSwitchChain } from 'wagmi'\nimport { NETWORK_LABEL } from '../../config/constants/chains'\nimport ModalHeader from '../../components/uikit-sdk/Modal/ModalHeader'\nimport { ApprovalState } from '../../state/allowance/useAllowance'\nimport {\n  discountEarnTokenPriceForUser,\n  earnTokenPrice,\n  getPayoutAmount,\n  getVestingTermsString,\n} from '../../utils/displayHelpers'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport useTierPoints, { getUserTier, TIERS_WEIGHT } from '../../state/tiers/useTierPoints'\nimport { BondsData } from '../../types/bonds'\nimport useCurrencyPrice from '../../state/price/useCurrencyPrice'\nimport { ChainId, Token } from '@ape.swap/apeswap-lists'\nimport { useMonitorTx } from '../../hooks/useMonitorTx'\nimport { getSymbol } from '../../utils/getNativeTicker'\nimport isArray from 'lodash-es/isArray.js'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { getTimePeriods } from '../../utils/getTimePeriods'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { findHighestTrueBondPrice } from '../../utils/bondPriceHelpers'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow'\n\nconst stepDelay = 1000\n\nconst TransactionModal = ({\n  onDismiss,\n  txChain,\n  approvalState,\n  approveCallback,\n  loadingTx,\n  txCallback,\n  bondData,\n  inputToken,\n  inputValue,\n  depositAmount,\n  buyTxHash,\n  rateChanged,\n}: {\n  onDismiss?: () => void\n  txChain?: number\n  approvalState?: ApprovalState\n  approveCallback?: () => Promise<void>\n  loadingTx?: boolean\n  txCallback?: () => void\n  bondData: BondsData\n  inputToken: Token | 'NATIVE' | undefined\n  inputValue: string\n  depositAmount: string\n  buyTxHash?: string\n  rateChanged: boolean\n}) => {\n  // Hooks\n  const { chain } = useEVMAccount()\n  const { data: tierPointsState } = useTierPoints()\n  const { promotionalPoints } = tierPointsState || {}\n  const inputTokenPrice = useCurrencyPrice(inputToken ?? null, txChain as ChainId)\n  const { switchChainAsync } = useSwitchChain()\n  const SDKConfig = useSDKConfig()\n\n  // Flow\n  const initialChain = useMemo(\n    () => chain?.id,\n    /* eslint-disable react-hooks/exhaustive-deps */\n    [],\n  )\n  const showSwitchChainFlow = txChain !== initialChain\n  // const showSwitchChainFlow = true\n  const [hasToSwitchChain, setHasToSwitchChain] = useState<boolean>(showSwitchChainFlow)\n  const [hasToApprove, setHasToApprove] = useState<boolean>(true)\n\n  // Loading state\n  const [loadingSwitchChain, setLoadingSwitchChain] = useState<boolean>(false)\n  const [approveLoading, setApproveLoading] = useState<boolean>(false)\n\n  // Values for regular bonds\n  const estimatedOutputAmount = getPayoutAmount(bondData, depositAmount, promotionalPoints ?? '0')\n  const estimatedOutputUSD = estimatedOutputAmount * parseFloat(bondData?.payoutTokenPrice ?? '0')\n  const preTGEEstimatedOutput = parseFloat(inputValue) / (bondData?.initPrice ?? 0)\n  const preTGEEstimatedOutputUSD = preTGEEstimatedOutput * (bondData?.tgePrice ?? 0)\n\n  const handleSwitchChain = () => {\n    setLoadingSwitchChain(true)\n    switchChainAsync({ chainId: txChain! })\n      .then(() => {\n        setHasToSwitchChain(false)\n        setApproveLoading(true)\n      })\n      .catch((e) => console.error(e))\n      .finally(() => {\n        setLoadingSwitchChain(false)\n      })\n  }\n\n  const handleApprove = () => {\n    setApproveLoading(true)\n    approveCallback?.().catch(() => {\n      setApproveLoading(false)\n    })\n  }\n\n  // Switch Chain Step #1\n  const hasTriggeredSwitch = useRef(false)\n  useEffect(() => {\n    if (hasToSwitchChain && !hasTriggeredSwitch.current) {\n      setLoadingSwitchChain(true)\n      const delay = setTimeout(() => {\n        hasTriggeredSwitch.current = true\n        handleSwitchChain()\n      }, stepDelay)\n      return () => clearTimeout(delay)\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain])\n\n  // Trigger approve Step #2\n  const hasTriggeredApproval = useRef(false)\n  useEffect(() => {\n    if (!hasToSwitchChain || !showSwitchChainFlow) {\n      if (approvalState === ApprovalState.APPROVED) {\n        setApproveLoading(true)\n        const delay = setTimeout(() => {\n          setApproveLoading(false)\n          setHasToApprove(false)\n        }, stepDelay)\n        return () => clearTimeout(delay)\n      } else if (!hasTriggeredApproval.current && approvalState !== ApprovalState.PENDING) {\n        setApproveLoading(true)\n        hasTriggeredApproval.current = true\n        handleApprove()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain, approvalState])\n\n  // Execute main tx Step #3\n  const hasTriggeredTx = useRef(false)\n  useEffect(() => {\n    if (!hasToSwitchChain && !hasToApprove && !hasTriggeredTx.current) {\n      hasTriggeredTx.current = true\n      if (rateChanged) {\n        onDismiss?.()\n      } else {\n        setApproveLoading(false)\n        txCallback?.()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain, hasToApprove, txCallback])\n\n  // Close modal if a hash is found. Final Step\n  const { data: txReceipt, isSuccess, isLoading: verifyingTx } = useMonitorTx(buyTxHash, txChain)\n  useEffect(() => {\n    if (buyTxHash && txReceipt) {\n      if (isSuccess) {\n        onDismiss?.()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [buyTxHash, txReceipt, isSuccess])\n\n  const currentStep: number = showSwitchChainFlow ? (hasToSwitchChain ? 1 : hasToApprove ? 2 : 3) : hasToApprove ? 1 : 2\n  const splited = typeof inputToken !== 'string' ? inputToken?.symbol?.split('-') : undefined\n  const trueBondPrice = findHighestTrueBondPrice(\n    // @ts-ignore\n    TIERS_WEIGHT[getUserTier(promotionalPoints)] ?? '0',\n    bondData?.trueBondPrices,\n  )\n\n  return (\n    <Modal>\n      <ModalHeader onDismiss={onDismiss} hideDivider />\n      <Flex className=\"ape:flex-col ape:w-full\">\n        <Flex className=\"ape:w-full ape:items-center ape:p-[10px]\">\n          {showSwitchChainFlow && (\n            <StepBubble number={1} title={'Switch Chain'} currentStep={currentStep} loading={loadingSwitchChain} />\n          )}\n          <StepBubble\n            number={showSwitchChainFlow ? 2 : 1}\n            title={'Approve'}\n            currentStep={currentStep}\n            loading={approveLoading || approvalState === ApprovalState.PENDING}\n          />\n          <StepBubble\n            number={showSwitchChainFlow ? 3 : 2}\n            title={'Buy'}\n            currentStep={currentStep}\n            loading={loadingTx || verifyingTx}\n            hideBar\n          />\n        </Flex>\n        <Flex className=\"ape:w-full ape:mt-[40px] ape:justify-center\">\n          <LoadingSpinner\n            isLoading={\n              loadingSwitchChain ||\n              approveLoading ||\n              loadingTx ||\n              verifyingTx ||\n              approvalState === ApprovalState.PENDING\n            }\n            size={100}\n          />\n        </Flex>\n        <Flex className=\"ape:w-full ape:justify-center ape:mt-[10px]\">\n          {hasToSwitchChain\n            ? loadingSwitchChain\n              ? 'Switching Chain...'\n              : 'Switch Chain'\n            : hasToApprove\n              ? approveLoading || approvalState === ApprovalState.PENDING\n                ? 'Approving...'\n                : 'Approve Contract'\n              : loadingTx || verifyingTx\n                ? 'Buying...'\n                : 'Buy'}\n        </Flex>\n        {bondData.billType === 'fcfs' ? (\n          <Flex className=\"ape:w-full ape:flex-col ape:mt-[20px]\">\n            <Flex\n              className=\"ape:w-full ape:bg-white3 ape:p-[5px] ape:rounded-normal ape:justify-center\"\n              style={{ color: 'var(--ape-color-text-disabled-button)' }}\n            >\n              {bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}\n              {!bondData.yieldBond && <>({getTimePeriods(bondData?.vestingTerm).months} Mo)</>}\n            </Flex>\n            <Flex className=\"ape:w-full ape:bg-white3 ape:p-[10px] ape:rounded-normal ape:mt-[10px]\">\n              <TokenImage\n                symbol={bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}\n                size={40}\n                chain={txChain}\n              />\n              <Flex className=\"ape:w-full ape:justify-between ape:items-center\">\n                <Flex className=\"ape:flex-col ape:text-[12px] ape:ml-[10px]\">\n                  {bondData.yieldBond ? (\n                    <>{bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}</>\n                  ) : (\n                    <>\n                      <Flex\n                        className=\"ape:font-normal ape:line-through\"\n                        style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                      >\n                        ${bondData.tgePrice}\n                      </Flex>\n                      <Flex className=\"ape:font-semibold\" style={{ color: 'green' }}>\n                        ${bondData.initPrice}\n                      </Flex>\n                    </>\n                  )}\n                </Flex>\n                <Flex\n                  className=\"ape:p-[5px] ape:rounded-normal ape:border ape:leading-[18px]\"\n                  style={{\n                    borderColor: 'var(--ape-color-success)',\n                    background: 'rgba(56, 166, 17, 0.13)',\n                    color: 'var(--ape-color-success)',\n                  }}\n                >\n                  {bondData.yieldBond\n                    ? `${bondData.yieldData?.apr.toFixed()} % APR`\n                    : `${trueBondPrice?.bonusWithFee?.toFixed(2)} % Bonus`}\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex className=\"ape:w-full ape:justify-between ape:mt-[10px]\">\n              <Flex className=\"ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]\">\n                {isArray(splited) ? (\n                  <TokenImage symbol={splited[0]} symbol2={splited[1]} size={20} chain={txChain} />\n                ) : (\n                  <TokenImage symbol={getSymbol(inputToken, txChain)} size={20} chain={txChain} />\n                )}\n                <Flex className=\"ape:text-[14px] ape:font-semibold ape:mx-[5px]\">\n                  {formatNumberSI(inputValue, 4) ?? '0'}\n                </Flex>\n                <Flex\n                  className=\"ape:text-[12px] ape:font-normal\"\n                  style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                >\n                  (\n                  {inputTokenPrice?.price && inputValue\n                    ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`\n                    : '0.00'}\n                  )\n                </Flex>\n              </Flex>\n              <Arrow direction={'right'} width={'10px'} />\n              <Flex className=\"ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%] ape:gap-[5px]\">\n                <TokenImage\n                  symbol={\n                    bondData.yieldBond\n                      ? bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol\n                      : getSymbol(bondData.earnToken, txChain)\n                  }\n                  chain={txChain}\n                  size={20}\n                />\n                {bondData.yieldBond ? (\n                  <Flex className=\"ape:text-[14px] ape:font-semibold\">\n                    ${formatNumberSI(preTGEEstimatedOutputUSD)}\n                  </Flex>\n                ) : (\n                  <>\n                    <Flex className=\"ape:text-[14px] ape:font-semibold ape:mx-[5px]\">\n                      {formatNumberSI(preTGEEstimatedOutput, 4)}\n                    </Flex>\n                    <Flex\n                      className=\"ape:text-[12px] ape:font-normal\"\n                      style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                    >\n                      (${formatNumberSI(preTGEEstimatedOutputUSD)})\n                    </Flex>\n                  </>\n                )}\n              </Flex>\n            </Flex>\n          </Flex>\n        ) : (\n          <Flex className=\"ape:w-full ape:flex-col ape:mt-[20px]\">\n            <Flex\n              className=\"ape:w-full ape:bg-white3 ape:p-[5px] ape:rounded-normal ape:justify-center\"\n              style={{ color: 'var(--ape-color-text-disabled-button)' }}\n            >\n              {bondData.earnToken.symbol} ({getVestingTermsString(bondData)})\n            </Flex>\n            <Flex className=\"ape:w-full ape:bg-white3 ape:p-[10px] ape:rounded-normal ape:mt-[10px]\">\n              <TokenImage symbol={bondData.earnToken.symbol} size={40} chain={txChain} />\n              <Flex className=\"ape:w-full ape:justify-between ape:items-center\">\n                <Flex className=\"ape:flex-col ape:text-[12px] ape:ml-[10px]\">\n                  <Flex\n                    className=\"ape:font-normal ape:line-through\"\n                    style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                  >\n                    ${earnTokenPrice(bondData)}\n                  </Flex>\n                  <Flex className=\"ape:font-semibold\" style={{ color: 'green' }}>\n                    $\n                    {discountEarnTokenPriceForUser(\n                      bondData,\n                      SDKConfig.useTiers,\n                      getUserTier(promotionalPoints!) ?? undefined,\n                    )}\n                  </Flex>\n                </Flex>\n                <Flex\n                  className=\"ape:p-[5px] ape:rounded-normal ape:border ape:leading-[18px]\"\n                  style={{\n                    borderColor: 'var(--ape-color-success)',\n                    background: 'rgba(56, 166, 17, 0.13)',\n                    color: 'var(--ape-color-success)',\n                  }}\n                >\n                  {bondData.earnToken.symbol.toLowerCase() === 'ireet'\n                    ? '3.00'\n                    : trueBondPrice?.bonusWithFee?.toFixed(2)}{' '}\n                  % Bonus\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex className=\"ape:w-full ape:justify-between ape:mt-[10px]\">\n              <Flex className=\"ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]\">\n                {isArray(splited) ? (\n                  <TokenImage symbol={splited[0]} symbol2={splited[1]} size={20} chain={txChain} />\n                ) : (\n                  <TokenImage symbol={getSymbol(inputToken, txChain)} size={20} chain={txChain} />\n                )}\n                <Flex className=\"ape:text-[14px] ape:font-semibold ape:mx-[5px]\">\n                  {formatNumberSI(inputValue, 4) ?? '0'}\n                </Flex>\n                <Flex\n                  className=\"ape:text-[12px] ape:font-normal\"\n                  style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                >\n                  (\n                  {inputTokenPrice?.price && inputValue\n                    ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`\n                    : '0.00'}\n                  )\n                </Flex>\n              </Flex>\n              <Arrow direction={'right'} width={'10px'} />\n              <Flex className=\"ape:p-[10px] ape:rounded-normal ape:bg-white3 ape:items-center ape:w-[45%]\">\n                <TokenImage symbol={getSymbol(bondData.earnToken, txChain)} chain={txChain} size={20} />\n                <Flex className=\"ape:text-[14px] ape:font-semibold ape:mx-[5px]\">\n                  {formatNumberSI(estimatedOutputAmount, 4)}\n                </Flex>\n                <Flex\n                  className=\"ape:text-[12px] ape:font-normal\"\n                  style={{ color: 'var(--ape-color-text-disabled-button)' }}\n                >\n                  (${formatNumberSI(estimatedOutputUSD)})\n                </Flex>\n              </Flex>\n            </Flex>\n          </Flex>\n        )}\n\n        {/*\n\n        Action Buttons\n\n        */}\n        <Flex className=\"ape:mt-[20px]\">\n          {hasToSwitchChain ? (\n            <Button load={loadingSwitchChain} disabled={loadingSwitchChain} onClick={handleSwitchChain} fullWidth>\n              switch to {NETWORK_LABEL[txChain!]}\n            </Button>\n          ) : !hasToApprove ? (\n            <Button load={loadingTx || verifyingTx} disabled={loadingTx || verifyingTx} onClick={txCallback} fullWidth>\n              buy\n            </Button>\n          ) : (\n            <Button\n              className=\"action-button\"\n              load={approvalState === ApprovalState.PENDING || approveLoading}\n              disabled={approvalState === ApprovalState.PENDING || approveLoading}\n              onClick={handleApprove}\n              fullWidth\n            >\n              Approve\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default TransactionModal\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
+{"version":3,"file":"TransactionModal.js","sources":["../../../src/views/TransactionModal/TransactionModal.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState } from 'react'\nimport Button from '../../components/uikit-sdk/Button/Button'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport Modal from '../../components/uikit-sdk/Modal'\nimport StepBubble from '../../components/StepBubble'\nimport LoadingSpinner from '../../components/LoadingSpinner'\nimport { useSwitchChain } from 'wagmi'\nimport { NETWORK_LABEL } from '../../config/constants/chains'\nimport ModalHeader from '../../components/uikit-sdk/Modal/ModalHeader'\nimport { ApprovalState } from '../../state/allowance/useAllowance'\nimport {\n  discountEarnTokenPriceForUser,\n  earnTokenPrice,\n  getPayoutAmount,\n  getVestingTermsString,\n} from '../../utils/displayHelpers'\nimport TokenImage from '../../components/uikit-sdk/TokenImage'\nimport useTierPoints, { getUserTier, TIERS_WEIGHT } from '../../state/tiers/useTierPoints'\nimport { BondsData } from '../../types/bonds'\nimport useCurrencyPrice from '../../state/price/useCurrencyPrice'\nimport { ChainId, Token } from '@ape.swap/apeswap-lists'\nimport { useMonitorTx } from '../../hooks/useMonitorTx'\nimport { getSymbol } from '../../utils/getNativeTicker'\nimport isArray from 'lodash-es/isArray.js'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { getTimePeriods } from '../../utils/getTimePeriods'\nimport { formatNumberSI } from '../../utils/formatNumber'\nimport { findHighestTrueBondPrice } from '../../utils/bondPriceHelpers'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport Arrow from '../../components/uikit-sdk/Svg/Icons/Arrow'\n\nconst stepDelay = 1000\n\nconst TransactionModal = ({\n  onDismiss,\n  txChain,\n  approvalState,\n  approveCallback,\n  loadingTx,\n  txCallback,\n  bondData,\n  inputToken,\n  inputValue,\n  depositAmount,\n  buyTxHash,\n  rateChanged,\n}: {\n  onDismiss?: () => void\n  txChain?: number\n  approvalState?: ApprovalState\n  approveCallback?: () => Promise<void>\n  loadingTx?: boolean\n  txCallback?: () => void\n  bondData: BondsData\n  inputToken: Token | 'NATIVE' | undefined\n  inputValue: string\n  depositAmount: string\n  buyTxHash?: string\n  rateChanged: boolean\n}) => {\n  // Hooks\n  const { chain } = useEVMAccount()\n  const { data: tierPointsState } = useTierPoints()\n  const { promotionalPoints } = tierPointsState || {}\n  const inputTokenPrice = useCurrencyPrice(inputToken ?? null, txChain as ChainId)\n  const { switchChainAsync } = useSwitchChain()\n  const SDKConfig = useSDKConfig()\n\n  // Flow\n  const initialChain = useMemo(\n    () => chain?.id,\n    /* eslint-disable react-hooks/exhaustive-deps */\n    [],\n  )\n  const showSwitchChainFlow = txChain !== initialChain\n  // const showSwitchChainFlow = true\n  const [hasToSwitchChain, setHasToSwitchChain] = useState<boolean>(showSwitchChainFlow)\n  const [hasToApprove, setHasToApprove] = useState<boolean>(true)\n\n  // Loading state\n  const [loadingSwitchChain, setLoadingSwitchChain] = useState<boolean>(false)\n  const [approveLoading, setApproveLoading] = useState<boolean>(false)\n\n  // Values for regular bonds\n  const estimatedOutputAmount = getPayoutAmount(bondData, depositAmount, promotionalPoints ?? '0')\n  const estimatedOutputUSD = estimatedOutputAmount * parseFloat(bondData?.payoutTokenPrice ?? '0')\n  const preTGEEstimatedOutput = parseFloat(inputValue) / (bondData?.initPrice ?? 0)\n  const preTGEEstimatedOutputUSD = preTGEEstimatedOutput * (bondData?.tgePrice ?? 0)\n\n  const handleSwitchChain = () => {\n    setLoadingSwitchChain(true)\n    switchChainAsync({ chainId: txChain! })\n      .then(() => {\n        setHasToSwitchChain(false)\n        setApproveLoading(true)\n      })\n      .catch((e) => console.error(e))\n      .finally(() => {\n        setLoadingSwitchChain(false)\n      })\n  }\n\n  const handleApprove = () => {\n    setApproveLoading(true)\n    approveCallback?.().catch(() => {\n      setApproveLoading(false)\n    })\n  }\n\n  // Switch Chain Step #1\n  const hasTriggeredSwitch = useRef(false)\n  useEffect(() => {\n    if (hasToSwitchChain && !hasTriggeredSwitch.current) {\n      setLoadingSwitchChain(true)\n      const delay = setTimeout(() => {\n        hasTriggeredSwitch.current = true\n        handleSwitchChain()\n      }, stepDelay)\n      return () => clearTimeout(delay)\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain])\n\n  // Trigger approve Step #2\n  const hasTriggeredApproval = useRef(false)\n  useEffect(() => {\n    if (!hasToSwitchChain || !showSwitchChainFlow) {\n      if (approvalState === ApprovalState.APPROVED) {\n        setApproveLoading(true)\n        const delay = setTimeout(() => {\n          setApproveLoading(false)\n          setHasToApprove(false)\n        }, stepDelay)\n        return () => clearTimeout(delay)\n      } else if (!hasTriggeredApproval.current && approvalState !== ApprovalState.PENDING) {\n        setApproveLoading(true)\n        hasTriggeredApproval.current = true\n        handleApprove()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain, approvalState])\n\n  // Execute main tx Step #3\n  const hasTriggeredTx = useRef(false)\n  useEffect(() => {\n    if (!hasToSwitchChain && !hasToApprove && !hasTriggeredTx.current) {\n      hasTriggeredTx.current = true\n      if (rateChanged) {\n        onDismiss?.()\n      } else {\n        setApproveLoading(false)\n        txCallback?.()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [hasToSwitchChain, hasToApprove, txCallback])\n\n  // Close modal if a hash is found. Final Step\n  const { data: txReceipt, isSuccess, isLoading: verifyingTx } = useMonitorTx(buyTxHash, txChain)\n  useEffect(() => {\n    if (buyTxHash && txReceipt) {\n      if (isSuccess) {\n        onDismiss?.()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [buyTxHash, txReceipt, isSuccess])\n\n  const currentStep: number = showSwitchChainFlow ? (hasToSwitchChain ? 1 : hasToApprove ? 2 : 3) : hasToApprove ? 1 : 2\n  const splited = typeof inputToken !== 'string' ? inputToken?.symbol?.split('-') : undefined\n  const trueBondPrice = findHighestTrueBondPrice(\n    // @ts-ignore\n    TIERS_WEIGHT[getUserTier(promotionalPoints)] ?? '0',\n    bondData?.trueBondPrices,\n  )\n\n  return (\n    <Modal>\n      <ModalHeader onDismiss={onDismiss} hideDivider />\n      <Flex sx={{ flexDirection: 'column', width: '100%' }}>\n        <Flex sx={{ width: '100%', alignItems: 'center', p: '10px' }}>\n          {showSwitchChainFlow && (\n            <StepBubble number={1} title={'Switch Chain'} currentStep={currentStep} loading={loadingSwitchChain} />\n          )}\n          <StepBubble\n            number={showSwitchChainFlow ? 2 : 1}\n            title={'Approve'}\n            currentStep={currentStep}\n            loading={approveLoading || approvalState === ApprovalState.PENDING}\n          />\n          <StepBubble\n            number={showSwitchChainFlow ? 3 : 2}\n            title={'Buy'}\n            currentStep={currentStep}\n            loading={loadingTx || verifyingTx}\n            hideBar\n          />\n        </Flex>\n        <Flex sx={{ width: '100%', mt: '40px', justifyContent: 'center' }}>\n          <LoadingSpinner\n            isLoading={\n              loadingSwitchChain ||\n              approveLoading ||\n              loadingTx ||\n              verifyingTx ||\n              approvalState === ApprovalState.PENDING\n            }\n            size={100}\n          />\n        </Flex>\n        <Flex sx={{ width: '100%', justifyContent: 'center', mt: '10px' }}>\n          {hasToSwitchChain\n            ? loadingSwitchChain\n              ? 'Switching Chain...'\n              : 'Switch Chain'\n            : hasToApprove\n              ? approveLoading || approvalState === ApprovalState.PENDING\n                ? 'Approving...'\n                : 'Approve Contract'\n              : loadingTx || verifyingTx\n                ? 'Buying...'\n                : 'Buy'}\n        </Flex>\n        {bondData.billType === 'fcfs' ? (\n          <Flex sx={{ width: '100%', flexDirection: 'column', mt: '20px' }}>\n            <Flex\n              sx={{\n                width: '100%',\n                background: 'white3',\n                p: '5px',\n                borderRadius: 'normal',\n                color: 'textDisabledButton',\n                justifyContent: 'center',\n              }}\n            >\n              {bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}\n              {!bondData.yieldBond && <>({getTimePeriods(bondData?.vestingTerm).months} Mo)</>}\n            </Flex>\n            <Flex sx={{ width: '100%', background: 'white3', p: '10px', borderRadius: 'normal', mt: '10px' }}>\n              <TokenImage\n                symbol={bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}\n                size={40}\n                chain={txChain}\n              />\n              <Flex sx={{ width: '100%', justifyContent: 'space-between', alignItems: 'center' }}>\n                <Flex sx={{ flexDirection: 'column', fontSize: '12px', ml: '10px' }}>\n                  {bondData.yieldBond ? (\n                    <>{bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol}</>\n                  ) : (\n                    <>\n                      <Flex sx={{ color: 'textDisabledButton', fontWeight: 400, textDecoration: 'line-through' }}>\n                        ${bondData.tgePrice}\n                      </Flex>\n                      <Flex sx={{ color: 'green', fontWeight: 600 }}>${bondData.initPrice}</Flex>\n                    </>\n                  )}\n                </Flex>\n                <Flex\n                  sx={{\n                    p: '5px',\n                    borderRadius: 'normal',\n                    border: '1px solid var(--theme-ui-colors-success)',\n                    background: 'rgba(56, 166, 17, 0.13)',\n                    color: 'success',\n                    lineHeight: '18px',\n                  }}\n                >\n                  {bondData.yieldBond\n                    ? `${bondData.yieldData?.apr.toFixed()} % APR`\n                    : `${trueBondPrice?.bonusWithFee?.toFixed(2)} % Bonus`}\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex sx={{ width: '100%', justifyContent: 'space-between', mt: '10px' }}>\n              <Flex\n                sx={{ p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }}\n              >\n                {isArray(splited) ? (\n                  <TokenImage symbol={splited[0]} symbol2={splited[1]} size={20} chain={txChain} />\n                ) : (\n                  <TokenImage symbol={getSymbol(inputToken, txChain)} size={20} chain={txChain} />\n                )}\n                <Flex sx={{ fontSize: '14px', fontWeight: 600, mx: '5px' }}>\n                  {formatNumberSI(inputValue, 4) ?? '0'}\n                </Flex>\n                <Flex sx={{ color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }}>\n                  (\n                  {inputTokenPrice?.price && inputValue\n                    ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`\n                    : '0.00'}\n                  )\n                </Flex>\n              </Flex>\n              <Arrow direction={'right'} width={'10px'} />\n              <Flex\n                sx={{\n                  p: '10px',\n                  borderRadius: 'normal',\n                  background: 'white3',\n                  alignItems: 'center',\n                  width: '45%',\n                  gap: '5px',\n                }}\n              >\n                <TokenImage\n                  symbol={\n                    bondData.yieldBond\n                      ? bondData.underlyingEarnToken?.symbol || bondData.earnToken?.symbol\n                      : getSymbol(bondData.earnToken, txChain)\n                  }\n                  chain={txChain}\n                  size={20}\n                />\n                {bondData.yieldBond ? (\n                  <Flex sx={{ fontSize: '14px', fontWeight: 600 }}>${formatNumberSI(preTGEEstimatedOutputUSD)}</Flex>\n                ) : (\n                  <>\n                    <Flex sx={{ fontSize: '14px', fontWeight: 600, mx: '5px' }}>\n                      {formatNumberSI(preTGEEstimatedOutput, 4)}\n                    </Flex>\n                    <Flex sx={{ color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }}>\n                      (${formatNumberSI(preTGEEstimatedOutputUSD)})\n                    </Flex>\n                  </>\n                )}\n              </Flex>\n            </Flex>\n          </Flex>\n        ) : (\n          <Flex sx={{ width: '100%', flexDirection: 'column', mt: '20px' }}>\n            <Flex\n              sx={{\n                width: '100%',\n                background: 'white3',\n                p: '5px',\n                borderRadius: 'normal',\n                color: 'textDisabledButton',\n                justifyContent: 'center',\n              }}\n            >\n              {bondData.earnToken.symbol} ({getVestingTermsString(bondData)})\n            </Flex>\n            <Flex sx={{ width: '100%', background: 'white3', p: '10px', borderRadius: 'normal', mt: '10px' }}>\n              <TokenImage symbol={bondData.earnToken.symbol} size={40} chain={txChain} />\n              <Flex sx={{ width: '100%', justifyContent: 'space-between', alignItems: 'center' }}>\n                <Flex sx={{ flexDirection: 'column', fontSize: '12px', ml: '10px' }}>\n                  <Flex sx={{ color: 'textDisabledButton', fontWeight: 400, textDecoration: 'line-through' }}>\n                    ${earnTokenPrice(bondData)}\n                  </Flex>\n                  <Flex sx={{ color: 'green', fontWeight: 600 }}>\n                    $\n                    {discountEarnTokenPriceForUser(\n                      bondData,\n                      SDKConfig.useTiers,\n                      getUserTier(promotionalPoints!) ?? undefined,\n                    )}\n                  </Flex>\n                </Flex>\n                <Flex\n                  sx={{\n                    p: '5px',\n                    borderRadius: 'normal',\n                    border: '1px solid var(--theme-ui-colors-success)',\n                    background: 'rgba(56, 166, 17, 0.13)',\n                    color: 'success',\n                    lineHeight: '18px',\n                  }}\n                >\n                  {bondData.earnToken.symbol.toLowerCase() === 'ireet'\n                    ? '3.00'\n                    : trueBondPrice?.bonusWithFee?.toFixed(2)}{' '}\n                  % Bonus\n                </Flex>\n              </Flex>\n            </Flex>\n            <Flex sx={{ width: '100%', justifyContent: 'space-between', mt: '10px' }}>\n              <Flex\n                sx={{ p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }}\n              >\n                {isArray(splited) ? (\n                  <TokenImage symbol={splited[0]} symbol2={splited[1]} size={20} chain={txChain} />\n                ) : (\n                  <TokenImage symbol={getSymbol(inputToken, txChain)} size={20} chain={txChain} />\n                )}\n                <Flex sx={{ fontSize: '14px', fontWeight: 600, mx: '5px' }}>\n                  {formatNumberSI(inputValue, 4) ?? '0'}\n                </Flex>\n                <Flex sx={{ color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }}>\n                  (\n                  {inputTokenPrice?.price && inputValue\n                    ? `$${formatNumberSI(inputTokenPrice?.price * parseFloat(inputValue))}`\n                    : '0.00'}\n                  )\n                </Flex>\n              </Flex>\n              <Arrow direction={'right'} width={'10px'} />\n              <Flex\n                sx={{ p: '10px', borderRadius: 'normal', background: 'white3', alignItems: 'center', width: '45%' }}\n              >\n                <TokenImage symbol={getSymbol(bondData.earnToken, txChain)} chain={txChain} size={20} />\n                <Flex sx={{ fontSize: '14px', fontWeight: 600, mx: '5px' }}>\n                  {formatNumberSI(estimatedOutputAmount, 4)}\n                </Flex>\n                <Flex sx={{ color: 'textDisabledButton', fontSize: '12px', fontWeight: 400 }}>\n                  (${formatNumberSI(estimatedOutputUSD)})\n                </Flex>\n              </Flex>\n            </Flex>\n          </Flex>\n        )}\n\n        {/*\n\n        Action Buttons\n\n        */}\n        <Flex sx={{ mt: '20px' }}>\n          {hasToSwitchChain ? (\n            <Button load={loadingSwitchChain} disabled={loadingSwitchChain} onClick={handleSwitchChain} fullWidth>\n              switch to {NETWORK_LABEL[txChain!]}\n            </Button>\n          ) : !hasToApprove ? (\n            <Button load={loadingTx || verifyingTx} disabled={loadingTx || verifyingTx} onClick={txCallback} fullWidth>\n              buy\n            </Button>\n          ) : (\n            <Button\n              className=\"action-button\"\n              load={approvalState === ApprovalState.PENDING || approveLoading}\n              disabled={approvalState === ApprovalState.PENDING || approveLoading}\n              onClick={handleApprove}\n              fullWidth\n            >\n              Approve\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n    </Modal>\n  )\n}\n\nexport default TransactionModal\n"],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}

package/dist/views/YourBonds/YourBonds.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 export type SortableKeys = 'claimable' | 'pending' | 'terms';
 declare const YourBonds: ({ showOnly }: {
     showOnly?: string;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => React.JSX.Element;
 export default YourBonds;

package/dist/views/YourBonds/YourBonds.js

@@ -1,7 +1,6 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'theme-ui/jsx-runtime';
 import { useState, useMemo, useCallback } from 'react';
-import Spinner from '../../components/uikit-sdk/Spinner/index.js';
-import Flex from '../../components/uikit-sdk/Flex/index.js';
+import { Flex, Spinner } from 'theme-ui';
 import { claimableUSD, pendingUSD, getTimeLeftForFullyVested } from '../../utils/displayHelpers.js';
 import useUserBonds from '../../state/bonds/useUserBonds.js';
 import useTokenPrices from '../../state/tokenPrices/useTokenPrices.js';
@@ -154,7 +153,7 @@ const YourBonds = ({ showOnly }) => {
     const hasBonds = useMemo(() => {
         return (bondsToRender && bondsToRender.length > 0) || !!preTGEBondsToRender?.length;
     }, [bondsToRender, preTGEBondsToRender]);
-    return (jsxs(Flex, { className: "yourbonds table-container ape:w-full ape:flex ape:flex-col ape:px-[10px]", children: [!showOnly && (jsx(YourBondsMenu, { chainFilterOption: chainFilterOption, setChainFilterOption: setChainFilterOption, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleFilterOption, setInputValue: setInputValue, inputValue: inputValue, handleSort: handleSort })), !account && !solanaAccount && !aptosAccount && !suiAccount ? (jsx(Flex, { className: "placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]", children: jsx(PlaceholderMonkey, { text: 'You are not connected.' }) })) : hasBonds && hasFetched ? (jsxs(Fragment, { children: [preTGEBondsToRender?.map((userBond, index) => {
+    return (jsxs(Flex, { className: "yourbonds table-container", children: [!showOnly && (jsx(YourBondsMenu, { chainFilterOption: chainFilterOption, setChainFilterOption: setChainFilterOption, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleFilterOption, setInputValue: setInputValue, inputValue: inputValue, handleSort: handleSort })), !account && !solanaAccount && !aptosAccount && !suiAccount ? (jsx(Flex, { className: "placeholder-monkey-wrapper", children: jsx(PlaceholderMonkey, { text: 'You are not connected.' }) })) : hasBonds && hasFetched ? (jsxs(Fragment, { children: [preTGEBondsToRender?.map((userBond, index) => {
                         return userBond.yieldBond ? (jsx(UserBondRowYield, { userBond: userBond }, index)) : (jsx(UserBondRowPreTGE, { userBond: userBond }, index));
                     }), bondsToRender.map((bond) => {
                         if (bond.bond?.chainId === ChainId.SOL)
@@ -164,7 +163,12 @@ const YourBonds = ({ showOnly }) => {
                         if (bond.bond?.chainId === ChainId.SUI)
                             return jsx(UserBondRowSui, { bill: bond }, `sui-${bond?.id}`);
                         return jsx(UserBondRow, { bill: bond }, `${bond?.id}-${bond?.billNftAddress}`);
-                    })] })) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (jsx(Flex, { className: "placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]", children: jsx(PlaceholderMonkey, { text: 'No results, change filters.' }) })) : hasFetched && !hasBonds ? (jsx(Flex, { className: "placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]", children: jsx(PlaceholderMonkey, { text: `You do not own any ${[account && 'EVM', solanaAccount && 'SOL', aptosAccount && 'Aptos', suiAccount && 'Sui'].filter(Boolean).join(' nor ') || 'EVM'} Bonds.` }) })) : (jsx(Flex, { className: "placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]", children: jsx(Spinner, { size: 100 }) })), jsxs(Flex, { className: "ape:w-full ape:flex-col ape:xl:flex-row ape:gap-[10px] ape:my-[10px]", children: [!solanaAccount && SDKConfig.chains?.includes(ChainId.SOL) && (jsx(Flex, { className: "ape:w-full ape:mt-[5px]", children: jsx(ConnectToSolanaCard, {}) })), !aptosAccount && SDKConfig.chains?.includes(ChainId.APTOS) && (jsx(Flex, { className: "ape:w-full ape:mt-[5px]", children: jsx(ConnectToAptosBanner, {}) })), !suiAccount && SDKConfig.chains?.includes(ChainId.SUI) && (jsx(Flex, { className: "ape:w-full ape:mt-[5px]", children: jsx(ConnectToSuiBanner, {}) })), !account && (jsx(Flex, { className: "ape:w-full ape:mt-[5px]", children: jsx(ConnectToEVMBanner, {}) }))] })] }));
+                    })] })) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (jsx(Flex, { className: "placeholder-monkey-wrapper", children: jsx(PlaceholderMonkey, { text: 'No results, change filters.' }) })) : hasFetched && !hasBonds ? (jsx(Flex, { className: "placeholder-monkey-wrapper", children: jsx(PlaceholderMonkey, { text: `You do not own any ${[account && 'EVM', solanaAccount && 'SOL', aptosAccount && 'Aptos', suiAccount && 'Sui'].filter(Boolean).join(' nor ') || 'EVM'} Bonds.` }) })) : (jsx(Flex, { className: "placeholder-monkey-wrapper", children: jsx(Spinner, { size: 100 }) })), jsxs(Flex, { sx: {
+                    width: '100%',
+                    flexDirection: ['column', 'column', 'column', 'column', 'column', 'row'],
+                    gap: '10px',
+                    my: '10px',
+                }, children: [!solanaAccount && SDKConfig.chains?.includes(ChainId.SOL) && (jsx(Flex, { sx: { width: '100%', mt: '5px' }, children: jsx(ConnectToSolanaCard, {}) })), !aptosAccount && SDKConfig.chains?.includes(ChainId.APTOS) && (jsx(Flex, { sx: { width: '100%', mt: '5px' }, children: jsx(ConnectToAptosBanner, {}) })), !suiAccount && SDKConfig.chains?.includes(ChainId.SUI) && (jsx(Flex, { sx: { width: '100%', mt: '5px' }, children: jsx(ConnectToSuiBanner, {}) })), !account && (jsx(Flex, { sx: { width: '100%', mt: '5px' }, children: jsx(ConnectToEVMBanner, {}) }))] })] }));
 };
 
 export { YourBonds as default };

package/dist/views/YourBonds/YourBonds.js.map

@@ -1 +1 @@
-{"version":3,"file":"YourBonds.js","sources":["../../../src/views/YourBonds/YourBonds.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react'\nimport Spinner from '../../components/uikit-sdk/Spinner'\nimport Flex from '../../components/uikit-sdk/Flex'\nimport { UserBill } from '../../types/yourbonds'\nimport { claimableUSD, pendingUSD, getTimeLeftForFullyVested } from '../../utils/displayHelpers'\nimport useUserBonds from '../../state/bonds/useUserBonds'\nimport useTokenPrices from '../../state/tokenPrices/useTokenPrices'\nimport PlaceholderMonkey from '../../components/PlaceholderMonkey'\nimport useChainFilterOption from '../../state/chainFilterOption/useChainFilterOption'\nimport YourBondsMenu from './components/YourBondsMenu/YourBondsMenu'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport ConnectToSolanaBanner from '../../components/ConnectoToVmBanners/ConnectToSolanaBanner'\nimport ConnectToEVMBanner from '../../components/ConnectoToVmBanners/ConnectToEvmBanner'\nimport ConnectToAptosBanner from '../../components/ConnectoToVmBanners/ConnectToAptosBanner'\nimport ConnectToSuiBanner from '../../components/ConnectoToVmBanners/ConnectToSuiBanner'\nimport {\n  UserBondRowPreTGE,\n  UserBondRowSolana,\n  UserBondRowAptos,\n  UserBondRowSui,\n  UserBondRow,\n} from './components/UserBondRow'\nimport useUserBondsPreTGE from '../../state/bonds/useUserBondsPreTGE'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport useSOLAccount from '../../hooks/accounts/useSOLAccount'\nimport useAPTAccount from '../../hooks/accounts/useAPTAccount'\nimport useSUIAccount from '../../hooks/accounts/useSUIAccount'\nimport useBondsData from '../../state/bonds/useBondsData'\nimport UserBondRowYield from './components/UserBondRow/UserBondRowYield'\n\ntype SortDirection = 'asc' | 'desc'\nexport type SortableKeys = 'claimable' | 'pending' | 'terms'\n\nconst YourBonds = ({ showOnly }: { showOnly?: string }) => {\n  useTokenPrices()\n  useBondsData()\n  // Hooks\n  const SDKConfig = useSDKConfig()\n  const { address: account } = useEVMAccount()\n  const { publicKey: solanaAccount } = useSOLAccount()\n  const { address: aptosAccount } = useAPTAccount()\n  const { address: suiAccount } = useSUIAccount()\n  const { data: userBonds, isFetched: userBondsFetched } = useUserBonds()\n  const { data: chainFilterOption, setChainFilterOption } = useChainFilterOption()\n  const { data: preTGEUserBonds, isFetched: preTGEFetched } = useUserBondsPreTGE()\n  const hasFetched = userBondsFetched && (preTGEFetched || !account)\n\n  // State\n  const [sortConfig, setSortConfig] = useState<{ key: SortableKeys; direction: SortDirection } | null>({\n    key: 'claimable',\n    direction: 'desc',\n  })\n\n  const [inputValue, setInputValue] = useState('')\n  const filterOptions = ['CLAIMABLE', 'ALL']\n  const [filterOption, setFilterOption] = useState(filterOptions[0])\n\n  const preTGEBondsToRender = preTGEUserBonds\n    ?.filter((userBond) => {\n      if (!userBond?.accountInfo?.hasRedeemed) {\n        return parseFloat(userBond?.accountInfo?.depositAmount ?? '0') > 0\n      } else if (userBond.yieldBond && parseFloat(userBond?.accountInfo?.depositAmount ?? '0') > 0) {\n        return (userBond?.yieldData?.depositedAssets ?? 0) > 0\n      } else {\n        return userBond?.userOwnedBillsData?.payout !== '0'\n      }\n    })\n    .filter(\n      (userBond) =>\n        chainFilterOption.includes(userBond.chainId?.toString() ?? '') || chainFilterOption.includes('All Chains'),\n    )\n    .filter((userBond) => userBond.earnToken.symbol?.toLowerCase().includes(inputValue.toLowerCase()))\n\n  const handleSort = (key: SortableKeys) => {\n    let direction: SortDirection = 'desc'\n    if (sortConfig?.key === key && sortConfig?.direction === 'desc') {\n      direction = 'asc'\n    }\n    setSortConfig({ key, direction })\n  }\n\n  const bondsToRender = useMemo((): UserBill[] => {\n    if (!userBonds) return []\n    let bondsToReturn = userBonds\n\n    // Handle Filtering //\n\n    bondsToReturn = bondsToReturn?.filter((bond) => {\n      return bond.bond?.onlyPartner ? bond.bond.bondPartner === SDKConfig.bondPartner : true\n    })\n\n    if (SDKConfig.bondPartner) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return bond.bond?.bondPartner === SDKConfig.bondPartner\n      })\n    }\n\n    // Filter Single Token View\n    if (showOnly) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return bond?.bond?.earnToken?.symbol?.toLowerCase() === showOnly.toLowerCase()\n      })\n    }\n\n    // Filter by search query\n    if (inputValue !== '') {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return [\n          bond?.bond?.showcaseTokenName?.toLowerCase(),\n          bond?.bond?.earnToken?.symbol?.toLowerCase(),\n          bond?.bond?.lpToken?.symbol?.toLowerCase(),\n        ].some((property) => property?.includes(inputValue.toLowerCase()))\n      })\n    }\n\n    // Filter by chain selector\n    if (!chainFilterOption.includes('All Chains')) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return chainFilterOption.includes(bond?.bond?.chainId?.toString() ?? '')\n      })\n    }\n\n    // Filter by filter option (claimable or all buttons)\n    if (filterOption === 'CLAIMABLE') {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        if (bond?.bond?.vestingCliff) {\n          return bond.payout !== '0'\n        }\n        return bond.pendingRewards !== '0'\n      })\n    }\n\n    // Handle sorting //\n    if (sortConfig !== null) {\n      bondsToReturn = bondsToReturn?.sort((a, b) => {\n        let aValue: number, bValue: number\n\n        if (sortConfig.key === 'claimable') {\n          aValue = claimableUSD(a)\n          bValue = claimableUSD(b)\n        } else if (sortConfig.key === 'pending') {\n          aValue = pendingUSD(a)\n          bValue = pendingUSD(b)\n        } else if (sortConfig.key === 'terms') {\n          // little nasty trick to have the lowest time (closest to being fully vested) show up first when sorting ascending\n          const aRemainingTime = getTimeLeftForFullyVested(b)\n          const bRemainingTime = getTimeLeftForFullyVested(a)\n\n          aValue = aRemainingTime\n          bValue = bRemainingTime\n        } else {\n          aValue = a[sortConfig.key]\n          bValue = b[sortConfig.key]\n        }\n\n        if (aValue < bValue) {\n          return sortConfig.direction === 'asc' ? -1 : 1\n        }\n        if (aValue > bValue) {\n          return sortConfig.direction === 'asc' ? 1 : -1\n        }\n        return 0\n      })\n    }\n    return bondsToReturn\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [userBonds, sortConfig, inputValue, chainFilterOption, filterOption, userBondsFetched])\n\n  const handleFilterOption = useCallback((newOption: string) => {\n    setFilterOption(newOption)\n  }, [])\n\n  const hasBonds = useMemo(() => {\n    return (bondsToRender && bondsToRender.length > 0) || !!preTGEBondsToRender?.length\n  }, [bondsToRender, preTGEBondsToRender])\n\n  return (\n    <Flex className=\"yourbonds table-container ape:w-full ape:flex ape:flex-col ape:px-[10px]\">\n      {!showOnly && (\n        <YourBondsMenu\n          chainFilterOption={chainFilterOption}\n          setChainFilterOption={setChainFilterOption}\n          filterOptions={filterOptions}\n          filterOption={filterOption}\n          setFilterOption={handleFilterOption}\n          setInputValue={setInputValue}\n          inputValue={inputValue}\n          handleSort={handleSort}\n        />\n      )}\n      {!account && !solanaAccount && !aptosAccount && !suiAccount ? (\n        <Flex className=\"placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]\">\n          <PlaceholderMonkey text={'You are not connected.'} />\n        </Flex>\n      ) : hasBonds && hasFetched ? (\n        <>\n          {preTGEBondsToRender?.map((userBond, index) => {\n            return userBond.yieldBond ? (\n              <UserBondRowYield userBond={userBond} key={index} />\n            ) : (\n              <UserBondRowPreTGE userBond={userBond} key={index} />\n            )\n          })}\n          {bondsToRender.map((bond) => {\n            if (bond.bond?.chainId === ChainId.SOL)\n              return <UserBondRowSolana bill={bond} key={`${bond?.billNftAddress}-${bond.id}`} />\n            if (bond.bond?.chainId === ChainId.APTOS) return <UserBondRowAptos bill={bond} key={`aptos-${bond?.id}`} />\n            if (bond.bond?.chainId === ChainId.SUI) return <UserBondRowSui bill={bond} key={`sui-${bond?.id}`} />\n            return <UserBondRow bill={bond} key={`${bond?.id}-${bond?.billNftAddress}`} />\n          })}\n        </>\n      ) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (\n        <Flex className=\"placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]\">\n          <PlaceholderMonkey text={'No results, change filters.'} />\n        </Flex>\n      ) : hasFetched && !hasBonds ? (\n        <Flex className=\"placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]\">\n          <PlaceholderMonkey\n            text={`You do not own any ${[account && 'EVM', solanaAccount && 'SOL', aptosAccount && 'Aptos', suiAccount && 'Sui'].filter(Boolean).join(' nor ') || 'EVM'} Bonds.`}\n          />\n        </Flex>\n      ) : (\n        <Flex className=\"placeholder-monkey-wrapper ape:w-full ape:flex-col ape:pt-[100px] ape:pb-[100px] ape:bg-white2 ape:items-center ape:rounded-[10px] ape:mt-[15px] ape:justify-center ape:h-[400px]\">\n          <Spinner size={100} />\n        </Flex>\n      )}\n      <Flex className=\"ape:w-full ape:flex-col ape:xl:flex-row ape:gap-[10px] ape:my-[10px]\">\n        {!solanaAccount && SDKConfig.chains?.includes(ChainId.SOL) && (\n          <Flex className=\"ape:w-full ape:mt-[5px]\">\n            <ConnectToSolanaBanner />\n          </Flex>\n        )}\n        {!aptosAccount && SDKConfig.chains?.includes(ChainId.APTOS) && (\n          <Flex className=\"ape:w-full ape:mt-[5px]\">\n            <ConnectToAptosBanner />\n          </Flex>\n        )}\n        {!suiAccount && SDKConfig.chains?.includes(ChainId.SUI) && (\n          <Flex className=\"ape:w-full ape:mt-[5px]\">\n            <ConnectToSuiBanner />\n          </Flex>\n        )}\n        {!account && (\n          <Flex className=\"ape:w-full ape:mt-[5px]\">\n            <ConnectToEVMBanner />\n          </Flex>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default YourBonds\n"],"names":["_jsxs","_jsx","_Fragment","ConnectToSolanaBanner"],"mappings":"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"}
+{"version":3,"file":"YourBonds.js","sources":["../../../src/views/YourBonds/YourBonds.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react'\nimport { Flex, Spinner } from 'theme-ui'\nimport { UserBill } from '../../types/yourbonds'\nimport { claimableUSD, pendingUSD, getTimeLeftForFullyVested } from '../../utils/displayHelpers'\nimport useUserBonds from '../../state/bonds/useUserBonds'\nimport useTokenPrices from '../../state/tokenPrices/useTokenPrices'\nimport PlaceholderMonkey from '../../components/PlaceholderMonkey'\nimport useChainFilterOption from '../../state/chainFilterOption/useChainFilterOption'\nimport YourBondsMenu from './components/YourBondsMenu/YourBondsMenu'\nimport { useSDKConfig } from '../../state/useSDKConfig'\nimport { ChainId } from '@ape.swap/apeswap-lists'\nimport ConnectToSolanaBanner from '../../components/ConnectoToVmBanners/ConnectToSolanaBanner'\nimport ConnectToEVMBanner from '../../components/ConnectoToVmBanners/ConnectToEvmBanner'\nimport ConnectToAptosBanner from '../../components/ConnectoToVmBanners/ConnectToAptosBanner'\nimport ConnectToSuiBanner from '../../components/ConnectoToVmBanners/ConnectToSuiBanner'\nimport {\n  UserBondRowPreTGE,\n  UserBondRowSolana,\n  UserBondRowAptos,\n  UserBondRowSui,\n  UserBondRow,\n} from './components/UserBondRow'\nimport useUserBondsPreTGE from '../../state/bonds/useUserBondsPreTGE'\nimport useEVMAccount from '../../hooks/accounts/useEVMAccount'\nimport useSOLAccount from '../../hooks/accounts/useSOLAccount'\nimport useAPTAccount from '../../hooks/accounts/useAPTAccount'\nimport useSUIAccount from '../../hooks/accounts/useSUIAccount'\nimport useBondsData from '../../state/bonds/useBondsData'\nimport UserBondRowYield from './components/UserBondRow/UserBondRowYield'\n\ntype SortDirection = 'asc' | 'desc'\nexport type SortableKeys = 'claimable' | 'pending' | 'terms'\n\nconst YourBonds = ({ showOnly }: { showOnly?: string }) => {\n  useTokenPrices()\n  useBondsData()\n  // Hooks\n  const SDKConfig = useSDKConfig()\n  const { address: account } = useEVMAccount()\n  const { publicKey: solanaAccount } = useSOLAccount()\n  const { address: aptosAccount } = useAPTAccount()\n  const { address: suiAccount } = useSUIAccount()\n  const { data: userBonds, isFetched: userBondsFetched } = useUserBonds()\n  const { data: chainFilterOption, setChainFilterOption } = useChainFilterOption()\n  const { data: preTGEUserBonds, isFetched: preTGEFetched } = useUserBondsPreTGE()\n  const hasFetched = userBondsFetched && (preTGEFetched || !account)\n\n  // State\n  const [sortConfig, setSortConfig] = useState<{ key: SortableKeys; direction: SortDirection } | null>({\n    key: 'claimable',\n    direction: 'desc',\n  })\n\n  const [inputValue, setInputValue] = useState('')\n  const filterOptions = ['CLAIMABLE', 'ALL']\n  const [filterOption, setFilterOption] = useState(filterOptions[0])\n\n  const preTGEBondsToRender = preTGEUserBonds\n    ?.filter((userBond) => {\n      if (!userBond?.accountInfo?.hasRedeemed) {\n        return parseFloat(userBond?.accountInfo?.depositAmount ?? '0') > 0\n      } else if (userBond.yieldBond && parseFloat(userBond?.accountInfo?.depositAmount ?? '0') > 0) {\n        return (userBond?.yieldData?.depositedAssets ?? 0) > 0\n      } else {\n        return userBond?.userOwnedBillsData?.payout !== '0'\n      }\n    })\n    .filter(\n      (userBond) =>\n        chainFilterOption.includes(userBond.chainId?.toString() ?? '') || chainFilterOption.includes('All Chains'),\n    )\n    .filter((userBond) => userBond.earnToken.symbol?.toLowerCase().includes(inputValue.toLowerCase()))\n\n  const handleSort = (key: SortableKeys) => {\n    let direction: SortDirection = 'desc'\n    if (sortConfig?.key === key && sortConfig?.direction === 'desc') {\n      direction = 'asc'\n    }\n    setSortConfig({ key, direction })\n  }\n\n  const bondsToRender = useMemo((): UserBill[] => {\n    if (!userBonds) return []\n    let bondsToReturn = userBonds\n\n    // Handle Filtering //\n\n    bondsToReturn = bondsToReturn?.filter((bond) => {\n      return bond.bond?.onlyPartner ? bond.bond.bondPartner === SDKConfig.bondPartner : true\n    })\n\n    if (SDKConfig.bondPartner) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return bond.bond?.bondPartner === SDKConfig.bondPartner\n      })\n    }\n\n    // Filter Single Token View\n    if (showOnly) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return bond?.bond?.earnToken?.symbol?.toLowerCase() === showOnly.toLowerCase()\n      })\n    }\n\n    // Filter by search query\n    if (inputValue !== '') {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return [\n          bond?.bond?.showcaseTokenName?.toLowerCase(),\n          bond?.bond?.earnToken?.symbol?.toLowerCase(),\n          bond?.bond?.lpToken?.symbol?.toLowerCase(),\n        ].some((property) => property?.includes(inputValue.toLowerCase()))\n      })\n    }\n\n    // Filter by chain selector\n    if (!chainFilterOption.includes('All Chains')) {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        return chainFilterOption.includes(bond?.bond?.chainId?.toString() ?? '')\n      })\n    }\n\n    // Filter by filter option (claimable or all buttons)\n    if (filterOption === 'CLAIMABLE') {\n      bondsToReturn = bondsToReturn?.filter((bond) => {\n        if (bond?.bond?.vestingCliff) {\n          return bond.payout !== '0'\n        }\n        return bond.pendingRewards !== '0'\n      })\n    }\n\n    // Handle sorting //\n    if (sortConfig !== null) {\n      bondsToReturn = bondsToReturn?.sort((a, b) => {\n        let aValue: number, bValue: number\n\n        if (sortConfig.key === 'claimable') {\n          aValue = claimableUSD(a)\n          bValue = claimableUSD(b)\n        } else if (sortConfig.key === 'pending') {\n          aValue = pendingUSD(a)\n          bValue = pendingUSD(b)\n        } else if (sortConfig.key === 'terms') {\n          // little nasty trick to have the lowest time (closest to being fully vested) show up first when sorting ascending\n          const aRemainingTime = getTimeLeftForFullyVested(b)\n          const bRemainingTime = getTimeLeftForFullyVested(a)\n\n          aValue = aRemainingTime\n          bValue = bRemainingTime\n        } else {\n          aValue = a[sortConfig.key]\n          bValue = b[sortConfig.key]\n        }\n\n        if (aValue < bValue) {\n          return sortConfig.direction === 'asc' ? -1 : 1\n        }\n        if (aValue > bValue) {\n          return sortConfig.direction === 'asc' ? 1 : -1\n        }\n        return 0\n      })\n    }\n    return bondsToReturn\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [userBonds, sortConfig, inputValue, chainFilterOption, filterOption, userBondsFetched])\n\n  const handleFilterOption = useCallback((newOption: string) => {\n    setFilterOption(newOption)\n  }, [])\n\n  const hasBonds = useMemo(() => {\n    return (bondsToRender && bondsToRender.length > 0) || !!preTGEBondsToRender?.length\n  }, [bondsToRender, preTGEBondsToRender])\n\n  return (\n    <Flex className=\"yourbonds table-container\">\n      {!showOnly && (\n        <YourBondsMenu\n          chainFilterOption={chainFilterOption}\n          setChainFilterOption={setChainFilterOption}\n          filterOptions={filterOptions}\n          filterOption={filterOption}\n          setFilterOption={handleFilterOption}\n          setInputValue={setInputValue}\n          inputValue={inputValue}\n          handleSort={handleSort}\n        />\n      )}\n      {!account && !solanaAccount && !aptosAccount && !suiAccount ? (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <PlaceholderMonkey text={'You are not connected.'} />\n        </Flex>\n      ) : hasBonds && hasFetched ? (\n        <>\n          {preTGEBondsToRender?.map((userBond, index) => {\n            return userBond.yieldBond ? (\n              <UserBondRowYield userBond={userBond} key={index} />\n            ) : (\n              <UserBondRowPreTGE userBond={userBond} key={index} />\n            )\n          })}\n          {bondsToRender.map((bond) => {\n            if (bond.bond?.chainId === ChainId.SOL)\n              return <UserBondRowSolana bill={bond} key={`${bond?.billNftAddress}-${bond.id}`} />\n            if (bond.bond?.chainId === ChainId.APTOS) return <UserBondRowAptos bill={bond} key={`aptos-${bond?.id}`} />\n            if (bond.bond?.chainId === ChainId.SUI) return <UserBondRowSui bill={bond} key={`sui-${bond?.id}`} />\n            return <UserBondRow bill={bond} key={`${bond?.id}-${bond?.billNftAddress}`} />\n          })}\n        </>\n      ) : inputValue !== '' || !chainFilterOption.includes('All Chains') ? (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <PlaceholderMonkey text={'No results, change filters.'} />\n        </Flex>\n      ) : hasFetched && !hasBonds ? (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <PlaceholderMonkey\n            text={`You do not own any ${[account && 'EVM', solanaAccount && 'SOL', aptosAccount && 'Aptos', suiAccount && 'Sui'].filter(Boolean).join(' nor ') || 'EVM'} Bonds.`}\n          />\n        </Flex>\n      ) : (\n        <Flex className=\"placeholder-monkey-wrapper\">\n          <Spinner size={100} />\n        </Flex>\n      )}\n      <Flex\n        sx={{\n          width: '100%',\n          flexDirection: ['column', 'column', 'column', 'column', 'column', 'row'],\n          gap: '10px',\n          my: '10px',\n        }}\n      >\n        {!solanaAccount && SDKConfig.chains?.includes(ChainId.SOL) && (\n          <Flex sx={{ width: '100%', mt: '5px' }}>\n            <ConnectToSolanaBanner />\n          </Flex>\n        )}\n        {!aptosAccount && SDKConfig.chains?.includes(ChainId.APTOS) && (\n          <Flex sx={{ width: '100%', mt: '5px' }}>\n            <ConnectToAptosBanner />\n          </Flex>\n        )}\n        {!suiAccount && SDKConfig.chains?.includes(ChainId.SUI) && (\n          <Flex sx={{ width: '100%', mt: '5px' }}>\n            <ConnectToSuiBanner />\n          </Flex>\n        )}\n        {!account && (\n          <Flex sx={{ width: '100%', mt: '5px' }}>\n            <ConnectToEVMBanner />\n          </Flex>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default YourBonds\n"],"names":["_jsxs","_jsx","_Fragment","ConnectToSolanaBanner"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAM,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAyB,KAAI;AACxD,IAAA,cAAc,EAAE;AAChB,IAAA,YAAY,EAAE;;AAEd,IAAA,MAAM,SAAS,GAAG,YAAY,EAAE;IAChC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,aAAa,EAAE;IAC5C,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,aAAa,EAAE;IACpD,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,aAAa,EAAE;IACjD,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,aAAa,EAAE;AAC/C,IAAA,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,GAAG,YAAY,EAAE;IACvE,MAAM,EAAE,IAAI,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,GAAG,oBAAoB,EAAE;AAChF,IAAA,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,kBAAkB,EAAE;IAChF,MAAM,UAAU,GAAG,gBAAgB,KAAK,aAAa,IAAI,CAAC,OAAO,CAAC;;AAGlE,IAAA,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAyD;AACnG,QAAA,GAAG,EAAE,WAAW;AAChB,QAAA,SAAS,EAAE,MAAM;AAClB,KAAA,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC;AAChD,IAAA,MAAM,aAAa,GAAG,CAAC,WAAW,EAAE,KAAK,CAAC;AAC1C,IAAA,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;IAElE,MAAM,mBAAmB,GAAG;AAC1B,UAAE,MAAM,CAAC,CAAC,QAAQ,KAAI;AACpB,QAAA,IAAI,CAAC,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE;AACvC,YAAA,OAAO,UAAU,CAAC,QAAQ,EAAE,WAAW,EAAE,aAAa,IAAI,GAAG,CAAC,GAAG,CAAC;QACpE;AAAO,aAAA,IAAI,QAAQ,CAAC,SAAS,IAAI,UAAU,CAAC,QAAQ,EAAE,WAAW,EAAE,aAAa,IAAI,GAAG,CAAC,GAAG,CAAC,EAAE;YAC5F,OAAO,CAAC,QAAQ,EAAE,SAAS,EAAE,eAAe,IAAI,CAAC,IAAI,CAAC;QACxD;aAAO;AACL,YAAA,OAAO,QAAQ,EAAE,kBAAkB,EAAE,MAAM,KAAK,GAAG;QACrD;AACF,IAAA,CAAC;SACA,MAAM,CACL,CAAC,QAAQ,KACP,iBAAiB,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,IAAI,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC;SAE7G,MAAM,CAAC,CAAC,QAAQ,KAAK,QAAQ,CAAC,SAAS,CAAC,MAAM,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;AAEpG,IAAA,MAAM,UAAU,GAAG,CAAC,GAAiB,KAAI;QACvC,IAAI,SAAS,GAAkB,MAAM;AACrC,QAAA,IAAI,UAAU,EAAE,GAAG,KAAK,GAAG,IAAI,UAAU,EAAE,SAAS,KAAK,MAAM,EAAE;YAC/D,SAAS,GAAG,KAAK;QACnB;AACA,QAAA,aAAa,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC;AACnC,IAAA,CAAC;AAED,IAAA,MAAM,aAAa,GAAG,OAAO,CAAC,MAAiB;AAC7C,QAAA,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,EAAE;QACzB,IAAI,aAAa,GAAG,SAAS;;QAI7B,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;YAC7C,OAAO,IAAI,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,KAAK,SAAS,CAAC,WAAW,GAAG,IAAI;AACxF,QAAA,CAAC,CAAC;AAEF,QAAA,IAAI,SAAS,CAAC,WAAW,EAAE;YACzB,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;gBAC7C,OAAO,IAAI,CAAC,IAAI,EAAE,WAAW,KAAK,SAAS,CAAC,WAAW;AACzD,YAAA,CAAC,CAAC;QACJ;;QAGA,IAAI,QAAQ,EAAE;YACZ,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;AAC7C,gBAAA,OAAO,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,QAAQ,CAAC,WAAW,EAAE;AAChF,YAAA,CAAC,CAAC;QACJ;;AAGA,QAAA,IAAI,UAAU,KAAK,EAAE,EAAE;YACrB,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;gBAC7C,OAAO;AACL,oBAAA,IAAI,EAAE,IAAI,EAAE,iBAAiB,EAAE,WAAW,EAAE;oBAC5C,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE;oBAC5C,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE;AAC3C,iBAAA,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAK,QAAQ,EAAE,QAAQ,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;AACpE,YAAA,CAAC,CAAC;QACJ;;QAGA,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE;YAC7C,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;AAC7C,gBAAA,OAAO,iBAAiB,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AAC1E,YAAA,CAAC,CAAC;QACJ;;AAGA,QAAA,IAAI,YAAY,KAAK,WAAW,EAAE;YAChC,aAAa,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC,IAAI,KAAI;AAC7C,gBAAA,IAAI,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE;AAC5B,oBAAA,OAAO,IAAI,CAAC,MAAM,KAAK,GAAG;gBAC5B;AACA,gBAAA,OAAO,IAAI,CAAC,cAAc,KAAK,GAAG;AACpC,YAAA,CAAC,CAAC;QACJ;;AAGA,QAAA,IAAI,UAAU,KAAK,IAAI,EAAE;YACvB,aAAa,GAAG,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAI;gBAC3C,IAAI,MAAc,EAAE,MAAc;AAElC,gBAAA,IAAI,UAAU,CAAC,GAAG,KAAK,WAAW,EAAE;AAClC,oBAAA,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC;AACxB,oBAAA,MAAM,GAAG,YAAY,CAAC,CAAC,CAAC;gBAC1B;AAAO,qBAAA,IAAI,UAAU,CAAC,GAAG,KAAK,SAAS,EAAE;AACvC,oBAAA,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC;AACtB,oBAAA,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC;gBACxB;AAAO,qBAAA,IAAI,UAAU,CAAC,GAAG,KAAK,OAAO,EAAE;;AAErC,oBAAA,MAAM,cAAc,GAAG,yBAAyB,CAAC,CAAC,CAAC;AACnD,oBAAA,MAAM,cAAc,GAAG,yBAAyB,CAAC,CAAC,CAAC;oBAEnD,MAAM,GAAG,cAAc;oBACvB,MAAM,GAAG,cAAc;gBACzB;qBAAO;AACL,oBAAA,MAAM,GAAG,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC;AAC1B,oBAAA,MAAM,GAAG,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC;gBAC5B;AAEA,gBAAA,IAAI,MAAM,GAAG,MAAM,EAAE;AACnB,oBAAA,OAAO,UAAU,CAAC,SAAS,KAAK,KAAK,GAAG,EAAE,GAAG,CAAC;gBAChD;AACA,gBAAA,IAAI,MAAM,GAAG,MAAM,EAAE;AACnB,oBAAA,OAAO,UAAU,CAAC,SAAS,KAAK,KAAK,GAAG,CAAC,GAAG,EAAE;gBAChD;AACA,gBAAA,OAAO,CAAC;AACV,YAAA,CAAC,CAAC;QACJ;AACA,QAAA,OAAO,aAAa;;AAEtB,IAAA,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,iBAAiB,EAAE,YAAY,EAAE,gBAAgB,CAAC,CAAC;AAE1F,IAAA,MAAM,kBAAkB,GAAG,WAAW,CAAC,CAAC,SAAiB,KAAI;QAC3D,eAAe,CAAC,SAAS,CAAC;IAC5B,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,QAAQ,GAAG,OAAO,CAAC,MAAK;AAC5B,QAAA,OAAO,CAAC,aAAa,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC,mBAAmB,EAAE,MAAM;AACrF,IAAA,CAAC,EAAE,CAAC,aAAa,EAAE,mBAAmB,CAAC,CAAC;IAExC,QACEA,KAAC,IAAI,EAAA,EAAC,SAAS,EAAC,2BAA2B,EAAA,QAAA,EAAA,CACxC,CAAC,QAAQ,KACRC,GAAA,CAAC,aAAa,IACZ,iBAAiB,EAAE,iBAAiB,EACpC,oBAAoB,EAAE,oBAAoB,EAC1C,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,kBAAkB,EACnC,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EAAA,CACtB,CACH,EACA,CAAC,OAAO,IAAI,CAAC,aAAa,IAAI,CAAC,YAAY,IAAI,CAAC,UAAU,IACzDA,GAAA,CAAC,IAAI,IAAC,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAC1CA,GAAA,CAAC,iBAAiB,EAAA,EAAC,IAAI,EAAE,wBAAwB,EAAA,CAAI,EAAA,CAChD,IACL,QAAQ,IAAI,UAAU,IACxBD,IAAA,CAAAE,QAAA,EAAA,EAAA,QAAA,EAAA,CACG,mBAAmB,EAAE,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,KAAI;AAC5C,wBAAA,OAAO,QAAQ,CAAC,SAAS,IACvBD,GAAA,CAAC,gBAAgB,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAA,EAAO,KAAK,CAAI,KAEpDA,IAAC,iBAAiB,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAA,EAAO,KAAK,CAAI,CACtD;oBACH,CAAC,CAAC,EACD,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;wBAC1B,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG;AACpC,4BAAA,OAAOA,IAAC,iBAAiB,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAO,CAAA,EAAG,IAAI,EAAE,cAAc,CAAA,CAAA,EAAI,IAAI,CAAC,EAAE,CAAA,CAAE,CAAI;wBACrF,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC,KAAK;AAAE,4BAAA,OAAOA,GAAA,CAAC,gBAAgB,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAO,CAAA,MAAA,EAAS,IAAI,EAAE,EAAE,CAAA,CAAE,CAAI;wBAC3G,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,KAAK,OAAO,CAAC,GAAG;AAAE,4BAAA,OAAOA,GAAA,CAAC,cAAc,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAO,CAAA,IAAA,EAAO,IAAI,EAAE,EAAE,CAAA,CAAE,CAAI;AACrG,wBAAA,OAAOA,IAAC,WAAW,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAO,CAAA,EAAG,IAAI,EAAE,EAAE,CAAA,CAAA,EAAI,IAAI,EAAE,cAAc,CAAA,CAAE,CAAI;oBAChF,CAAC,CAAC,CAAA,EAAA,CACD,IACD,UAAU,KAAK,EAAE,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC,IAChEA,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAC1CA,IAAC,iBAAiB,EAAA,EAAC,IAAI,EAAE,6BAA6B,EAAA,CAAI,EAAA,CACrD,IACL,UAAU,IAAI,CAAC,QAAQ,IACzBA,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAC1CA,GAAA,CAAC,iBAAiB,EAAA,EAChB,IAAI,EAAE,CAAA,mBAAA,EAAsB,CAAC,OAAO,IAAI,KAAK,EAAE,aAAa,IAAI,KAAK,EAAE,YAAY,IAAI,OAAO,EAAE,UAAU,IAAI,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,KAAK,SAAS,EAAA,CACpK,EAAA,CACG,KAEPA,GAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAC,4BAA4B,EAAA,QAAA,EAC1CA,GAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,GAAG,EAAA,CAAI,EAAA,CACjB,CACR,EACDD,IAAA,CAAC,IAAI,EAAA,EACH,EAAE,EAAE;AACF,oBAAA,KAAK,EAAE,MAAM;AACb,oBAAA,aAAa,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC;AACxE,oBAAA,GAAG,EAAE,MAAM;AACX,oBAAA,EAAE,EAAE,MAAM;AACX,iBAAA,EAAA,QAAA,EAAA,CAEA,CAAC,aAAa,IAAI,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KACxDC,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,YACpCA,GAAA,CAACE,mBAAqB,EAAA,EAAA,CAAG,EAAA,CACpB,CACR,EACA,CAAC,YAAY,IAAI,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,KACzDF,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EACpCA,GAAA,CAAC,oBAAoB,EAAA,EAAA,CAAG,EAAA,CACnB,CACR,EACA,CAAC,UAAU,IAAI,SAAS,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KACrDA,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EACpCA,GAAA,CAAC,kBAAkB,EAAA,EAAA,CAAG,EAAA,CACjB,CACR,EACA,CAAC,OAAO,KACPA,GAAA,CAAC,IAAI,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAA,QAAA,EACpCA,GAAA,CAAC,kBAAkB,EAAA,EAAA,CAAG,EAAA,CACjB,CACR,CAAA,EAAA,CACI,CAAA,EAAA,CACF;AAEX;;;;"}

package/dist/views/YourBonds/components/ClaimAll/ClaimAllModal.d.ts

@@ -1,2 +1,3 @@
-declare const ClaimAllModal: () => import("react/jsx-runtime").JSX.Element;
+import React from 'react';
+declare const ClaimAllModal: () => React.JSX.Element;
 export default ClaimAllModal;

package/dist/views/YourBonds/components/ClaimAll/ClaimAllModal.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'theme-ui/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { useSwitchChain, useWriteContract } from 'wagmi';
 import { ChainId } from '@ape.swap/apeswap-lists';
@@ -224,13 +224,32 @@ const ClaimAllModal = () => {
         }
         /* eslint-disable react-hooks/exhaustive-deps */
     }, [purchasedBillsChains?.length]);
-    return (jsx(Modal, { title: "Claim All", className: "ape:w-[420px]", children: viewAllChains ? (jsxs(Fragment, { children: [jsxs(Flex, { className: "ape:justify-between ape:mb-[20px]", children: [jsx(Flex, { onClick: () => setViewAllChains(false), className: "ape:hover:cursor-pointer", children: jsx(Arrow, { width: "10px", direction: "left" }) }), jsx(Text, { size: "16px", weight: 300, children: "All Chain Options" })] }), jsx(ChainOptionsList, { setSelectedChain: setSelectedChain, setViewAllChains: setViewAllChains, chainList: chains })] })) : (jsxs(Flex, { className: "ape:flex-col ape:w-full", children: [jsx(Text, { size: "14px", weight: 400, className: "ape:my-[10px]", children: "Select the chain from which you want to claim your Bonds." }), jsx(ChainOptionsButtons, { setSelectedChain: setSelectedChain, selectedChain: selectedChain, setViewAllChains: setViewAllChains, chainList: purchasedBillsChains ?? [] }), jsx(Flex, { className: "ape:w-full ape:mt-[10px] ape:bg-white3 ape:rounded-normal ape:p-[10px] ape:flex-col ape:h-[30vh] ape:overflow-y-auto", children: bondsOfSelectedChain && bondsOfSelectedChain?.length > 0 ? (bondsOfSelectedChain
+    return (jsx(Modal, { title: "Claim All", sx: { width: '420px' }, children: viewAllChains ? (jsxs(Fragment, { children: [jsxs(Flex, { sx: { justifyContent: 'space-between', mb: '20px' }, children: [jsx(Flex, { onClick: () => setViewAllChains(false), sx: {
+                                ':hover': {
+                                    cursor: 'pointer',
+                                },
+                            }, children: jsx(Arrow, { width: "10px", direction: "left" }) }), jsx(Text, { sx: { fontSize: '16px', fontWeight: '300' }, children: "All Chain Options" })] }), jsx(ChainOptionsList, { setSelectedChain: setSelectedChain, setViewAllChains: setViewAllChains, chainList: chains })] })) : (jsxs(Flex, { sx: { flexDirection: 'column', width: '100%' }, children: [jsx(Text, { sx: { fontSize: '14px', fontWeight: 400, my: '10px' }, children: "Select the chain from which you want to claim your Bonds." }), jsx(ChainOptionsButtons, { setSelectedChain: setSelectedChain, selectedChain: selectedChain, setViewAllChains: setViewAllChains, chainList: purchasedBillsChains ?? [] }), jsx(Flex, { sx: {
+                        width: '100%',
+                        mt: '10px',
+                        background: 'white3',
+                        borderRadius: 'normal',
+                        p: '10px',
+                        flexDirection: 'column',
+                        height: '30vh',
+                        overflowY: 'auto',
+                    }, children: bondsOfSelectedChain && bondsOfSelectedChain?.length > 0 ? (bondsOfSelectedChain
                         ?.filter((userBill) => userBill.bond.chainId === selectedChain)
                         .map((ownedBill, index) => {
-                        return (jsxs(Flex, { className: "ape:w-full ape:items-center ape:p-[5px]", children: [jsx(TokenImage, { symbol: ownedBill.bond.earnToken.symbol, size: 30 }), jsxs(Text, { className: "ape:ml-[10px]", children: [ownedBill.bond.earnToken.symbol, jsxs(Text, { size: "14px", weight: 400, className: "ape:ml-[10px]", style: { color: 'var(--ape-color-text-disabled-button)' }, children: ["(", ownedBill?.userOwnedBills?.length, " Bond", ownedBill?.userOwnedBills && ownedBill?.userOwnedBills?.length > 1 ? 's' : '', ")"] })] })] }, `${ownedBill.bond.earnToken.symbol}-${index}`));
-                    })) : (jsx(Flex, { className: "ape:text-[14px] ape:font-normal ape:justify-center ape:mt-[10px]", style: { color: 'var(--ape-color-text-disabled-button)' }, children: "No bonds to claim for this chain" })) }), jsxs(Text, { size: "14px", weight: 400, className: "ape:mt-[15px]", children: [`You'll claim`, " ", ownedBillsAmount, " Bonds in", ' ', isAptosChain ? ownedBillsAmount : isSuiChain ? 1 : bondsOfSelectedChain?.length, " transaction", (isAptosChain ? (ownedBillsAmount ?? 0) : isSuiChain ? 0 : (bondsOfSelectedChain?.length ?? 0)) > 1
+                        return (jsxs(Flex, { sx: { width: '100%', alignItems: 'center', p: '5px' }, children: [jsx(TokenImage, { symbol: ownedBill.bond.earnToken.symbol, size: 30 }), jsxs(Text, { sx: { ml: '10px' }, children: [ownedBill.bond.earnToken.symbol, jsxs(Text, { sx: { fontSize: '14px', fontWeight: 400, color: 'textDisabledButton', ml: '10px' }, children: ["(", ownedBill?.userOwnedBills?.length, " Bond", ownedBill?.userOwnedBills && ownedBill?.userOwnedBills?.length > 1 ? 's' : '', ")"] })] })] }, `${ownedBill.bond.earnToken.symbol}-${index}`));
+                    })) : (jsx(Flex, { sx: {
+                            fontSize: '14px',
+                            fontWeight: 400,
+                            color: 'textDisabledButton',
+                            justifyContent: 'center',
+                            mt: '10px',
+                        }, children: "No bonds to claim for this chain" })) }), jsxs(Text, { sx: { fontSize: '14px', fontWeight: 400, mt: '15px' }, children: [`You'll claim`, " ", ownedBillsAmount, " Bonds in", ' ', isAptosChain ? ownedBillsAmount : isSuiChain ? 1 : bondsOfSelectedChain?.length, " transaction", (isAptosChain ? (ownedBillsAmount ?? 0) : isSuiChain ? 0 : (bondsOfSelectedChain?.length ?? 0)) > 1
                             ? 's'
-                            : '', "."] }), isSuiChain ? (jsx(Button, { className: "ape:mt-[15px] ape:w-full", onClick: handleClaim, disabled: !suiAccount || loadingTx || !ownedBillsAmount, load: loadingTx, children: !suiAccount ? 'Connect Sui Wallet' : 'Claim' })) : isAptosChain ? (jsx(Button, { className: "ape:mt-[15px] ape:w-full", onClick: handleClaim, disabled: !aptosAccount || loadingTx || !ownedBillsAmount, load: loadingTx, children: !aptosAccount ? 'Connect Aptos Wallet' : 'Claim' })) : chainId === selectedChain ? (jsx(Button, { className: "ape:mt-[15px] ape:w-full", onClick: handleClaim, children: "Claim" })) : (jsxs(Button, { className: "ape:mt-[15px] ape:w-full", onClick: () => switchChain({ chainId: selectedChain }), children: ["Switch to ", NETWORK_LABEL[selectedChain ?? 0]] }))] })) }));
+                            : '', "."] }), isSuiChain ? (jsx(Button, { sx: { mt: '15px', width: '100%' }, onClick: handleClaim, disabled: !suiAccount || loadingTx || !ownedBillsAmount, load: loadingTx, children: !suiAccount ? 'Connect Sui Wallet' : 'Claim' })) : isAptosChain ? (jsx(Button, { sx: { mt: '15px', width: '100%' }, onClick: handleClaim, disabled: !aptosAccount || loadingTx || !ownedBillsAmount, load: loadingTx, children: !aptosAccount ? 'Connect Aptos Wallet' : 'Claim' })) : chainId === selectedChain ? (jsx(Button, { sx: { mt: '15px', width: '100%' }, onClick: handleClaim, children: "Claim" })) : (jsxs(Button, { sx: { mt: '15px', width: '100%' }, onClick: () => switchChain({ chainId: selectedChain }), children: ["Switch to ", NETWORK_LABEL[selectedChain ?? 0]] }))] })) }));
 };
 
 export { ClaimAllModal as default };