Closed weber77 closed 2 days ago
@weber77 Seems to be a WalletConnect issue. Can you check if you've added your preview link to the "Allowed Domains" section in the WalletConnect dashboard ?
@weber77 Seems to be a WalletConnect issue. Can you check if you've added your preview link to the "Allowed Domains" section in the WalletConnect dashboard ?
![]()
Hey @weber77 It's working after allow domain. But new issue. When i click button that call metamask action, No action at metamask. Need another configuration?
same with me no action at MM
@sniper365 Are you saying that whenever you try to connect with MetaMask it doesn't do anything or it's not prompting you to connect to the dApp ? Are you able to show any console errors ?
@magiziz First. MetaMask doesn't do anything when I call action after connect.
@sniper365 Can you share a minimal reproducible example ?
@weber77 Seems to work for me since i use my own projectId
. What happens if you use the projectId
below ? https://github.com/rainbow-me/rainbowkit/blob/cdcaa25d66b522119852502f71c8efc02b1abdd9/packages/rainbowkit/src/wallets/getWalletConnectConnector.ts#L95
Don't use that in production, i'm just trying to see if you have configured everything in WalletConnect dashboard.
Also are you using any VPN's ?
Yes, I configured projectId correctly and verified on the walletconnect Yes, I use VPN. that would have some issue?
@weber77 Seems to work for me since i use my own
projectId
. What happens if you use theprojectId
below ? https://github.com/rainbow-me/rainbowkit/blob/cdcaa25d66b522119852502f71c8efc02b1abdd9/packages/rainbowkit/src/wallets/getWalletConnectConnector.ts#L95Don't use that in production, i'm just trying to see if you have configured everything in WalletConnect dashboard.
Also are you using any VPN's ?
I used it but it still doesn't work. Here's the repo
https://github.com/rainbow-me/rainbowkit/assets/44323398/17ce0a57-5504-4503-85ff-aadd6711bec7
@magiziz @ I followed wagmi ssr guide The issue is not on wallet connect. On the desktop, third party api hook shows correctly the balance, But on the mobile it doesn't work.
e.g
const { availableBalance, availableWithdraw } = useWithdraw();
It's working on desktop but not on the mobile. any further configuration, you think?
@sniper365 The reason this might be a WalletConnect issue is because you're not being deep linked correctly into the MetaMask app and we use WalletConnect to initiate the deep links.
You also mentioned that you use VPN ? Can you describe more where the VPN is pointed at ?
Also can you show the console errors you get once trying to connect with MetaMask ?
VPN location is Germany
@sniper365 Are you able to fully turn off your VPN and try again ? Make sure to first disconnect in MetaMask and try again using this project id 21fef48091f12692cad574a6f7753643
.
Also it would be helpful if you can share any console errors you get on mobile. You can use any android simulators for that.
Everything seem to work just find when using default configs. Without configuring urls
export const rainbowConfig = getDefaultConfig({
appName: 'PaalX Sniper🎯',
projectId: PROJECT_ID,
chains: [mainnet],
ssr: false, // If your dApp uses server side rendering (SSR)
});
If you absolutely want to choose your own set of wallets, you can use wagmi/connectors
import { connectorsForWallets, getDefaultConfig } from "@rainbow-me/rainbowkit";
import { mainnet } from "wagmi/chains";
import { createConfig, http } from "wagmi";
import { PROJECT_ID } from "@/utils/env";
import { metaMask, walletConnect } from "wagmi/connectors";
import {
walletConnectWallet,
metaMaskWallet,
phantomWallet,
} from "@rainbow-me/rainbowkit/wallets";
const connectors = connectorsForWallets([
{
groupName: "Recommended",
wallets: [metaMaskWallet, walletConnectWallet],
},
], { projectId: PROJECT_ID, walletConnectParameters: {}, appName: "xxx", appDescription: "", appUrl: "", appIcon: "" });
const wagmiWallets = [walletConnect({
projectId: PROJECT_ID, metadata: {
name: 'xxxx',
description: "xxxx",
url: "https://xxxx.ai/",
icons: [""]
}
}), metaMask()]
function isMobileDevice() {
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
}
export const wagmiConfig = createConfig({
connectors: isMobileDevice() ? wagmiWallets : connectors,
chains: [mainnet],
transports: {
[mainnet.id]: http(''),
},
});
In main.tsx
<WagmiProvider config={wagmiConfig}> // replace with "rainbowConfig" if you want to use defaults
<QueryClientProvider client={queryClient}>
<App />
</QueryClientProvider>
</WagmiProvider>
@weber77 Are you saying everything seems to work with getDefaultConfig
? If so that's great.
Here is another alternative to your wagmi/connectors
approach:
const connectors = connectorsForWallets(
[
{
groupName: "Recommended",
wallets: [metaMaskWallet, walletConnectWallet],
},
],
{
projectId: "...",
appName: "...",
// Add your own WalletConnect parameters
walletConnectParameters: {
metadata: {
name: "xxxx",
description: "xxxx",
url: "https://xxxx.ai/",
icons: [""],
},
},
}
);
Closing this issue for now. Feel free to re open this issue if you're still stuck.
Is there an existing issue for this?
RainbowKit Version
^2.1.2
wagmi Version
^2.10.2
Current Behavior
when I connect on mobile it opens in metamask but does prompt for connection
https://github.com/rainbow-me/rainbowkit/assets/44323398/5a22f4cd-3be0-46e1-b898-5588e05059eb
Expected Behavior
https://github.com/coder/coder/assets/44323398/04f86d3c-45fe-4358-a213-29f7639652ca
Steps To Reproduce
connect wallet
Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)
CodeSandBox