Getting error - Login modal is not initialized

[inventionsbyhamid]

 const [provider, setProvider] = useState<IProvider | null>(null);
  const [loggedIn, setLoggedIn] = useState(false);
  const [modalInitialized, setModalInitialized] = useState(false);

  const clientId = "removed";
  const chainConfig = {
    chainId: "0x2105", // Please use 0x1 for Mainnet
    rpcTarget: "https://mainnet.base.org",
    chainNamespace: CHAIN_NAMESPACES.EIP155,
    displayName: "Base",
    blockExplorerUrl: "https://basescan.org/",
    ticker: "ETH",
    tickerName: "ETH",
    logo: "https://github.com/base-org/brand-kit/blob/main/logo/symbol/Base_Symbol_Blue.svg",
  };

  const privateKeyProvider = new EthereumPrivateKeyProvider({
    config: { chainConfig },
  });

  const web3auth = new Web3Auth({
    clientId,
    web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,
    privateKeyProvider,
  });

  useEffect(() => {
    const init = async () => {
      try {
        console.log("web3auth init", web3auth);
        await web3auth.initModal();
        setModalInitialized(true);
        console.log("web3auth init finished", web3auth);
        setProvider(web3auth.provider);

        if (web3auth.connected) {
          setLoggedIn(true);
        }
      } catch (error) {
        console.error(error);
      }
    };

    init();
  }, []);

  const login = async () => {
    if (!modalInitialized) {
      console.error("modal not initialized yet");
      return;
    }
    const web3authProvider = await web3auth.connect();
    setProvider(web3authProvider);
    if (web3auth.connected) {
      setLoggedIn(true);
    }
  };

web3auth init finished is logged successfully but when i call login() after that, it shows error that Login modal is not initialized. What am I doing wrong?

[TomTom]

hi @inventionsbyhamid

Thanks for the patience! !

Did you see our PnP examples ? Please check our examples with hooks.
PnP Modal: web3auth-pnp-examples/web-modal-sdk/blockchain-connection-examples/evm-modal-example/src/App.tsx at main · Web3Auth/web3auth-pnp-examples · GitHub

This is our old example like yours (without hooks) → web3auth-pnp-examples/web-modal-sdk/blockchain-connection-examples/evm-modal-example/src/App.tsx at 851b4bc8d0c595e2ad32fb20a476d16043ae3ae5 · Web3Auth/web3auth-pnp-examples · GitHub

please contact me if you have any other question