/fcl-discovery

Primary LanguageJavaScriptApache License 2.0Apache-2.0

Discovery

When building an dapp on Flow using @onflow/fcl, Discovery eliminates the need for dapp developers to write code to integrate their user's preferred wallet into their application. Instead, @onflow/fcl and this repo uses a secure discovery protocol that wallets can implement to connect to @onflow/fcl. The end result is dapps using @onflow/fcl automatically integrate all compatible wallets without their developers needing to write any custom code!

To read more about consuming/using this repo via FCL, visit the Discovery docs.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev

Discovery Routes

Environment Example
Mainnet http://localhost:3000/authn
Testnet http://localhost:3000/testnet/authn

Discovery API Endpoints

Environment Example
Mainnet http://localhost:3000/api/authn
Testnet http://localhost:3000/api/testnet/authn

Configuration (For FCL)

These are examples on how to set configuration from FCL in your application.

Include Opt In Wallets

Starting in FCL v0.0.78-alpha.10

To include opt-in wallets from FCL:

import * as fcl from "@onflow/fcl"

fcl.config({
  "discovery.wallet": "https://fcl-discovery.onflow.org/testnet/authn",
  "discovery.authn.endpoint": "https://fcl-discovery.onflow.org/api/testnet/authn",
  "discovery.authn.include": ["0x123"] // Service account address
})

Opt-In Wallet Addresses on Testnet and Mainnet

Service Testnet Mainnet
Dapper Wallet 0x82ec283f88a62e65 0xead892083b3e2c6c
Ledger 0x9d2e44203cb13051 0xe5cd26afebe62781

For more information on including opt-in wallets, see the FCL docs.

App Title & Icon

Starting in FCL v0.0.79-alpha.4

To set an app title and icon from FCL:

import * as fcl from "@onflow/fcl"

fcl.config({
  "app.detail.title": "Test App",
  "app.detail.icon": "https://placekitten.com/g/200/200"
})

Adding a Wallet to Discovery

Flow compatible wallets wanting to add their wallets to Discovery can do so by creating a PR with the following:

  • Add your wallet's service information to the services data file
  • Please provide any metadata related to your service if required (see metadata docs)
  • Provide a demo of your wallet that can be tested and is connected to Testnet

For more information/examples on how to build a Flow compatible wallet, check out the following links:

Documentation

To learn more about the repo, take a look at the following resources:

  • Discovery - Documentation for using Discovery with FCL.
  • FCL - Learn more about Flow's FCL
  • Next.js Documentation - This app is built with Next. Learn about Next.js features and API.