@ape.swap/bonds-sdk 1.0.362 → 1.0.363
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.
- package/dist/components/YourBonds/YourBonds.js +7 -5
- package/dist/components/YourBonds/fetchBillsUser.js +2 -2
- package/dist/components/YourBondsModal/YourBondsModal.js +11 -3
- package/dist/components/YourBondsModal/styles.d.ts +1 -0
- package/dist/components/YourBondsModal/styles.js +11 -0
- package/package.json +1 -1
|
@@ -110,6 +110,7 @@ var YourBonds = function (_a) {
|
|
|
110
110
|
}
|
|
111
111
|
});
|
|
112
112
|
}); };
|
|
113
|
+
// Fetch data for user owned bill
|
|
113
114
|
useEffect(function () {
|
|
114
115
|
axios.get('https://realtime-api.ape.bond/bonds').then(function (response) {
|
|
115
116
|
var bonds = response.data.bonds;
|
|
@@ -119,11 +120,6 @@ var YourBonds = function (_a) {
|
|
|
119
120
|
var _d = useState([]), bondData = _d[0], setBondData = _d[1];
|
|
120
121
|
var _e = useState(false), isModalOpen = _e[0], setIsModalOpen = _e[1];
|
|
121
122
|
var _f = useState(null), selectedBill = _f[0], setSelectedBill = _f[1];
|
|
122
|
-
var rowClick = function (bill) {
|
|
123
|
-
setSelectedBill(bill);
|
|
124
|
-
setIsModalOpen(true);
|
|
125
|
-
navigate("/YourBonds/?bondAddress=".concat(bill.address, "&bondChain=").concat(bill.bond.chainId), { replace: true });
|
|
126
|
-
};
|
|
127
123
|
var _g = useState([]), userOwnedBillsData = _g[0], setUserOwnedBillsData = _g[1];
|
|
128
124
|
useEffect(function () {
|
|
129
125
|
var fetchData = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -150,6 +146,12 @@ var YourBonds = function (_a) {
|
|
|
150
146
|
}); };
|
|
151
147
|
fetchData();
|
|
152
148
|
}, [account]);
|
|
149
|
+
var rowClick = function (bill) {
|
|
150
|
+
setSelectedBill(bill);
|
|
151
|
+
setIsModalOpen(true);
|
|
152
|
+
navigate("/YourBonds/?bondAddress=".concat(bill.address, "&bondChain=").concat(bill.bond.chainId), { replace: true });
|
|
153
|
+
};
|
|
154
|
+
// Functions to calculate display values for each row
|
|
153
155
|
var chainId = useWeb3React().chainId;
|
|
154
156
|
var currentTime = useCurrentTime() / 1000;
|
|
155
157
|
var vestingTimeRemaining = function (userBill) {
|
|
@@ -109,7 +109,7 @@ export var fetchUserOwnedBillNftData = function (ownedBillsData, chainId, bills)
|
|
|
109
109
|
}
|
|
110
110
|
});
|
|
111
111
|
}); };
|
|
112
|
-
|
|
112
|
+
/* MODIFIED FUNCTION FROM FRONTEND SPECIFICALLY FOR THE SDK */
|
|
113
113
|
export var fetchUserOwnedBillsDataAsync = function (chainId, account, bondData) { return __awaiter(void 0, void 0, void 0, function () {
|
|
114
114
|
var bonds, userOwnedBills_1, mapUserOwnedBills_1, userOwnedBillsData, ownedBillsData, userBillNftData_1, combinedData, error_1;
|
|
115
115
|
return __generator(this, function (_a) {
|
|
@@ -161,7 +161,7 @@ export var fetchUserOwnedBillsDataAsync = function (chainId, account, bondData)
|
|
|
161
161
|
}
|
|
162
162
|
});
|
|
163
163
|
}); };
|
|
164
|
-
|
|
164
|
+
/* MODIFIED FUNCTION FROM FRONTEND SPECIFICALLY FOR THE SDK */
|
|
165
165
|
export var fetchUserOwnedBills = function (chainId, account, bonds) { return __awaiter(void 0, void 0, void 0, function () {
|
|
166
166
|
var billIdCalls, billIds, billsPendingRewardCall, billDataCalls, billVersions, billData, pendingRewardsCall, result, i, billDataPos, data;
|
|
167
167
|
var _a, _b, _c, _d, _e;
|
|
@@ -55,7 +55,7 @@ import '../../scss/YourBondsModal.scss';
|
|
|
55
55
|
import axios from 'axios';
|
|
56
56
|
import { BigNumber } from 'bignumber.js';
|
|
57
57
|
import { getFirstNonZeroDigits } from '../../utils/roundNumber';
|
|
58
|
-
import { TooltipBubble, Button, Svg, ListTag } from '../uikit-sdk';
|
|
58
|
+
import { TooltipBubble, Button, Svg, ListTag, Skeleton, Text } from '../uikit-sdk';
|
|
59
59
|
import { UserBillTooltipText } from '../../enum/tooltips';
|
|
60
60
|
import TokenImage from '../uikit-sdk/TokenImage';
|
|
61
61
|
import { getBalanceNumber } from '../../utils/getBalanceNumber';
|
|
@@ -63,11 +63,13 @@ import { MAINNET_CHAINS } 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';
|
|
66
|
+
import { TraitsContentContainer } from './styles';
|
|
66
67
|
var YourBondsModal = function (_a) {
|
|
67
68
|
var isOpen = _a.isOpen, onClose = _a.onClose, bondAddress = _a.bondAddress;
|
|
68
69
|
if (!isOpen)
|
|
69
70
|
return null;
|
|
70
71
|
var _b = useWeb3React(), account = _b.account, chainId = _b.chainId, isActive = _b.isActive;
|
|
72
|
+
// Fetch data for user owned bill
|
|
71
73
|
var _c = useState([]), bondData = _c[0], setBondData = _c[1];
|
|
72
74
|
useEffect(function () {
|
|
73
75
|
axios.get('https://realtime-api.ape.bond/bonds').then(function (response) {
|
|
@@ -103,6 +105,7 @@ var YourBondsModal = function (_a) {
|
|
|
103
105
|
}); };
|
|
104
106
|
fetchData();
|
|
105
107
|
}, [account]);
|
|
108
|
+
// Functions to calculate display values for modal
|
|
106
109
|
var totalPending = function (userBill) {
|
|
107
110
|
var _a, _b, _c, _d;
|
|
108
111
|
return getBalanceNumber(new BigNumber((_a = userBill === null || userBill === void 0 ? void 0 : userBill.payout) !== null && _a !== void 0 ? _a : 0), (_d = (_c = (_b = userBill.bond.earnToken) === null || _b === void 0 ? void 0 : _b.decimals) === null || _c === void 0 ? void 0 : _c[chainId]) !== null && _d !== void 0 ? _d : 18);
|
|
@@ -115,12 +118,17 @@ var YourBondsModal = function (_a) {
|
|
|
115
118
|
var _a;
|
|
116
119
|
return getFirstNonZeroDigits(parseFloat((_a = bond === null || bond === void 0 ? void 0 : bond.payoutTokenPrice) !== null && _a !== void 0 ? _a : '0'));
|
|
117
120
|
};
|
|
121
|
+
var BILL_ATTRIBUTES = ['The Legend', 'The Location', 'The Moment', 'The Trend', 'The Innovation'];
|
|
118
122
|
return (_jsx(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: userOwnedBillsData.flat().map(function (data) {
|
|
119
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
123
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
120
124
|
var userBill = data.userOwnedBills.find(function (bill) { return bill.bond.billAddress.toLowerCase() === (bondAddress === null || bondAddress === void 0 ? void 0 : bondAddress.toLowerCase()); });
|
|
121
125
|
console.log("USER BILL LOG");
|
|
122
126
|
console.log(userBill);
|
|
123
|
-
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: (_a = userBill.nftData) === null || _a === void 0 ? void 0 : _a.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: (_b = userBill.bond.showcaseTokenName) !== null && _b !== void 0 ? _b : userBill.bond.payoutTokenName, size: 40 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: (_c = userBill.bond) === null || _c === void 0 ? void 0 : _c.showcaseTokenName })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_e = (_d = userBill.bond) === null || _d === void 0 ? void 0 : _d.tags) === null || _e === void 0 ? void 0 : _e[0], variant: ((_g = (_f = userBill.bond) === null || _f === void 0 ? void 0 : _f.tags) === null || _g === void 0 ? void 0 : _g[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) })), "#", userBill.id] })), _jsxs(Flex, __assign({ className: "yourbondinfo blocks-container" }, { children: [
|
|
127
|
+
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: (_a = userBill.nftData) === null || _a === void 0 ? void 0 : _a.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: (_b = userBill.bond.showcaseTokenName) !== null && _b !== void 0 ? _b : userBill.bond.payoutTokenName, size: 40 }) })), _jsx(Flex, __assign({ className: "title-container bondname" }, { children: (_c = userBill.bond) === null || _c === void 0 ? void 0 : _c.showcaseTokenName })), _jsx(Flex, __assign({ className: "title-container tokentags" }, { children: _jsx(ListTag, { text: (_e = (_d = userBill.bond) === null || _d === void 0 ? void 0 : _d.tags) === null || _e === void 0 ? void 0 : _e[0], variant: ((_g = (_f = userBill.bond) === null || _f === void 0 ? void 0 : _f.tags) === null || _g === void 0 ? void 0 : _g[0]) === 'Cex Fund' ? 'cex_fund' : 'liquidity' }) })), "#", userBill.id] })), _jsxs(Flex, __assign({ className: "yourbondinfo blocks-container" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block row-traits" }, { children: [_jsx(Flex, __assign({ className: "yourbondinfo-block header" }, { children: "Traits" })), ((_h = userBill.nftData) === null || _h === void 0 ? void 0 : _h.data.attributes)
|
|
128
|
+
? (_j = userBill.nftData) === null || _j === void 0 ? void 0 : _j.data.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)); })
|
|
129
|
+
: BILL_ATTRIBUTES.map(function (attrib) {
|
|
130
|
+
return (_jsxs(TraitsContentContainer, { children: [_jsx(Text, __assign({ sx: { fontSize: '10px', fontWeight: 500 } }, { children: attrib })), _jsx(Skeleton, { width: "150px" })] }, attrib));
|
|
131
|
+
})] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-vested" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Fully Vested", _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: getPendingVesting(userBill.lastBlockTimestamp, userBill.vesting) }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-pending" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Pending", _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: (_k = userBill.bond.showcaseTokenName) !== null && _k !== void 0 ? _k : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(totalPending(userBill).toFixed(4)), 4), "($".concat((totalPending(userBill) * ((_l = parseFloat(earnTokenPrice(userBill.bond))) !== null && _l !== void 0 ? _l : 0)).toFixed(2), ")")] }))] }))] })), _jsxs(Flex, __assign({ className: "yourbondinfo-block row-claimable" }, { children: [_jsxs(Flex, __assign({ className: "yourbondinfo-block header" }, { children: ["Claimable", _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: (_m = userBill.bond.showcaseTokenName) !== null && _m !== void 0 ? _m : userBill.bond.payoutTokenName, size: 25 }) })), _jsxs(Flex, __assign({ className: "block-info text" }, { children: [formatNumberSI(parseFloat(claimable(userBill).toFixed(4)), 4), "($".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, { children: "TRANSFER" }) }))] }))] }))] }))] })) })) }, userBill.bond.billAddress)) : null;
|
|
124
132
|
}) })));
|
|
125
133
|
};
|
|
126
134
|
export default YourBondsModal;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const TraitsContentContainer: import("@emotion/styled").StyledComponent<any, {}, {}>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
import styled from "@emotion/styled";
|
|
6
|
+
import { Flex } from "../uikit-sdk";
|
|
7
|
+
export var TraitsContentContainer = styled(Flex)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n justify-content: space-between;\n background: ", ";\n padding: 0px 15px;\n &:last-child {\n border-radius: 0px 0px 6px 6px;\n }\n @media screen and (max-width: 667px) {\n :first-of-type {\n border-radius: 6px 6px 0px 0px;\n }\n }\n"], ["\n justify-content: space-between;\n background: ", ";\n padding: 0px 15px;\n &:last-child {\n border-radius: 0px 0px 6px 6px;\n }\n @media screen and (max-width: 667px) {\n :first-of-type {\n border-radius: 6px 6px 0px 0px;\n }\n }\n"])), function (_a) {
|
|
8
|
+
var theme = _a.theme;
|
|
9
|
+
return theme.colors.white4;
|
|
10
|
+
});
|
|
11
|
+
var templateObject_1;
|