@ape.swap/bonds-sdk 1.0.628 → 1.0.629

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/components/Modals/BondModal/BondModal.js +15 -15
  2. package/dist/components/Modals/YourBondsModal/YourBondsModal.js +11 -11
  3. package/dist/pages/YourBonds/YourBonds.js +2 -3
  4. package/package.json +1 -1
package/dist/components/Modals/BondModal/BondModal.js CHANGED
@@ -60,13 +60,22 @@ var BondModal = function (_a) {
60
60
  var account = _a.account, isActive = _a.isActive, isOpen = _a.isOpen, accountChainId = _a.accountChainId, onClose = _a.onClose, bondAddress = _a.bondAddress;
61
61
  if (!isOpen)
62
62
  return null;
63
- var _b = useWriteContract(), hash = _b.data, isPending = _b.isPending, writeContract = _b.writeContract, writeContractAsync = _b.writeContractAsync;
64
- var _c = useWaitForTransactionReceipt({
63
+ var _b = useState([]), bondData = _b[0], setBondData = _b[1];
64
+ var _c = useWriteContract(), hash = _c.data, isPending = _c.isPending, writeContract = _c.writeContract, writeContractAsync = _c.writeContractAsync;
65
+ var _d = useWaitForTransactionReceipt({
65
66
  confirmations: 4,
66
- chainId: accountChainId,
67
+ chainId: accountChainId !== null && accountChainId !== void 0 ? accountChainId : bondData[0].chainId,
67
68
  hash: hash,
68
- }), isConfirming = _c.isLoading, isConfirmed = _c.isSuccess;
69
- var _d = useState([]), bondData = _d[0], setBondData = _d[1];
69
+ }), isConfirming = _d.isLoading, isConfirmed = _d.isSuccess;
70
+ var _e = useState(null), approveTx = _e[0], setApproveTx = _e[1];
71
+ var _f = useState(null), toastMessage = _f[0], setToastMessage = _f[1];
72
+ var _g = useState(null), buyTx = _g[0], setBuyTx = _g[1];
73
+ var _h = useState(null), tokenBalance = _h[0], setTokenBalance = _h[1];
74
+ var _j = useState(null), tokenDecimals = _j[0], setTokenDecimals = _j[1];
75
+ var _k = useState(''), inputValue = _k[0], setInputValue = _k[1];
76
+ var handleInputChange = function (event) {
77
+ setInputValue(event.target.value);
78
+ };
70
79
  //This is a temp solution, but we will force approval each time, and then once set we will set status here and allow
71
80
  //user to buy
72
81
  //Check with Fede if this needs to be temp, if we force approval everytime, isn't this fine?
@@ -109,7 +118,6 @@ var BondModal = function (_a) {
109
118
  }
110
119
  });
111
120
  }); };
112
- var _e = useState(null), buyTx = _e[0], setBuyTx = _e[1];
113
121
  //You approve the token, not the contract (this code will have to be updated for zap)
114
122
  var handleApprove = function () { return __awaiter(void 0, void 0, void 0, function () {
115
123
  var tokenAddress, decimals, amount, tx, error_2;
@@ -143,16 +151,13 @@ var BondModal = function (_a) {
143
151
  }
144
152
  });
145
153
  }); };
146
- var _f = useState(null), approveTx = _f[0], setApproveTx = _f[1];
147
- var _g = useState(null), toastMessage = _g[0], setToastMessage = _g[1];
154
+ // Confirmation message
148
155
  useEffect(function () {
149
156
  if (isConfirmed) {
150
157
  setToastMessage("Transaction Complete.");
151
158
  setTimeout(function () { return setToastMessage(null); }, 10000);
152
159
  }
153
160
  }, [approveTx, buyTx, isConfirmed]);
