When asking for help in this category, please make sure to provide the following details:
Also, kindly provide the Web3Auth initialization and login code snippet below. This will help us better understand your issue and provide you with the necessary assistance.
@psaini.php Thanks for reaching out.
Please refer to the below code snippet to do this for Social Logins. Similarly, you can hide the other social logins by passing the objects in loginMethods for the modal:
import { CHAIN_NAMESPACES, WALLET_ADAPTERS } from "@web3auth/base";
const web3auth = new Web3Auth({
chainConfig: { chainNamespace: CHAIN_NAMESPACES.EIP155 },
clientId: "BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ",
web3AuthNetwork: "sapphire_mainnet",
});
await web3auth.initModal({
modalConfig: {
[WALLET_ADAPTERS.OPENLOGIN]: {
label: "openlogin",
loginMethods: {
// Disable facebook and reddit
facebook: {
name: "facebook",
showOnModal: false,
},
reddit: {
name: "reddit",
showOnModal: false,
},
},
},
},
});
To disable Email or SMS login, here is the code snippet:
import { CHAIN_NAMESPACES, WALLET_ADAPTERS } from "@web3auth/base";
const web3auth = new Web3Auth({
chainConfig: { chainNamespace: CHAIN_NAMESPACES.EIP155 },
clientId: "BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ",
web3AuthNetwork: "sapphire_mainnet",
});
await web3auth.initModal({
modalConfig: {
[WALLET_ADAPTERS.OPENLOGIN]: {
label: "openlogin",
loginMethods: {
// Disable email_passwordless and sms_passwordless
email_passwordless: {
name: "email_passwordless",
showOnModal: false,
},
sms_passwordless: {
name: "sms_passwordless",
showOnModal: false,
},
},
},
},
});```Hi @vjgee now its look like this
Can you share your Dapp URL so I can check ?
it is under development
what do you want to know?
How have you added the code to display the External wallet button? Can you share?
useEffect(() => {
const init = async () => {
try {
const web3auth = new Web3Auth({
clientId,
chainConfig: flareConfig,
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
// uiConfig refers to the whitelabeling options, which is available only on Growth Plan and above
// Please remove this parameter if you’re on the Base Plan
uiConfig: {
appName: “W3A”,
theme: {
primary: “blue”,
},
mode: “light”,
logoLight: “https://web3auth.io/images/web3auth-logo.svg”,
logoDark: “https://web3auth.io/images/web3auth-logo---Dark.svg”,
defaultLanguage: “en”, // en, de, ja, ko, zh, es, fr, pt, nl
loginGridCol: 3,
primaryButton: “externalLogin”, // “externalLogin” | “socialLogin” | “emailLogin”
},
});
const openloginAdapter = new OpenloginAdapter({
loginSettings: {
mfaLevel: "optional",
},
adapterSettings: {
uxMode: "redirect", // "redirect" | "popup"
whiteLabel: {
logoLight: "https://web3auth.io/images/web3auth-logo.svg",
logoDark: "https://web3auth.io/images/web3auth-logo---Dark.svg",
defaultLanguage: "en", // en, de, ja, ko, zh, es, fr, pt, nl
mode: "dark", // whether to enable dark, light or auto mode. defaultValue: auto [ system theme]
},
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 torusPlugin = new TorusWalletConnectorPlugin({
torusWalletOpts: {},
walletInitOptions: {
whiteLabel: {
theme: { isDark: true, colors: { primary: "#00a8ff" } },
logoDark: "https://web3auth.io/images/web3auth-logo.svg",
logoLight: "https://web3auth.io/images/web3auth-logo---Dark.svg",
},
useWalletConnect: true,
enableLogging: true,
},
});
setTorusPlugin(torusPlugin);
await web3auth.addPlugin(torusPlugin);
// read more about adapters here: https://web3auth.io/docs/sdk/pnp/web/adapters/
// adding wallet connect v2 adapter
const defaultWcSettings = await getWalletConnectV2Settings(
"eip155",
[1],
"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: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
chainConfig: flareConfig,
});
// we can change the above settings using this function
metamaskAdapter.setAdapterSettings({
sessionTime: 86400, // 1 day in seconds
chainConfig: flareConfig,
web3AuthNetwork: WEB3AUTH_NETWORK.SAPPHIRE_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({
modalConfig: {
[WALLET_ADAPTERS.OPENLOGIN]: {
label: "openlogin",
loginMethods: {
// Disable facebook and reddit
facebook: {
name: "facebook",
showOnModal: false,
},
reddit: {
name: "reddit",
showOnModal: false,
},
google: {
name: "google",
showOnModal: false,
},
discord: {
name: "discord",
showOnModal: false,
},
twitch: {
name: "twitch",
showOnModal: false,
},
apple: {
name: "apple",
showOnModal: false,
},
line: {
name: "line",
showOnModal: false,
},
github: {
name: "github",
showOnModal: false,
},
kakao: {
name: "kakao",
showOnModal: false,
},
linkedin: {
name: "linkedin",
showOnModal: false,
},
twitter: {
name: "twitter",
showOnModal: false,
},
weibo: {
name: "weibo",
showOnModal: false,
},
wechat: {
name: "wechat",
showOnModal: false,
},
sms_passwordless: {
name: "sms_passwordless",
showOnModal: false,
},
},
},
},
});
if (web3auth.connected) {
setLoggedIn(true);
}
} catch (error) {
console.log("wallet--init--catch", error);
}
};
init();
}, []);
Try adding the following snippet after the above block in the modal config:
[WALLET_ADAPTERS.TORUS_EVM]: {
label: "torus_evm",
showOnModal: false,
},
it’s not working.
label: "torus_evm",
showOnModal: false,
},
Could you refer to the below snippet and check:
await web3auth.initModal({
modalConfig: {
[WALLET_ADAPTERS.OPENLOGIN]: {
label: "openlogin",
loginMethods: {
// Disable facebook and reddit
facebook: {
name: "facebook",
showOnModal: false,
},
reddit: {
name: "reddit",
showOnModal: false,
},
google: {
name: "google",
showOnModal: false,
},
discord: {
name: "discord",
showOnModal: false,
},
twitch: {
name: "twitch",
showOnModal: false,
},
apple: {
name: "apple",
showOnModal: false,
},
line: {
name: "line",
showOnModal: false,
},
github: {
name: "github",
showOnModal: false,
},
kakao: {
name: "kakao",
showOnModal: false,
},
linkedin: {
name: "linkedin",
showOnModal: false,
},
twitter: {
name: "twitter",
showOnModal: false,
},
weibo: {
name: "weibo",
showOnModal: false,
},
wechat: {
name: "wechat",
showOnModal: false,
},
sms_passwordless: {
name: "sms_passwordless",
showOnModal: false,
},
},
}, //Disable Torus Plugin
[WALLET_ADAPTERS.TORUS_EVM]: {
label: 'TORUS_EVM',
showOnModal: false,
},
},
});thanks it works… also want to know how wallet connect works in web3auth…
why these hard coded value passed to wellectconnect adaptor
const defaultWcSettings = await getWalletConnectV2Settings(
"eip155",
[1],
"04309ed1007e77d1f119b85205bb779d"
);
const walletConnectV2Adapter = new WalletConnectV2Adapter({
adapterSettings: { ...defaultWcSettings.adapterSettings },
loginSettings: { ...defaultWcSettings.loginSettings },
});
web3auth.configureAdapter(walletConnectV2Adapter);
You may refer to the documentation below to understand how it works:
They are hardcoded to illustrate as an example. The below parameters go into it:
| Parameter | type |
|---|---|
| namespace | ChainNamespaceType, e.g. (eip155, solana) |
| chainIds | number[] e.g. [1, 5, 56, etc.] |
| projectID | WalletConnect Project ID, get one from https://cloud.walletconnect.com |
Click here to learn more about setting up projectID
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.