Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: show WalletConnect chain dropdown #1447

Closed
wants to merge 7 commits into from
Closed

Conversation

fionnachan
Copy link
Member

@fionnachan fionnachan commented Jan 18, 2024

Upon selection, this dropdown adds the query param walletConnectChain so that users can successfully connect their wallet using WalletConnect.

Tested with Safe.

image

Closes #1153

@cla-bot cla-bot bot added the cla-signed label Jan 18, 2024
Copy link

vercel bot commented Jan 18, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
arbitrum-token-bridge ✅ Ready (Inspect) Visit Preview Jan 22, 2024 5:21pm

@brtkx
Copy link
Contributor

brtkx commented Jan 19, 2024

Screen.Recording.2024-01-19.at.15.00.35.mov

Possible race condition with useNetworks. Query params don't have walletConnectChain on them when this happens.

</p>
<NetworkListbox
label={''}
placeholder="Select a chain"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we can set this inside NetworkListbox if value is undefined?

Copy link
Member Author

@fionnachan fionnachan Jan 19, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NetworkListbox is also used on the tx panel for "From: Network" and "To: Network" so I won't set it inside

unless we think Select a chain can be globally used :/
although the ones on tx panel will never have an undefined value as it is

const options = getSupportedNetworks(undefined, true)
.map(chainId => {
const wagmiChain = getWagmiChain(chainId)
const targetChainKey =
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it be possible to have an object:

const chainIdToWalletConnectKey: { [key in ChainId]: string } = {
   ChainId.Ethereum: 'mainnet',
   . . .
}

and then we could just do:

const targetChainKey = chainIdToWalletConnectKey[chainId]

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done


const walletConnectChain = searchParams?.get('walletConnectChain')

const chain = (() => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why do we need try catch?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oops i was testing something else and didn't remove it

@fionnachan
Copy link
Member Author

closing this in favour of #1452

@fionnachan fionnachan closed this Mar 6, 2024
@fionnachan fionnachan deleted the walletConnectChain branch March 6, 2024 19:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Expose walletConnectChain on the UI
2 participants