search

near / wallet-selector

This is a wallet selector modal that allows users to interact with NEAR dApps with a selection of available wallets.
https://near.github.io/wallet-selector/
Apache License 2.0
149 stars 155 forks source link

Conduct research on WalletConnect implementation #129

Closed AmmarHumackicSQA closed 2 years ago

AmmarHumackicSQA commented 2 years ago

Description

The aim of this spike is to investigate the potential implementation of the WalletConnect protocol.

As mentioned by Mike, the WalletConnect should eventually show up as an option for the Wallet Selector. The idea is when someone chooses the WalletConnect option, the QR code is presented to the user on the website (dApp). The user then will open an app that implements a WalletConnect SDK on his mobile phone device (which has the private key).

The mobile phone scans and reads the QR code and gets two things:

  1. A private key (not attached to any blockchain, just plain vanilla cryptography key)
  2. A "relay" address. Example: https://relay-1023423.mike.stinks/

The frontend and the mobile phone now can communicate. They know the same private key. They could sign some message and broadcast that signed message through the relay address, which is just a websocket connection, essentially. On the receiving end, the frontend or phone app can say, that the msg is received and the message was signed by the same key "grabbed" from the QR code.

So now there is a secure communication channel established between frontend and mobile phone.

For example, the user is on some dApp, buying some tokens, or getting ready for some DeFi trade, and when they click "Submit" the payload is signed and sent through the relayer to mobile phone. The payload would be something like: 

{
  contract: "defi.near",
  method: "swap",
  args: ["dai", "near"]
}

There if the message is trusted, the transaction can be constructed, signed, and sent to the blockchain. (Or, send the bytes through the relay to the frontend, which sends it to the blockchain).

Resources

Available WalletConnect documentation: https://docs.walletconnect.com/

https://github.com/WalletConnect

https://moralis.io/what-is-walletconnect-the-ultimate-walletconnect-guide/

Onboard.js example:

https://zapper.fi/

https://github.com/blocknative/onboard/blob/develop/src/modules/select/wallets/wallet-connect.ts

Outcome

Time Box: 2 days

kujtimprenkuSQA commented 2 years ago

WalletConnect findings

WalletConnect: Connecting wallets to dapps WalletConnect 2.0 - To Interchain and Beyond!

The above videos provide answers for the below questions:

Blockchains/Wallets that have custom WalletConnect integration:

Outcome - Answers

Should we start implementing it in this stage of the project?

Are there any potential blockers regarding its implementation?

kujtimprenkuSQA commented 2 years ago

More info

Stellar

After doing more research and trying to find other implementations of wallet connect found this site: https://stellarterm.com/wallet-connect/

They have all the code of this website in github, and here is a service where they implement the integration with WalletConnect: https://github.com/stellarterm/stellarterm/blob/master/src/lib/driver/WalletConnectService.js

When visiting the first link if we try to login with WalletConnect a modal will be opened and you will notice the QRcode and also there's a description like: Open your WalletConnect-compatible app with Stellar support, like LOBSTR wallet, and scan the QR code to connect.

As I understand from what I have currently read about WalletConnect, in order for the pairing to be successful (between dApp and a Wallet) the configuration for WalletConnect which is setup inside the dApp in our case near-wallet-selector when we try to create a connection(session) both the dApp and the wallet which implements WalletConnect need to know about the network of the blockchain(NEAR) in which they're trying to make the connection.

To prove this when visiting the first link and if we open the WalletConnect modal if we try to scan the QR code with any other wallet thant LOBSTR there will be no successful connection and the QRcode scanner will simply close.

Binance

Another resource worth having a look at is Binance docs for walletconnect, there you see a List of Wallets Supporting WalletConnect on Binance Chain which indicates that not only the dApp needs to have support for the Binance chain but also the wallet which the dApp is trying to connect with.

mikedotexe commented 2 years ago

Thanks @kujtimprenkuSQA we're looking to build the integration for WalletConnect and cannot wait for another team to help. Thanks for the investigation