How to apply testnet in No Modal SDK (Custom Auth)

Help - Plug n Play PnP Web SDKs
1

I am using “Plug n Play Web No Modal SDK” in Nextjs.

As the SDK version was upgraded, I saw that testnet was deprecated.
Instead, Testnet is fully migrated at this point to Sapphire.

However, I saw that Sapphire is not supported in PnP, so how can I apply testnet to PnP?

I don’t see any other alternative items on the dashboard.

2

Hey @bjkim, it’s correct that the testnet was deprecated and Sapphire is not supported in PnP. I will recommend you to try Cyan Mainnet and see if it works for you. Please note that you will have to create verifier for the Cyan Mainnet deployment environment and use that in the sample app.
Let me know if you face any difficulties with that.

1 Like
3

When I try to log in with custom Facebook through cyan, the following screen appears. I am using the latest version of no-modal v6.1.1.

When is it usually redirected to a screen like this?

스크린샷 2023-06-27 오후 3.16.55

And, when using cyan, which OAuth redirection URL should be set?

I set it like this: https://cyan.openlogin.com/auth

async function init() {
            try {
                setIsLoading(true);
                const web3AuthInstance = new Web3AuthNoModal({
                    chainConfig: {
                      chainNamespace: CHAIN_NAMESPACES.EIP155,
                      rpcTarget: 'https://polygon-rpc.com',
                      blockExplorer: 'https://polygonscan.com/',
                      chainId: '0x89',
                     displayName: 'Polygon Mainnet',
                    ticker: 'matic',
                     tickerName: 'Matic',

                    } ,
                    clientId,
                    web3AuthNetwork: 'cyan',
                });

                const privateKeyProvider = new EthereumPrivateKeyProvider({
                    config: { chainConfig: {
                      chainNamespace: CHAIN_NAMESPACES.EIP155,
                      rpcTarget: 'https://polygon-rpc.com',
                      blockExplorer: 'https://polygonscan.com/',
                      chainId: '0x89',
                     displayName: 'Polygon Mainnet',
                    ticker: 'matic',
                     tickerName: 'Matic',

                    } , },
                });

                const openloginAdapter = new OpenloginAdapter({
                    adapterSettings: {
                        clientId,
                        network: 'cyan',
                        uxMode: 'redirect',
                        loginConfig: {
                            google: {
                                verifier: 'xxx-google-cyan-dev',
                                typeOfLogin: 'google',
                                clientId: 'xxxxxxxxxxxxx,
                            },
                            facebook: {
                                verifier: 'xxx-facebook-cyan-dev',
                                typeOfLogin: 'facebook',
                                clientId: 'xxxxxxxxxxxxx',
                            },
                        },
                    },
                    loginSettings: {
                        mfaLevel: 'none',
                    },
                    privateKeyProvider,
                });
                web3AuthInstance.configureAdapter(openloginAdapter);
                subscribeAuthEvents(web3AuthInstance);
                setWeb3Auth(web3AuthInstance);

                await web3AuthInstance.init();
                setStatus(web3AuthInstance.status);
            } catch (error) {
                console.error(error);
            } finally {
                setIsLoading(false);
            }
        }
        init();
    }, [setWalletProvider]);
4

It works well when I add the email permission of the app in Facebook developer tools.

1 Like