feat: walletconnect wallet

[GMSteuart]

Description

Integrates WalletConnect wallet

UPDATE: Moved the provider object from hdwallet over to web since there is a scenario where the connect modal will hang indefinitely and there is no graceful way to automatically exit on behalf of the user. This indefinite situation occurs after the QR modal pops up and the user rejects the session. The reason this occurs is because the connector at the time is only listening for connect events and the only event emitted is the disconnect event; alas, the connector enters a state of waiting with no apparent end. The code of concern can be found in WalletConnect's web3-provider.

Notice

• [x] Have you followed the guidelines in our Contributing guide?
• [x] Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Pull Request Type

• [ ] :bug: Bug fix (Non-breaking Change: Fixes an issue)
• [ ] :hammer_and_wrench: Chore (Non-breaking Change: Doc updates, pkg upgrades, typos, etc..)
• [x] :nail_care: New Feature (Breaking/Non-breaking Change)

Issue (if applicable)

Closes #1686

Risk

• UX exposure to WalletConnect bugs

Testing

Open a terminal for web and another for hdwallet.

# /hdwallet
yarn
yarn build
cd packages/hdwallet-walletconnect
yarn link
# hdwallet-walletconnect tests
 yarn test packages/hdwallet-walletconnect/src/walletconnect.test.ts
#  hdwallet-walletconnect integration tests
cd integration
yarn test src/walletconnect.test.ts

# /web
# clone this branch 
gh pr checkout 1733
yarn clean
yarn link "@shapeshiftoss/hdwallet-walletconnect"
# update package.json "@shapeshiftoss/hdwallet-walletconnect": "^1.21.2"
# to use filepath "@shapeshiftoss/hdwallet-walletconnect": "../hdwallet/packages/hdwallet-walletconnect"
# the above assumes your directory structure is setup like:
# .
# ├── hdwallet
# ├── lib
# └── web
yarn
open https://test.walletconnect.org/
yarn dev

1. Sign in with some other wallet
2. Go to flag settings
3. Turn on WalletConnectWallet flag and save
4. Disconnect from current wallet
5. Go through wallet sign in process but select WalletConnect this time around

Screenshots (if applicable)

@0xdef1cafe copy on pairing modal will need to be updated since a QR code pops up:

On test.walletconnect.org

And lastly on test.walletconnect.org

[GMSteuart]

@0xdef1cafe will need product review for user flow when clicking WalletConnect option

[gomesalexandre]

@GMSteuart I suppose this needs linking with https://github.com/shapeshift/hdwallet/pull/529 for now, could you add some instructions for local testing until hdwallet-walletconnect is published?

[gomesalexandre]

Also, seems like the diff touches many files/lines that shouldn't be modified by this PR, rebase/merge might help 👀

[GMSteuart]

@GMSteuart I suppose this needs linking with shapeshift/hdwallet#529 for now, could you add some instructions for local testing until hdwallet-walletconnect is published?

Ya, I can add local testing steps, one of those will have to be running the associated hdwallet-walletconnect package that isn't published yet.

[GMSteuart]

Also, seems like the diff touches many files/lines that shouldn't be modified by this PR, rebase/merge might help 👀

Oh fun. lol. Glad I'm finding out earlier in the day rather than later. Thanks for pointing that out. 🙂

[gomesalexandre]

@GMSteuart I suppose this needs linking with shapeshift/hdwallet#529 for now, could you add some instructions for local testing until hdwallet-walletconnect is published?

Ya, I can add local testing steps, one of those will have to be running the associated hdwallet-walletconnect package that isn't published yet.

Built, linked, and ran web off the hdwallet PR branch but I'm seeing this, so I'm wondering whether or not there are more steps or something I missed:

[sababa-2019]

bumping this, any updates here @GMSteuart ser?

[0xdef1cafe]

i connected a wallet with eth, btc, and atom assets

i can see tx history for eth and atom but not bitcoin

i can only see account data for eth

i'm only seeing eth account specifiers in the client

plz fix

[GMSteuart]

@0xdef1cafe no longer a fuzzy fox 🙂

[pastaghost]

i connected a wallet with eth, btc, and atom assets i can see tx history for eth and atom but not bitcoin i can only see account data for eth i'm only seeing eth account specifiers in the client

I think this is an hdwallet issue. I'll make the necessary changes and publish a new alpha release, then include the updated dependency here.

edit: @0xdef1cafe Correction on this - WalletConnect 1.0 only supports ETH.

[gomesalexandre]

This is currently blocked by the hdwallet WalletConnect integration: https://github.com/shapeshift/hdwallet/pull/544

[pastaghost]

Keplr also supports WalletConnect, and can be used to connect to e.g osmosis.zone. It isn't supported at all as the app is effectively in full skeleton mode for dashboard and has no loaded accounts in state. Do we want to handle the case of Keplr Mobile (and Cosmos/Osmosis accounts derivation in WalletConnect) not being supported, by having some UX for it?

This is because WalletConnect 1.0 (the version we've implemented in HDWallet) is ETH-only. WalletConnect 2.0 has multi-chain support but is still in beta. I'm currently looking to see if it is possible to either detect the user wallet connected on the other side of the WalletConnect bridge or to limit the set of wallets supported by the application via WalletConnect.

[pastaghost]

• Added copy to WalletConnect option in SelectModal.tsx
• Constrained width of wallet option icons
• Tested WalletConnect option text in all three possible configurations (no wallet active, walletConnect active, some other wallet active)

[0xdef1cafe]

merging as previously approved by @gomesalexandre and the most recent commit was stylistic/trivial