How to integrate with WalletConnect

Context

WalletConnect is a protocol that connects other applications (dApps) to multiple blockchain wallet solutions. It works by generating a URI that can be scanned as a QR code or pasted into a browser or desktop wallet to establish a secure connection.

If you are providing your own wallet solution, through the Venly Wallet-API, It may be useful to also look into integrating WalletConnect to expand the reach and possibilities of your wallet.

🚧
It is important to note that there is a big difference with a WalletConnect integration, based on the Venly wallet solution you are using:

Wallet-Widget: The Wallet-Widget is a frontend integration, where Venly authenticates (and therefore knows) the actual end-users. For these end-users, Venly is in charge of offering a WalletConnect integration. Nothing has to be done at your end. Every end-user you onboard through the Wallet-Widget, will have the ability to connect its Venly wallet with WalletConnect. Widget End-users are therefore able to use any application (dApp) that supports WalletConnect.
Wallet-API: The Wallet-API solution is a purely backend-to-backend integration. Venly does not know the actual end-user of the wallets that are created through the Wallet-API. Since WalletConnect is a "client-side" integration (the end user has to scan a QR code and connect its wallet), you have to provide your own integration inside your own (client-side) app. A brief explanation is added in the next section.

Integrating the Wallet-API with WalletConnect

Setup

An integration with WalletConnect is done through a Client-side integration. Any dApp will communicate, through the WalletConnect protocol, with your client-side application. This is done through a set of relayers that facilitate the connection between your app and the dApp.

The way it works is that when a user wants to interact with a dApp, the dApp generates a unique URI that contains a cryptographic key. The user then scans or copies the QR code using your wallet application, which establishes a secure, encrypted connection between your wallet app and the dApp (through the relay servers). The dApp can then send transaction requests to your wallet app, which the user can review and approve within your app.

Web3Wallet-SDK

There are two SDKs that WalletConnect provides:

Web3Modal: this is the SDK that a dApp needs to implement if they want to integrate with multiple wallet solutions at the same time.
Web3Wallet: this is the SDK that a Wallet-solution (your app) needs to implement when you want to provide WalletConnect access to your end users.

In order to expose your wallet solution in WalletConnect, you will have to integrate the Web3Wallet-SDK in your client-side application. This library will take care of:

Setting up the connection between a dApp and your app using the relay servers
Accepting sign transaction requests
Accepting message signature requests

To actually sign and perform a blockchain transaction, using the Venly Wallet-API, you will have to follow the following flow:

Your client-side app receives a transaction request from a dApp through WalletConnect
Your client-side app sends this request to your backend. This call is secured with any kind of user-authentication mechanism that you have.
Your backend translates the WalletConnect transaction request to the relevant Wallet-API request (e.g. POST /api/transactions/execute )
- You'll need to know the wallet-id, linked to the actual end-user
- You'll need the PIN code of that wallet
The response of the Venly-API is returned (and translated) to your client-side app.