UNPKG

@coin-voyage/paykit

Version:

Seamless crypto payments. Onboard users from any chain, any coin into your app with one click.

25 lines (24 loc) 1.68 kB
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime"; import { ChainType } from "@coin-voyage/shared/types"; import { useAccount, useConnect, useDisconnect } from "wagmi"; import { DisconnectIcon } from "../../../assets/icons"; import { useChainIsSupported } from "../../../hooks/useChainIsSupported"; import useLocales from "../../../hooks/useLocales"; import { isSafeConnector } from "../../../utils"; import Button from "../../ui/Button"; import ChainSelectList from "../../ui/ChainSelectList"; import { OrDivider } from "../../ui/Divider/OrDivider"; import { ModalBody, ModalContent, PageContent } from "../../ui/Modal/styles"; const SwitchNetworks = () => { const { reset } = useConnect(); const { disconnect } = useDisconnect(); const { connector, chain } = useAccount(); const isChainSupported = useChainIsSupported(ChainType.EVM, chain?.id); const locales = useLocales(); const onDisconnect = () => { disconnect(); reset(); }; return (_jsx(PageContent, { style: { width: 278 }, children: _jsxs(ModalContent, { style: { padding: 0, marginTop: -10 }, children: [!isChainSupported && (_jsxs(ModalBody, { children: [locales.warnings_chainUnsupported, " ", locales.warnings_chainUnsupportedResolve] })), _jsx("div", { style: { padding: "6px 8px" }, children: _jsx(ChainSelectList, { variant: "secondary" }) }), !isChainSupported && !isSafeConnector(connector?.id) && (_jsxs("div", { style: { paddingTop: 12 }, children: [_jsx(OrDivider, {}), _jsx(Button, { icon: _jsx(DisconnectIcon, {}), variant: "secondary", onClick: onDisconnect, children: locales.disconnect })] }))] }) })); }; export default SwitchNetworks;