@sky-mavis/tanto-widget
Version:
Tanto Widget
111 lines • 11.8 kB
JavaScript
import _styled from'@emotion/styled/base';import {jsx}from'@emotion/react/jsx-runtime';import {useMemo}from'react';import {useConnectors}from'wagmi';import {walletConfigs}from'../configs/walletConfigs.mjs';import {WALLET_IDS}from'../types/wallet.mjs';import {isRoninInAppBrowser,isDesktop,isMobile,isInjectedConnector,notEmpty,isWCConnector,isRoninExtensionInstalled,isSafeConnector,isCoinbaseConnector,isWaypointConnector}from'../utils/index.mjs';import {useIsSafeWallet}from'./useIsSafeWallet.mjs';function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
const WalletIcon = /*#__PURE__*/_styled("img", process.env.NODE_ENV === "production" ? {
target: "e2a4psx0"
} : {
target: "e2a4psx0",
label: "WalletIcon"
})(process.env.NODE_ENV === "production" ? {
name: "sg5qoq",
styles: "width:32px;height:32px;border-radius:8px;object-fit:contain"
} : {
name: "sg5qoq",
styles: "width:32px;height:32px;border-radius:8px;object-fit:contain/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInVzZVdhbGxldHMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFtQiIsImZpbGUiOiJ1c2VXYWxsZXRzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4IH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0L2pzeC1ydW50aW1lXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgdXNlQ29ubmVjdG9ycyB9IGZyb20gJ3dhZ21pJztcbmltcG9ydCB7IHdhbGxldENvbmZpZ3MgfSBmcm9tICcuLi9jb25maWdzL3dhbGxldENvbmZpZ3MnO1xuaW1wb3J0IHsgV0FMTEVUX0lEUyB9IGZyb20gJy4uL3R5cGVzL3dhbGxldCc7XG5pbXBvcnQgeyBpc0NvaW5iYXNlQ29ubmVjdG9yLCBpc0Rlc2t0b3AsIGlzSW5qZWN0ZWRDb25uZWN0b3IsIGlzTW9iaWxlLCBpc1JvbmluRXh0ZW5zaW9uSW5zdGFsbGVkLCBpc1JvbmluSW5BcHBCcm93c2VyLCBpc1NhZmVDb25uZWN0b3IsIGlzV2F5cG9pbnRDb25uZWN0b3IsIGlzV0NDb25uZWN0b3IsIG5vdEVtcHR5LCB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHVzZUlzU2FmZVdhbGxldCB9IGZyb20gJy4vdXNlSXNTYWZlV2FsbGV0JztcbmNvbnN0IFdhbGxldEljb24gPSBzdHlsZWQuaW1nKHtcbiAgICB3aWR0aDogMzIsXG4gICAgaGVpZ2h0OiAzMixcbiAgICBib3JkZXJSYWRpdXM6IDgsXG4gICAgb2JqZWN0Rml0OiAnY29udGFpbicsXG59KTtcbmNvbnN0IGdldFdhbGxldEluc3RhbGxhdGlvblN0YXR1cyA9IChjb25uZWN0b3IsIGNvbm5lY3RvcnMpID0+IHtcbiAgICBjb25zdCB7IGlkLCB0eXBlIH0gPSBjb25uZWN0b3I7XG4gICAgaWYgKGlkID09PSBXQUxMRVRfSURTLlJPTklOX1dBTExFVClcbiAgICAgICAgcmV0dXJuIGlzUm9uaW5FeHRlbnNpb25JbnN0YWxsZWQoY29ubmVjdG9ycyk7XG4gICAgcmV0dXJuIChpc1NhZmVDb25uZWN0b3IoaWQpIHx8XG4gICAgICAgIGlzQ29pbmJhc2VDb25uZWN0b3IoaWQpIHx8XG4gICAgICAgIGlzV2F5cG9pbnRDb25uZWN0b3IoaWQpIHx8XG4gICAgICAgIGlzV0NDb25uZWN0b3IoaWQpIHx8XG4gICAgICAgIGlzSW5qZWN0ZWRDb25uZWN0b3IodHlwZSkpO1xufTtcbmNvbnN0IGNyZWF0ZUJhc2VXYWxsZXQgPSAoY29ubmVjdG9yLCBjb25uZWN0b3JzKSA9PiAoe1xuICAgIGlkOiBjb25uZWN0b3IuaWQsXG4gICAgbmFtZTogY29ubmVjdG9yLm5hbWUgPz8gY29ubmVjdG9yLmlkID8/IGNvbm5lY3Rvci50eXBlLFxuICAgIGljb246IGNvbm5lY3Rvci5pY29uID8gX2pzeChXYWxsZXRJY29uLCB7IHNyYzogY29ubmVjdG9yLmljb24sIGFsdDogY29ubmVjdG9yLm5hbWUgfSkgOiB1bmRlZmluZWQsXG4gICAgaXNJbnN0YWxsZWQ6IGdldFdhbGxldEluc3RhbGxhdGlvblN0YXR1cyhjb25uZWN0b3IsIGNvbm5lY3RvcnMpLFxuICAgIGNvbm5lY3Rvcixcbn0pO1xuY29uc3QgY3JlYXRlV2FsbGV0V2l0aENvbmZpZyA9IChiYXNlV2FsbGV0KSA9PiB7XG4gICAgY29uc3Qgd2FsbGV0Q29uZmlnID0gd2FsbGV0Q29uZmlnc1tiYXNlV2FsbGV0LmlkXTtcbiAgICByZXR1cm4gd2FsbGV0Q29uZmlnID8geyAuLi5iYXNlV2FsbGV0LCAuLi53YWxsZXRDb25maWcgfSA6IGJhc2VXYWxsZXQ7XG59O1xuZXhwb3J0IGZ1bmN0aW9uIHVzZVdhbGxldHMoKSB7XG4gICAgY29uc3QgY29ubmVjdG9ycyA9IHVzZUNvbm5lY3RvcnMoKTtcbiAgICBjb25zdCB7IGlzU2FmZSB9ID0gdXNlSXNTYWZlV2FsbGV0KCk7XG4gICAgY29uc3QgZGV2aWNlSW5mbyA9IHVzZU1lbW8oKCkgPT4gKHtcbiAgICAgICAgaXNNb2JpbGU6IGlzTW9iaWxlKCksXG4gICAgICAgIGlzRGVza3RvcDogaXNEZXNrdG9wKCksXG4gICAgICAgIGlzUm9uaW5JbkFwcEJyb3dzZXI6IGlzUm9uaW5JbkFwcEJyb3dzZXIoKSxcbiAgICB9KSwgW10pO1xuICAgIGNvbnN0IHdhbGxldHMgPSB1c2VNZW1vKCgpID0+IGNvbm5lY3RvcnMubWFwKGNvbm5lY3RvciA9PiBjcmVhdGVCYXNlV2FsbGV0KGNvbm5lY3RvciwgY29ubmVjdG9ycykpLm1hcChjcmVhdGVXYWxsZXRXaXRoQ29uZmlnKSwgW2Nvbm5lY3RvcnNdKTtcbiAgICBjb25zdCB3YWxsZXRzQnlUeXBlID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGNvbnN0IHdhbGxldE1hcCA9IG5ldyBNYXAod2FsbGV0cy5tYXAod2FsbGV0ID0+IFt3YWxsZXQuaWQsIHdhbGxldF0pKTtcbiAgICAgICAgY29uc3Qgc2FmZVdhbGxldCA9IGlzU2FmZSA/IHdhbGxldE1hcC5nZXQoV0FMTEVUX0lEUy5TQUZFKSA6IG51bGw7XG4gICAgICAgIGNvbnN0IHdheXBvaW50V2FsbGV0ID0gd2FsbGV0TWFwLmdldChXQUxMRVRfSURTLldBWVBPSU5UKTtcbiAgICAgICAgY29uc3QgY29pbmJhc2VXYWxsZXQgPSB3YWxsZXRNYXAuZ2V0KFdBTExFVF9JRFMuQ09JTkJBU0VfV0FMTEVUKTtcbiAgICAgICAgY29uc3Qgd2NXYWxsZXQgPSB3YWxsZXRNYXAuZ2V0KFdBTExFVF9JRFMuV0FMTEVUX0NPTk5FQ1QpO1xuICAgICAgICBjb25zdCByb25pbkV4dGVuc2lvbldhbGxldCA9IHdhbGxldE1hcC5nZXQoV0FMTEVUX0lEUy5ST05JTl9XQUxMRVQpID8/IHdhbGxldE1hcC5nZXQoV0FMTEVUX0lEUy5ST05JTl9XQUxMRVRfSU5KRUNURUQpO1xuICAgICAgICBjb25zdCBpbmplY3RlZFdhbGxldHMgPSB3YWxsZXRzLmZpbHRlcih3YWxsZXQgPT4gaXNJbmplY3RlZENvbm5lY3Rvcih3YWxsZXQuY29ubmVjdG9yPy50eXBlKSAmJlxuICAgICAgICAgICAgd2FsbGV0LmlkICE9PSBXQUxMRVRfSURTLlJPTklOX1dBTExFVCAmJlxuICAgICAgICAgICAgd2FsbGV0LmlkICE9PSBXQUxMRVRfSURTLlJPTklOX1dBTExFVF9JTkpFQ1RFRCk7XG4gICAgICAgIGNvbnN0IHJvbmluTW9iaWxlV2FsbGV0ID0gd2NXYWxsZXQgJiYge1xuICAgICAgICAgICAgLi4ud2NXYWxsZXQsXG4gICAgICAgICAgICAuLi53YWxsZXRDb25maWdzLkNVU1RPTV9ST05JTl9NT0JJTEVfV0FMTEVULFxuICAgICAgICAgICAgaXNJbnN0YWxsZWQ6IHRydWUsXG4gICAgICAgIH07XG4gICAgICAgIGNvbnN0IHJvbmluSW5BcHBCcm93c2VyV2FsbGV0ID0gcm9uaW5FeHRlbnNpb25XYWxsZXQgJiYge1xuICAgICAgICAgICAgLi4ucm9uaW5FeHRlbnNpb25XYWxsZXQsXG4gICAgICAgICAgICAuLi53YWxsZXRDb25maWdzLkNVU1RPTV9ST05JTl9JTl9BUFBfV0FMTEVULFxuICAgICAgICAgICAgaXNJbnN0YWxsZWQ6IHRydWUsXG4gICAgICAgIH07XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICB3YXlwb2ludFdhbGxldCxcbiAgICAgICAgICAgIHJvbmluRXh0ZW5zaW9uV2FsbGV0LFxuICAgICAgICAgICAgcm9uaW5Nb2JpbGVXYWxsZXQsXG4gICAgICAgICAgICByb25pbkluQXBwQnJvd3NlcldhbGxldCxcbiAgICAgICAgICAgIGluamVjdGVkV2FsbGV0cyxcbiAgICAgICAgICAgIHdjV2FsbGV0LFxuICAgICAgICAgICAgc2FmZVdhbGxldCxcbiAgICAgICAgICAgIGNvaW5iYXNlV2FsbGV0LFxuICAgICAgICB9O1xuICAgIH0sIFt3YWxsZXRzLCBpc1NhZmVdKTtcbiAgICBjb25zdCBwcmltYXJ5V2FsbGV0cyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgICAgICBjb25zdCB7IHdheXBvaW50V2FsbGV0LCByb25pbkV4dGVuc2lvbldhbGxldCwgcm9uaW5Nb2JpbGVXYWxsZXQsIHJvbmluSW5BcHBCcm93c2VyV2FsbGV0IH0gPSB3YWxsZXRzQnlUeXBlO1xuICAgICAgICBpZiAoZGV2aWNlSW5mby5pc0Rlc2t0b3ApXG4gICAgICAgICAgICByZXR1cm4gW3dheXBvaW50V2FsbGV0LCByb25pbkV4dGVuc2lvbldhbGxldF0uZmlsdGVyKG5vdEVtcHR5KTtcbiAgICAgICAgaWYgKGRldmljZUluZm8uaXNNb2JpbGUgJiYgIWRldmljZUluZm8uaXNSb25pbkluQXBwQnJvd3NlcilcbiAgICAgICAgICAgIHJldHVybiBbd2F5cG9pbnRXYWxsZXQsIHJvbmluTW9iaWxlV2FsbGV0XS5maWx0ZXIobm90RW1wdHkpO1xuICAgICAgICBpZiAoZGV2aWNlSW5mby5pc1JvbmluSW5BcHBCcm93c2VyKVxuICAgICAgICAgICAgcmV0dXJuIFtyb25pbkluQXBwQnJvd3NlcldhbGxldF0uZmlsdGVyKG5vdEVtcHR5KTtcbiAgICAgICAgcmV0dXJuIFtdO1xuICAgIH0sIFt3YWxsZXRzQnlUeXBlLCBkZXZpY2VJbmZvXSk7XG4gICAgY29uc3Qgc2Vjb25kYXJ5V2FsbGV0cyA9IHVzZU1lbW8oKCkgPT4ge1xuICAgICAgICBjb25zdCB7IGluamVjdGVkV2FsbGV0cywgd2NXYWxsZXQsIHNhZmVXYWxsZXQsIGNvaW5iYXNlV2FsbGV0IH0gPSB3YWxsZXRzQnlUeXBlO1xuICAgICAgICBpZiAoIWRldmljZUluZm8uaXNEZXNrdG9wKVxuICAgICAgICAgICAgcmV0dXJuIFtjb2luYmFzZVdhbGxldCwgc2FmZVdhbGxldF0uZmlsdGVyKG5vdEVtcHR5KTtcbiAgICAgICAgY29uc3QgZmlsdGVyZWRXYWxsZXRzID0gW3djV2FsbGV0LCBzYWZlV2FsbGV0LCBjb2luYmFzZVdhbGxldCwgLi4uaW5qZWN0ZWRXYWxsZXRzXS5maWx0ZXIobm90RW1wdHkpO1xuICAgICAgICAvLyBNb3ZlIFdhbGxldENvbm5lY3QgdG8gdG9wXG4gICAgICAgIGNvbnN0IHdjV2FsbGV0cyA9IGZpbHRlcmVkV2FsbGV0cy5maWx0ZXIod2FsbGV0ID0+IGlzV0NDb25uZWN0b3Iod2FsbGV0LmlkKSk7XG4gICAgICAgIGNvbnN0IG90aGVyV2FsbGV0cyA9IGZpbHRlcmVkV2FsbGV0cy5maWx0ZXIod2FsbGV0ID0+ICFpc1dDQ29ubmVjdG9yKHdhbGxldC5pZCkpO1xuICAgICAgICByZXR1cm4gWy4uLndjV2FsbGV0cywgLi4ub3RoZXJXYWxsZXRzXTtcbiAgICB9LCBbd2FsbGV0c0J5VHlwZSwgZGV2aWNlSW5mb10pO1xuICAgIHJldHVybiB1c2VNZW1vKCgpID0+ICh7XG4gICAgICAgIHdhbGxldHM6IFsuLi5wcmltYXJ5V2FsbGV0cywgLi4uc2Vjb25kYXJ5V2FsbGV0c10sXG4gICAgICAgIHByaW1hcnlXYWxsZXRzLFxuICAgICAgICBzZWNvbmRhcnlXYWxsZXRzLFxuICAgIH0pLCBbcHJpbWFyeVdhbGxldHMsIHNlY29uZGFyeVdhbGxldHNdKTtcbn1cbiJdfQ== */",
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
});
const getWalletInstallationStatus = (connector, connectors) => {
const {
id,
type
} = connector;
if (id === WALLET_IDS.RONIN_WALLET) return isRoninExtensionInstalled(connectors);
return isSafeConnector(id) || isCoinbaseConnector(id) || isWaypointConnector(id) || isWCConnector(id) || isInjectedConnector(type);
};
const createBaseWallet = (connector, connectors) => ({
id: connector.id,
name: connector.name ?? connector.id ?? connector.type,
icon: connector.icon ? jsx(WalletIcon, {
src: connector.icon,
alt: connector.name
}) : undefined,
isInstalled: getWalletInstallationStatus(connector, connectors),
connector
});
const createWalletWithConfig = baseWallet => {
const walletConfig = walletConfigs[baseWallet.id];
return walletConfig ? {
...baseWallet,
...walletConfig
} : baseWallet;
};
function useWallets() {
const connectors = useConnectors();
const {
isSafe
} = useIsSafeWallet();
const deviceInfo = useMemo(() => ({
isMobile: isMobile(),
isDesktop: isDesktop(),
isRoninInAppBrowser: isRoninInAppBrowser()
}), []);
const wallets = useMemo(() => connectors.map(connector => createBaseWallet(connector, connectors)).map(createWalletWithConfig), [connectors]);
const walletsByType = useMemo(() => {
const walletMap = new Map(wallets.map(wallet => [wallet.id, wallet]));
const safeWallet = isSafe ? walletMap.get(WALLET_IDS.SAFE) : null;
const waypointWallet = walletMap.get(WALLET_IDS.WAYPOINT);
const coinbaseWallet = walletMap.get(WALLET_IDS.COINBASE_WALLET);
const wcWallet = walletMap.get(WALLET_IDS.WALLET_CONNECT);
const roninExtensionWallet = walletMap.get(WALLET_IDS.RONIN_WALLET) ?? walletMap.get(WALLET_IDS.RONIN_WALLET_INJECTED);
const injectedWallets = wallets.filter(wallet => isInjectedConnector(wallet.connector?.type) && wallet.id !== WALLET_IDS.RONIN_WALLET && wallet.id !== WALLET_IDS.RONIN_WALLET_INJECTED);
const roninMobileWallet = wcWallet && {
...wcWallet,
...walletConfigs.CUSTOM_RONIN_MOBILE_WALLET,
isInstalled: true
};
const roninInAppBrowserWallet = roninExtensionWallet && {
...roninExtensionWallet,
...walletConfigs.CUSTOM_RONIN_IN_APP_WALLET,
isInstalled: true
};
return {
waypointWallet,
roninExtensionWallet,
roninMobileWallet,
roninInAppBrowserWallet,
injectedWallets,
wcWallet,
safeWallet,
coinbaseWallet
};
}, [wallets, isSafe]);
const primaryWallets = useMemo(() => {
const {
waypointWallet,
roninExtensionWallet,
roninMobileWallet,
roninInAppBrowserWallet
} = walletsByType;
if (deviceInfo.isDesktop) return [waypointWallet, roninExtensionWallet].filter(notEmpty);
if (deviceInfo.isMobile && !deviceInfo.isRoninInAppBrowser) return [waypointWallet, roninMobileWallet].filter(notEmpty);
if (deviceInfo.isRoninInAppBrowser) return [roninInAppBrowserWallet].filter(notEmpty);
return [];
}, [walletsByType, deviceInfo]);
const secondaryWallets = useMemo(() => {
const {
injectedWallets,
wcWallet,
safeWallet,
coinbaseWallet
} = walletsByType;
if (!deviceInfo.isDesktop) return [coinbaseWallet, safeWallet].filter(notEmpty);
const filteredWallets = [wcWallet, safeWallet, coinbaseWallet, ...injectedWallets].filter(notEmpty);
// Move WalletConnect to top
const wcWallets = filteredWallets.filter(wallet => isWCConnector(wallet.id));
const otherWallets = filteredWallets.filter(wallet => !isWCConnector(wallet.id));
return [...wcWallets, ...otherWallets];
}, [walletsByType, deviceInfo]);
return useMemo(() => ({
wallets: [...primaryWallets, ...secondaryWallets],
primaryWallets,
secondaryWallets
}), [primaryWallets, secondaryWallets]);
}export{useWallets};