@web3auth/modal/dist/lib.esm/packages/modal/src/react/hooks/useWeb3AuthConnect.js

Multi chain wallet aggregator for web3Auth

import { useState, useEffect, useCallback } from 'react';
import { useWeb3AuthInner } from './useWeb3AuthInner.js';

const useWeb3AuthConnect = () => {
  const {
    web3Auth,
    isConnected
  } = useWeb3AuthInner();
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState(null);
  const [connectorName, setConnectorName] = useState(null);
  useEffect(() => {
    if (!web3Auth) return;
    if (!isConnected && connectorName) {
      setConnectorName(null);
    }
    if (isConnected && !connectorName) {
      setConnectorName(web3Auth.connectedConnectorName);
    }
  }, [isConnected, connectorName, web3Auth]);
  const connect = useCallback(async () => {
    setLoading(true);
    setError(null);
    try {
      const provider = await web3Auth.connect();
      if (provider) {
        setConnectorName(web3Auth.connectedConnectorName);
      }
      return provider;
    } catch (error) {
      setError(error);
    } finally {
      setLoading(false);
    }
  }, [web3Auth]);
  const connectTo = useCallback(async (connector, params) => {
    setLoading(true);
    setError(null);
    try {
      const provider = await web3Auth.connectTo(connector, params);
      if (provider) {
        setConnectorName(web3Auth.connectedConnectorName);
      }
      return provider;
    } catch (error) {
      setError(error);
    } finally {
      setLoading(false);
    }
  }, [web3Auth]);
  return {
    isConnected,
    loading,
    error,
    connectorName,
    connect,
    connectTo
  };
};

export { useWeb3AuthConnect };