Basic informations

This document describes a basic way of integrating metapro plugin into your web app.

Getting the plugin

First, you'll need to add our plugin to your project.

If you use npm or yarn, run:

npm install @metapro/connector

Provider and packages requirements

The provider has his own react version so these versions must at least be compatible

to avoid failure use at least react version "18.2.0"

Our plugin uses Material UI, to properly display our plugin you need to install desired dependencies


npm install @mui/material @emotion/react @emotion/styled


For now, we are supporting BSC testnet and mainnet we'll extend our plugin for other chains in close future


Metapro Hook explained ( useMetapro() )


A hook that returns an object with the following properties:

 - login: a function that will open the Metapro login modal.
 - logout: a function that will log out the user from Metapro.
 - metaproHooks: an object with the following properties:

Hook for accessing wallet address data.


Hook for accessing network data, such as current connected chain.


Hook for fetching ENS name for address.


Hook for check if wallet address is connected and active.


Hook for accessing Client ethers Provider.

After setup our plugin

A detailed guide about our metapro wallet Download & set up

When the plugin is already implemented in your application just a couple of simple steps to get started :

  • After using a {login} from useMetapro() hook you should see a modal popup

  • Click here to scan QR code

  • Allow your application to connect with the plugin

Your plugin is successfully connected!  🎉


Last updated