@broxus/tvm-connect
Version:
Nekoton-compatible wallets connector.
65 lines (64 loc) • 3.15 kB
JavaScript
'use client';
import { debug } from '@broxus/js-utils';
import { useContext } from '@broxus/react-uikit';
import { observer } from 'mobx-react-lite';
import * as React from 'react';
import { useTvmWalletService } from '../context/TvmWalletServiceContext';
import { getRecentConnectionMeta, storeRecentConnectionMeta } from '../hooks';
import { convertNetworkToChainParams } from '../utils';
export const TvmWalletProvidersContext = React.createContext(null);
export function useTvmWalletProviders() {
return useContext(TvmWalletProvidersContext);
}
export const TvmWalletProvidersProvider = observer(({ agreementsNote, children, network, recentMetaStorageKey, onConnect, }) => {
const walletService = useTvmWalletService();
const [error, setError] = React.useState(null);
const [connectingProvider, setConnectingProvider] = React.useState(null);
const connect = React.useCallback(async (providerConfig) => {
try {
setError(null);
setConnectingProvider(providerConfig);
const existedChainId = walletService.chainId;
const prevConnector = walletService.connector;
const recentMeta = getRecentConnectionMeta(recentMetaStorageKey);
// eslint-disable-next-line no-nested-ternary
const networkParams = network ?? (recentMeta?.chainId
? walletService.networks.find(_network => _network.chainId === recentMeta?.chainId)
?? existedChainId
: existedChainId);
debug(`Try to activate ${providerConfig.info.name} connection with chain`, typeof networkParams === 'number' ? networkParams : networkParams?.chainId);
await providerConfig.connector?.connect(typeof networkParams === 'number'
? networkParams
: networkParams && convertNetworkToChainParams(networkParams), { onConnect });
if (walletService.providerId && providerConfig.id !== walletService.providerId) {
await prevConnector?.disconnect({ force: true });
}
storeRecentConnectionMeta({
chainId: providerConfig.connector.chainId?.toString(),
disconnected: false,
providerId: providerConfig.id,
type: providerConfig.connector.type,
}, recentMetaStorageKey);
walletService.setState('providerId', providerConfig.id);
}
catch (e) {
setError(e);
}
}, [network, onConnect, recentMetaStorageKey, walletService]);
const reset = React.useCallback(() => {
setError(null);
setConnectingProvider(null);
}, []);
const context = React.useMemo(() => ({
agreementsNote,
connect,
connectingProvider,
error,
recentMetaStorageKey,
reset,
}), [agreementsNote, connect, connectingProvider, error, recentMetaStorageKey, reset]);
return React.createElement(TvmWalletProvidersContext.Provider, { value: context }, children);
});
if (process.env.NODE_ENV !== 'production') {
TvmWalletProvidersContext.displayName = 'TvmWalletProvidersContext';
}