@sky-mavis/tanto-widget
Version:
Tanto Widget
48 lines • 1.75 kB
JavaScript
import {jsxs,jsx}from'@emotion/react/jsx-runtime';import {useEffect}from'react';import {analytic}from'../../analytic.mjs';import {Box}from'../../components/box/Box.mjs';import {DashedDivider}from'../../components/dashed-divider/DashedDivider.mjs';import {Disclaimer}from'../../components/disclaimer/Disclaimer.mjs';import {GetWalletCTA}from'../../components/get-wallet-cta/GetWalletCTA.mjs';import {useWidgetConnect}from'../../hooks/useWidgetConnect.mjs';import {isMobile,isRoninInAppBrowser}from'../../utils/index.mjs';import {WalletGroup}from'./components/WalletGroup.mjs';const mapWalletData = item => {
const {
connector,
name,
homepage,
id,
isInstalled
} = item;
return {
id,
name,
homepage,
isInstalled,
connector: {
id: connector?.id,
type: connector?.type,
name: connector?.name,
chainId: connector?.chainId
}
};
};
function WalletList() {
const {
primaryWallets,
secondaryWallets
} = useWidgetConnect();
useEffect(() => {
analytic.sendEvent('walletlist_view', {
wallet_selected: primaryWallets.map(mapWalletData),
wallets_available: [...primaryWallets, ...secondaryWallets].map(mapWalletData)
});
}, [primaryWallets, secondaryWallets]);
return jsxs(Box, {
vertical: true,
gap: 20,
children: [jsx(WalletGroup, {
wallets: primaryWallets
}), secondaryWallets.length > 0 && jsxs(Box, {
vertical: true,
gap: 12,
children: [primaryWallets.length > 0 && jsx(DashedDivider, {
text: "Other wallets"
}), jsx(WalletGroup, {
wallets: secondaryWallets
})]
}), isMobile() && !isRoninInAppBrowser() && jsx(GetWalletCTA, {}), jsx(Disclaimer, {})]
});
}export{WalletList};