@ape.swap/bonds-sdk 1.0.372 → 1.0.374

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.
@@ -59,7 +59,7 @@ import { TooltipBubble, Button, Svg, ListTag, Skeleton, Text } from '../uikit-sd
59
59
  import { UserBillTooltipText } from '../../enum/tooltips';
60
60
  import TokenImage from '../uikit-sdk/TokenImage';
61
61
  import { getBalanceNumber } from '../../utils/getBalanceNumber';
62
- import { MAINNET_CHAINS } from '../../config/constants/chains';
62
+ import { MAINNET_CHAINS, NETWORK_ICONS } from '../../config/constants/chains';
63
63
  import { getPendingVesting } from '../../hooks/usePendingVesting';
64
64
  import { formatNumberSI } from '../../utils/formatNumber';
65
65
  import { fetchUserOwnedBillsDataAsync } from '../YourBonds/fetchBillsUser';
@@ -122,14 +122,14 @@ var YourBondsModal = function (_a) {
122
122
  var BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation'];
123
123
  var _e = useState(false), isOpenTraits = _e[0], setIsOpenTraits = _e[1];
124
124
  return (_jsx(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: userOwnedBillsData.flat().map(function (data) {
125
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
125
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
126
126
  var userBill = data.userOwnedBills.find(function (bill) { return bill.bond.billAddress.toLowerCase() === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); });
127
127
  console.log("USER BILL LOG");
128
128
  console.log(userBill);
129
129
  var attributes = (_b = (_a = userBill === null || userBill === void 0 ? void 0 : userBill.nftData) === null || _a === void 0 ? void 0 : _a.data.attributes) === null || _b === void 0 ? void 0 : _b.filter(function (attrib) { return BILL_ATTRIBUTES.includes(attrib.trait_type); });
130
130
  console.log("ATTRIBUTES LOG");
131
131
  console.log(attributes);
132
- return userBill ? (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "yourbondsmodal backdrop" }, { children: _jsxs(Flex, __assign({ className: "yourbondsmodal content" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "yourbondsmodal table-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal bondimage" }, { children: _jsx("img", { src: (_c = userBill.nftData) === null || _c === void 0 ? void 0 : _c.data.image }) })), _jsxs(Flex, __assign({ className: "yourbondsmodal yourbondinfo" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsx(TokenImage, { symbol: (_d = userBill.bond.showcaseTokenName) !== null && _d !== void 0 ? _d : userBill.bond.payoutTokenName, size: 40 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: _jsx(StyledHeadingText, { children: (_e = userBill.bond) === null || _e === void 0 ? void 0 : _e.showcaseTokenName }) })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: (_f = userBill.bond.tags) === null || _f === void 0 ? void 0 : _f.slice(0, 1).map(function (tag) {
132
+ return userBill ? (_jsx(React.Fragment, { children: _jsx(Flex, __assign({ className: "yourbondsmodal backdrop" }, { children: _jsxs(Flex, __assign({ className: "yourbondsmodal content" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal header" }, { children: _jsx(Flex, __assign({ className: "svg-close", onClick: onClose }, { children: _jsx(Svg, { icon: "close" }) })) })), _jsxs(Flex, __assign({ className: "yourbondsmodal table-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondsmodal bondimage" }, { children: _jsx("img", { src: (_c = userBill.nftData) === null || _c === void 0 ? void 0 : _c.data.image }) })), _jsxs(Flex, __assign({ className: "yourbondsmodal yourbondinfo" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo title-container" }, { children: [_jsx(Flex, __assign({ className: "title-container bondicon" }, { children: _jsxs("div", __assign({ className: "icon-container" }, { children: [_jsx(Svg, { width: 18, height: 18, icon: (_d = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _d !== void 0 ? _d : 'question' }), _jsx(TokenImage, { symbol: (_e = userBill.bond.showcaseTokenName) !== null && _e !== void 0 ? _e : userBill.bond.payoutTokenName, size: 40 })] })) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: _jsx(StyledHeadingText, { children: (_f = userBill.bond) === null || _f === void 0 ? void 0 : _f.showcaseTokenName }) })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: (_g = userBill.bond.tags) === null || _g === void 0 ? void 0 : _g.slice(0, 1).map(function (tag) {
133
133
  return (_jsx(Flex, __assign({ sx: { marginRight: '10px' } }, { children: _jsx(ListTag, { variant: tag === 'Cex Fund' ? 'cex_fund' : 'liquidity', text: tag === null || tag === void 0 ? void 0 : tag.toUpperCase() }) }), tag));
134
134
  }) })), _jsxs(Text, __assign({ sx: { color: 'text', opacity: '0.6', fontSize: ['12px', '12px', '12px', '16px'] } }, { children: ["#", userBill.id] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo blocks-container" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block attributes" }, { children: _jsxs(Flex, __assign({ sx: { flexDirection: 'column', width: '100%' } }, { children: [_jsxs(Flex, __assign({ sx: {
135
135
  justifyContent: 'space-between',
@@ -142,7 +142,7 @@ var YourBondsModal = function (_a) {
142
142
  ? attributes.map(function (a) { return (_jsxs(TraitsContentContainer, { children: [_jsx(Text, __assign({ sx: { fontSize: '10px', fontWeight: 500 } }, { children: a === null || a === void 0 ? void 0 : a.trait_type })), _jsx(Text, __assign({ sx: { fontSize: '10px', fontWeight: 500 } }, { children: a === null || a === void 0 ? void 0 : a.value }))] }, a.value)); })
143
143
  : BILL_ATTRIBUTES.map(function (attrib) {
144
144
  return (_jsxs(TraitsContentContainer, { children: [_jsx(Text, __assign({ sx: { fontSize: '10px', fontWeight: 500 } }, { children: attrib })), _jsx(Skeleton, { width: "150px" })] }, attrib));
145
- }) })) }))) })] })) })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-vested" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Fully Vested" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, __assign({ className: "block-info text" }, { children: _jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: getPendingVesting(userBill.lastBlockTimestamp, userBill.vesting) })) }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-pending" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Pending" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_g = userBill.bond.showcaseTokenName) !== null && _g !== void 0 ? _g : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [_jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) })), _jsx(Text, __assign({ sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' } }, { children: "($".concat((totalPending(userBill) * ((_h = parseFloat(earnTokenPrice(userBill.bond))) !== null && _h !== void 0 ? _h : 0)).toFixed(2), ")") }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-claimable" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Claimable" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsx(TokenImage, { symbol: (_j = userBill.bond.showcaseTokenName) !== null && _j !== void 0 ? _j : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [_jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) })), _jsx(Text, __assign({ sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' } }, { children: "($".concat((claimable(userBill) * ((_k = parseFloat(earnTokenPrice(userBill.bond))) !== null && _k !== void 0 ? _k : 0)).toFixed(2), ")") }))] }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container claim" }, { children: _jsx(Button, { children: "CLAIM" }) })), _jsx(Flex, __assign({ className: "button-container transfer" }, { children: _jsx(Button, __assign({ variant: "secondary" }, { children: "TRANSFER" })) }))] }))] }))] }))] })) })) }, userBill.bond.billAddress)) : null;
145
+ }) })) }))) })] })) })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-vested" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Fully Vested" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.FullyVested }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, { className: "block-info icon" }), _jsx(Flex, __assign({ className: "block-info text" }, { children: _jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: getPendingVesting(userBill.lastBlockTimestamp, userBill.vesting) })) }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-pending" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Pending" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Pending }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsxs("div", __assign({ className: "icon-container" }, { children: [_jsx(Svg, { width: 10, height: 10, icon: (_h = NETWORK_ICONS === null || NETWORK_ICONS === void 0 ? void 0 : NETWORK_ICONS[userBill.bond.chainId]) !== null && _h !== void 0 ? _h : 'question' }), _jsx(TokenImage, { symbol: (_j = userBill.bond.showcaseTokenName) !== null && _j !== void 0 ? _j : userBill.bond.payoutTokenName, size: 25 })] })) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [_jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4) })), _jsx(Text, __assign({ sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' } }, { children: "($".concat((totalPending(userBill) * ((_k = parseFloat(earnTokenPrice(userBill.bond))) !== null && _k !== void 0 ? _k : 0)).toFixed(2), ")") }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-claimable" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header-title" }, { children: "Claimable" })), _jsx(Flex, __assign({ className: "yourbondinfo-block header-tooltip" }, { children: _jsx(TooltipBubble, __assign({ body: _jsx(Flex, { children: UserBillTooltipText.Claimable }), width: "230px", placement: "bottomLeft", transformTip: "translate(-5%, -5%)" }, { children: _jsx(Flex, __assign({ className: "block-header icon" }, { children: _jsx(Svg, { icon: "questionCircle", width: "12px" }) })) })) }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block info" }, { children: [_jsx(Flex, __assign({ className: "block-info icon" }, { children: _jsxs("div", __assign({ className: "icon-container" }, { 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, __assign({ className: "block-info text" }, { children: [_jsx(Text, __assign({ sx: { fontSize: ['12px', '12px', '12px', '19px'], fontWeight: 700 } }, { children: formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4) })), _jsx(Text, __assign({ sx: { fontSize: ['10px', '10px', '10px', '12px'], fontWeight: [500, 500, 500, 400], paddingLeft: '10px' } }, { children: "($".concat((claimable(userBill) * ((_o = parseFloat(earnTokenPrice(userBill.bond))) !== null && _o !== void 0 ? _o : 0)).toFixed(2), ")") }))] }))] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo button-container" }, { children: [_jsx(Flex, __assign({ className: "button-container claim" }, { children: _jsx(Button, { children: "CLAIM" }) })), _jsx(Flex, __assign({ className: "button-container transfer" }, { children: _jsx(Button, __assign({ variant: "secondary" }, { children: "TRANSFER" })) }))] }))] }))] }))] })) })) }, userBill.bond.billAddress)) : null;
146
146
  }) })));
147
147
  };
148
148
  export default YourBondsModal;
@@ -84,6 +84,22 @@
84
84
  align-items: center;
85
85
  }
86
86
 
87
+ .icon-container {
88
+ position: relative;
89
+ display: inline-block;
90
+ }
91
+
92
+ .icon-container svg {
93
+ position: absolute;
94
+ top: -7px;
95
+ right: -5px;
96
+ z-index: 1;
97
+ }
98
+
99
+ .icon-container img {
100
+ display: block;
101
+ }
102
+
87
103
  .title-container.bondname {
88
104
  display: flex;
89
105
  flex-direction: row;
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.372",
6
+ "version": "1.0.374",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.es.js",
9
9
  "types": "dist/index.d.ts",