- SDK Version(package.json):
“@web3auth/base”: “^9.7.0”,
“@web3auth/modal”: “^10.0.5”,
“@web3auth/no-modal”: “^9.0.0”, - Platform: ReactJS in web browser
The ReactJS project was previously using the @web3auth/no-modal library to implement login to the Solana network using Google and Email passwordless.
Now, I need to add the Apple login feature, which requires switching to @web3auth/modal.
However, I couldn’t find any official documentation or examples for migrating from @web3auth/no-modal to @web3auth/modal.
I’ve tried implementing it manually, but encountered the errors listed below.
Hope to get help with a tutorial or example. Thank you.
- Code using my @web3auth/no-modal:
const web3AuthConfig = walletType => ({
privateKeyProvider: getPrivateKeyProvider(walletType),
enableLogging: true,
clientId: clientId,
uiConfig: {
defaultLanguage: currentLang,
logoLight: logoLight,
logoDark: logoDark,
},
});
const createAuthAdapterConfig = walletType => ({
adapterSettings: {
uxMode: UX_MODE.REDIRECT,
loginConfig: {
google: {
verifier,
verifierSubIdentifier: googleVerifier,
typeOfLogin: 'google',
clientId: googleClientId,
},
email_passwordless: {
verifier,
verifierSubIdentifier: emailVerifier,
typeOfLogin: 'email_passwordless',
clientId,
},
},
},
privateKeyProvider: getPrivateKeyProvider(walletType),
});
const web3AuthInstance = new Web3AuthNoModal(web3AuthConfig(walletType));
const authAdapter = new AuthAdapter(createAuthAdapterConfig(walletType));
web3AuthInstance.configureAdapter(authAdapter);
await web3AuthInstance.init();
await web3Login.connectTo(WALLET_ADAPTERS.AUTH, {
loginProvider: 'google',
});
- New code has been moved to @web3auth/modal:
import { WEB3AUTH_NETWORK } from '@web3auth/modal';
import { chainConfigSolana, keyEnvConfig } from './config';
const { clientId } = keyEnvConfig;
const web3AuthContextConfig = {
web3AuthOptions: {
clientId: clientId,
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
chains: [chainConfigSolana],
hideWalletDiscovery: true,
},
};
export default web3AuthContextConfig;
Web3AuthProvider config={web3AuthContextConfig}>
<QueryClientProvider client={queryClient}>
<WagmiProvider> {children}</WagmiProvider>
</QueryClientProvider>
</Web3AuthProvider>
await connectTo(WALLET_CONNECTORS.AUTH, {
authConnection: AUTH_CONNECTION.GOOGLE,
authConnectionId: 'w3a-google-bth',
});
- Browser Console Screenshots:
- Error occurred when calling connectTo function from useWeb3AuthConnect()
