@coin-voyage/paykit
Version:
Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.
72 lines (71 loc) • 3 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { useInstalledWallets } from "@coin-voyage/crypto/hooks";
import usePayContext from "../components/contexts/pay";
import { walletConfigs } from "../lib/config/wallet";
import { isInjectedConnector } from "../utils";
export const useWallets = () => {
const { paymentState } = usePayContext();
const installedWallets = useInstalledWallets(paymentState.connectorChainType);
const wallets = installedWallets.map((wallet) => {
// use overrides
const walletId = Object.keys(walletConfigs).find(
// where id is comma seperated list
(id) => id
.split(",")
.map((i) => i.trim())
.indexOf(wallet.id) !== -1);
const c = {
id: wallet.id,
name: wallet.name ?? wallet.id,
icon: _jsx("img", { src: wallet.icon, alt: wallet.name, width: "100%", height: "100%" }),
connectors: wallet.connectors,
iconShape: "squircle",
isInstalled: true,
};
if (walletId) {
const walletConfig = walletConfigs[walletId];
return {
...c,
iconConnector: wallet.icon ? (_jsx("img", { src: wallet.icon.toString(), alt: wallet.name, width: "100%", height: "100%" })) : undefined,
...walletConfig,
};
}
return c;
});
// if (isMobile) {
// wallets.push({
// id: WALLET_ID_OTHER_WALLET,
// name: otherWalletsString,
// shortName: otherString,
// iconConnector: <Logos.OtherWallets />,
// iconShape: "square",
// showInMobileConnectors: false,
// })
// }
return (wallets
// remove duplicate ids
.filter((wallet, index, self) => self.findIndex((w) => w.id === wallet.id) === index)
// remove wallet with id coinbaseWalletSDK if wallet with id 'com.coinbase.wallet' exists
.filter((wallet, _, self) => !(wallet.id === "coinbaseWalletSDK" && self.find((w) => w.id === "com.coinbase.wallet")))
// remove wallet with id io.metamask if wallet with id 'metaMask' exists
.filter((wallet, _, self) => !((wallet.id === "metaMaskSDK" || wallet.id === "metaMask") &&
self.find((w) => w.id === "io.metamask" || w.id === "io.metamask.mobile")))
// order by isInstalled injected connectors first
.sort((a, b) => {
const AisInstalled = a.isInstalled && isInjectedConnector(a.connectors[0].connector.id);
const BisInstalled = b.isInstalled && isInjectedConnector(b.connectors[0].connector.id);
if (AisInstalled && !BisInstalled)
return -1;
if (!AisInstalled && BisInstalled)
return 1;
return 0;
})
// move walletConnect to the end
.sort((a, b) => {
if (a.id === "walletConnect")
return 1;
if (b.id === "walletConnect")
return -1;
return 0;
}));
};