Search

How To Add Wallet Connect In FCL

Daniela
Daniela
  • Updated


To add WalletConnect support in FCL (Flow Client Library), you need to follow these steps:

1. Install the required packages. You need to have:

  • fcl version > = 1.3.0 
  • fcl-wc version > = 1.0.0

You can install these using npm:

npm install @onflow/fcl @onflow/fcl-wc

2. Obtain a WalletConnect projectID by registering at the WalletConnect Cloud Registry. 

3. Initialize WalletConnect SignClient and FclWcServicePlugin with configuration options.

4. Add FclWcServicePlugin to FCL Plugin Registry. You can do this by injecting FclWcServicePlugin via fcl.pluginRegistry.add(FclWcServicePlugin).

Here is a sample code snippet:

import * as fcl from "@onflow/fcl"
import { init } from "fcl-wc"

const { FclWcServicePlugin, client } = await init({
projectId: WC_PROJECT_ID, // required
metadata: WC_APP_METADATA, // optional
includeBaseWC: false, // optional, default: false
wallets: [], // optional, default: []
wcRequestHook: (wcRequestData) => { // optional,default: null
handlePendingRequest(data)
},
pairingModalOverride: (uri, rejectPairingRequest) => { // optional,default: null
handlePendingPairingRequest(data)
}
})

fcl.pluginRegistry.add(FclWcServicePlugin)

Please note that you need to replace WC_PROJECT_ID and WC_APP_METADATA with your actual WalletConnect project ID and metadata.