@ape.swap/bonds-sdk 1.0.483 → 1.0.484
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.
|
@@ -31,6 +31,6 @@ var BondRowHeader = function (_a) {
|
|
|
31
31
|
//setChainFilterOption(['All Chains'])
|
|
32
32
|
setFilterOption(newOption);
|
|
33
33
|
}, [setFilterOption]);
|
|
34
|
-
return (_jsxs(Flex, __assign({ className: "container header-container" }, { children: [_jsxs(Flex, __assign({ className: "header filters" }, { children: [_jsx(Flex, __assign({ sx: { display: ['none', 'none', 'none', 'flex'], mr: '20px' } }, { children: _jsx(RecommendationSelector, { options: filterOptions, activeOption: filterOption, setActiveOption: handleFilterSelection }) })), _jsx(Flex, __assign({ sx: { display: ['flex', 'flex', 'flex', 'none'], width: '100%' } }, { children: _jsx(MenuSelect, { selectedOption: filterOption, setOption: setFilterOption, options: mappedFilters, sx: { background: 'white2' } }) }))] })), _jsxs(Flex, __assign({ className: "header rows
|
|
34
|
+
return (_jsxs(Flex, __assign({ className: "container header-container" }, { children: [_jsxs(Flex, __assign({ className: "header-container filters" }, { children: [_jsx(Flex, __assign({ sx: { display: ['none', 'none', 'none', 'flex'], mr: '20px' } }, { children: _jsx(RecommendationSelector, { options: filterOptions, activeOption: filterOption, setActiveOption: handleFilterSelection }) })), _jsx(Flex, __assign({ sx: { display: ['flex', 'flex', 'flex', 'none'], width: '100%' } }, { children: _jsx(MenuSelect, { selectedOption: filterOption, setOption: setFilterOption, options: mappedFilters, sx: { background: 'white2' } }) }))] })), _jsxs(Flex, __assign({ className: "header-container rows" }, { children: [_jsxs(Flex, __assign({ className: "column column-tokens" }, { children: [_jsx(Flex, __assign({ className: "column column-search", sx: { width: '100%', maxWidth: ['200px', '200px', '200px', '340px'] } }, { children: _jsx(Input, { value: inputValue, onChange: onInputChange, variant: "search", sx: { fontWeight: 400, background: 'white2', height: '30px', fontSize: '14px', color: 'white' }, width: '100%', placeholder: 'Search...' }) })), _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", color: "textDisabledButton" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return onSort('discount'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) }))] })), _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", color: "textDisabledButton" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return onSort('arr'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) }))] })), _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", color: "textDisabledButton" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return onSort('terms'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) }))] })), _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", color: "textDisabledButton" }) }))] })) })), _jsx(Flex, __assign({ className: "column header-icon", onClick: function () { return onSort('tokensRemaining'); } }, { children: _jsx(Svg, { icon: "sort", width: "12px", color: "textDisabledButton" }) }))] })), _jsx(Flex, { className: "column column-hotbond" })] }))] }))] })));
|
|
35
35
|
};
|
|
36
36
|
export default BondRowHeader;
|
|
@@ -227,16 +227,16 @@ var Bonds = function (_a) {
|
|
|
227
227
|
// Search logic
|
|
228
228
|
var _j = useState(''), inputValue = _j[0], setInputValue = _j[1];
|
|
229
229
|
var _k = useState(sortedBonds), filteredBonds = _k[0], setFilteredBonds = _k[1];
|
|
230
|
-
useEffect(
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
}, [inputValue, sortedBonds]);
|
|
230
|
+
// useEffect(() => {
|
|
231
|
+
// if (inputValue === '') {
|
|
232
|
+
// setFilteredBonds(sortedBonds);
|
|
233
|
+
// } else {
|
|
234
|
+
// setFilteredBonds(
|
|
235
|
+
// sortedBonds.filter(bond =>
|
|
236
|
+
// bond.showcaseTokenName.toLowerCase().includes(inputValue.toLowerCase())
|
|
237
|
+
// ));
|
|
238
|
+
// }
|
|
239
|
+
// }, [inputValue, sortedBonds]);
|
|
240
240
|
var handleInputChange = function (event) {
|
|
241
241
|
setInputValue(event.target.value);
|
|
242
242
|
};
|
|
@@ -246,12 +246,8 @@ var Bonds = function (_a) {
|
|
|
246
246
|
var handleChangeFilterOption = useCallback(function (newOption) {
|
|
247
247
|
setFilterOption(newOption);
|
|
248
248
|
}, []);
|
|
249
|
-
var handleFilterSelection = useCallback(function (newOption) {
|
|
250
|
-
//setChainFilterOption(['All Chains'])
|
|
251
|
-
setFilterOption(newOption);
|
|
252
|
-
}, [setFilterOption]);
|
|
253
249
|
var billstoRender = useMemo(function () {
|
|
254
|
-
var billsToReturn =
|
|
250
|
+
var billsToReturn = sortedBonds !== null && sortedBonds !== void 0 ? sortedBonds : [];
|
|
255
251
|
if (inputValue) {
|
|
256
252
|
billsToReturn = billsToReturn === null || billsToReturn === void 0 ? void 0 : billsToReturn.filter(function (bill) {
|
|
257
253
|
var _a;
|
|
@@ -270,10 +266,10 @@ var Bonds = function (_a) {
|
|
|
270
266
|
// Page render logic
|
|
271
267
|
var _m = useState(false), bondsRendered = _m[0], setBondsRendered = _m[1];
|
|
272
268
|
useEffect(function () {
|
|
273
|
-
if (
|
|
269
|
+
if (billstoRender.length > 0) {
|
|
274
270
|
setBondsRendered(true);
|
|
275
271
|
}
|
|
276
272
|
}, [filteredBonds]);
|
|
277
|
-
return (_jsxs(ThemeUIProvider, __assign({ theme: defaultTheme }, { children: [isActive && account && _jsx("p", { children: account }), isActive && account && _jsx("button", __assign({ onClick: handleApprove }, { children: "Approve USDT" })),
|
|
273
|
+
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: [_jsx(BondRowHeader, { inputValue: inputValue, filterOptions: filterOptions, filterOption: filterOption, setFilterOption: handleChangeFilterOption, onInputChange: handleInputChange, onSort: handleSort }), bondsRendered && (_jsx(BondRowsByChain, { bonds: billstoRender, hotBonds: hotBonds, hideTitles: inputValue !== '', rowClick: rowClick }))] }))] })));
|
|
278
274
|
};
|
|
279
275
|
export default Bonds;
|
|
@@ -12,14 +12,18 @@
|
|
|
12
12
|
color: #73728E;
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
.header.filters {
|
|
15
|
+
.header-container.filters {
|
|
16
16
|
display: flex;
|
|
17
17
|
flex-direction: row;
|
|
18
|
+
align-items: center;
|
|
19
|
+
width: 100%;
|
|
18
20
|
}
|
|
19
21
|
|
|
20
|
-
.header.rows
|
|
22
|
+
.header-container.rows {
|
|
21
23
|
display: flex;
|
|
22
24
|
flex-direction: row;
|
|
25
|
+
align-items: center;
|
|
26
|
+
width: 100%;
|
|
23
27
|
}
|
|
24
28
|
|
|
25
29
|
.column.column-tokens {
|