-
-
Notifications
You must be signed in to change notification settings - Fork 4.9k
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
Mobile: Migrate to react-native-paper
#7477
Mobile: Migrate to react-native-paper
#7477
Conversation
…dev' into pr/react-native-paper-action-buttons
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks like a good change, but aren't we adding a huge dependency with React Native Paper.
That being said, over the medium term it would make sense to start using an existing UI lib to make our life easier. How good is React Native Paper compared to other popular alternatives?
packages/app-mobile/package.json
Outdated
"react-native-paper": "^5.0.2", | ||
"react-native-popup-menu": "0.16.1", | ||
"react-native-quick-actions": "0.3.13", | ||
"react-native-rsa-native": "2.0.5", | ||
"react-native-safe-area-context": "^4.4.1", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Dependencies must be pinned (no ^
)
PRODUCT_BUNDLE_IDENTIFIER = net.cozic.joplin.ShareExtension; | ||
PRODUCT_BUNDLE_IDENTIFIER = net.personalizedrefrigerator.joplin.ShareExtension; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That should probably not be changed
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Oops! Sorry! That was for my own custom build!!! I'll fix that!!!
GCC_C_LANGUAGE_STANDARD = gnu11; | ||
INFOPLIST_FILE = ShareExtension/Info.plist; | ||
IPHONEOS_DEPLOYMENT_TARGET = 11.0; | ||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @executable_path/../../Frameworks"; | ||
MARKETING_VERSION = 12.10.0; | ||
MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE; | ||
MTL_FAST_MATH = YES; | ||
PRODUCT_BUNDLE_IDENTIFIER = net.cozic.joplin.ShareExtension; | ||
PRODUCT_BUNDLE_IDENTIFIER = net.personalizedrefrigerator.joplin.ShareExtension; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same, shouldn't be changed
@@ -265,12 +265,12 @@ | |||
ORGANIZATIONNAME = joplinapp.org; | |||
TargetAttributes = { | |||
13B07F861A680F5B00A75B9A = { | |||
DevelopmentTeam = A9BXAFS6CT; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In fact I suspect all the changes in this file should be undone, because it looks like it's changes from your profile
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thank you for catching this! I've reverted changes to the ios/
directory and re-run npx pod-install
.
react-native-paper
react-native-paper
We are adding a huge dependency. According to I looked at two other popular alternatives. Neither have floating action button groups.
We could also try forking I'm also looking at component libraries for sidebars (navigation drawers) as well. Our app's current sidebar library I did notice some accessibility issues in the React Native Paper demo app with their sidebar — the sidebar can't be closed with a screen reader. I think we can work around this, though.
I changed the iOS project team to allow running the app on my device, then ran |
react-native-paper
react-native-paper
When I try to run this pull request, I'm getting this error:
Have you ever had this issue and do you know how to fix it? I wanted to try RN Paper to develop the Profile Switcher UI, as a way to assess if we can use it as our main UI lib. |
If you're building from this branch, re-run |
Yes that was it, thank you. I thought pod installation would happen during |
Ok I've created the profile switcher using react-native-paper and it seems good enough for our use. Could you fix the conflicts please? Then I'll merge it, and then merge mine since it's based on this PR. |
I won't be able to fix the conflicts for a few hours — I need access to a Mac to resolve conflicts in Podfile.lock. Expect conflicts to be resolved later tonight. Edit: Done. |
The old action button indeed seems incompatible with RN-0.69 |
Summary
react-native-action-button
is no longer maintained and is blocking upgrade to the most recent version of React Native (see the relevant forum post).react-native-paper
provides aFAB.Group
component that looks and acts very similar toreact-native-action-button
.Screenshots
Testing plan
Notes
react-native-paper
provides its own sidebar. Switching to that might fix this issue (and current sidebar-related accessibility issues).