@sky-mavis/tanto-widget
Version:
Tanto Widget
38 lines • 1.43 kB
JavaScript
import {jsx}from'@emotion/react/jsx-runtime';import {useEffect}from'react';import {analytic}from'../../analytic.mjs';import {DELAY_CONNECT}from'../../constants/index.mjs';import {useConnect}from'../../hooks/useConnect.mjs';import {useWidgetConnect}from'../../hooks/useWidgetConnect.mjs';import {ConnectState}from'../../types/connect.mjs';import {ConnectLayout}from'./components/ConnectLayout.mjs';function ConnectInjector() {
const {
selectedWallet,
selectedConnector
} = useWidgetConnect();
const {
status,
connect,
error
} = useConnect({
connector: selectedConnector
});
useEffect(() => {
const timer = setTimeout(() => {
connect();
analytic.sendEvent('wallet_connect_attempt', {
chain_id: selectedConnector?.chainId,
wallet_type: selectedWallet?.name
});
}, DELAY_CONNECT);
return () => clearTimeout(timer);
}, [connect, selectedConnector, selectedWallet]);
useEffect(() => {
if (status === ConnectState.ERROR && error) {
analytic.sendEvent('wallet_connect_fail', {
chain_id: selectedConnector?.chainId,
wallet_type: selectedWallet?.name,
error_reason: error.message
});
}
}, [status, error, selectedConnector, selectedWallet]);
if (!selectedWallet) return null;
return jsx(ConnectLayout, {
wallet: selectedWallet,
status: status,
onRetry: connect
});
}export{ConnectInjector};