@ape.swap/bonds-sdk 1.0.386 → 1.0.388

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 (3) hide show
  1. package/dist/components/Bonds/Bonds.js +59 -39
  2. package/dist/scss/Bonds.scss +2 -2
  3. package/package.json +1 -1
package/dist/components/Bonds/Bonds.js CHANGED
@@ -151,21 +151,56 @@ var Bonds = function (_a) {
151
151
  return true;
152
152
  return ((_b = new BigNumber(bond.tokensRemaining)) === null || _b === void 0 ? void 0 : _b.lte(thresholdToHide)) || bond.discount === 100;
153
153
  }, []);
154
- // const sortedBonds = bondData.sort((a, b) => {
155
- // const aIsHot = hotBonds.includes(a.billAddress.toLowerCase()) && (a.discount ?? 0) > 0;
156
- // const bIsHot = hotBonds.includes(b.billAddress.toLowerCase()) && (b.discount ?? 0) > 0;
157
- // if (aIsHot && !bIsHot) {
158
- // return -1;
159
- // }
160
- // else if (!aIsHot && bIsHot) {
161
- // return 1;
162
- // }
163
- // else {
164
- // return b.discount - a.discount;
165
- // }
166
- // });
167
- var _f = useState(false), isModalOpen = _f[0], setIsModalOpen = _f[1];
168
- var _g = useState(null), selectedBond = _g[0], setSelectedBond = _g[1];
154
+ var sortedHotBonds = bondData.sort(function (a, b) {
155
+ var _a, _b;
156
+ var aIsHot = hotBonds.includes(a.billAddress.toLowerCase()) && ((_a = a.discount) !== null && _a !== void 0 ? _a : 0) > 0;
157
+ var bIsHot = hotBonds.includes(b.billAddress.toLowerCase()) && ((_b = b.discount) !== null && _b !== void 0 ? _b : 0) > 0;
158
+ if (aIsHot && !bIsHot) {
159
+ return -1;
160
+ }
161
+ else if (!aIsHot && bIsHot) {
162
+ return 1;
163
+ }
164
+ else {
165
+ return b.discount - a.discount;
166
+ }
167
+ });
168
+ var _f = useState({ key: 'discount', direction: 'asc' }), sortConfig = _f[0], setSortConfig = _f[1];
169
+ var _g = useState(bondData), sortedBonds = _g[0], setSortedBonds = _g[1];
170
+ var handleSort = function (key) {
171
+ var direction = 'asc';
172
+ if (sortConfig.key === key && sortConfig.direction === 'asc') {
173
+ direction = 'desc';
174
+ }
175
+ setSortConfig({ key: key, direction: direction });
176
+ };
177
+ useEffect(function () {
178
+ var sorted = __spreadArray([], bondData, true).sort(function (a, b) {
179
+ var aValue, bValue;
180
+ if (sortConfig.key === 'ARR') {
181
+ aValue = calculateARR(a);
182
+ bValue = calculateARR(b);
183
+ }
184
+ else if (sortConfig.key === 'tokensRemaining') {
185
+ aValue = remainingPercentage(a);
186
+ bValue = remainingPercentage(b);
187
+ }
188
+ else {
189
+ aValue = a[sortConfig.key];
190
+ bValue = b[sortConfig.key];
191
+ }
192
+ if (aValue < bValue) {
193
+ return sortConfig.direction === 'asc' ? -1 : 1;
194
+ }
195
+ if (aValue > bValue) {
196
+ return sortConfig.direction === 'asc' ? 1 : -1;
197
+ }
198
+ return 0;
199
+ });
200
+ setSortedBonds(sorted);
201
+ }, [sortConfig, sortedHotBonds]);
202
+ var _h = useState(false), isModalOpen = _h[0], setIsModalOpen = _h[1];
203
+ var _j = useState(null), selectedBond = _j[0], setSelectedBond = _j[1];
169
204
  var rowClick = function (bond) {
170
205
  setSelectedBond(bond);
171
206
  setIsModalOpen(true);
@@ -195,30 +230,15 @@ var Bonds = function (_a) {
195
230
  var explorerLink = BLOCK_EXPLORER[selectedChain];
196
231
  return "".concat(explorerLink, "/address/").concat(bond === null || bond === void 0 ? void 0 : bond.billAddress);
197
232
  };
198
- var _h = useState({ key: 'discount', direction: 'asc' }), sortConfig = _h[0], setSortConfig = _h[1];
199
- var _j = useState(bondData), sortedBonds = _j[0], setSortedBonds = _j[1];
200
- var handleSort = function (key) {
201
- var direction = 'asc';
202
- if (sortConfig.key === key && sortConfig.direction === 'asc') {
203
- direction = 'desc';
204
- }
205
- setSortConfig({ key: key, direction: direction });
233
+ var calculateARR = function (bond) {
234
+ var _a;
235
+ var discount = (_a = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _a !== void 0 ? _a : 0;
236
+ var vestingDays = vestingTime(bond.vestingTerm).days;
237
+ return parseFloat((((discount * 365) / vestingDays).toFixed(2)));
206
238
  };
207
- useEffect(function () {
208
- var sorted = __spreadArray([], bondData, true).sort(function (a, b) {
209
- if (a[sortConfig.key] < b[sortConfig.key]) {
210
- return sortConfig.direction === 'asc' ? -1 : 1;
211
- }
212
- if (a[sortConfig.key] > b[sortConfig.key]) {
213
- return sortConfig.direction === 'asc' ? 1 : -1;
214
- }
215
- return 0;
216
- });
217
- setSortedBonds(sorted);
218
- }, [sortConfig, bondData]);
219
- return (_jsxs(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: [isActive && account && _jsx("p", { children: account }), isActive && account && _jsx("button", __assign({ onClick: handleApprove }, { children: "Approve USDT" })), _jsxs(Flex, __assign({ className: "container table-container" }, { children: [_jsxs(Flex, __assign({ className: "container header-container" }, { children: [_jsxs(Flex, __assign({ className: "column column-tokens" }, { children: [_jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: "Tokens" })), _jsx(Flex, { className: "column column-tokenicons" })] })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsxs(Flex, __assign({ className: "column column-discount" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(18%, -4%)" }, { children: ["Discount", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return handleSort('discount'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-arr" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(8%, -5%)" }, { children: ["ARR", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-term" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomRight", transformTip: "translate(11%, -5%)" }, { children: ["Terms", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-tokensremaining" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.TokensRemaining }), width: "230px", placement: "bottomRight", transformTip: "translate(12%, -4%)" }, { children: ["Tokens Remaining", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsx(Flex, { className: "column column-hotbond" })] }))] })), sortedBonds.map(function (bond) {
220
- var _a, _b, _c, _d, _e;
221
- return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bond); } }, { children: [_jsxs(Flex, __assign({ className: "column column-tokens" }, { children: [_jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: _jsx(TokenInfoAndName, { bill: bond }) })), _jsx(Flex, __assign({ className: "column column-tokenicons" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Tooltip, { tokenContract: (bond === null || bond === void 0 ? void 0 : bond.payoutToken) || '', secondURL: getBillContractURL(bond), secondURLTitle: 'View Bond Contract', thirdURL: "https://dashboard.ape.bond/bond/".concat((_a = bond === null || bond === void 0 ? void 0 : bond.billAddress) === null || _a === void 0 ? void 0 : _a.toLowerCase()), thirdURLTitle: 'View Insights', twitter: bond === null || bond === void 0 ? void 0 : bond.twitter, projectLink: bond === null || bond === void 0 ? void 0 : bond.projectLink, audit: bond === null || bond === void 0 ? void 0 : bond.audit, chain: (_b = bond.chainId) !== null && _b !== void 0 ? _b : ChainId.BSC }), width: "205px", placement: "bottomRight", transformTip: "translate(11%, 0%)" }, { children: _jsx(Svg, { icon: "more", width: "20px" }) })) }))] })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsx(Flex, __assign({ className: "column column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: "".concat((_c = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _c === void 0 ? void 0 : _c.toFixed(2), "%") })), _jsx(Flex, __assign({ className: "column column-arr" }, { children: "".concat(((((_d = bond === null || bond === void 0 ? void 0 : bond.discount) !== null && _d !== void 0 ? _d : 0) * 365) / vestingTime(bond.vestingTerm).days).toFixed(2), "%") })), _jsx(Flex, __assign({ className: "column column-term" }, { children: vestingTime(bond.vestingTerm).days ? "".concat(vestingTime(bond.vestingTerm).days, " D") : '-' })), _jsx(Flex, __assign({ className: "column column-tokensremaining" }, { children: _jsx(ProgressBarWrapper, { title: '', value: _jsx(ProgressBar, { value: remainingPercentage(bond) }), style: {
239
+ return (_jsxs(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: [isActive && account && _jsx("p", { children: account }), isActive && account && _jsx("button", __assign({ onClick: handleApprove }, { children: "Approve USDT" })), _jsxs(Flex, __assign({ className: "container table-container" }, { children: [_jsxs(Flex, __assign({ className: "container header-container" }, { children: [_jsxs(Flex, __assign({ className: "column column-tokens" }, { children: [_jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: "Tokens" })), _jsx(Flex, { className: "column column-tokenicons" })] })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsxs(Flex, __assign({ className: "column column-discount" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Discount }), width: "230px", placement: "bottomLeft", transformTip: "translate(18%, -4%)" }, { children: ["Discount", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return handleSort('discount'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-arr" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.ARR }), width: "230px", placement: "bottomLeft", transformTip: "translate(8%, -5%)" }, { children: ["ARR", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return handleSort('ARR'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-terms" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.Terms }), width: "230px", placement: "bottomRight", transformTip: "translate(11%, -5%)" }, { children: ["Terms", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return handleSort('vestingTerm'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsxs(Flex, __assign({ className: "column column-tokensremaining" }, { children: [_jsx(Flex, __assign({ className: "column tooltip" }, { children: _jsxs(TooltipBubble, __assign({ body: _jsx(Flex, { children: TooltipText.TokensRemaining }), width: "230px", placement: "bottomRight", transformTip: "translate(12%, -4%)" }, { children: ["Tokens Remaining", _jsx(Flex, __assign({ className: "column header-icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return handleSort('tokensRemaining'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px" }) }))] })), _jsx(Flex, { className: "column column-hotbond" })] }))] })), sortedBonds.map(function (bond) {
240
+ var _a, _b, _c, _d;
241
+ return (_jsxs(Flex, __assign({ className: "container bondrow-container", onClick: function () { return rowClick(bond); } }, { children: [_jsxs(Flex, __assign({ className: "column column-tokens" }, { children: [_jsx(Flex, __assign({ className: "column column-tokeninfoname" }, { children: _jsx(TokenInfoAndName, { bill: bond }) })), _jsx(Flex, __assign({ className: "column column-tokenicons" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Tooltip, { tokenContract: (bond === null || bond === void 0 ? void 0 : bond.payoutToken) || '', secondURL: getBillContractURL(bond), secondURLTitle: 'View Bond Contract', thirdURL: "https://dashboard.ape.bond/bond/".concat((_a = bond === null || bond === void 0 ? void 0 : bond.billAddress) === null || _a === void 0 ? void 0 : _a.toLowerCase()), thirdURLTitle: 'View Insights', twitter: bond === null || bond === void 0 ? void 0 : bond.twitter, projectLink: bond === null || bond === void 0 ? void 0 : bond.projectLink, audit: bond === null || bond === void 0 ? void 0 : bond.audit, chain: (_b = bond.chainId) !== null && _b !== void 0 ? _b : ChainId.BSC }), width: "205px", placement: "bottomRight", transformTip: "translate(11%, 0%)" }, { children: _jsx(Svg, { icon: "more", width: "20px" }) })) }))] })), _jsxs(Flex, __assign({ className: "column column-bondinfo" }, { children: [_jsx(Flex, __assign({ className: "column column-discount ".concat(getDiscountColor(bond === null || bond === void 0 ? void 0 : bond.discount)) }, { children: "".concat((_c = bond === null || bond === void 0 ? void 0 : bond.discount) === null || _c === void 0 ? void 0 : _c.toFixed(2), "%") })), _jsxs(Flex, __assign({ className: "column column-arr" }, { children: [calculateARR(bond), "%"] })), _jsx(Flex, __assign({ className: "column column-term" }, { children: vestingTime(bond.vestingTerm).days ? "".concat(vestingTime(bond.vestingTerm).days, " D") : '-' })), _jsx(Flex, __assign({ className: "column column-tokensremaining" }, { children: _jsx(ProgressBarWrapper, { title: '', value: _jsx(ProgressBar, { value: remainingPercentage(bond) }), style: {
222
242
  width: '127px',
223
243
  height: '25px',
224
244
  flexDirection: 'column',
@@ -227,7 +247,7 @@ var Bonds = function (_a) {
227
247
  }, showTooltip: true, toolTip: "".concat(remainingTokensFormat(bond), " ").concat(bond.payoutTokenName, " (").concat(formatDollar({
228
248
  num: remainingTokensUsd(bond).toNumber(),
229
249
  isPrice: true,
230
- }), ")") }) })), _jsx(Flex, __assign({ className: "column column-hotbond" }, { children: _jsx(Flex, __assign({ className: "column column-icon" }, { children: hotBonds.includes(bond.billAddress.toLowerCase()) && ((_e = bond.discount) !== null && _e !== void 0 ? _e : 0) > 0 && (_jsx(Svg, { icon: "hot", width: "20px" })) })) }))] }))] }), bond.billAddress));
250
+ }), ")") }) })), _jsx(Flex, __assign({ className: "column column-hotbond" }, { children: _jsx(Flex, __assign({ className: "column column-icon" }, { children: hotBonds.includes(bond.billAddress.toLowerCase()) && ((_d = bond.discount) !== null && _d !== void 0 ? _d : 0) > 0 && (_jsx(Svg, { icon: "hot", width: "20px" })) })) }))] }))] }), bond.billAddress));
231
251
  })] }))] })));
232
252
  };
233
253
  export default Bonds;
package/dist/scss/Bonds.scss CHANGED
@@ -77,7 +77,7 @@
77
77
  flex-direction: row;
78
78
  align-items: center;
79
79
  justify-content: end;
80
- width: 60%;
80
+ width: 70%;
81
81
  }
82
82
 
83
83
  .column.column-discount {
@@ -104,7 +104,7 @@
104
104
  width: 20%;
105
105
  }
106
106
 
107
- .column.column-term {
107
+ .column.column-terms {
108
108
  flex-direction: row;
109
109
  justify-content: center;
110
110
  align-items: center;
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.386",
6
+ "version": "1.0.388",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.es.js",
9
9
  "types": "dist/index.d.ts",