@broxus/tvm-connect
Version:
TypeScript SDK for connecting to Nekoton-compatible wallets using a unified interface.
33 lines (32 loc) • 1.7 kB
JavaScript
import { getUserAgent } from '@broxus/js-utils';
import { Button, useConfig } from '@broxus/react-uikit';
import { observer } from 'mobx-react-lite';
import * as React from 'react';
import { useTvmConnectDialog, useTvmConnectService } from '../context';
import { isNekotonWebview, toChainParams } from '../utils';
export const TvmConnectButton = observer(({ disabled, network, popupType, standalone = isNekotonWebview(getUserAgent()), trigger, onConnect, onOpen, ...props }) => {
const config = useConfig();
const service = useTvmConnectService();
const dialog = useTvmConnectDialog();
const open = React.useCallback(() => {
dialog.connect({ network, popupType, onConnect });
onOpen?.();
}, [dialog, network, popupType, onConnect, onOpen]);
const connect = React.useCallback(async () => {
dialog.close();
const networkParams = network?.chainId ? toChainParams(network) : undefined;
await service.connect(networkParams).catch(() => {
if ((service.providers?.length ?? 0) > 1) {
open();
}
});
if (service.connector) {
onConnect?.(service.connector);
}
}, [dialog, network, onConnect, open, service]);
const mergedDisabled = disabled ?? (!!service.provider && (service.isInitializing || service.isConnecting));
if (typeof trigger === 'function') {
return trigger({ connect: standalone ? connect : open, disabled: mergedDisabled });
}
return (React.createElement(Button, { "aria-disabled": mergedDisabled, disabled: mergedDisabled, shape: config.button?.shape, type: "primary", ...props, onClick: standalone ? connect : open }));
});