Please provide the following details too when asking for help in this category:
- SDK Version: 6.1.3
- Platform: WebApp (React.js)
- Browser Console Screenshots:
Please provide the Web3Auth initialization and login code snippet below:
const init = async () => {
try {
const web3auth = new Web3Auth({
clientId,
chainConfig: {
chainNamespace: CHAIN_NAMESPACES.EIP155,
chainId: process.env.REACT_APP_CHAIN_ID, // hex of 80001, polygon testnet
rpcTarget: process.env.REACT_APP_RPC_URL,
blockExplorer: process.env.REACT_APP_EXPLORER_URL
},
uiConfig: {
appName: “DA”,
appLogo: “https://web3auth.io/community/images/w3a-L-Favicon-1.svg”, // Your App Logo Here
theme: “light”,
loginMethodsOrder: [“apple”, “google”, “twitter”],
defaultLanguage: “en”, // en, de, ja, ko, zh, es, fr, pt, nl
loginGridCol: 3,
primaryButton: “externalLogin”, // “externalLogin” | “socialLogin” | “emailLogin”
},
web3AuthNetwork: “mainnet”,
});
const openloginAdapter = new OpenloginAdapter({
loginSettings: {
mfaLevel: "optional",
},
adapterSettings: {
uxMode: "popup", // "redirect" | "popup"
whiteLabel: {
name: "Digital Arms",
logoLight: "https://web3auth.io/community/images/w3a-L-Favicon-1.svg",
logoDark: "https://web3auth.io/community/images/w3a-D-Favicon-1.svg",
defaultLanguage: "en", // en, de, ja, ko, zh, es, fr, pt, nl
dark: false, // whether to enable dark mode. defaultValue: false
},
mfaSettings: {
deviceShareFactor: {
enable: true,
priority: 1,
mandatory: true,
},
backUpShareFactor: {
enable: true,
priority: 2,
mandatory: false,
},
socialBackupFactor: {
enable: true,
priority: 3,
mandatory: false,
},
passwordFactor: {
enable: true,
priority: 4,
mandatory: false,
},
},
},
});
web3auth.configureAdapter(openloginAdapter);
const defaultWcSettings = await getWalletConnectV2Settings(
"eip155",
[1, 137, 5, 56],
"04309ed1007e77d1f119b85205bb779d"
);
const walletConnectV2Adapter = new WalletConnectV2Adapter({
adapterSettings: { ...defaultWcSettings.adapterSettings },
loginSettings: { ...defaultWcSettings.loginSettings },
});
web3auth.configureAdapter(walletConnectV2Adapter);
// adding metamask adapter
const metamaskAdapter = new MetamaskAdapter({
clientId,
sessionTime: 3600, // 1 hour in seconds
web3AuthNetwork: "mainnet",
chainConfig: {
chainNamespace: CHAIN_NAMESPACES.EIP155,
chainId: process.env.REACT_APP_CHAIN_ID,
rpcTarget: process.env.REACT_APP_RPC_URL, // This is the public RPC we have added, please pass on your own endpoint while creating an app
},
});
// we can change the above settings using this function
metamaskAdapter.setAdapterSettings({
sessionTime: 86400, // 1 day in seconds
chainConfig: {
chainNamespace: CHAIN_NAMESPACES.EIP155,
chainId: process.env.REACT_APP_CHAIN_ID,
rpcTarget: process.env.REACT_APP_RPC_URL, // This is the public RPC we have added, please pass on your own endpoint while creating an app
},
web3AuthNetwork: "mainnet",
});
// it will add/update the metamask adapter in to web3auth class
web3auth.configureAdapter(metamaskAdapter);
const torusWalletAdapter = new TorusWalletAdapter({
clientId,
});
// it will add/update the torus-evm adapter in to web3auth class
web3auth.configureAdapter(torusWalletAdapter);
setWeb3auth(web3auth);
await web3auth.initModal();
setProvider(web3auth.provider);
if (web3auth.connected) {
console.log("Connected")
setProvider(web3auth.provider);
setAccount(cookies["selected_account"]);
console.log("account 1 is-------->", cookies["selected_account"]);
// setLoggedIn(true);
}
} catch (error) {
console.error(error);
}
};