Skip to content

Upgrade RN templates to React Native 0.82.1#523

Merged
wmathurin merged 16 commits into
forcedotcom:devfrom
wmathurin:rn-upgrade-0.82
May 29, 2026
Merged

Upgrade RN templates to React Native 0.82.1#523
wmathurin merged 16 commits into
forcedotcom:devfrom
wmathurin:rn-upgrade-0.82

Conversation

@wmathurin
Copy link
Copy Markdown
Contributor

@wmathurin wmathurin commented May 28, 2026

Summary

  • Upgrade all 4 React Native templates to RN 0.82.1, React 19.1.1
  • Switch from @react-navigation/stack to @react-navigation/native-stack 7.16.0 (fixes InteractionManager 2-minute delay in RN 0.82)
  • Bump react-native-safe-area-context to 5.8.0
  • Upgrade Gradle wrapper to 9.3.1 (required by Android SDK dev)
  • Use native-stack statusBarColor/statusBarStyle/statusBarTranslucent screenOptions (replaces StatusBar component which conflicts with react-native-screens)
  • Set UIViewControllerBasedStatusBarAppearance = YES in all iOS Info.plists (required by react-native-screens)
  • Add dependencySubstitution rules in settings.gradle for composite build with local Android SDK
  • Fix missing key props in MobileSyncExplorer ContactCell
  • Update docs: native-stack references, version bumps

Pre-existing issues fixed (not caused by 0.82 upgrade)

These issues were likely introduced during the New Architecture migration and are unrelated to the 0.82 version bump:

  • MobileSyncExplorer: buttons unresponsive on iOSNavImgButton used Icon's internal TouchableHighlight which doesn't receive touches in native-stack's iOS header. Fixed by wrapping with TouchableOpacity.
  • MobileSyncExplorer: logout does nothingoauth.logout() was called without a callback. In bridgeless mode, the native side no longer auto-restarts the React surface after logout. Fixed by calling oauth.authenticate() after logout (same pattern as other templates).
  • MobileSyncExplorer: Save button not pinned to bottom — Moved outside ScrollView so it stays at the bottom of the screen.
  • MobileSyncExplorer: "key" prop warningreact-native-elements 3.4.3 ListItemBase renders separator views without keys internally. Suppressed via LogBox.ignoreLogs.

Before Merging

Test Plan

  • All 4 RN templates build on iOS
  • All 4 RN templates build on Android
  • ReactNativeTemplate: login + contacts on Android ✅ and iOS ✅
  • ReactNativeTypeScriptTemplate: login + contacts on Android ✅ and iOS ✅
  • ReactNativeDeferredTemplate: login + contacts on Android ✅ and iOS ✅
  • MobileSyncExplorerReactNative: login + contacts on Android ✅ and iOS ✅

wmathurin added 4 commits May 27, 2026 12:42
- react-native: 0.81.5 → 0.82.1
- react: 19.1.0 → 19.1.1
- @react-native/new-app-screen: 0.81.5 → 0.82.1
- Gradle wrapper: 8.14.3 → 9.0.0
- AGP remains at 8.12.0 (RN 0.82 gradle plugin still expects it)
- Switch from @react-navigation/stack to @react-navigation/native-stack
  (stack uses deprecated InteractionManager causing 2min render delay in 0.82)
- Bump @react-navigation/native: 7.1.10 → 7.2.5
- Bump react-native-safe-area-context: 5.5.2 → 5.8.0
Uses StatusBar component and statusBarTranslucent screenOption
to properly color the status bar and reduce excess header height
with native-stack navigator.
…mponent

The StatusBar component conflicts with react-native-screens which
requires UIViewControllerBasedStatusBarAppearance=YES. Use native-stack's
built-in statusBarColor/statusBarStyle/statusBarTranslucent screenOptions
which work natively on both platforms without the conflict.
@wmathurin wmathurin marked this pull request as draft May 28, 2026 17:36
@wmathurin
Copy link
Copy Markdown
Contributor Author

Hmm - the other RN templates still need some work...

wmathurin added 10 commits May 28, 2026 12:12
- Switch @react-navigation/stack to @react-navigation/native-stack in
  TypeScript, Deferred, and MobileSyncExplorer templates
- Add statusBarTranslucent/statusBarColor/statusBarStyle screenOptions
- Add dependencySubstitution rules to settings.gradle for composite build
- Bump Gradle wrapper to 9.3.1 (required by Android SDK dev branch)
- Point sdkDependencies to forcedotcom#dev
- NavImgButton: use TouchableOpacity instead of Icon's internal touch
  (native-stack iOS header doesn't forward touches to TouchableHighlight)
- Logout: call oauth.authenticate() after logout to restart login flow
  (bridgeless mode doesn't auto-restart React surface after logout)
- ContactCell: add key props to all ListItem children
…warning

- Move Save button outside ScrollView so it stays at bottom of screen
- Suppress react-native-elements ListItemBase key warning (library bug)
@wmathurin wmathurin marked this pull request as ready for review May 28, 2026 22:19
Copy link
Copy Markdown
Contributor

@JohnsonEricAtSalesforce JohnsonEricAtSalesforce left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍🏻

@wmathurin wmathurin merged commit a5b110e into forcedotcom:dev May 29, 2026
13 of 15 checks passed
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