Phantom Adapter won't work with latest Modal SDK

    "@web3auth/auth-adapter": "^9.4.0",
    "@web3auth/base": "^9.4.0",
    "@web3auth/modal": "^9.4.1",
    "@web3auth/solana-provider": "^9.4.0",

My Code errors out on web3auth.configureAdapter(phantomAdapter):
Argument of type ‘PhantomAdapter’ is not assignable to parameter of type ‘IAdapter’.
Types of property ‘provider’ are incompatible.

Please help! I want to add Phantom (Solana) to my modal.

1 Like

Hi Zhe Wang! Thanks for reaching out to us about the issue you’re facing with the Phantom Adapter and the latest Modal SDK. Let’s gather some details to help you better.

Issue Summary:

  • SDK Details:
    • @web3auth/auth-adapter: ^9.4.0
    • @web3auth/base: ^9.4.0
    • @web3auth/modal: ^9.4.1
    • @web3auth/solana-provider: ^9.4.0
  • Platform: (Assuming it’s JavaScript/TypeScript based on the code snippet)
  • Error Encountered:
    • Errors out on web3auth.configureAdapter(phantomAdapter)
    • Type error indicating Argument of type 'PhantomAdapter' is not assignable to parameter of type 'IAdapter<unknown>'.

Next Steps:

  1. Web3Auth Initialization & Login Code Snippet: If possible, please share the relevant code snippet for initializing Web3Auth and your login attempt. This could help identify misconfigurations.

  2. Screenshot: Thank you for providing the screenshot! It may contain helpful information, and it appears to show the error context, which is great.

  3. Custom Adapter Details: If you are trying to use a custom authentication method with Phantom:

    • Please confirm the Verifier Name you are using.
    • Provide the method of login if it’s a specific case.

Proposed Solution:

The error message seems related to type compatibility issues. It could be worth checking:

  • If you’ve imported the correct types for PhantomAdapter.
  • If there’s any mismatch in the types of the provider expected.

Please share any additional details if available, and we’ll work together to find a resolution!

Note: This response was generated by an AI bot and may require further verification. The Web3Auth support team has tracked this issue and will be responding as soon as possible.

Please respond with a human. Thanks!

Hey @zhew1991 the Phantom Adapter is deprecated with v9, please checkout the migration guide. PnP Modal SDK - v8 to v9 | Documentation | Web3Auth

Also, you can simply use the Default Solana Adapters to show all the Solana supported wallets in user’s browser context. https://web3auth.io/docs/sdk/pnp/web/adapters/default-solana-adapter#usage

before you replied, we have already updated the code to what you suggested.

now the problem is the same as what I had before: I can see the “your wallet is connected” success message in the modal, but the web3auth.connected is still false, so further backend login related logic can’t be triggered on our end.

    const web3AuthOptions: Web3AuthOptions = {
  clientId,
  web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
  uiConfig: {
    uxMode: "redirect",
    appName: "...",
    appUrl: "....",
    theme: {
      primary: "gray",
    },
    logoLight: "...",
    logoDark: "...",
    defaultLanguage: "en", // en, de, ja, ko, zh, es, fr, pt, nl, tr
    mode: "dark", // whether to enable dark mode. defaultValue: auto
    useLogoLoader: true,
  },
  privateKeyProvider: privateKeyProvider,
  sessionTime: 86400 * 7, // 7 days
  // useCoreKitKey: true,
};
      const web3auth = new Web3Auth(web3AuthOptions as Web3AuthOptions);

      const authAdapter = new AuthAdapter({
        loginSettings: {
          mfaLevel: "none",
          curve: "ed25519", // allowed values "secp256k1" (default, EVM) or "ed25519" (Solana)
        },
        adapterSettings: {
          uxMode: "redirect", // "redirect" | "popup"
          whiteLabel: {
            logoLight: "...o",
            logoDark: "...",
            defaultLanguage: "en", // en, de, ja, ko, zh, es, fr, pt, nl, tr
            mode: "light", // whether to enable dark, light or auto mode. defaultValue: auto [ system theme]
          }
        },
        privateKeyProvider: privateKeyProvider
      });
      web3auth.configureAdapter(authAdapter)
      
      const adapters = await getInjectedAdapters({ options: web3AuthOptions })
      const phantomAdapter = adapters.find((e) => e.name == "phantom")
      if (phantomAdapter) {
        web3auth.configureAdapter(phantomAdapter)
      }

      setWeb3auth(web3auth);

      await web3auth.initModal();
      if (web3auth.connected) {
         **// CODE HERE WON'T GET CALLED!!!!!!!!!!!!!!!!!!!!!!!!!!!!**
        ....

You can always listen to adapter events.

web3auth.addListener(ADAPTER_EVENTS.CONNECTED, () => {
    // trigger your logic
  })