154
- var _h = useState(null), tokenBalance = _h[0], setTokenBalance = _h[1];
155
- var _j = useState(null), tokenDecimals = _j[0], setTokenDecimals = _j[1];
156
161
  useEffect(function () {
157
162
  if (isActive && account && bondData.length > 0) {
158
163
  getTokenBalance(bondData[0].chainId, bondData[0].principalToken, account).then(function (_a) {
@@ -183,7 +188,6 @@ var BondModal = function (_a) {
183
188
  case 2:
184
189
  balance = _a.sent();
185
190
  balanceInEther = ethers.utils.formatUnits(balance, decimals);
186
- console.log("Token Balance: ".concat(balanceInEther));
187
191
  return [2 /*return*/, { balanceInEther: balanceInEther, decimals: decimals }];
188
192
  case 3:
189
193
  error_3 = _a.sent();
@@ -225,10 +229,6 @@ var BondModal = function (_a) {
225
229
  var singlePurchaseLimit = new BigNumber((_c = bond === null || bond === void 0 ? void 0 : bond.maxPayout) !== null && _c !== void 0 ? _c : 0).div(new BigNumber(10).pow((_d = bond === null || bond === void 0 ? void 0 : bond.payoutTokenDecimals) !== null && _d !== void 0 ? _d : 18));
226
230
  return !available ? 0 : (singlePurchaseLimit.lt(safeAvailable) ? singlePurchaseLimit : safeAvailable);
227
231
  };
228
- var _k = useState(''), inputValue = _k[0], setInputValue = _k[1];
229
- var handleInputChange = function (event) {
230
- setInputValue(event.target.value);
231
- };
232
232
  return (_jsx(ThemeUIProvider, { theme: defaultTheme, children: bondData.map(function (bond) {
233
233
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
234
234
  return (_jsx(React.Fragment, { children: _jsx(Flex, { className: "modal modal-backdrop", children: _jsxs(Flex, { className: "modal modal-content", children: [toastMessage && (_jsx(Flex, { className: "toast", children: toastMessage })), _jsx(Flex, { className: "modal modal-header", children: _jsx(Flex, { className: "svg-close", onClick: onClose, children: _jsx(Svg, { icon: "close" }) }) }), _jsxs(Flex, { className: "modal-container table-container", children: [_jsxs(Flex, { className: "modal-container title-container", children: [_jsx(Flex, { className: "title-container bondicon", children: _jsxs("div", { className: "icon-container", children: [_jsx(Svg, { width: 20, height: 20, icon: (_a = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[bond.chainId]) !== null && _a !== void 0 ? _a : 'question' }), _jsx(TokenImage, { symbol: (_b = bond.showcaseTokenName) !== null && _b !== void 0 ? _b : bond.payoutTokenName, size: 50 })] }) }), _jsx(Flex, { className: "title-container bondname", children: bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName }), _jsxs(Flex, { className: "title-container price-container", children: [_jsxs(Flex, { className: "price-container price", children: ["$", earnTokenPrice(bond)] }), _jsxs(Flex, { className: "price-container discounted", children: ["$", discountEarnTokenPrice(bond)] })] }), _jsx(Flex, { className: "title-container tokentags", children: _jsx(ListTag, { text: (_c = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _c === void 0 ? void 0 : _c[0], variant: ((_d = bond === null || bond === void 0 ? void 0 : bond.tags) === null || _d === void 0 ? void 0 : _d[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) })] }), _jsx(Flex, { className: "modal-container description-container", children: bond === null || bond === void 0 ? void 0 : bond.shortDescription }), _jsxs(Flex, { className: "modal-container blocks-container", children: [_jsxs(Flex, { className: "modal-block column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)), children: [_jsxs(Flex, { className: "block-header header", children: ["Discount", _jsx(TooltipBubble, { body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), "".concat((_e = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _e === void 0 ? void 0 : _e.toFixed(2), "%")] }), _jsxs(Flex, { className: "modal-block column-arr", children: [_jsxs(Flex, { className: "block-header header", children: ["ARR", _jsx(TooltipBubble, { body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), "".concat(((((_f = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _f !== void 0 ? _f : 0) * 365) / vestingTime((_g = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _g !== void 0 ? _g : 0).days).toFixed(2), "%")] }), _jsxs(Flex, { className: "modal-block column-term", children: [_jsxs(Flex, { className: "block-header header", children: ["Terms", _jsx(TooltipBubble, { body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), vestingTime((_h = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _h !== void 0 ? _h : 0).days ? "".concat(vestingTime((_j = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _j !== void 0 ? _j : 0).days, " D") : '-'] }), _jsxs(Flex, { className: "modal-block column-maxbuy", children: [_jsxs(Flex, { className: "block-header header", children: ["Max Buy", _jsx(TooltipBubble, { body: _jsx(Flex, { children: TooltipText.MaxBuy(bond.payoutTokenName) }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), (_k = parseFloat(maxBuy(bond).toFixed(0))) === null || _k === void 0 ? void 0 : _k.toLocaleString('en-US')] })] }), _jsxs(Flex, { className: "modal-container text-container", children: [_jsxs(Flex, { className: "text-container row", children: [_jsx(Flex, { className: "row-container spend", children: "You spend:" }), _jsxs(Flex, { className: "row-container spend-val", children: [youSpend(inputValue), " ", bond.principalTokenName, " = $ ", formatUSDNumber(youSpendUSD(bond, inputValue))] })] }), _jsxs(Flex, { className: "text-container row", children: [_jsxs(Flex, { className: "row-container premium", children: ["Premium:", _jsx(TooltipBubble, { body: _jsx(Flex, { children: TooltipText.Premium }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "row-container premium-icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) })] }), _jsxs(Flex, { className: "row-container premium-val ".concat(getPremiumColor(bond, inputValue)), children: ["$ ", premium(bond, inputValue)] })] }), _jsxs(Flex, { className: "text-container row", children: [_jsxs(Flex, { className: "row-container get", children: ["You get (over ", vestingTime((_l = bond === null || bond === void 0 ? void 0 : bond.vestingTerm) !== null && _l !== void 0 ? _l : 0).days, " days):"] }), _jsxs(Flex, { className: "row-container get-val", children: [youGet(bond, inputValue), " ", bond === null || bond === void 0 ? void 0 : bond.showcaseTokenName, " = $ ", formatUSDNumber(youGetUSD(bond, inputValue))] })] })] }), _jsxs(Flex, { className: "modal-container input-container", children: [_jsxs(Flex, { className: "input-container inputrow", children: [_jsx(Flex, { className: "input-container input", children: _jsx(Input, { placeholder: "0.0", value: inputValue, pattern: "^[0-9]*[.,]?[0-9]*$", onChange: handleInputChange, onInput: function (v) {
package/dist/components/Modals/YourBondsModal/YourBondsModal.js CHANGED
@@ -38,7 +38,6 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "theme-ui/jsx-
38
38
  /** @jsxImportSource theme-ui */
39
39
  import React, { useEffect, useState } from 'react';
40
40
  import { Flex } from 'theme-ui';
41
- import { useWeb3React } from '@web3-react/core';
42
41
  import { BigNumber } from 'bignumber.js';
43
42
  import { AnimatePresence, motion } from 'framer-motion';
44
43
  import { NETWORK_ICONS } from '../../../config/constants/chains';
@@ -51,20 +50,22 @@ import { getPendingVesting } from '../../../hooks/usePendingVesting';
51
50
  import { formatNumberSI } from '../../../utils/formatNumber';
52
51
  import { StyledHeadingText, TraitsContentContainer } from './styles';
53
52
  import '../../../scss/YourBondsModal.scss';
54
- import { useWaitForTransactionReceipt, useWriteContract } from 'wagmi';
53
+ import { useChainId, useWaitForTransactionReceipt, useWriteContract } from 'wagmi';
55
54
  import BOND_ABI from '../../../config/abi/bond.json';
56
55
  var YourBondsModal = function (_a) {
57
56
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
58
57
  var isOpen = _a.isOpen, onClose = _a.onClose, userBill = _a.userBill;
59
58
  if (!isOpen)
60
59
  return null;
61
- var _s = useWeb3React(), account = _s.account, chainId = _s.chainId, isActive = _s.isActive;
62
- var _t = useWriteContract(), hash = _t.data, isPending = _t.isPending, writeContract = _t.writeContract, writeContractAsync = _t.writeContractAsync;
63
- var _u = useWaitForTransactionReceipt({
60
+ var chainId = useChainId();
61
+ var _s = useWriteContract(), hash = _s.data, isPending = _s.isPending, writeContract = _s.writeContract, writeContractAsync = _s.writeContractAsync;
62
+ var _t = useWaitForTransactionReceipt({
64
63
  confirmations: 4,
65
64
  chainId: userBill === null || userBill === void 0 ? void 0 : userBill.bond.chainId,
66
65
  hash: hash,
67
- }), isConfirming = _u.isLoading, isConfirmed = _u.isSuccess;
66
+ }), isConfirming = _t.isLoading, isConfirmed = _t.isSuccess;
67
+ var _u = useState(null), claimTx = _u[0], setClaimTx = _u[1];
68
+ var _v = useState(null), toastMessage = _v[0], setToastMessage = _v[1];
68
69
  var handleClaim = function (billId, billAddress) { return __awaiter(void 0, void 0, void 0, function () {
69
70
  var address, tx, error_1;
70
71
  return __generator(this, function (_a) {
@@ -94,8 +95,7 @@ var YourBondsModal = function (_a) {
94
95
  }
95
96
  });
96
97
  }); };
97
- var _v = useState(null), claimTx = _v[0], setClaimTx = _v[1];
98
- var _w = useState(null), toastMessage = _w[0], setToastMessage = _w[1];
98
+ // Confirmation message
99
99
  useEffect(function () {
100
100
  if (isConfirmed) {
101
101
  setToastMessage("Transaction Complete.");
@@ -116,8 +116,8 @@ var YourBondsModal = function (_a) {
116
116
  return getFirstNonZeroDigits(parseFloat((_a = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0'));
117
117
  };
118
118
  var BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation'];
119
- var _x = useState(false), isOpenTraits = _x[0], setIsOpenTraits = _x[1];
120
- var _y = useState(false), billRendered = _y[0], setBillRendered = _y[1];
119
+ var _w = useState(false), isOpenTraits = _w[0], setIsOpenTraits = _w[1];
120
+ var _x = useState(false), billRendered = _x[0], setBillRendered = _x[1];
121
121
  var attributes = (_c = (_b = userBill.nftData) === null || _b === void 0 ? void 0 : _b.data.attributes) === null || _c === void 0 ? void 0 : _c.filter(function (attrib) { return BILL_ATTRIBUTES.includes(attrib.trait_type); });
122
122
  return (_jsx(_Fragment, { children: _jsx(React.Fragment, { children: _jsx(Flex, { className: "yourbondsmodal backdrop", children: _jsxs(Flex, { className: "yourbondsmodal content", children: [toastMessage && (_jsx(Flex, { className: "toast", children: toastMessage })), _jsx(Flex, { className: "yourbondsmodal header", children: _jsx(Flex, { className: "svg-close", onClick: onClose, children: _jsx(Svg, { icon: "close" }) }) }), _jsxs(Flex, { className: "yourbondsmodal table-container", children: [_jsx(Flex, { className: "yourbondsmodal bondimage", children: _jsx("img", { src: (_d = userBill.nftData) === null || _d === void 0 ? void 0 : _d.data.image }) }), _jsxs(Flex, { className: "yourbondsmodal yourbondinfo", children: [_jsxs(Flex, { className: "yourbondinfo title-container", children: [_jsx(Flex, { className: "title-container bondicon", children: _jsxs("div", { className: "icon-container", children: [_jsx(Svg, { width: 18, height: 18, icon: (_e = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _e !== void 0 ? _e : 'question' }), _jsx(TokenImage, { symbol: (_f = userBill.bond.showcaseTokenName) !== null && _f !== void 0 ? _f : userBill.bond.payoutTokenName, size: 40 })] }) }), _jsx(Flex, { className: "title-container tokenname", children: _jsx(StyledHeadingText, { children: (_g = userBill.bond) === null || _g === void 0 ? void 0 : _g.showcaseTokenName }) }), _jsx(Flex, { className: "title-container tokentags", children: (_h = userBill.bond.tags) === null || _h === void 0 ? void 0 : _h.slice(0, 1).map(function (tag) {
123
123
  return (_jsx(Flex, { sx: { marginRight: '10px' }, children: _jsx(ListTag, { variant: tag === 'Cex Fund' ? 'cex_fund' : 'liquidity', text: tag === null || tag === void 0 ? void 0 : tag.toUpperCase() }) }, tag));
@@ -132,6 +132,6 @@ var YourBondsModal = function (_a) {
132
132
  ? attributes.map(function (a) { return (_jsxs(TraitsContentContainer, { children: [_jsx(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a === null || a === void 0 ? void 0 : a.trait_type }), _jsx(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: a === null || a === void 0 ? void 0 : a.value })] }, a.value)); })
133
133
  : BILL_ATTRIBUTES.map(function (attrib) {
134
134
  return (_jsxs(TraitsContentContainer, { children: [_jsx(Text, { sx: { fontSize: '10px', fontWeight: 500 }, children: attrib }), _jsx(Skeleton, { width: "150px" })] }, attrib));
135
- }) }) })) })] }) }), _jsxs(Flex, { className: "yourbondinfo-block row-vested", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, { className: "block-info text", children: _jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: getPendingVesting((_j = userBill.lastBlockTimestamp) !== null && _j !== void 0 ? _j : '', (_k = userBill.vesting) !== null && _k !== void 0 ? _k : '') }) })] })] }), _jsxs(Flex, { className: "yourbondinfo-block row-pending", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Pending" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon", children: _jsxs("div", { className: "icon-container-small", children: [_jsx(Svg, { width: 10, height: 10, icon: (_l = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _l !== void 0 ? _l : 'question' }), _jsx(TokenImage, { symbol: (_m = userBill.bond.showcaseTokenName) !== null && _m !== void 0 ? _m : userBill.bond.payoutTokenName, size: 25 })] }) }), _jsxs(Flex, { className: "block-info text", children: [_jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), _jsx(Text, { sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' }, children: "($".concat((totalPending(userBill) * ((_o = parseFloat(earnTokenPrice(userBill.bond))) !== null && _o !== void 0 ? _o : 0)).toFixed(2), ")") })] })] })] }), _jsxs(Flex, { className: "yourbondinfo-block row-claimable", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Claimable" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon", children: _jsxs("div", { className: "icon-container-small", children: [_jsx(Svg, { width: 10, height: 10, icon: (_p = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _p !== void 0 ? _p : 'question' }), _jsx(TokenImage, { symbol: (_q = userBill.bond.showcaseTokenName) !== null && _q !== void 0 ? _q : userBill.bond.payoutTokenName, size: 25 })] }) }), _jsxs(Flex, { className: "block-info text", children: [_jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) }), _jsx(Text, { sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' }, children: "($".concat((claimable(userBill) * ((_r = parseFloat(earnTokenPrice(userBill.bond))) !== null && _r !== void 0 ? _r : 0)).toFixed(2), ")") })] })] })] })] }), _jsxs(Flex, { className: "yourbondinfo button-container", children: [_jsx(Flex, { className: "button-container claim", children: _jsx(Button, { disabled: claimable(userBill) === 0 || isPending, onClick: function () { return handleClaim(userBill.id, userBill.address); }, children: "CLAIM" }) }), _jsx(Flex, { className: "button-container transfer", children: _jsx(Button, { variant: "secondary", onClick: function () { window.open('https://ape.bond/swap', '_blank'); }, children: "TRANSFER" }) })] })] })] })] }) }) }, userBill.address) }));
135
+ }) }) })) })] }) }), _jsxs(Flex, { className: "yourbondinfo-block row-vested", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Fully Vested" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, { className: "block-info text", children: _jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: getPendingVesting((_j = userBill.lastBlockTimestamp) !== null && _j !== void 0 ? _j : '', (_k = userBill.vesting) !== null && _k !== void 0 ? _k : '') }) })] })] }), _jsxs(Flex, { className: "yourbondinfo-block row-pending", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Pending" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon", children: _jsxs("div", { className: "icon-container-small", children: [_jsx(Svg, { width: 10, height: 10, icon: (_l = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _l !== void 0 ? _l : 'question' }), _jsx(TokenImage, { symbol: (_m = userBill.bond.showcaseTokenName) !== null && _m !== void 0 ? _m : userBill.bond.payoutTokenName, size: 25 })] }) }), _jsxs(Flex, { className: "block-info text", children: [_jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) }), _jsx(Text, { sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' }, children: "($".concat((totalPending(userBill) * ((_o = parseFloat(earnTokenPrice(userBill.bond))) !== null && _o !== void 0 ? _o : 0)).toFixed(2), ")") })] })] })] }), _jsxs(Flex, { className: "yourbondinfo-block row-claimable", children: [_jsxs(Flex, { className: "yourbondinfo-block header", children: [_jsx(Flex, { className: "yourbondinfo-block header-title", children: "Claimable" }), _jsx(Flex, { className: "yourbondinfo-block header-tooltip", children: _jsx(TooltipBubble, { body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)", children: _jsx(Flex, { className: "block-header icon", children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }) }) })] }), _jsxs(Flex, { className: "yourbondinfo-block info", children: [_jsx(Flex, { className: "block-info icon", children: _jsxs("div", { className: "icon-container-small", children: [_jsx(Svg, { width: 10, height: 10, icon: (_p = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _p !== void 0 ? _p : 'question' }), _jsx(TokenImage, { symbol: (_q = userBill.bond.showcaseTokenName) !== null && _q !== void 0 ? _q : userBill.bond.payoutTokenName, size: 25 })] }) }), _jsxs(Flex, { className: "block-info text", children: [_jsx(Text, { sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 }, children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) }), _jsx(Text, { sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' }, children: "($".concat((claimable(userBill) * ((_r = parseFloat(earnTokenPrice(userBill.bond))) !== null && _r !== void 0 ? _r : 0)).toFixed(2), ")") })] })] })] })] }), _jsxs(Flex, { className: "yourbondinfo button-container", children: [_jsx(Flex, { className: "button-container claim", children: _jsx(Button, { disabled: claimable(userBill) === 0 || isPending, onClick: function () { return handleClaim(userBill.id, userBill.address); }, children: "CLAIM" }) }), _jsx(Flex, { className: "button-container transfer", children: _jsx(Button, { variant: "secondary", disabled: true, onClick: function () { window.open('https://ape.bond/swap', '_blank'); }, children: "TRANSFER" }) })] })] })] })] }) }) }, userBill.address) }));
136
136
  };
137
137
  export default YourBondsModal;
package/dist/pages/YourBonds/YourBonds.js CHANGED
@@ -47,7 +47,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "theme-ui/jsx-runtime";
47
47
  /** @jsxImportSource theme-ui */
48
48
  import { useEffect, useState } from 'react';
49
49
  import { Flex, ThemeUIProvider } from 'theme-ui';
50
- import { useWeb3React } from '@web3-react/core';
51
50
  import getTimePeriods from '../../utils/getTimePeriods';
52
51
  import { defaultTheme } from '../../theme';
53
52
  import '../../scss/YourBonds.scss';
@@ -65,7 +64,7 @@ import { fetchUserOwnedBillsDataAsync } from './fetchBillsUser';
65
64
  import { Input } from '../../components/uikit-sdk/Input';
66
65
  import { YourBondsModal } from "../../index";
67
66
  import BOND_ABI from '../../config/abi/bond.json';
68
- import { useWaitForTransactionReceipt, useWriteContract } from 'wagmi';
67
+ import { useChainId, useWaitForTransactionReceipt, useWriteContract } from 'wagmi';
69
68
  var YourBonds = function (_a) {
70
69
  var account = _a.account, accountChainId = _a.accountChainId;
71
70
  var _b = useWriteContract(), hash = _b.data, isPending = _b.isPending, writeContract = _b.writeContract, writeContractAsync = _b.writeContractAsync;
@@ -203,7 +202,7 @@ var YourBonds = function (_a) {
203
202
  setSortedBonds(sorted);
204
203
  }, [sortConfig, mappedUserBills]);
205
204
  // Functions for calculations
206
- var chainId = useWeb3React().chainId;
205
+ var chainId = useChainId();
207
206
  var currentTime = useCurrentTime() / 1000;
208
207
  var vestingTimeRemaining = function (userBill) {
209
208
  return getTimePeriods(parseInt(userBill.lastBlockTimestamp) + parseInt(userBill.vesting) - currentTime, true);
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Ape Bond SDK",
4
4
  "author": "Ape Bond",
5
5
  "license": "MIT",
6
- "version": "1.0.628",
6
+ "version": "1.0.629",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.es.js",
9
9
  "types": "dist/index.d.ts",