@enclavemoney/enclave-wallet-sdk
Version:
A simple enclave wallet SDK for React applications
944 lines (943 loc) • 78.4 kB
JavaScript
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
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.WalletModal = void 0;
var react_1 = __importStar(require("react"));
var enclavemoney_web_experimental_1 = require("@enclavemoney/enclavemoney-web-experimental");
var SwapToken_1 = require("./Swap/SwapToken");
var Dashboard_1 = require("./Dashboard/Dashboard");
var TransferToken_1 = __importDefault(require("./Transfer/TransferToken"));
var ActivityDetails_1 = __importDefault(require("./Activity/ActivityDetails"));
var WalletProvider_1 = require("./WalletProvider");
var services_1 = require("../services/services");
var firebase_auth_1 = require("../services/firebase-auth");
var lucide_react_1 = require("lucide-react");
var Spinner_1 = __importDefault(require("./ui/Spinner"));
var framer_motion_1 = require("framer-motion");
var theme_1 = require("../types/theme");
var utils_1 = require("./utils");
var StartStep = function (_a) {
var onNext = _a.onNext;
var _b = (0, WalletProvider_1.useWallet)(), walletCornerRadius = _b.walletCornerRadius, currentTheme = _b.currentTheme;
var currentRadius = theme_1.borderRadiusStyles[walletCornerRadius];
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { style: { fontSize: 36, marginBottom: 10 } },
react_1.default.createElement("img", { src: "https://storage.googleapis.com/enclave_assets/passKey.png", alt: "passkey Logo", style: { width: 84 } })),
react_1.default.createElement("div", { style: {
color: currentTheme.textSecondary,
fontSize: 17,
textAlign: "center",
marginBottom: 10,
} }, "Authenticate securely using your device's passkey"),
react_1.default.createElement("button", { style: {
marginTop: 10,
width: "100%",
background: currentTheme.primary,
color: (0, utils_1.getContrastingTextColor)(currentTheme.primary),
fontWeight: 600,
fontSize: 18,
border: "none",
borderRadius: currentRadius.innerRadius,
padding: "16px 0",
cursor: "pointer",
boxShadow: "0 2px 8px rgba(70,100,233,0.10)",
transition: "background 0.2s",
}, onClick: onNext }, "Use my passkey")));
};
var SignupStep = function (_a) {
var username = _a.username, onUsernameChange = _a.onUsernameChange, usernameStatus = _a.usernameStatus, checking = _a.checking, error = _a.error, actionLoading = _a.actionLoading, onLogin = _a.onLogin, onSignup = _a.onSignup;
var _b = (0, WalletProvider_1.useWallet)(), walletCornerRadius = _b.walletCornerRadius, currentTheme = _b.currentTheme;
var currentRadius = theme_1.borderRadiusStyles[walletCornerRadius];
return (react_1.default.createElement("div", { style: { width: "100%" } },
react_1.default.createElement("label", { style: {
fontWeight: 600,
fontSize: 14,
margin: "0px 10px 10px 10px",
display: "block",
color: currentTheme.textSecondary,
} }, "Choose a username"),
react_1.default.createElement("input", { type: "text", value: username, onChange: function (e) { return onUsernameChange(e.target.value); }, placeholder: "Enter username", style: {
width: "100%",
padding: "16px",
borderRadius: currentRadius.innerRadius,
border: "1px solid ".concat(currentTheme.border),
color: currentTheme.text,
backgroundColor: currentTheme.surface,
fontSize: 16,
marginBottom: 8,
}, disabled: actionLoading }),
checking && (react_1.default.createElement("div", { style: {
color: currentTheme.textSecondary,
fontSize: 14,
margin: "0px 10px 10px 10px",
} }, "Searching username...")),
usernameStatus === "exists" && (react_1.default.createElement("div", { style: {
color: currentTheme.successText,
fontSize: 14,
display: "flex",
alignItems: "center",
gap: 4,
margin: "0px 10px 10px 10px",
} },
react_1.default.createElement(lucide_react_1.BadgeCheck, { color: currentTheme.successText, size: 16 }),
" Username found. You can log in.")),
usernameStatus === "not-exists" && (react_1.default.createElement("div", { style: {
color: currentTheme.primary,
fontSize: 14,
display: "flex",
alignItems: "center",
gap: 4,
margin: "0px 10px 10px 10px",
} },
react_1.default.createElement(lucide_react_1.BadgeAlert, { color: currentTheme.primary, size: 16 }),
" Username is available. You can sign up.")),
error && (react_1.default.createElement("div", { style: {
color: currentTheme.errorText,
fontSize: 14,
margin: "0px 10px 10px 10px",
} },
react_1.default.createElement(lucide_react_1.CircleX, { color: currentTheme.errorText, size: 16 }),
" ",
error)),
react_1.default.createElement("button", { style: {
marginTop: 16,
width: "100%",
background: currentTheme.primary,
color: (0, utils_1.getContrastingTextColor)(currentTheme.primary),
fontWeight: 600,
fontSize: 16,
border: "none",
borderRadius: currentRadius.innerRadius,
padding: "16px 0",
cursor: usernameStatus && !checking ? "pointer" : "not-allowed",
boxShadow: "0 2px 8px rgba(70,100,233,0.10)",
transition: "background 0.2s",
opacity: usernameStatus && !checking && !actionLoading ? 1 : 0.5,
}, disabled: !usernameStatus || checking || actionLoading, onClick: function () { return __awaiter(void 0, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!(usernameStatus === "exists")) return [3 /*break*/, 2];
return [4 /*yield*/, onLogin()];
case 1:
_a.sent();
return [3 /*break*/, 4];
case 2:
if (!(usernameStatus === "not-exists")) return [3 /*break*/, 4];
return [4 /*yield*/, onSignup()];
case 3:
_a.sent();
_a.label = 4;
case 4: return [2 /*return*/];
}
});
}); } }, checking
? "Searching username..."
: actionLoading
? usernameStatus === "exists"
? "Logging in..."
: "Signing up..."
: usernameStatus === "exists"
? "Login"
: usernameStatus === "not-exists"
? "Sign Up"
: "Continue")));
};
var PasskeyUsernameStep = function (_a) {
var username = _a.username, actionLoading = _a.actionLoading, error = _a.error, onLogin = _a.onLogin, onSwitchToManual = _a.onSwitchToManual;
var _b = (0, WalletProvider_1.useWallet)(), walletCornerRadius = _b.walletCornerRadius, currentTheme = _b.currentTheme;
var currentRadius = theme_1.borderRadiusStyles[walletCornerRadius];
return (react_1.default.createElement("div", { style: { width: "100%" } },
react_1.default.createElement("label", { style: {
fontWeight: 600,
fontSize: 14,
marginBottom: 6,
marginLeft: 10,
display: "block",
} }, "Continue with your passkey"),
react_1.default.createElement("div", { style: {
display: "flex",
alignItems: "center",
padding: "12px",
borderRadius: currentRadius.innerRadius,
border: "1px solid ".concat(currentTheme.border),
backgroundColor: currentTheme.surface,
marginBottom: 8,
gap: 10,
} },
react_1.default.createElement(lucide_react_1.CircleUserRound, { color: currentTheme.primary, size: 24 }),
react_1.default.createElement("span", { style: {
flex: 1,
fontSize: 16,
color: currentTheme.text,
fontWeight: 500,
} }, username),
react_1.default.createElement("button", { onClick: onSwitchToManual, style: {
background: "none",
border: "none",
color: currentTheme.textSecondary,
fontSize: 12,
cursor: "pointer",
padding: "4px 8px",
borderRadius: 4,
textDecoration: "underline",
}, disabled: actionLoading }, "Use different username")),
error && (react_1.default.createElement("div", { style: {
color: currentTheme.errorText,
fontSize: 14,
marginBottom: 8,
} }, error)),
react_1.default.createElement("button", { style: {
marginTop: 8,
width: "100%",
background: currentTheme.primary,
color: "white",
fontWeight: 600,
fontSize: 16,
border: "none",
borderRadius: currentRadius.innerRadius,
padding: "16px 0",
cursor: actionLoading ? "not-allowed" : "pointer",
boxShadow: "0 2px 8px rgba(70,100,233,0.10)",
transition: "background 0.2s",
opacity: actionLoading ? 0.5 : 1,
}, disabled: actionLoading, onClick: onLogin }, actionLoading ? "Logging in..." : "Continue with passkey")));
};
// Add CSS styles with theme and borderRadius support
var getStyles = function (theme, cornerRadius, themeObject, config) {
if (cornerRadius === void 0) { cornerRadius = "medium"; }
var currentTheme = themeObject;
var currentRadius = theme_1.borderRadiusStyles[cornerRadius];
var fontFamily = (config === null || config === void 0 ? void 0 : config.fontFamily) || "Inter, sans-serif";
return "\n .modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: rgba(0, 0, 0, 0.5);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1001;\n animation: fadeIn 0.3s ease-out;\n }\n\n .modal-content {\n box-sizing: border-box;\n background-color: ".concat(currentTheme.surface, ";\n max-height: 95vh;\n overflow-y: auto;\n padding: 28px ;\n border-radius: ").concat(currentRadius.outerRadius, "px;\n min-width: 480px;\n max-width: 440px;\n color: ").concat(currentTheme.text, ";\n box-shadow: 0 4px 24px rgba(0,0,0,0.10);\n position: relative;\n font-family: ").concat(fontFamily, " !important;\n animation: slideIn 0.3s ease-out;\n border: 1px solid ").concat(currentTheme.border, ";\n }\n .modal-content * {\n box-sizing: border-box;\n font-family: ").concat(fontFamily, " !important;\n }\n\n .hide-scrollbar::-webkit-scrollbar {\n display: none;\n }\n\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes slideIn {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n }\n\n @media (max-width: 768px) {\n .modal-overlay {\n align-items: flex-end;\n }\n\n .modal-content {\n width: 100%;\n min-width: 100%;\n max-height: 90vh;\n border-radius: ").concat(currentRadius.outerRadius, "px ").concat(currentRadius.outerRadius, "px 0 0;\n padding: 24px;\n margin: 0;\n }\n }\n ");
};
var WalletModalContent = function (_a) {
var _b, _c, _d, _e, _f, _g;
var isOpen = _a.isOpen, onClose = _a.onClose, walletSDKKey = _a.walletSDKKey, swapParams = _a.swapParams, transferParams = _a.transferParams, showMessagePopup = _a.showMessagePopup, _h = _a.messageType, messageType = _h === void 0 ? "success" : _h, transactionId = _a.transactionId;
var _j = (0, react_1.useState)("start"), step = _j[0], setStep = _j[1];
var _k = (0, react_1.useState)(""), username = _k[0], setUsername = _k[1];
var _l = (0, react_1.useState)(false), checking = _l[0], setChecking = _l[1];
var _m = (0, react_1.useState)(null), usernameStatus = _m[0], setUsernameStatus = _m[1];
var _o = (0, react_1.useState)(null), error = _o[0], setError = _o[1];
var _p = (0, react_1.useState)(false), actionLoading = _p[0], setActionLoading = _p[1];
var _q = (0, react_1.useState)(null), result = _q[0], setResult = _q[1];
var _r = (0, react_1.useState)(null), balance = _r[0], setBalance = _r[1];
var _s = (0, react_1.useState)(false), showSwap = _s[0], setShowSwap = _s[1];
var _t = (0, react_1.useState)(false), showTransfer = _t[0], setShowTransfer = _t[1];
var debounceRef = (0, react_1.useRef)(null);
var _u = (0, WalletProvider_1.useWallet)(), tokenOptions = _u.tokenOptions, tokensLoading = _u.tokensLoading, cryptoBalance = _u.cryptoBalance, loading = _u.loading, refreshBalance = _u.refreshBalance, showActivity = _u.showActivity, setShowActivity = _u.setShowActivity, activity = _u.activity, setLoading = _u.setLoading, refreshTokenOptions = _u.refreshTokenOptions, theme = _u.theme, walletCornerRadius = _u.walletCornerRadius, config = _u.config, currentTheme = _u.currentTheme;
var _v = (0, react_1.useState)(null), combinedBalance = _v[0], setCombinedBalance = _v[1];
var _w = (0, react_1.useState)(false), initialTokensLoading = _w[0], setInitialTokensLoading = _w[1];
var _x = (0, react_1.useState)(undefined), initialFromToken = _x[0], setInitialFromToken = _x[1];
var _y = (0, react_1.useState)(undefined), initialToToken = _y[0], setInitialToToken = _y[1];
// Add transfer-related state
var _z = (0, react_1.useState)(undefined), initialTransferToken = _z[0], setInitialTransferToken = _z[1];
var _0 = (0, react_1.useState)(""), initialTransferAmount = _0[0], setInitialTransferAmount = _0[1];
var _1 = (0, react_1.useState)(""), initialRecipient = _1[0], setInitialRecipient = _1[1];
// New state for passkey username flow
var _2 = (0, react_1.useState)(null), savedUsername = _2[0], setSavedUsername = _2[1];
var _3 = (0, react_1.useState)(false), showManualInput = _3[0], setShowManualInput = _3[1];
var _4 = (0, react_1.useState)(false), showMessagePopupState = _4[0], setShowMessagePopupState = _4[1];
var _5 = (0, react_1.useState)("success"), messageTypeState = _5[0], setMessageTypeState = _5[1];
var _6 = (0, react_1.useState)(null), transactionIdState = _6[0], setTransactionIdState = _6[1];
var _7 = (0, react_1.useState)(false), showActivityState = _7[0], setShowActivityState = _7[1];
// Google authentication state
var _8 = (0, react_1.useState)(false), googleAuthLoading = _8[0], setGoogleAuthLoading = _8[1];
var _9 = (0, react_1.useState)(false), xAuthLoading = _9[0], setXAuthLoading = _9[1];
var _10 = (0, react_1.useState)(null), googleUser = _10[0], setGoogleUser = _10[1];
var _11 = (0, react_1.useState)(null), twitterUser = _11[0], setTwitterUser = _11[1];
var enclave = new enclavemoney_web_experimental_1.Enclave(walletSDKKey);
var currentRadius = theme_1.borderRadiusStyles[walletCornerRadius];
// Add style tag to document head
(0, react_1.useEffect)(function () {
var styleElement = document.createElement("style");
styleElement.textContent = getStyles(theme, walletCornerRadius, currentTheme, config);
document.head.appendChild(styleElement);
return function () {
document.head.removeChild(styleElement);
};
}, [theme, walletCornerRadius, currentTheme]);
// Prevent body scroll when modal is open
(0, react_1.useEffect)(function () {
if (isOpen) {
// Store the original overflow value
var originalOverflow_1 = document.body.style.overflow;
// Prevent body scroll
document.body.style.overflow = "hidden";
// Restore original overflow when modal closes
return function () {
document.body.style.overflow = originalOverflow_1;
};
}
}, [isOpen]);
(0, react_1.useEffect)(function () {
if (isOpen) {
// Check for existing session first
var saved = localStorage.getItem("enclave_wallet_login");
if (saved) {
var parsed = JSON.parse(saved);
setResult(parsed.result);
setBalance(parsed.balance);
if (parsed.googleUser) {
setGoogleUser(parsed.googleUser);
}
if (parsed.twitterUser) {
setTwitterUser(parsed.twitterUser);
}
// Trigger immediate balance refresh when modal opens with existing session
refreshBalance();
return;
}
// Check for previously used username
var lastUsername = localStorage.getItem("enclave_last_username");
if (lastUsername) {
setSavedUsername(lastUsername);
setUsername(lastUsername);
setStep("passkey-username");
}
else {
setStep("start");
}
}
}, [isOpen, swapParams]);
(0, react_1.useEffect)(function () {
if (result) {
localStorage.setItem("enclave_wallet_login", JSON.stringify({ result: result, balance: balance, googleUser: googleUser, twitterUser: twitterUser }));
setLoading(true);
}
}, [result, balance, googleUser, twitterUser]);
(0, react_1.useEffect)(function () {
if (swapParams) {
setShowSwap(true);
}
if (transferParams) {
setShowTransfer(true);
setInitialTransferAmount(transferParams.inputAmount || "");
setInitialRecipient(transferParams.recipient);
}
if (cryptoBalance) {
setCombinedBalance(cryptoBalance);
}
}, [result, swapParams, transferParams, cryptoBalance]);
(0, react_1.useEffect)(function () {
var initializeTokens = function () { return __awaiter(void 0, void 0, void 0, function () {
var fromToken, toToken, transferToken;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
setInitialTokensLoading(true);
if (!swapParams) return [3 /*break*/, 3];
return [4 /*yield*/, getInitialFromToken()];
case 1:
fromToken = _a.sent();
return [4 /*yield*/, getInitialToToken()];
case 2:
toToken = _a.sent();
setInitialFromToken(fromToken);
setInitialToToken(toToken);
console.log("initialFromToken", fromToken);
console.log("initialToToken", toToken);
_a.label = 3;
case 3:
if (!transferParams) return [3 /*break*/, 5];
return [4 /*yield*/, getInitialTransferToken()];
case 4:
transferToken = _a.sent();
setInitialTransferToken(transferToken);
console.log("initialTransferToken", transferToken);
_a.label = 5;
case 5:
setInitialTokensLoading(false);
return [2 /*return*/];
}
});
}); };
if ((swapParams || transferParams) && tokenOptions.length > 0) {
initializeTokens();
}
}, [swapParams, transferParams, tokenOptions, walletSDKKey]);
(0, react_1.useEffect)(function () {
if (isOpen) {
// Check for transaction data in localStorage
var transactionData = localStorage.getItem("enclave_transaction_data");
if (transactionData) {
var data = JSON.parse(transactionData);
setTransactionIdState(data.transactionId || null);
// Clear the data after reading
localStorage.removeItem("enclave_transaction_data");
}
}
}, [isOpen]);
var handleUsernameChange = function (value) {
setUsername(value);
setUsernameStatus(null);
setError(null);
if (debounceRef.current)
clearTimeout(debounceRef.current);
if (!value)
return;
setChecking(true);
debounceRef.current = setTimeout(function () {
checkUserName(value);
}, 500);
};
var checkUserName = function (username) { return __awaiter(void 0, void 0, void 0, function () {
var resp, e_1;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
setChecking(true);
setError(null);
_a.label = 1;
case 1:
_a.trys.push([1, 3, 4, 5]);
return [4 /*yield*/, enclave.checkUserName(username)];
case 2:
resp = _a.sent();
if (resp.value === true) {
setUsernameStatus("exists");
}
else if (resp.value === false) {
setUsernameStatus("not-exists");
}
else {
setUsernameStatus(null);
}
return [3 /*break*/, 5];
case 3:
e_1 = _a.sent();
setError("Error checking username");
setUsernameStatus(null);
return [3 /*break*/, 5];
case 4:
setChecking(false);
return [7 /*endfinally*/];
case 5: return [2 /*return*/];
}
});
}); };
var signInAccount = function () { return __awaiter(void 0, void 0, void 0, function () {
var resp, attResp, error_1, verificationResp, firebaseResult, updatedVerificationResp, sdkInstance, balanceData, sdkInstance, balanceData, e_2;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
setActionLoading(true);
setError(null);
_a.label = 1;
case 1:
_a.trys.push([1, 19, 20, 21]);
return [4 /*yield*/, enclave.getPasskeyAccountRegisteredOptions(username)];
case 2:
resp = _a.sent();
attResp = void 0;
_a.label = 3;
case 3:
_a.trys.push([3, 5, , 6]);
return [4 /*yield*/, enclave.startPasskeyAccountAuthentication(resp)];
case 4:
attResp = _a.sent();
return [3 /*break*/, 6];
case 5:
error_1 = _a.sent();
throw error_1;
case 6: return [4 /*yield*/, enclave.submitPasskeyAccountRegisteredResponse({
username: username,
attResp: attResp,
})];
case 7:
verificationResp = _a.sent();
if (!verificationResp) return [3 /*break*/, 17];
if (!verificationResp.error) return [3 /*break*/, 8];
setError(verificationResp.message);
return [3 /*break*/, 16];
case 8:
if (!verificationResp.token) return [3 /*break*/, 14];
return [4 /*yield*/, (0, firebase_auth_1.signInWithCustomTokenAndGetIdToken)(verificationResp.token)];
case 9:
firebaseResult = _a.sent();
if (!(firebaseResult.success && firebaseResult.idToken)) return [3 /*break*/, 12];
updatedVerificationResp = __assign(__assign({}, verificationResp), { token: firebaseResult.idToken, refreshToken: firebaseResult.refreshToken });
setResult(updatedVerificationResp);
refreshTokenOptions();
// Save username for future passkey login
localStorage.setItem("enclave_last_username", username);
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 11];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 10:
balanceData = _a.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: updatedVerificationResp,
balance: balanceData,
});
_a.label = 11;
case 11: return [3 /*break*/, 13];
case 12:
setError(firebaseResult.error || "Failed to get Firebase ID token");
_a.label = 13;
case 13: return [3 /*break*/, 16];
case 14:
// Fallback to original response if no token
setResult(verificationResp);
refreshTokenOptions();
// Save username for future passkey login
localStorage.setItem("enclave_last_username", username);
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 16];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 15:
balanceData = _a.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: verificationResp,
balance: balanceData,
});
_a.label = 16;
case 16: return [3 /*break*/, 18];
case 17:
setError("Login failed");
_a.label = 18;
case 18: return [3 /*break*/, 21];
case 19:
e_2 = _a.sent();
setError(e_2.message || "Login failed");
return [3 /*break*/, 21];
case 20:
setActionLoading(false);
return [7 /*endfinally*/];
case 21: return [2 /*return*/];
}
});
}); };
var createAccount = function () { return __awaiter(void 0, void 0, void 0, function () {
var resp, attResp, error_2, verificationResp, firebaseResult, updatedVerificationResp, sdkInstance, balanceData, sdkInstance, balanceData, e_3;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
setActionLoading(true);
setError(null);
_a.label = 1;
case 1:
_a.trys.push([1, 19, 20, 21]);
return [4 /*yield*/, enclave.getPasskeyAccountRegistrationOptions(username)];
case 2:
resp = _a.sent();
attResp = void 0;
_a.label = 3;
case 3:
_a.trys.push([3, 5, , 6]);
return [4 /*yield*/, enclave.startPasskeyAccountRegistration(resp)];
case 4:
attResp = _a.sent();
return [3 /*break*/, 6];
case 5:
error_2 = _a.sent();
throw error_2;
case 6: return [4 /*yield*/, enclave.submitPasskeyAccountRegistrationResponse({
username: username,
attResp: attResp,
})];
case 7:
verificationResp = _a.sent();
if (!verificationResp) return [3 /*break*/, 17];
if (!verificationResp.error) return [3 /*break*/, 8];
setError(verificationResp.message);
return [3 /*break*/, 16];
case 8:
if (!verificationResp.token) return [3 /*break*/, 14];
return [4 /*yield*/, (0, firebase_auth_1.signInWithCustomTokenAndGetIdToken)(verificationResp.token)];
case 9:
firebaseResult = _a.sent();
if (!(firebaseResult.success && firebaseResult.idToken)) return [3 /*break*/, 12];
updatedVerificationResp = __assign(__assign({}, verificationResp), { token: firebaseResult.idToken, refreshToken: firebaseResult.refreshToken });
setResult(updatedVerificationResp);
refreshTokenOptions();
// Save username for future passkey login
localStorage.setItem("enclave_last_username", username);
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 11];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 10:
balanceData = _a.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: updatedVerificationResp,
balance: balanceData,
});
_a.label = 11;
case 11: return [3 /*break*/, 13];
case 12:
setError(firebaseResult.error || "Failed to get Firebase ID token");
_a.label = 13;
case 13: return [3 /*break*/, 16];
case 14:
// Fallback to original response if no token
setResult(verificationResp);
refreshTokenOptions();
// Save username for future passkey login
localStorage.setItem("enclave_last_username", username);
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 16];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 15:
balanceData = _a.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: verificationResp,
balance: balanceData,
});
_a.label = 16;
case 16: return [3 /*break*/, 18];
case 17:
setError("Signup failed");
_a.label = 18;
case 18: return [3 /*break*/, 21];
case 19:
e_3 = _a.sent();
setError(e_3.message || "Signup failed");
return [3 /*break*/, 21];
case 20:
setActionLoading(false);
return [7 /*endfinally*/];
case 21: return [2 /*return*/];
}
});
}); };
var handleLogout = function () { return __awaiter(void 0, void 0, void 0, function () {
var signOutUser, error_3;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!googleUser) return [3 /*break*/, 5];
_a.label = 1;
case 1:
_a.trys.push([1, 4, , 5]);
return [4 /*yield*/, Promise.resolve().then(function () { return __importStar(require("../services/firebase-auth")); })];
case 2:
signOutUser = (_a.sent()).signOutUser;
return [4 /*yield*/, signOutUser()];
case 3:
_a.sent();
setGoogleUser(null);
return [3 /*break*/, 5];
case 4:
error_3 = _a.sent();
console.error("Error signing out from Google:", error_3);
return [3 /*break*/, 5];
case 5:
setResult(null);
setUsername("");
setUsernameStatus(null);
setError(null);
setStep("start");
localStorage.removeItem("enclave_wallet_login");
localStorage.removeItem("enclave_last_username"); // Clear saved username
onClose();
return [2 /*return*/];
}
});
}); };
// Handler for passkey username login
var handlePasskeyLogin = function () { return __awaiter(void 0, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!savedUsername) return [3 /*break*/, 2];
return [4 /*yield*/, signInAccount()];
case 1:
_a.sent();
_a.label = 2;
case 2: return [2 /*return*/];
}
});
}); };
// Handler to switch to manual username input
var handleSwitchToManual = function () {
setShowManualInput(true);
setStep("signup");
setUsername("");
setUsernameStatus(null);
setError(null);
};
// Handler for Google login
var handleGoogleLogin = function () { return __awaiter(void 0, void 0, void 0, function () {
var result_1, googleResult, sdkInstance, balanceData, error_4;
var _a, _b, _c, _d, _e;
return __generator(this, function (_f) {
switch (_f.label) {
case 0:
setGoogleAuthLoading(true);
setError(null);
_f.label = 1;
case 1:
_f.trys.push([1, 7, 8, 9]);
return [4 /*yield*/, (0, firebase_auth_1.signInWithGoogle)(walletSDKKey)];
case 2:
result_1 = _f.sent();
if (!(result_1.success && result_1.user)) return [3 /*break*/, 5];
setGoogleUser(result_1.user);
googleResult = {
username: (_a = result_1.user.socialLoginDetails.googleUser) === null || _a === void 0 ? void 0 : _a.email,
email: (_b = result_1.user.socialLoginDetails.googleUser) === null || _b === void 0 ? void 0 : _b.email,
displayName: (_c = result_1.user.socialLoginDetails.googleUser) === null || _c === void 0 ? void 0 : _c.displayName,
photoURL: (_d = result_1.user.socialLoginDetails.googleUser) === null || _d === void 0 ? void 0 : _d.photoURL,
uid: (_e = result_1.user.socialLoginDetails.googleUser) === null || _e === void 0 ? void 0 : _e.uid,
authMethod: "google",
wallet: result_1.user.wallet,
verified: result_1.user.verified,
socialLoginDetails: result_1.user.socialLoginDetails,
_id: result_1.user._id,
// @ts-ignore
token: result_1.user.accessToken,
// @ts-ignore
refreshToken: result_1.user.refreshToken,
};
setResult(googleResult);
refreshTokenOptions();
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 4];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 3:
balanceData = _f.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: googleResult,
balance: balanceData,
});
_f.label = 4;
case 4: return [3 /*break*/, 6];
case 5:
setError(result_1.error || "Google login failed");
_f.label = 6;
case 6: return [3 /*break*/, 9];
case 7:
error_4 = _f.sent();
console.error("Google login error:", error_4);
setError(error_4.message || "Google login failed");
return [3 /*break*/, 9];
case 8:
setGoogleAuthLoading(false);
return [7 /*endfinally*/];
case 9: return [2 /*return*/];
}
});
}); };
// Handler for X (Twitter) login
var handleXLogin = function () { return __awaiter(void 0, void 0, void 0, function () {
var result_2, socialLoginDetails, twitterUser_1, xResult, sdkInstance, balanceData, error_5;
var _a;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
setXAuthLoading(true);
setError(null);
_b.label = 1;
case 1:
_b.trys.push([1, 7, 8, 9]);
return [4 /*yield*/, (0, firebase_auth_1.signInWithX)(walletSDKKey)];
case 2:
result_2 = _b.sent();
if (!(result_2.success && result_2.user)) return [3 /*break*/, 5];
console.log("result", result_2);
setTwitterUser(result_2.user); // You may want a separate state for X user if needed
socialLoginDetails = result_2.user.socialLoginDetails || {};
twitterUser_1 = socialLoginDetails.twitterUser || {};
xResult = {
username: (_a = result_2 === null || result_2 === void 0 ? void 0 : result_2.user) === null || _a === void 0 ? void 0 : _a.username,
email: twitterUser_1.email,
displayName: twitterUser_1.username,
photoURL: twitterUser_1.profile_image_url,
uid: twitterUser_1.uid,
authMethod: "twitter",
wallet: result_2.user.wallet,
verified: result_2.user.verified,
socialLoginDetails: result_2.user.socialLoginDetails,
_id: result_2.user._id,
// @ts-ignore
token: result_2.user.accessToken,
// @ts-ignore
refreshToken: result_2.user.refreshToken,
};
setResult(xResult);
refreshTokenOptions();
sdkInstance = window.__walletSDKInstance;
if (!sdkInstance) return [3 /*break*/, 4];
return [4 /*yield*/, sdkInstance.getUserCryptoBalance()];
case 3:
balanceData = _b.sent();
setBalance(balanceData);
sdkInstance.setUserSession({
result: xResult,
balance: balanceData,
});
_b.label = 4;
case 4: return [3 /*break*/, 6];
case 5:
setError(result_2.error || "X login failed");
_b.label = 6;
case 6: return [3 /*break*/, 9];
case 7:
error_5 = _b.sent();
console.error("X login error:", error_5);
setError(error_5.message || "X login failed");
return [3 /*break*/, 9];
case 8:
setXAuthLoading(false);
return [7 /*endfinally*/];
case 9: return [2 /*return*/];
}
});
}); };
var getMatchingTokenFromCryptoBalance = function (tokenAddress, chainId) {
return cryptoBalance === null || cryptoBalance === void 0 ? void 0 : cryptoBalance.data.find(function (token) {
return token.chainIds.some(function (chain) {
return chain.address.toLowerCase() === tokenAddress.toLowerCase() &&
chain.chainId === chainId;
});
});
};
var formatTokenForSwap = function (matchingToken, chainId) {
var _a;
if (!matchingToken)
return undefined;
var matchingChain = matchingToken.chainIds.find(function (chain) { return chain.chainId === chainId; });
if (!matchingChain)
return undefined;
return {
symbol: matchingToken.symbol,
name: matchingToken.name,
icon: matchingToken.logoURI,
address: matchingChain.address,
chainId: matchingChain.chainId,
chainIds: matchingToken.chainIds,
decimals: matchingToken.decimals,
balance: matchingChain.balance,
amount: (_a = matchingToken.amount) === null || _a === void 0 ? void 0 : _a.toString(),
};
};
var getInitialFromToken = function () { return __awaiter(void 0, void 0, void 0, function () {
var matchingToken, searchTokenResponse, matchingChain;
var _a, _b, _c;
return __generator(this, function (_d) {
switch (_d.label) {
case 0:
if (!(swapParams === null || swapParams === void 0 ? void 0 : swapParams.fromToken) || !tokenOptions.length)
return [2 /*return*/, undefined];
matchingToken = tokenOptions.find(function (token) {
var _a;
return (_a = token.chainIds) === null || _a === void 0 ? void 0 : _a.some(function (chain) {
return chain.address.toLowerCase() ===
swapParams.fromToken.tokenAddress.toLowerCase() &&
chain.chainId === swapParams.fromToken.chainId;
});
});
if (!(!matchingToken || !matchingToken.chainIds)) return [3 /*break*/, 4];
if (!swapParams.fromToken.metadata) return [3 /*break*/, 1];
matchingToken = {
address: swapParams.fromToken.tokenAddress,
symbol: swapParams.fromToken.metadata.tokenSymbol,
name: swapParams.fromToken.metadata.tokenName,
logoURI: swapParams.fromToken.metadata.logoURI,
chainIds: swapParams.fromToken.metadata.chainIds.map(function (chain) { return ({
chainId: chain.chainId,
address: chain.address,
}); }),
decimals: swapParams.fromToken.metadata.decimals,
chainId: swapParams.fromToken.metadata.chainIds[0].chainId,
};
return [3 /*break*/, 3];
case 1: return [4 /*yield*/, (0, services_1.searchToken)(swapParams.fromToken.tokenAddress, swapParams.fromToken.chainId, walletSDKKey)];
case 2:
searchTokenResponse = _d.sent();
if ((searchTokenResponse === null || searchTokenResponse === void 0 ? void 0 : searchTokenResponse.success) && searchTokenResponse.data) {
matchingToken = {
address: searchTokenResponse.data.chainIds[0].address,
symbol: searchTokenResponse.data.symbol,
name: searchTokenResponse.data.name,
logoURI: searchTokenResponse.data.logoURI,
chainIds: searchTokenResponse.data.chainIds.map(function (chain) { return ({
chainId: parseInt(chain.chainId),
address: chain.address,
}); }),
decimals: searchTokenResponse.data.decimals,
chainId: parseInt(searchTokenResponse.data.chainIds[0].chainId),
};
}
_d.label = 3;
case 3:
if (!matchingToken)
return [2 /*return*/, undefined];
return [2 /*return*/, {