React Native EVM

The @ramper/react-native-evm package works in conjunction with the @ramper/react-native-core package. This package works with ethers.js and is responsible for handling all EVM-related peculiarities in order to interact with an Ethereum-based wallet.

npm

$ npm install @ramper/react-native-evm react-native-get-random-values

yarn

$ yarn add @ramper/react-native-evm react-native-get-random-values

Step 1

$ cd ios && pod install

Step 2

You will need to register react-native-get-random-values and @ethersproject/shims in the entry file of your application, such as index.js:

// Import the crypto getRandomValues shim (**BEFORE** the shims)
import 'react-native-get-random-values';

// Import the ethers shims (**BEFORE** ethers)
import '@ethersproject/shims';

Usage

import { ethers } from 'ethers';
import { EtherTx } from '@ramper/react-native-evm';

Transactions

import { Transactions } from '@ramper/react-native-core';

Before you can do transactions you need to create an ethers provider

const provider = ethers.getDefaultProvider(
  `https://polygon-mumbai.g.alchemy.com/v2/${yourApiKey}`
);

Sign Transaction

const value = ethers.utils.parseEther('0.0000001');
try {
  const transaction = await Transactions.signTransaction({
    serializedTx: await EtherTx.serializeTransactionRequest(
      {
        from: 'fromAddress',
        to: 'toAddress',
        value,
      },
      provider
    ),
    network: SUPPORTED_ETHEREUM_NETWORKS.MATICMUM,
    theme: 'light',
  });
  const deserializedTransaction = EtherTx.deserializeTransaction(transaction);=
  
  // broadcast the Signed Transaction to the network:
  const transaction = await provider.sendTransaction(
    deserializedTransaction.transaction
  );
} catch (error) {
  // handle error
}

Sign Typed Data

try {
  const signTypedDataResponse = await Transactions.signTypedData({
    serializedTx: await EtherTx.serializeSignTypedDataRequest(
      {
        name: 'Ether Mail',
        version: '1',
        chainId: 1,
        verifyingContract: '0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC',
      },
      {
        Person: [
          { name: 'name', type: 'string' },
          { name: 'wallet', type: 'address' },
        ],
        Mail: [
          { name: 'from', type: 'Person' },
          { name: 'to', type: 'Person' },
          { name: 'contents', type: 'string' },
        ],
      },
      {
        from: {
          name: 'Cow',
          wallet: '0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826',
        },
        to: {
          name: 'Bob',
          wallet: '0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB',
        },
        contents: 'Hello, Bob!',
      }
    ),
    network: SUPPORTED_ETHEREUM_NETWORKS.MATICMUM,
  });
  const deserializedTypedData = EtherTx.deserializeTransaction(signResponse);
  // handle response
} catch (error) {
  // handle error
}

Sign Message

try {
  const signMessageResponse = await Transactions.signMessage({
    serializedTx: EtherTx.serializeMessage({
      message: 'Hello World',
      method: 'eth_sign',
    }),
    network: SUPPORTED_ETHEREUM_NETWORKS.MATICMUM,
    theme: 'light',
  });
  const deserializedRespone =
    EtherTx.deserializeTransaction(signMessageResponse);
  // handle response
} catch (error) {
  // handle error
}

Personal Sign

try {
  const signPersonalMessageResponse = await Transactions.signMessage({
    serializedTx: EtherTx.serializeMessage({
      message: 'My email is john@doe.com - Thu, 22 Sep 2022 22:45:02 GMT',
      method: 'personal_sign',
    }),
    network: SUPPORTED_ETHEREUM_NETWORKS.MATICMUM,
    theme: 'light',
  });
  const deserializedResponse = EtherTx.deserializeTransaction(
    signPersonalMessageResponse
  );
  // handle response
} catch (error) {
  // handle error
}

Deserialize Transaction

const deserializedTx = EtherTx.deserializeTransaction(serializedTx);

Method Signature:

type DeserializedTx = {
   transaction: string // Signed Transaction
   msgs: any[]
}

Last updated