SwitchNetwork seems not working

[abhishekDabba]

I have a custom test network (EVM Compatible ) for which I am using metamask btw the integration is for multichain

while creating the instance of APPKIT I make sure to only provide the PeaqTestnet for compatibility but when I test by connecting any Ethereumchain the wallet is successfully getting connected I want that it should request to switch network and make sure only user is able to connect through peaq chain if using metamask wallet

import { useAppKit, useAppKitEvents, useAppKitAccount, useDisconnect, useAppKitNetwork } from '@reown/appkit/react';
import { peaqTestnet } from '../../constants/network';

const CustomConnectButton = () => {
    const { open } = useAppKit();
    const { switchNetwork } = useAppKitNetwork();
    const { address, isConnected } = useAppKitAccount();
    const { disconnect } = useDisconnect();
    const { data: eventData } = useAppKitEvents();
    const [showDropdown, setShowDropdown] = useState(false);

    const toggleDropdown = () => setShowDropdown(!showDropdown);

    const enforceNetwork = async () => {
        if (isConnected) {
            console.log("ENFORCING NETWORK NOW");
            await switchNetwork(peaqTestnet);
            console.log("Network Switched to Peaq Testnet");
        }
    };

    useEffect(() => {
        if (eventData) {
            console.log("eventData.event:", eventData.event);

            switch (eventData.event) {
                case 'SELECT_WALLET':
                    console.log("Wallet selected:", eventData.properties?.name);
                    break;
                
                case 'CONNECT_SUCCESS':
                    console.log("Connected successfully!");
                    enforceNetwork(); // Enforce network upon successful connection
                    break;
                
                case 'DISCONNECT_SUCCESS':
                    console.log("Disconnected successfully!");
                    disconnect(); // Ensure disconnection
                    break;
                
                case 'SWITCH_NETWORK':
                    console.log("Switching network to enforce Peaq Testnet");
                    enforceNetwork(); // Re-enforce network if user tries to switch
                    break;

                case 'CONNECT_ERROR':
                    console.error("Connection error:", eventData.properties?.message);
                    break;
                
                default:
                    console.log("Unhandled event:", eventData);
                    break;
            }
        }
    }, [eventData, isConnected]);

    const buttonStyle = {
        backgroundColor: 'black',
        color: '#FFD903',
        border: '1px solid #FFD903',
        padding: '6px 12px',
        borderRadius: '8px',
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'center',
    };

    if (isConnected) {
        return (
            <div className="relative inline-block">
                <button onClick={toggleDropdown} style={buttonStyle}>
                    {`${address.slice(0, 6)}...${address.slice(-4)}`}
                </button>
                {showDropdown && (
                    <div className="absolute right-0 mt-2 w-40 bg-gray-800 text-white rounded-lg shadow-lg z-10">
                        <button
                            onClick={() => {
                                disconnect();
                                setShowDropdown(false);
                            }}
                            className="w-full px-4 py-2 text-left hover:bg-gray-700"
                            style={{ color: '#FFD903' }}
                        >
                            Disconnect
                        </button>
                    </div>
                )}
            </div>
        );
    }

    return (
        <button onClick={() => open()} style={buttonStyle}>
            Select Wallet
        </button>
    );
};

export default CustomConnectButton;

here's how I tried to use the SwitchNetwork but It seems not working the network is still Ethereum even after the function is running but not providing any such output that we expect !

[rtomas]

hi. Which version are you using ?

[abhishekDabba]

here's the versions

    "@reown/appkit-adapter-solana": "^1.3.2",
    "@solana/spl-token": "^0.4.8",
    "@solana/wallet-adapter-react": "^0.15.35",
    "@solana/wallet-adapter-wallets": "^0.19.32",
    "@solana/web3.js": "^1.95.4",
    "ethers": "^6.13.4",
    ```

[rtomas]

hi @abhishekDabba

Could you please try in latest ? v1.4.1 ?

I have just tried and is working for me.

Otherwise, please share "peaqTestnet" declaration and AppKit Configuration.

Thanks

[abhishekDabba]

any chance I can remove the ethereum option from here !
likewise remove solana if someone clicks on metamask. just to avoid confusions since we are having chain specific wallets.Images are shared below

[rtomas]

hi @abhishekDabba

so you want your users to use phantom for solana and metamask for evm ? that is what you are requesting ?

[rtomas]

I am still able to connect to different EVM chains even if only I have passed in PEAQ as network (KIT configuration shared above)

This should be solved on v1.5.0 .. can you confirm ?

[abhishekDabba]

This should be solved on v1.5.0 .. can you confirm ?

so the Network connections seems working where if I switch or connect via other network then it open a tab specifying that the network is not supported , but the modal is not clickable completely I have shared a loom video for the same , when clicking on peaq testnet it does not work when clicking on solana it directly disconnects

https://www.loom.com/share/a8adf95799154adfa2f1c73544243ee0?sid=55aab640-1898-4fe3-9e2b-f9bc69c37d5a

hi @abhishekDabba

so you want your users to use phantom for solana and metamask for evm ? that is what you are requesting ?

Yes to avoid confusion for users If we can streamline this and if someone clicks phantom we show only solana and if someone clicks metamask we show them Peaq option its Ethereum there that feels like mainnet but our chains is different can we make it PEAQ ?

[abhishekDabba]

hi @rtomas waiting for you response ! also my team wants to know in case we can use REOWN for our product (can the customizations be done to the wallet ?)

[1012492240]

重复了

[abhishekDabba]

how can I get this specific for chain instead of multi-chain ?