# EVM Dapp Integration

Welcome to Ramper Wallet Extension Developer Guide. This documentation contains guides for developers to get started developing Ramper Wallet on EVM networks

## Connect <a href="#connect" id="connect"></a>

### The easiest way to connect to Ramper Wallet <a href="#the-easiest-way-to-connect-to-ramper-wallet" id="the-easiest-way-to-connect-to-ramper-wallet"></a>

Check if the provider is `window.ramper2`, if not, please replace it with the exclusive Ramper Wallet provider `window.ramper2`.

For example, see below:

```
function getProvider() {
  const provider = window.ramper2;
  if (!provider) {
    return window.open('https://https://chrome.google.com/webstore/detail/ramper-wallet/nbdhibgjnjpnkajaghbffjbkcgljfgdi?hl=vi');
  }
  return provider;
}
```

**ChainID:**

| Hex  | Decimal | Network                   |
| ---- | ------- | ------------------------- |
| 0x1  | 1       | Ethereum (Mainnet)        |
| 0x58 | 88      | TomoChain (Mainnet)       |
| 0x38 | 56      | BNB Smart Chain (Mainnet) |
| 0x89 | 137     | Polygon (Mainnet)         |

Use `eth_chainId` or `net_version` to return the current network/chain ID

### To detect Ramper Wallet Extension <a href="#to-detect-ramper-wallet-extension" id="to-detect-ramper-wallet-extension"></a>

&#x20;

```
if(window.ramper2){ console.log('Ramper Extension is installed!'); }
```

### To connect Ramper Wallet Extension <a href="#to-connect-ramper-wallet-extension" id="to-connect-ramper-wallet-extension"></a>

To connect Ramper Extension means to access the user's \[blockchain - like Ethereum] account(s).

***

#### Access a user's accounts <a href="#access-a-users-accounts" id="access-a-users-accounts"></a>

We recommend providing a button to allow users to connect Ramper Wallet to your dapp. Selecting this button should call `eth_requestAccounts` to access the user's accounts.

```
//Alias for connection
window.ramper2.provider.request({method: 'eth_requestAccounts'});​
```

#### Handle accounts[​](https://docs.metamask.io/wallet/how-to/connect/access-accounts/#handle-accounts) <a href="#handle-accounts" id="handle-accounts"></a>

Use the `eth_accounts` RPC method to handle user accounts. Listen to the `accountsChanged` provider event to be notified when the user changes accounts.

```
// Connect & get accounts
window.ramper2.provider.request({method: 'eth_accounts'});
```

#### Switch chain <a href="#switch-chain" id="switch-chain"></a>

Requests that the Ramper Extension switches its active Ethereum chain.

```
window.ramper2.provider.request({
  "method": "wallet_switchEthereumChain",
  "params": [
    {
      "chainId": "0x58"
    }
  ]
});
```

&#x20;

### To disconnect Ramper Wallet Extension  <a href="#to-disconnect-ramper-wallet-extension" id="to-disconnect-ramper-wallet-extension"></a>

To disconnect Ramper Extension, please use:

```
window.ramper2.provider.disconnect()
```

## To experience functions <a href="#to-experience-functions" id="to-experience-functions"></a>

Once your account is connected, let's start experiencing more functions.‌

### Account <a href="#account" id="account"></a>

#### How to get Current Account <a href="#how-to-get-current-account" id="how-to-get-current-account"></a>

return `Promise<Array[String]>`

* If the wallet can not be found, return `[]` instead of `throw Error`

```
window.ramper2.provider.request({ method: 'eth_accounts' }).then(accounts => {
  if (accounts[0]) {
    // Do something with accounts
  } else {
    // Wallet not found
  }
})
```

### Sign Transaction <a href="#sign-transaction" id="sign-transaction"></a>

{% hint style="info" %}
**Important**

`eth_signTypedData_v1`, and `eth_signTypedData_v3` are deprecated. We highly recommend users use `eth_signTypedData_v4` or `personal_sign`.
{% endhint %}

#### Personal\_sign <a href="#personal_sign" id="personal_sign"></a>

`personal_sign` provides a simple means to request signatures that are human-readable and don't require efficient processing on-chain. It's commonly used for signature challenges authenticated on a web server.

Ramper Wallet implements both `personal_sign` and `eth_sign`. You might need to check what method your supported signers use for a given implementation.

```
method: 'personal_sign', params: [msg, from],
```

#### eth\_signTypedData\_v4 <a href="#eth_signtypeddata_v4" id="eth_signtypeddata_v4"></a>

