@kiroboio/web3-react-native-safe-transfer

Example

Docs

Install

To install react-native versions of node packages needed for web3 and @kiroboio/safe-transfer-lib libs use rn-nodeify

rn-nodeify

rn-nodeify for web3 tutorial

npm i -D rn-nodeify
npm i --save react-native-crypto react-native-randombytes react-native-event-listeners react-native-securerandom react-native-sync-localstorage @kiroboio/web3-react-native-safe-transfer
npx react-native link react-native-randombytes

npm i --save-dev rn-nodeify@latest
./node_modules/.bin/rn-nodeify --install
npm i --save node-libs-browser
npm i base-64

IOS

cd ios/ && pod install && cd ..

XCode > Pods > react-native-udp > Build Phases > remove the GCDAsyncSocket.m reference

Modify metro.config

// metro.config.js

const extraNodeModules = require('node-libs-browser');
module.exports = {
  resolver: {
    extraNodeModules,
  },
  transformer: {
    getTransformOptions: async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: false,
    },
   }),
  },
};

Modify shim

// shim.js

import { decode, encode } from 'base-64';
import localStorage from 'react-native-sync-localstorage';
import { EventRegister } from 'react-native-event-listeners'

const initialize = async () => {

  global.addEventListener = EventRegister.addEventListener;
  global.removeEventListener = EventRegister.removeEventListener;
  global.navigator.userAgent = 'ReactNative'

  await localStorage.getAllFromLocalStorage();
  global.localStorage = localStorage;
  global.sessionStorage = {
    _data: {},
    setItem: function (id, val) {
      return (this._data[id] = String(val));
    },
    getItem: function (id) {
      return Object.prototype.hasOwnProperty.call(this._data, 'id')
        ? this._data[id]
        : undefined;
    },
    removeItem: function (id) {
      return delete this._data[id];
    },
    clear: function () {
      return (this._data = {});
    },
  };

  global.DOMException = require('domexception');
}


if (!global.btoa) global.btoa = encode;
if (!global.atob) global.atob = decode;
if (typeof __dirname === 'undefined') global.__dirname = '/';
if (typeof __filename === 'undefined') global.__filename = '';
if (typeof process === 'undefined') {
  global.process = require('process');
} else {
  const bProcess = require('process');
  for (var p in bProcess) {
    if (!(p in process)) {
      process[p] = bProcess[p];
    }
  }
}
process.browser = false;
if (typeof Buffer === 'undefined') global.Buffer = require('buffer').Buffer;
if (typeof location === 'undefined')
  global.location = { port: 80, protocol: 'https:' };
const isDev = typeof __DEV__ === 'boolean' && __DEV__;
process.env['NODE_ENV'] = isDev ? 'development' : 'production';
if (typeof localStorage !== 'undefined') {
  localStorage.debug = isDev ? '*' : '';
}

require('crypto');
initialize();

import shim in your App root component

import './shim'

You can use @kiroboio/web3-react-native-safe-transfer library now

docs