Ethereum React Native Boilerplate Questions

Getting this warning straight out of the box (havenā€™t touched the code yet):

src/components/Contract/Contract.jsx Line 90:34: Unsafe usage of optional chaining. If it short-circuits with 'undefined' the evaluation will throw TypeError no-unsafe-optional-chaining

Does this have something to do with dependencies or webpack? Sorry, Iā€™m new to this - been trying to get a react app up and running with Moralis for days and no luck.

Having problems with React Native since updating my gradle build getting error below
Build file ā€˜C:\Users\marc_\Documents\ethereum-react-native-boilerplate\node_modules\react-native-os\android\build.gradleā€™ line: 47

any updates on updating modules?

You template fking sucks, it waste me a lot of time , fk you moralis

Today I cloned the project and installed it on my ios device. The app installed correctly but when I try to click on wallet login, i get an error as below [Simulator Screen Shot - iPhone 13 - 2022-03-31 at 12.40.39]. Am not using expo, only React native

Hello dear Moralis team.

Iā€™ve been trying to get the Ethereum React Native BoilerPlater app to work for over a week, but I canā€™t get past the wallet connect button that displays ā€œAuthentication error: WalletConnect is not a constructor (evaluating ā€˜new Connector(options)ā€™)ā€ when I click it. Could someone please help me. Iā€™m working on an ubuntu virtual machine with Android Studio and Iā€™m running the application on a real Android phone. Thanks in advance!

I got above issue when i forked latest code from the boilerplate.

Do one thing check for the second last update of the boilerplate repo and then make some changes in one file : Provider.tsx

replace by these
// import Moralis from ā€˜moralis/react-nativeā€™;

const Moralis = require(ā€˜moralis/react-native.jsā€™);

// import AsyncStorage from ā€˜@react-native-async-storage/async-storageā€™;

const AsyncStorage = require(ā€˜react-nativeā€™).AsyncStorage;

finally fixed.

Thanks

Hello, could you give us the SHA of the commit you are talking about, I tried with the 5 last commits and still blocked on this error. Thanks

Hello again, for people who has this error ā€œAuthentication error: WalletConnect is not a constructor (evaluating ā€˜new Connector(options)ā€™)ā€ you can:

git clone -n <the_repository>

Then:

git checkout d4c85bf5cd796fe0b78dda4cd0f350742df6db5c

Which will give you the version of the boilerplate from 1 Feb. In this version I donā€™t have this error anymore.

Hope it will help you until itā€™s fix on last version.

1 Like

ok great.
thanks for mentioning exact commit.

Hey guys just wanted to ask whatā€™s the best way to swap the sign-in method from the default web3 auth to the web3auth.io method as outlined here https://docs.moralis.io/moralis-dapp/users/crypto-login/web3auth

When I try make any changes to the components/Account folder in the eth-boilerplate template, everything breaks and I get a blank page.

Does anyone have any tips on how to achieve this?

Hi, has anyone had experience in integrating moralis on an existing react-native project?

Hi all, I am new to Moralis but have some coding experiences on react native, I cloned the
ethereum-react-native-boilerplate, the app installs to the devices but I am not able to reach to the login, screen when I launch the app I get some errors
AppContainer@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:74985:78
[Tue Apr 19 2022 13:03:55.732] ERROR TypeError: Moralis.onAccountChanged is not a function. (In ā€˜Moralis.onAccountChanged(function (address) {
setWalletAddress(address[0]);
})ā€™, ā€˜Moralis.onAccountChangedā€™ is undefined)

This error is located at:
in MoralisDappProvider (at Providers.tsx:63)
in MoralisProvider (at Providers.tsx:59)
in WalletConnectProvider (at Providers.tsx:58)
in Providers (at AppWithProviders.tsx:6)
in _default (at renderApplication.js:45)
in RCTView (at View.js:34)
in View (at AppContainer.js:106)
in RCTView (at View.js:34)
in View (at AppContainer.js:132)
in AppContainer (at renderApplication.js:39)

1 Like

Changing wallet services displayed in modal

Hello, Iā€™m currently running the old boilerplate. What I find interesting is how in main/frontend/Providers.tsx (code snippet bellow) the qrcodeModalOptions are set to a certain array of wallets, but then the app proceeds to show every single wallet.

const walletConnectOptions: WalletConnectProviderProps = {
  storageOptions: {
    // @ts-ignore
    asyncStorage: AsyncStorage,
  },
  qrcodeModalOptions: {
    mobileLinks: [
    'rainbow',
      'metamask',
      'argent',
     'trust',
      'imtoken',
      'pillar',
    ],
  },
  // Uncomment to show a QR-code to connect a wallet
  //renderQrcodeModal: Qrcode,
};

Is this behaviour also present in the new version or does it work the same way? If so, how could one achieve actually only displaying certain wallets to pick from in the modal? What comes to mind would just be filtering the walletServices in main/frontend/WalletConnect/providers/WalletConnectProvider.tsx or in general just filtering them in any of the files. This does seem like a simple solution to me but is there an actual good correct way of doing this?

Thank you in advance!

HI!. For the React-Native Boilerplate is working super fine to me. Anyway. When I press on button login with crypto I want to go to metamask app direct rather than popup with all of the wallet services.

How to do it?

It needs happen through walletconnect service only. I dont think there is a direct way to connect with metamask.

Website launched today with the ETH boilerplate and users were experiencing this:
image
I do not speak the language but from my understanding, google chrome had tried to install something called the Ethereum Boilerplate and i am unsure how this could have happened. I cannot find it anywhere in the code, and this happened to two different users.
What is this?

Is Moralis react-native wallet app doesnā€™t work on the android version greater than 10? Is it so, As when i build the app on the android phone that is below or equal to android version 10 so the wallet does popup, But what if i build the application on the android build that have a version greater than 10 so it wont open the metamask on the app although it redirects me to a webpage stating that the wallet connect not found.

Hey man, Can you tell me that is your boilerplate code working for android device having a android version greater than 10.

Hey guys
Our RN boilerplate is in alpha stage and not production ready currently (we write that in docs)

therefore we canā€™t assist currently with it, maybe someone in the community can help here but unfortunately our focus right now is not on RN

https://docs.moralis.io/moralis-dapp/connect-the-sdk/boilerplate-projects#web3-react-native-boilerplate-alpha