`eth_signTypedData_v4` offers highly legible signatures that can be processed efficiently on-chain. Adheres to the [EIP-712 ](https://eips.ethereum.org/EIPS/eip-712)standard, enabling users to sign typed structured data that can be confirmed on-chain.

```
const msgParams = JSON.stringify({
    domain: {
      chainId: 0x,
      name: 'Ether Mail',
      verifyingContract: '0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC',
      version: '1',
    },

    message: {
      contents: 'Hello, Bob!',
      attachedMoneyInEth: 4.2,
      from: {
        name: 'Cow',
        wallets: [
          '0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826',
          '0xDeaDbeefdEAdbeefdEadbEEFdeadbeEFdEaDbeeF',
        ],
      },
      to: [
        {
          name: 'Bob',
          wallets: [
            '0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB',
            '0xB0BdaBea57B0BDABeA57b0bdABEA57b0BDabEa57',
            '0xB0B0b0b0b0b0B000000000000000000000000000',
          ],
        },
      ],
    },
    
    primaryType: 'Mail',
    types: {
      EIP712Domain: [
        { name: 'name', type: 'string' },
        { name: 'version', type: 'string' },
        { name: 'chainId', type: 'uint256' },
        { name: 'verifyingContract', type: 'address' },
      ],
      Group: [
        { name: 'name', type: 'string' },
        { name: 'members', type: 'Person[]' },
      ],
      Mail: [
        { name: 'from', type: 'Person' },
        { name: 'to', type: 'Person[]' },
        { name: 'contents', type: 'string' },
      ],
      Person: [
        { name: 'name', type: 'string' },
        { name: 'wallets', type: 'address[]' },
      ],
    },
  ;

```

**Note:**

`Gas limit​` : is an optional parameter, since Ramper Wallet automatically calculates a reasonable gas price.

`chainid`: The chain ID is derived from the user's current selected network at `window.ramper2.provider.net_version`.

#### personal\_ecRecover <a href="#personal_ecrecover" id="personal_ecrecover"></a>

`personal_ecRecover` returns the address associated with the private key that was used to calculate a signature.

`method: 'personal_ecRecover', params: [message, signature],`

&#x20;

### Transfer <a href="#transfer" id="transfer"></a>

This method requires that the user has granted permission to interact with their account first, so please make sure to call `eth_requestAccounts` or `wallet_requestPermissions` first.

#### eth\_sendTransaction <a href="#eth_sendtransaction" id="eth_sendtransaction"></a>

return `Promise<hash>`

```
window.ramper2.provider.request({
  method: 'eth_sendTransaction',
  params: [
    {
      from: 'string',
      to: 'string',
      gas: 'string',
      gasPrice: 'string',
      value: 'string',
      data: 'string',
      nonce: 'string'
    }
  ]
})
```

### Decrypt & Encrypt <a href="#decrypt-and-encrypt" id="decrypt-and-encrypt"></a>

#### eth\_decrypt <a href="#eth_decrypt" id="eth_decrypt"></a>

Requests that Ramper Wallet decrypt the specified encrypted message.

* The message must have been encrypted using the public encryption key of the specified Ethereum address.

return `Promise<string>`

```
window.ramper2.provider.request({
  method: 'eth_decrypt',
  params: [encryptedMessage, accounts[0]],
  })
   .then((decryptedMessage) =>
    console.log('The decrypted message is:', decryptedMessage)
  )
  .catch((error) => console.log(error.message));
})
```

#### eth\_getEncryptionPublicKey <a href="#eth_getencryptionpublickey" id="eth_getencryptionpublickey"></a>

Requests that the user share their public encryption key. Returns a public encryption key, or rejects if the user denies the request.

return `Promise<string>`- The public encryption key of the Ethereum account whose encryption key should be retrieved

```
let encryptionPublicKey
window.ramper2.provider.request({
  method: 'eth_getEncryptionPublicKey',
  params: [accounts[0]], // you must have access to the specified account
  })
  .then((result) => {
    encryptionPublicKey = result;
  })
  .catch((error) => {
    if (error.code === 4001) {
     
      // EIP-1193 userRejectedRequest error
      console.log("We can't encrypt anything without the key.");
    } else {
      console.error(error);
    }
  });
```

#### Encrypt <a href="#encrypt" id="encrypt"></a>

```
const ethUtil = require('ethereumjs-util');
const encryptedMessage = ethUtil.bufferToHex(

  Buffer.from(
    JSON.stringify(
      sigUtil.encrypt(
        {
          publicKey: encryptionPublicKey,
          data: 'hello world!,
          version: 'x25519-xsalsa20-poly1305',
        }
      )
    ),
    'utf8'
  )
);
```

#### List of events <a href="#list-of-events" id="list-of-events"></a>

Currently, we only support some action events from the wallet extension

```
window.ethereum.on('event_name', callback);

​//Example

window.ramper2.provider.on('close', () => window.location.reload());

window.ramper2.provider.on('accountsChanged', () => window.location.reload());
```

| Events          | Trigger                                          |
| --------------- | ------------------------------------------------ |
| accountsChanged | Receive when active account changed in Extension |
| chainChanged    | Receive when active chain changed in Extension   |

| Method               | Description           |
| -------------------- | --------------------- |
| on(event, callback)  | Add event listener    |
| off(event, callback) | Remove event listener |

<br>
