@thespidercode/openbook-swap
Version:
Ready-to-use swap tool using Openbook DEX
50 lines (49 loc) • 2.85 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PairSearch = void 0;
const react_1 = require("react");
const react_2 = __importDefault(require("react"));
const search_pair_button_1 = require("./search-pair-button");
function PairSearch(props) {
const [modalOpen, setModalOpen] = (0, react_1.useState)(false);
const [inputSearch, setInputSearch] = (0, react_1.useState)('');
const handleInputChange = (e) => {
setInputSearch(e.target.value);
};
const options = (0, react_1.useMemo)(() => {
let response = [];
response = props.options.filter((option) => {
return option.label.toLocaleLowerCase().includes(inputSearch.toLocaleLowerCase());
});
return response;
}, [inputSearch, props.options]);
const setNewPair = (newValue) => {
if (props.setPair && newValue?.pair) {
props.setPair(newValue.pair, newValue.label);
}
};
const closeModal = () => {
setModalOpen(false);
};
return (react_2.default.createElement("div", null,
react_2.default.createElement(search_pair_button_1.SearchPairButton, { onClick: () => setModalOpen(true), currentOption: props.currentOption }),
modalOpen &&
react_2.default.createElement("div", { className: "openbookswap modal-overlay", onClick: closeModal },
react_2.default.createElement("div", { className: "obs-modal", onClick: (e) => e.stopPropagation() },
react_2.default.createElement("button", { className: "modal-close", onClick: closeModal }, "\u2715"),
react_2.default.createElement("div", { className: "modal-content" },
react_2.default.createElement("div", { className: 'search-tokens' },
react_2.default.createElement("input", { autoFocus: true, placeholder: 'Search tokens', value: inputSearch, onChange: handleInputChange, type: 'text' })),
react_2.default.createElement("div", { className: 'token-options flex column start mt-4' }, options.length > 0 && options.map((option) => {
return (react_2.default.createElement("div", { className: 'token-option flex start items-center', key: option.value, onClick: (e) => {
setNewPair(option);
closeModal();
} },
react_2.default.createElement("img", { src: option.imageUrl }),
react_2.default.createElement("h3", null, option.label)));
})))))));
}
exports.PairSearch = PairSearch;