Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: ios changes to make app work with new react native version #166

Merged

Conversation

pedroferreira1
Copy link
Member

Summary

I will list here every problem I found and the solutions:

Build in new M1 macOS

I was having many different errors that were fixed when I executed the pod install with the CPU prefix.

arch -x86_64 pod install

Icon not showing

The icons were not showing in the menubar in the app.

Fix: Add tabbar.tff to Build Phases > Copy Bundle Resources.

Camera error when opening QRCode reader

I was getting a permission error when trying to access the camera.

Fix: Install new package: npm install react-native-permissions --save

Add the lines below to ios/Podfile

  # The react-native-qrcode-scanner requires installing react-native-permissions now
  # https://github.com/moaazsidat/react-native-qrcode-scanner#react-native-permissions
  # The two lines below are required by the installation of react-native-permissions
  # https://github.com/zoontek/react-native-permissions#ios
  permissions_path = '../node_modules/react-native-permissions/ios'
  pod 'Permission-Camera', :path => "#{permissions_path}/Camera"

TabView with a blank space in the bottom (ReceiveScreen):

The same issue described here: satya164/react-native-tab-view#1342

Fix: Downgrade react-native-pager-view to v5.4.11. Before was using v5.4.15.

Splash screen

There was no splash screen, only the react-native default one.

Fix: copy the previous launch screen file we had in the project and substitute the current launch screen.

Token List

This list was with the wrong padding for some new iPhone screen models.

Fix: consider the correct padding for new iPhone models. See changes in this file src/components/TokenSelect.js.

Keyboard opened after creating a token

The keyboard from the token name screen opens after the token creation message, i.e. when we open the Token detail screen.

This was the only issue that I didn't fix, the reason is detailed below.

I was receiving a lot of deprecation errors when using the app: "ERROR currentlyFocusedField is deprecated and will be removed in a future release. Use currentlyFocusedInput"

I noticed that this error was being generated by react-navigation package. The second step of the upgrade dependencies project is to upgrade this package. I manually changed the files inside this package that had the deprecated code node_modules/@react-navigation/native/dist/createKeyboardAwareNavigator.js and the bug stopped happening.

I feel we should leave this issue for the next upgrade step because naturally, we will need to upgrade this package. The only downside of this is that any user that creates a token will see the keyboard opening on a screen without input. This might be a good reason for us to focus in this next step of upgrade soon.

Acceptance Criteria

  • The app should work as before with the new react native version.

Security Checklist

  • Make sure you do not include new dependencies in the project unless strictly necessary and do not include dev-dependencies as production ones. More dependencies increase the possibility of one of them being hijacked and affecting us.

@andreabadesso andreabadesso mentioned this pull request May 12, 2022
1 task
@pedroferreira1 pedroferreira1 merged commit 0a227a0 into feat/upgrade-react-native May 17, 2022
@pedroferreira1 pedroferreira1 deleted the feat/upgrade-react-native-ios branch May 17, 2022 13:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants