@enclavemoney/enclave-wallet-sdk
Version:
A simple enclave wallet SDK for React applications
832 lines • 77.8 kB
JavaScript
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (g && (g = 0, op[0] && (_ = 0)), _) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.SwapToken = void 0;
var react_1 = __importStar(require("react"));
var ReviewOrder_1 = __importDefault(require("./ReviewOrder"));
var lucide_react_1 = require("lucide-react");
var MessagePopup_1 = __importDefault(require("./MessagePopup"));
var TokenSelector_1 = __importDefault(require("./TokenSelector"));
var services_1 = require("../services/services");
var Spinner_1 = __importDefault(require("./Spinner"));
var SelectNetwork_1 = __importDefault(require("./SelectNetwork"));
var utils_1 = require("./utils");
var SelectSingleNetwork_1 = __importDefault(require("./SelectSingleNetwork"));
var ActivityDetails_1 = __importDefault(require("./ActivityDetails"));
var utils_2 = require("./utils");
var ethers_1 = require("ethers");
var ethers_2 = require("ethers");
var NetworkAllocationDisplay = function (_a) {
var network = _a.network, amount = _a.amount, symbol = _a.symbol;
return (react_1.default.createElement("div", { style: {
display: "flex",
justifyContent: "space-between",
alignItems: "center",
width: "100%",
padding: "8px 0",
} },
react_1.default.createElement("div", { style: {
display: "flex",
alignItems: "center",
gap: "8px",
} },
react_1.default.createElement("img", { src: utils_1.NETWORK_LOGO_URLS[utils_1.NETWORK_NAME_TO_CHAIN_ID[network]], alt: network, style: { width: 24, height: 24, borderRadius: "50%" } }),
react_1.default.createElement("span", { style: { fontSize: 14, color: "#000000", fontWeight: 500 } }, network)),
react_1.default.createElement("span", { style: { fontSize: 14, color: "#535862" } },
amount,
" ",
symbol)));
};
// Add this helper function at the top level
var calculateTotalAmount = function (networks, decimals) {
if (decimals === void 0) { decimals = 6; }
return networks.reduce(function (total, network) {
if (!network.amount)
return total;
try {
var amountWei = (0, ethers_2.parseUnits)(network.amount, decimals);
var totalWei = (0, ethers_2.parseUnits)(total.toString(), decimals);
return parseFloat((0, ethers_2.formatUnits)(totalWei + amountWei, decimals));
}
catch (_a) {
return total;
}
}, 0);
};
// Add this helper function at the top level after the existing helper functions
var getNetworkBalance = function (combinedBalance, symbol, chainId) {
var _a;
if (!(combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data))
return "0";
var token = combinedBalance.data.find(function (t) { return t.symbol === symbol; });
if (!token)
return "0";
var chainData = (_a = token.chainIds) === null || _a === void 0 ? void 0 : _a.find(function (chain) { return chain.chainId === chainId; });
return (chainData === null || chainData === void 0 ? void 0 : chainData.balance) || "0";
};
// Add this helper function to check if a token is BTC
var isBTCToken = function (token) {
return (token === null || token === void 0 ? void 0 : token.symbol) === "BTC" || (token === null || token === void 0 ? void 0 : token.symbol) === "WBTC";
};
var SwapToken = function (_a) {
var _b, _c, _d, _e;
var onBack = _a.onBack, walletSDKKey = _a.walletSDKKey, combinedBalance = _a.combinedBalance, initialFromToken = _a.initialFromToken, initialToToken = _a.initialToToken, _f = _a.initialAmount, initialAmount = _f === void 0 ? "" : _f, externalTokenOptions = _a.tokenOptions, tokensLoading = _a.tokensLoading;
var _g = (0, react_1.useState)(initialAmount), amount = _g[0], setAmount = _g[1];
var _h = (0, react_1.useState)(false), proActive = _h[0], setProActive = _h[1];
var _j = (0, react_1.useState)(false), showReviewOrder = _j[0], setShowReviewOrder = _j[1];
var _k = (0, react_1.useState)([]), selectedNetworksPay = _k[0], setSelectedNetworksPay = _k[1];
var _l = (0, react_1.useState)([]), selectedNetworksReceive = _l[0], setSelectedNetworksReceive = _l[1];
var _m = (0, react_1.useState)(""), quoteDetails = _m[0], setQuoteDetails = _m[1];
var _o = (0, react_1.useState)(false), isLoadingQuote = _o[0], setIsLoadingQuote = _o[1];
var _p = (0, react_1.useState)(""), quoteError = _p[0], setQuoteError = _p[1];
var _q = (0, react_1.useState)(false), isLoading = _q[0], setIsLoading = _q[1];
var _r = (0, react_1.useState)(false), showMessagePopup = _r[0], setShowMessagePopup = _r[1];
var _s = (0, react_1.useState)("success"), messageType = _s[0], setMessageType = _s[1];
var _t = (0, react_1.useState)(false), showFromTokenSelector = _t[0], setShowFromTokenSelector = _t[1];
var _u = (0, react_1.useState)(false), showToTokenSelector = _u[0], setShowToTokenSelector = _u[1];
var _v = (0, react_1.useState)([]), tokenOptions = _v[0], setTokenOptions = _v[1];
var _w = (0, react_1.useState)(false), showSelectFromNetworks = _w[0], setShowSelectFromNetworks = _w[1];
var _x = (0, react_1.useState)(false), showPreviewNetworks = _x[0], setShowPreviewNetworks = _x[1];
var _y = (0, react_1.useState)(false), showSelectToNetworks = _y[0], setShowSelectToNetworks = _y[1];
var _z = (0, react_1.useState)(null), transactionId = _z[0], setTransactionId = _z[1];
var _0 = (0, react_1.useState)(false), showActivity = _0[0], setShowActivity = _0[1];
// Add polling interval ref
var pollingIntervalRef = (0, react_1.useRef)(null);
// Add style tag for number input
react_1.default.useEffect(function () {
var style = document.createElement("style");
style.textContent = "\n .no-spinners::-webkit-outer-spin-button,\n .no-spinners::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n .no-spinners {\n -moz-appearance: textfield;\n }\n ";
document.head.appendChild(style);
return function () {
document.head.removeChild(style);
};
}, []);
// Transform external token options to internal Token format
(0, react_1.useEffect)(function () {
if (externalTokenOptions.length > 0) {
setTokenOptions(externalTokenOptions.map(function (token) {
var _a, _b, _c, _d;
return ({
symbol: token.symbol,
name: token.name,
icon: token.logoURI || token.icon,
address: ((_b = (_a = token.chainIds) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.address) || token.address || "",
chainId: ((_d = (_c = token.chainIds) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.chainId) || token.chainId || 0,
chainIds: token.chainIds,
decimals: token.decimals,
balance: token.balance || "0",
amount: (token.amount || 0).toString(),
priceUsd: token.price || 0,
});
}));
}
}, [externalTokenOptions]);
// Initialize fromToken and toToken with initial values or first two available tokens
var _1 = (0, react_1.useState)(null), fromToken = _1[0], setFromToken = _1[1];
var _2 = (0, react_1.useState)(null), toToken = _2[0], setToToken = _2[1];
(0, react_1.useEffect)(function () {
// Only set tokens if they haven't been set yet
if (tokensLoading) {
return;
}
if (!fromToken && !toToken && tokenOptions.length >= 2) {
if (initialFromToken) {
setFromToken(initialFromToken);
}
else {
setFromToken(tokenOptions[0]);
}
if (initialToToken) {
setToToken(initialToToken);
setSelectedNetworksReceive([
{
name: (0, utils_1.getNetworkName)(initialToToken.chainId),
chainId: initialToToken.chainId,
},
]);
}
else {
setToToken(tokenOptions[1]);
setSelectedNetworksReceive([
{
name: (0, utils_1.getNetworkName)(tokenOptions[1].chainId),
chainId: tokenOptions[1].chainId,
},
]);
}
}
}, [tokenOptions, initialFromToken, initialToToken, tokensLoading]);
(0, react_1.useEffect)(function () {
var _a, _b, _c, _d;
console.log("toToken", toToken, selectedNetworksReceive);
if (selectedNetworksReceive.length === 0) {
setSelectedNetworksReceive([
{
name: (0, utils_1.getNetworkName)(((_b = (_a = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.chainId) || 0),
chainId: ((_d = (_c = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.chainId) || 0,
},
]);
}
}, [toToken]);
var getTokenBalance = function (token) {
if (!(combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) || !token)
return 0;
var tokenData = combinedBalance.data.find(function (t) {
var _a, _b;
return t.symbol.toLowerCase() === token.symbol.toLowerCase() &&
((_a = t.name) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === ((_b = token.name) === null || _b === void 0 ? void 0 : _b.toLowerCase()) &&
t.decimals === token.decimals;
});
return (tokenData === null || tokenData === void 0 ? void 0 : tokenData.amount) || 0;
};
// Button state variables
var isButtonDisabled = isLoadingQuote ||
(typeof quoteDetails === "string" &&
quoteDetails.includes("Insufficient")) ||
!amount ||
parseFloat(amount) <= 0 ||
!fromToken ||
!toToken ||
fromToken.symbol === toToken.symbol ||
quoteError !== "" ||
amount > getTokenBalance(fromToken);
var buttonBackground = isButtonDisabled ? "#E9EAEB" : "#4664E9";
var buttonTextColor = isButtonDisabled ? "#717680" : "#fff";
var buttonCursor = isButtonDisabled ? "not-allowed" : "pointer";
var getButtonText = function () {
if (!fromToken || !toToken) {
return "Loading tokens...";
}
if (fromToken.symbol === toToken.symbol) {
return "Select different tokens";
}
if (isLoadingQuote) {
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(Spinner_1.default, null),
react_1.default.createElement("span", null, "Calculating...")));
}
if (quoteError) {
return quoteError;
}
if (amount > getTokenBalance(fromToken)) {
return "Insufficient funds";
}
if (typeof quoteDetails === "string" &&
quoteDetails.includes("Insufficient")) {
return "Insufficient funds";
}
if (!amount || parseFloat(amount) <= 0) {
return "Enter an amount";
}
return "Review Order";
};
var userName = window.__walletSDKInstance.getUsername();
var handleTransactionClick = function () {
setShowMessagePopup(false);
setShowActivity(true);
};
// Update the quote effect
(0, react_1.useEffect)(function () {
var fetchQuote = function (isPolling) {
if (isPolling === void 0) { isPolling = false; }
return __awaiter(void 0, void 0, void 0, function () {
var quote, error_1;
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
return __generator(this, function (_k) {
switch (_k.label) {
case 0:
if (tokensLoading) {
return [2 /*return*/];
}
if (!toToken || !fromToken) {
return [2 /*return*/];
}
// Don't fetch if amount is empty or zero or tokens are not set
if (!amount || parseFloat(amount) <= 0 || !fromToken || !toToken) {
return [2 /*return*/];
}
// Don't fetch quote if tokens are the same
if (fromToken.symbol === toToken.symbol) {
return [2 /*return*/];
}
// Only reset states and show loading on initial fetch, not during polling
if (!isPolling) {
setQuoteDetails("");
setQuoteError("");
setIsLoadingQuote(true);
}
_k.label = 1;
case 1:
_k.trys.push([1, 8, 9, 10]);
quote = void 0;
if (!isBTCToken(fromToken)) return [3 /*break*/, 3];
return [4 /*yield*/, (0, services_1.getMultiFromBTCRelaySwapQuote)({
username: userName,
amount: ethers_1.ethers.parseUnits(amount, fromToken.decimals).toString(),
outputToken: (_b = (_a = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _a === void 0 ? void 0 : _a.find(function (chain) {
return chain.chainId === selectedNetworksReceive[0].chainId;
})) === null || _b === void 0 ? void 0 : _b.address,
outputChainId: selectedNetworksReceive[0].chainId,
}, walletSDKKey)];
case 2:
quote = _k.sent();
return [3 /*break*/, 7];
case 3:
if (!isBTCToken(toToken)) return [3 /*break*/, 5];
return [4 /*yield*/, (0, services_1.getMultiToBTCRelaySwapQuote)({
username: userName,
userBalance: proActive
? selectedNetworksPay.map(function (network) {
var _a, _b, _c, _d;
return ({
chainId: network.chainId,
address: (_d = (_c = (_b = (_a = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _a === void 0 ? void 0 : _a.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _b === void 0 ? void 0 : _b.chainIds) === null || _c === void 0 ? void 0 : _c.find(function (chain) { return chain.chainId === network.chainId; })) === null || _d === void 0 ? void 0 : _d.address,
balance: ethers_1.ethers
.parseUnits(network.amount, fromToken.decimals)
.toString()
.toString(),
});
})
: ((_d = (_c = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _c === void 0 ? void 0 : _c.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _d === void 0 ? void 0 : _d.chainIds) || [
{
chainId: fromToken.chainId,
address: fromToken.address,
balance: 0,
},
],
inputAmount: ethers_1.ethers
.parseUnits(amount, fromToken.decimals)
.toString(),
proMode: proActive,
}, walletSDKKey)];
case 4:
// Handle swapping to BTC
quote = _k.sent();
return [3 /*break*/, 7];
case 5: return [4 /*yield*/, (0, services_1.getMultiRelaySwapQuote)({
username: userName,
userBalance: proActive
? selectedNetworksPay.map(function (network) {
var _a, _b, _c, _d;
return ({
chainId: network.chainId,
address: (_d = (_c = (_b = (_a = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _a === void 0 ? void 0 : _a.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _b === void 0 ? void 0 : _b.chainIds) === null || _c === void 0 ? void 0 : _c.find(function (chain) { return chain.chainId === network.chainId; })) === null || _d === void 0 ? void 0 : _d.address,
balance: ethers_1.ethers
.parseUnits(network.amount, fromToken.decimals)
.toString()
.toString(),
});
})
: ((_f = (_e = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _e === void 0 ? void 0 : _e.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _f === void 0 ? void 0 : _f.chainIds) || [
{
chainId: fromToken.chainId,
address: fromToken.address,
balance: 0,
},
],
outputToken: (_h = (_g = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _g === void 0 ? void 0 : _g.find(function (chain) {
return chain.chainId === selectedNetworksReceive[0].chainId;
})) === null || _h === void 0 ? void 0 : _h.address,
outputChainId: selectedNetworksReceive[0].chainId,
inputAmount: ethers_1.ethers
.parseUnits(amount, fromToken.decimals)
.toString(),
proMode: proActive,
}, walletSDKKey)];
case 6:
// Regular swap quote
quote = _k.sent();
_k.label = 7;
case 7:
if (quote === null || quote === void 0 ? void 0 : quote.error) {
if ((_j = quote === null || quote === void 0 ? void 0 : quote.message) === null || _j === void 0 ? void 0 : _j.includes("Insufficient")) {
setQuoteError("Insufficient funds");
}
else {
setQuoteError("Unable to fetch quote");
}
}
else {
setQuoteDetails(quote);
}
return [3 /*break*/, 10];
case 8:
error_1 = _k.sent();
console.error("No quote found:", error_1);
if (!isPolling) {
setQuoteError("Error fetching quote");
setQuoteDetails("");
}
return [3 /*break*/, 10];
case 9:
if (!isPolling) {
setIsLoadingQuote(false);
}
return [7 /*endfinally*/];
case 10: return [2 /*return*/];
}
});
});
};
// Initial fetch
fetchQuote(false);
// Set up polling interval
pollingIntervalRef.current = setInterval(function () { return fetchQuote(true); }, 20000);
return function () {
if (pollingIntervalRef.current) {
clearInterval(pollingIntervalRef.current);
pollingIntervalRef.current = null;
}
};
}, [
amount,
fromToken,
toToken,
userName,
walletSDKKey,
selectedNetworksReceive,
tokensLoading,
]);
// Update the output amount based on quote details
var outputAmount = typeof quoteDetails === "string"
? ""
: ((_b = quoteDetails === null || quoteDetails === void 0 ? void 0 : quoteDetails.outputDetails) === null || _b === void 0 ? void 0 : _b.minimumAmount) || "";
var outputAmountUsd = typeof quoteDetails === "string"
? ""
: ((_c = quoteDetails === null || quoteDetails === void 0 ? void 0 : quoteDetails.outputDetails) === null || _c === void 0 ? void 0 : _c.amountUsd) || "";
var calculateRate = function () {
var _a;
if (typeof quoteDetails === "string" ||
!((_a = quoteDetails === null || quoteDetails === void 0 ? void 0 : quoteDetails.outputDetails) === null || _a === void 0 ? void 0 : _a.amountFormatted))
return "0";
var rate = parseFloat(amount) /
parseFloat(quoteDetails.outputDetails.amountFormatted);
if (rate > 0 && rate < 0.0001) {
return "<0.0001";
}
return rate.toFixed(6);
};
var handleReviewOrder = function () {
setShowReviewOrder(true);
};
var handleBack = function () {
if (showReviewOrder) {
setShowReviewOrder(false);
}
else if (showFromTokenSelector || showToTokenSelector) {
setShowFromTokenSelector(false);
setShowToTokenSelector(false);
}
else {
onBack();
}
};
var handleFromTokenSelect = function (token) {
console.log("token", token);
setFromToken(token);
setSelectedNetworksPay([]);
setShowFromTokenSelector(false);
};
var handleToTokenSelect = function (token) {
setToToken(token);
setSelectedNetworksReceive([]);
setShowToTokenSelector(false);
};
var handleConfirm = function () { return __awaiter(void 0, void 0, void 0, function () {
var data, error_2;
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
return __generator(this, function (_l) {
switch (_l.label) {
case 0:
if (!fromToken || !toToken) {
return [2 /*return*/];
}
_l.label = 1;
case 1:
_l.trys.push([1, 8, 9, 10]);
setIsLoading(true);
data = void 0;
if (!isBTCToken(fromToken)) return [3 /*break*/, 3];
return [4 /*yield*/, (0, services_1.executeFromBTCSwapFlow)({
username: userName,
amount: ethers_1.ethers
.parseUnits(amount, (fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals) || 0)
.toString(),
outputToken: (_b = (_a = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _a === void 0 ? void 0 : _a.find(function (chain) {
return chain.chainId === selectedNetworksReceive[0].chainId;
})) === null || _b === void 0 ? void 0 : _b.address,
outputChainId: selectedNetworksReceive[0].chainId,
metadata: {
inputToken: {
tokenName: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenSymbol: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenAddress: fromToken === null || fromToken === void 0 ? void 0 : fromToken.address,
decimals: fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals,
logoURI: (fromToken === null || fromToken === void 0 ? void 0 : fromToken.icon) || (fromToken === null || fromToken === void 0 ? void 0 : fromToken.logoURI),
},
outputToken: {
tokenName: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenSymbol: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenAddress: toToken === null || toToken === void 0 ? void 0 : toToken.address,
decimals: toToken === null || toToken === void 0 ? void 0 : toToken.decimals,
logoURI: (toToken === null || toToken === void 0 ? void 0 : toToken.icon) || (toToken === null || toToken === void 0 ? void 0 : toToken.logoURI),
},
},
}, walletSDKKey)];
case 2:
// Execute swap from BTC flow
data = _l.sent();
return [3 /*break*/, 7];
case 3:
if (!isBTCToken(toToken)) return [3 /*break*/, 5];
return [4 /*yield*/, (0, services_1.executeToBTCSwapFlow)({
username: userName,
userBalance: proActive
? selectedNetworksPay.map(function (network) {
var _a, _b, _c, _d;
return ({
chainId: network.chainId,
address: (_d = (_c = (_b = (_a = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _a === void 0 ? void 0 : _a.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _b === void 0 ? void 0 : _b.chainIds) === null || _c === void 0 ? void 0 : _c.find(function (chain) { return chain.chainId === network.chainId; })) === null || _d === void 0 ? void 0 : _d.address,
balance: ethers_1.ethers
.parseUnits(network.amount, fromToken.decimals)
.toString(),
});
})
: ((_d = (_c = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _c === void 0 ? void 0 : _c.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _d === void 0 ? void 0 : _d.chainIds) || [],
inputAmount: ethers_1.ethers
.parseUnits(amount, (fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals) || 0)
.toString(),
proMode: proActive,
metadata: {
inputToken: {
tokenName: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenSymbol: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenAddress: fromToken === null || fromToken === void 0 ? void 0 : fromToken.address,
decimals: fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals,
logoURI: (fromToken === null || fromToken === void 0 ? void 0 : fromToken.icon) || (fromToken === null || fromToken === void 0 ? void 0 : fromToken.logoURI),
},
outputToken: {
tokenName: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenSymbol: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenAddress: toToken === null || toToken === void 0 ? void 0 : toToken.address,
decimals: toToken === null || toToken === void 0 ? void 0 : toToken.decimals,
logoURI: (toToken === null || toToken === void 0 ? void 0 : toToken.icon) || (toToken === null || toToken === void 0 ? void 0 : toToken.logoURI),
},
},
}, walletSDKKey)];
case 4:
// Execute swap to BTC flow
data = _l.sent();
return [3 /*break*/, 7];
case 5: return [4 /*yield*/, (0, services_1.executeSwapFlow)({
username: userName,
userBalance: proActive
? selectedNetworksPay.map(function (network) {
var _a, _b, _c, _d;
return ({
chainId: network.chainId,
address: (_d = (_c = (_b = (_a = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _a === void 0 ? void 0 : _a.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _b === void 0 ? void 0 : _b.chainIds) === null || _c === void 0 ? void 0 : _c.find(function (chain) { return chain.chainId === network.chainId; })) === null || _d === void 0 ? void 0 : _d.address,
balance: ethers_1.ethers
.parseUnits(network.amount, fromToken.decimals)
.toString(),
});
})
: ((_f = (_e = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _e === void 0 ? void 0 : _e.find(function (token) {
return token.symbol === fromToken.symbol &&
token.name === fromToken.name &&
token.decimals === fromToken.decimals;
})) === null || _f === void 0 ? void 0 : _f.chainIds) || [],
outputToken: (_h = (_g = toToken === null || toToken === void 0 ? void 0 : toToken.chainIds) === null || _g === void 0 ? void 0 : _g.find(function (chain) {
return chain.chainId === selectedNetworksReceive[0].chainId;
})) === null || _h === void 0 ? void 0 : _h.address,
outputChainId: selectedNetworksReceive[0].chainId,
inputAmount: ethers_1.ethers
.parseUnits(amount, (fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals) || 0)
.toString(),
metadata: {
inputToken: {
tokenName: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenSymbol: fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol,
tokenAddress: fromToken === null || fromToken === void 0 ? void 0 : fromToken.address,
decimals: fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals,
logoURI: (fromToken === null || fromToken === void 0 ? void 0 : fromToken.icon) || (fromToken === null || fromToken === void 0 ? void 0 : fromToken.logoURI),
},
outputToken: {
tokenName: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenSymbol: toToken === null || toToken === void 0 ? void 0 : toToken.symbol,
tokenAddress: toToken === null || toToken === void 0 ? void 0 : toToken.address,
decimals: toToken === null || toToken === void 0 ? void 0 : toToken.decimals,
logoURI: (toToken === null || toToken === void 0 ? void 0 : toToken.icon) || (toToken === null || toToken === void 0 ? void 0 : toToken.logoURI),
},
},
proMode: proActive,
}, walletSDKKey)];
case 6:
// Execute regular swap flow
data = _l.sent();
_l.label = 7;
case 7:
if (((_j = data === null || data === void 0 ? void 0 : data.transactionDetails) === null || _j === void 0 ? void 0 : _j.overallStatus) === "PENDING" ||
((_k = data === null || data === void 0 ? void 0 : data.transactionDetails) === null || _k === void 0 ? void 0 : _k.overallStatus) === "COMPLETED") {
console.log("Transaction successful:", data);
setTransactionId(data.transactionDetails.multiTransactionId);
console.log("Transaction ID: ", transactionId);
setShowMessagePopup(true);
setMessageType("success");
}
else {
console.error("Transaction failed:", data);
setShowMessagePopup(true);
setMessageType("error");
}
return [3 /*break*/, 10];
case 8:
error_2 = _l.sent();
console.error("Error making transaction:", error_2);
setShowMessagePopup(true);
setMessageType("error");
return [3 /*break*/, 10];
case 9:
setIsLoading(false);
return [7 /*endfinally*/];
case 10: return [2 /*return*/];
}
});
}); };
// Calculate total amount
var totalAmount = (0, react_1.useMemo)(function () {
return calculateTotalAmount(selectedNetworksPay, (fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals) || 6);
}, [selectedNetworksPay, fromToken === null || fromToken === void 0 ? void 0 : fromToken.decimals]);
(0, react_1.useEffect)(function () {
if (totalAmount > 0) {
setAmount(totalAmount.toString());
}
}, [totalAmount]);
var switchTokens = function () {
setFromToken(toToken);
setToToken(fromToken);
setSelectedNetworksPay([]);
setSelectedNetworksReceive([]);
setAmount("");
setQuoteDetails("");
};
// Add preset amount handler
var handlePresetClick = function (percentage) {
if (!fromToken)
return;
var balance = getTokenBalance(fromToken).toString();
if (!balance || balance === "0")
return;
try {
if (percentage === 100) {
// Max - just use the full balance
setAmount(balance);
}
else {
// Calculate percentage
var parsedBalance = ethers_1.ethers.parseUnits(balance, fromToken.decimals);
var amount_1 = (parsedBalance * BigInt(percentage)) / BigInt(100);
var formattedAmount = ethers_1.ethers.formatUnits(amount_1, fromToken.decimals);
setAmount(formattedAmount);
}
}
catch (error) {
console.error("Error calculating preset amount:", error);
}
};
// Add loading screen for tokens
if (tokensLoading) {
return (react_1.default.createElement("div", { style: {
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
height: "400px",
padding: "24px",
background: "#fff",
borderRadius: "20px",
width: "100%",
fontFamily: "Inter, sans-serif",
} },
react_1.default.createElement(Spinner_1.default, null),
react_1.default.createElement("div", { style: { marginTop: "16px", color: "#535862" } }, "Initializing tokens...")));
}
if (showActivity) {
return (react_1.default.createElement(ActivityDetails_1.default, { apiKey: walletSDKKey, onBack: onBack, activityId: transactionId || "" }));
}
if (showMessagePopup) {
return (react_1.default.createElement("div", null,
react_1.default.createElement(MessagePopup_1.default, { transactionClick: handleTransactionClick, handleDone: function () {
if (messageType === "success") {
onBack();
setShowMessagePopup(false);
}
else {
setShowMessagePopup(false);
setShowReviewOrder(false);
}
}, type: messageType, customContent: messageType === "success" ? (react_1.default.createElement("div", { style: {
display: "flex",
flexDirection: "column",
gap: 8,
alignItems: "center",
justifyContent: "center",
textAlign: "center",
} },
react_1.default.createElement("h1", { style: { fontSize: 18, fontWeight: 600, fontFamily: "Inter" } }, "Transaction successful"),
react_1.default.createElement("p", { style: {
fontSize: 15,
color: "#535862",
fontFamily: "Inter",
} }, "Please check your balance."))) : (react_1.default.createElement("div", { style: { textAlign: "center" } },
react_1.default.createElement("h1", { style: { fontSize: 18, fontWeight: 600, fontFamily: "Inter" } }, "Transaction failed"),
react_1.default.createElement("p", { style: {
fontSize: 15,
color: "#535862",
fontFamily: "Inter",
marginTop: 8,
} }, "We couldn't complete your transaction at the moment. This might be due to network issues, insufficient liquidity, or a failed quote."))) })));
}
if (showSelectToNetworks) {
return (react_1.default.createElement(SelectSingleNetwork_1.default, { availableNetworks: utils_1.availableNetworks, selectedToNetworksPay: selectedNetworksReceive, setSelectedToNetworksPay: setSelectedNetworksReceive, toToken: toToken, onBack: function () { return setShowSelectToNetworks(false); }, onDone: function () {
setShowSelectToNetworks(false);
} }));
}
if (showSelectFromNetworks) {
return (react_1.default.createElement(SelectNetwork_1.default, { availableNetworks: utils_1.availableNetworks, selectedNetworksPay: selectedNetworksPay, setSelectedNetworksPay: setSelectedNetworksPay, fromToken: ((_d = combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data) === null || _d === void 0 ? void 0 : _d.find(function (token) { return token.symbol === (fromToken === null || fromToken === void 0 ? void 0 : fromToken.symbol); })) || {}, onBack: function () { return setShowSelectFromNetworks(false); }, onDone: function (networks) {
setSelectedNetworksPay(networks);
setShowSelectFromNetworks(false);
} }));
}
// Show From Token Selector
if (showFromTokenSelector) {
return (react_1.default.createElement(TokenSelector_1.default, { title: "Select token to pay", tokens: tokenOptions, onTokenSelect: handleFromTokenSelect, onBack: function () { return setShowFromTokenSelector(false); }, isLoading: !(combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data), inSwap: true, apiKey: walletSDKKey }));
}
// Show To Token Selector
if (showToTokenSelector) {
return (react_1.default.createElement(TokenSelector_1.default, { title: "Select token to receive", tokens: tokenOptions, onTokenSelect: handleToTokenSelect, onBack: function () { return setShowToTokenSelector(false); }, isLoading: !(combinedBalance === null || combinedBalance === void 0 ? void 0 : combinedBalance.data), inSwap: true, apiKey: walletSDKKey }));
}
return (react_1.default.createElement("div", { style: {
background: "#fff",
borderRadius: 20,
width: "100%",
margin: "0 auto",
position: "relative",
fontFamily: "Inter, sans-serif",
} },
react_1.default.createElement("div", { style: {
display: "flex",
alignItems: "center",
marginBottom: 28,
fontFamily: "Inter, sans-serif",
} },
react_1.default.createElement("button", { onClick: handleBack, style: {
background: "none",
border: "none",
fontSize: 22,
color: "#222",
cursor: "pointer",
marginRight: 8,
fontFamily: "Inter, sans-serif",
padding: 0,
} },
react_1.default.createElement(lucide_react_1.ArrowLeft, { style: { width: 24, height: 24, color: "#717680" } })),
react_1.default.createElement("div", { style: {
flex: 1,
textAlign: "center",
fontWeight: 600,
fontSize: 22,
fontFamily: "Inter, sans-serif",
} }, showReviewOrder ? "Review Order" : "Swap tokens instantly"),
!showReviewOrder && (react_1.default.createElement("div", { style: { marginLeft: 8, fontFamily: "Inter, sans-serif" } },
react_1.default.createElement("button", { type: "button", "aria-pressed": proActive, onClick: function () {
setProActive(function (v) {