I am using “@web3auth/modal”: “^10.3.0”,
This is my code
import {
AUTH_CONNECTION,
CHAIN_NAMESPACES,
CommonPrivateKeyProvider,
IProvider,
WALLET_CONNECTORS,
WEB3AUTH_NETWORK,
Web3Auth,
} from "@web3auth/modal";
import { useEffect, useState } from "react";
const clientId = "BNPm6P51gixcR2YhGlFPAh2YQ_G5tZ6oXTF1NXqfrvXuiPsfpPTML-zn1Ah66q6x55gmF_grh9qtsbD3byMPh-4";
const sentinelChainDetails = {
blockExplorerUrl: "https://explorer.chainroot.io/sentinel",
chainId: "sentinelhub-2",
chainNamespace: CHAIN_NAMESPACES.OTHER,
displayName: "Sentinel",
logo: "https://raw.githubusercontent.com/cosmos/chain-registry/master/sentinel/images/dvpn.svg",
rpcTarget: "https://rpc.sentinel.co:443",
ticker: "dVPN",
tickerName: "Sentinel",
};
const privateKeyProvider = new CommonPrivateKeyProvider({
config: {
chain: sentinelChainDetails,
chains: [sentinelChainDetails],
},
});
const web3auth = new Web3Auth({
clientId,
mfaLevel: "none",
privateKeyProvider,
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_DEVNET,
});
await web3auth.init();
function MyApp() {
const [provider, setProvider] = useState<IProvider | null>(null);
const loginGoogle = async () => {
const status = await web3auth.connectTo(WALLET_CONNECTORS.AUTH, {
authConnection: AUTH_CONNECTION.GOOGLE,
});
setProvider(status);
};
const loginEmail = async () => {
const status = await web3auth.connectTo(WALLET_CONNECTORS.AUTH, {
authConnection: AUTH_CONNECTION.EMAIL_PASSWORDLESS,
loginHint: "srinath@exidio.co",
});
setProvider(status);
};
useEffect(() => {
console.log(web3auth, provider);
}, [provider]);
return (
<div>
<button onClick={loginGoogle}>Login with Google</button>
<button onClick={loginEmail}>Login via Email</button>
<button onClick={() => web3auth.logout()}>Logout</button>
</div>
);
}
export default function AppWrapper() {
return (
<MyApp />
);
}
After login with EMAIL_PASSWORDLESS, I am getting Error: Unsupported chain namespace…
And when I login with Google: I am getting the below screen even after mfaLevel: "none",
Also, let me know how to implement this
const handleWeb3AuthConnected = useCallback(
async (event) => {
try {
console.log(“::CONNECTED::”, event);
const idToken = await window.web3auth.authenticateUser();
const user = await window.web3auth.getUserInfo();
const privateKey = await event.provider.request({ method: "private_key" });
if (privateKey) {
const appPubKey = getPublicCompressed(window.Buffer.from(privateKey.padStart(64, "0"), "hex")).toString("hex");
const accessToken = await accountServices.fetchPublicKey({ appPubKey, idToken: idToken.idToken });
const details = await accountServices.fetchUserDetailsWithPublicKey({ publicKey: `${accessToken}` });
dispatch(
UPDATE_AUTH_DETAILS({
accessToken,
address: details.sentinelAddress,
authProvider: user.typeOfLogin,
creditCoins: 0,
expiredAt: details.expiredAt,
profileImage: user.profileImage,
})
);
}
} catch (error) {
console.log("error", error);
}
},
[dispatch]
);