# Basic informations

### Getting the plugin

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

If you use npm or yarn, run:

{% hint style="info" %}
<https://www.npmjs.com/package/@metapro/connector>
{% endhint %}

{% tabs %}
{% tab title="npm" %}
npm install @metapro/connector
{% endtab %}

{% tab title="yarn" %}
yarn add @metapro/connector
{% endtab %}
{% endtabs %}

### Provider and packages requirements

{% hint style="warning" %}
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"**
{% endhint %}

{% hint style="info" %}
Our plugin uses [Material UI](https://mui.com/material-ui/getting-started/installation/), to properly display our plugin you need to install desired dependencies

```json
"@emotion/react"
"@emotion/styled"
"@mui/material"
```

{% endhint %}

{% tabs %}
{% tab title="npm" %}
npm install @mui/material @emotion/react @emotion/styled
{% endtab %}

{% tab title="yarn" %}
yarn add @mui/material @emotion/react @emotion/styled
{% endtab %}
{% endtabs %}

<mark style="color:purple;">-----------------------------------------------------------------------------------------------------</mark>

{% hint style="warning" %}
For now, we are supporting BSC testnet and mainnet we'll extend our plugin for other chains in close future
{% endhint %}

<mark style="color:purple;">-----------------------------------------------------------------------------------------------------</mark>

### Metapro Hook explained ( <mark style="color:purple;">useMetapro()</mark> )&#x20;

{% hint style="info" %} <mark style="color:purple;">**`useMetapro()`**</mark>

A hook that returns an object with the following properties:

```typescriptreact
 - 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:
```

{% endhint %}

<details>

<summary>useAccount </summary>

Hook for accessing wallet address data.

</details>

<details>

<summary>useChainId</summary>

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

</details>

<details>

<summary>useENSName</summary>

Hook for fetching ENS name for address.

</details>

<details>

<summary>useIsActive</summary>

Hook for check if wallet address is connected and active.

</details>

<details>

<summary>useProvider</summary>

Hook for accessing Client ethers Provider.

</details>

### After setup our plugin

{% hint style="info" %}
A detailed guide about our **metapro** wallet [Download & set up](/metapro-one/download-and-set-up.md)
{% endhint %}

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

* After using a <mark style="color:purple;">**{login}**</mark> from [**useMetapro()**](#basic-implementation-of-our-plugin) hook you should see a modal popup

![](/files/xjQ0VAKQOCkyJAkZo2sD)

* Follow [Download & set up](/metapro-one/download-and-set-up.md) to setup our metaprowallet

![](/files/0d6WLtxNtZwW8b9pe2qH)

* Click here to scan QR code

![](/files/17Qz3JFTz05de8r2rTdZ)

* Allow your application to connect with the plugin

## Your plugin is successfully connected!  🎉

<mark style="color:purple;">-----------------------------------------------------------------------------------------------------</mark>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.metaproprotocol.com/wallet-connector/basic-informations.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
