@daimo/pay
Version:
Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.
58 lines (55 loc) • 3.04 kB
JavaScript
import { jsx, jsxs } from 'react/jsx-runtime';
import { ROUTES } from '../../../constants/routes.js';
import { usePayContext } from '../../../hooks/usePayContext.js';
import { walletConfigs } from '../../../wallets/walletConfigs.js';
import { PageContent, ModalContent } from '../../Common/Modal/styles.js';
import { ScrollArea } from '../../Common/ScrollArea/index.js';
import { Container, WalletList, WalletItem, WalletIcon, WalletLabel } from './styles.js';
const MobileConnectors = () => {
const context = usePayContext();
const { paymentState, setRoute } = context;
// filter out installed wallets
const walletsIdsToDisplay = Object.keys(walletConfigs).filter((walletId) => {
const wallet = walletConfigs[walletId];
if (!wallet.showInMobileConnectors)
return false;
// If the mobile wallet supports solana only, don't show it if we are not supporting solana has a payment method
if (wallet.isSolanaOnly && !context.paymentState.showSolanaPaymentMethod)
return false;
return true;
}) ?? [];
const goToWallet = (wallet) => {
if (wallet.getDaimoPayDeeplink == null) {
console.error(`wallet ${wallet.name} has no deeplink`);
return;
}
if (paymentState.isDepositFlow) {
context.paymentState.setSelectedWallet(wallet);
setRoute(ROUTES.SELECT_WALLET_AMOUNT);
}
else {
paymentState.openInWalletBrowser(wallet);
}
};
return (jsx(PageContent, { style: { width: 312 }, children: jsx(Container, { children: jsx(ModalContent, { style: { paddingBottom: 0 }, children: jsx(ScrollArea, { height: 340, children: jsx(WalletList, { children: walletsIdsToDisplay
.sort(
// sort by name
(a, b) => {
const walletA = walletConfigs[a];
const walletB = walletConfigs[b];
const nameA = walletA.name ?? walletA.shortName ?? a;
const nameB = walletB.name ?? walletB.shortName ?? b;
return nameA.localeCompare(nameB);
})
.filter((walletId) => !(walletId === "coinbaseWallet" ||
walletId === "com.coinbase.wallet"))
.map((walletId, i) => {
const wallet = walletConfigs[walletId];
const { name, shortName, iconConnector, icon } = wallet;
return (jsxs(WalletItem, { onClick: () => goToWallet(wallet), style: {
animationDelay: `${i * 50}ms`,
}, children: [jsx(WalletIcon, { children: iconConnector ?? icon }), jsx(WalletLabel, { children: shortName ?? name })] }, i));
}) }) }) }) }) }));
};
export { MobileConnectors as default };
//# sourceMappingURL=index.js.map