feat: upgrade to react-native 0.85.0 with RNTA 5.3.2 (#732)

* feat: upgrade to react-native 0.85.0 with RNTA 5.3.2

* Update iOS pods for React Native 0.85

* Fix SafeAreaView crash on React Native 0.85

* Update CI Node version for React Native 0.85

* Shorten Windows Android CI build path

* Enable long paths for Windows Android CI

* Shorten Windows CMake object paths

* Use short RNTA path for Windows Android CI

---------

Co-authored-by: Melissa Vallee <melissa@appandflow.com>

Author: hurali97

.github/scripts/build-android.cmd

@@ -1,7 +1,9 @@
 @echo off
 setlocal
-rem subst the workspace to a short drive to avoid Windows MAX_PATH in
+rem subst the example app to a short drive to avoid Windows MAX_PATH in
 rem CMake-generated object file names from autolinked codegen.
-subst W: "%GITHUB_WORKSPACE%" || exit /b 1
-cd /D W:\example\android || exit /b 1
+subst W: "%GITHUB_WORKSPACE%\example" || exit /b 1
+robocopy W:\node_modules\react-native-test-app W:\r /MIR /NFL /NDL /NJH /NJS /NP
+if %ERRORLEVEL% GEQ 8 exit /b %ERRORLEVEL%
+cd /D W:\android || exit /b 1
 call gradlew.bat assembleDebug -PnewArchEnabled=%1

.github/workflows/android-release.yml

@@ -10,10 +10,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - uses: actions/setup-java@v2
         with:
           distribution: 'temurin'

.github/workflows/android.yml

@@ -28,10 +28,10 @@ jobs:
         shell: bash
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - uses: actions/setup-java@v2
         with:
           distribution: 'temurin'
@@ -62,10 +62,10 @@ jobs:
         shell: bash
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v1
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - uses: actions/setup-java@v2
         with:
           distribution: 'temurin'

.github/workflows/docs-check.yml

@@ -20,10 +20,10 @@ jobs:
       WORKING_DIRECTORY: docs
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - name: Install docs deps
         working-directory: ${{ env.WORKING_DIRECTORY }}
         run: yarn install

.github/workflows/ios.yml

@@ -20,10 +20,10 @@ jobs:
     runs-on: macos-latest
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - uses: ruby/setup-ruby@v1
         with:
           ruby-version: 3.2
@@ -44,10 +44,10 @@ jobs:
     runs-on: macos-latest
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v1
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - uses: ruby/setup-ruby@v1
         with:
           ruby-version: 3.2

.github/workflows/js.yml

@@ -7,10 +7,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
-      - name: Use Node.js 20.x
+      - name: Use Node.js 22.13.0
         uses: actions/setup-node@v4
         with:
-          node-version: 20.x
+          node-version: 22.13.0
       - name: Restore yarn workspaces
         id: yarn-cache
         uses: actions/cache@v3

common/cpp/react/renderer/components/safeareacontext/RNCSafeAreaViewShadowNode.cpp

@@ -99,30 +99,27 @@ void RNCSafeAreaViewShadowNode::adjustLayoutWithState() {
       stateData.insets.bottom,
       bottom.value().unwrapOrDefault(0)));
 
-  yoga::Style adjustedStyle = getConcreteProps().yogaStyle;
+  auto &currentStyle = yogaNode_.style();
   if (props.mode == RNCSafeAreaViewMode::Padding) {
-    adjustedStyle.setPadding(Edge::Top, top);
-    adjustedStyle.setPadding(Edge::Left, left);
-    adjustedStyle.setPadding(Edge::Right, right);
-    adjustedStyle.setPadding(Edge::Bottom, bottom);
-  } else {
-    adjustedStyle.setMargin(Edge::Top, top);
-    adjustedStyle.setMargin(Edge::Left, left);
-    adjustedStyle.setMargin(Edge::Right, right);
-    adjustedStyle.setMargin(Edge::Bottom, bottom);
-  }
-
-  auto currentStyle = yogaNode_.style();
-  if (adjustedStyle.padding(Edge::Top) != currentStyle.padding(Edge::Top) ||
-      adjustedStyle.padding(Edge::Left) != currentStyle.padding(Edge::Left) ||
-      adjustedStyle.padding(Edge::Right) != currentStyle.padding(Edge::Right) ||
-      adjustedStyle.padding(Edge::Bottom) !=
-          currentStyle.padding(Edge::Bottom) ||
-      adjustedStyle.margin(Edge::Top) != currentStyle.margin(Edge::Top) ||
-      adjustedStyle.margin(Edge::Left) != currentStyle.margin(Edge::Left) ||
-      adjustedStyle.margin(Edge::Right) != currentStyle.margin(Edge::Right) ||
-      adjustedStyle.margin(Edge::Bottom) != currentStyle.margin(Edge::Bottom)) {
-    yogaNode_.setStyle(adjustedStyle);
+    if (currentStyle.padding(Edge::Top) != top ||
+        currentStyle.padding(Edge::Left) != left ||
+        currentStyle.padding(Edge::Right) != right ||
+        currentStyle.padding(Edge::Bottom) != bottom) {
+      currentStyle.setPadding(Edge::Top, top);
+      currentStyle.setPadding(Edge::Left, left);
+      currentStyle.setPadding(Edge::Right, right);
+      currentStyle.setPadding(Edge::Bottom, bottom);
+      yogaNode_.setDirty(true);
+    }
+  } else if (
+      currentStyle.margin(Edge::Top) != top ||
+      currentStyle.margin(Edge::Left) != left ||
+      currentStyle.margin(Edge::Right) != right ||
+      currentStyle.margin(Edge::Bottom) != bottom) {
+    currentStyle.setMargin(Edge::Top, top);
+    currentStyle.setMargin(Edge::Left, left);
+    currentStyle.setMargin(Edge::Right, right);
+    currentStyle.setMargin(Edge::Bottom, bottom);
     yogaNode_.setDirty(true);
   }
 }

example/android/build.gradle

@@ -42,5 +42,5 @@ allprojects {
     }
 }
 
-rootProject.ext.set("react.compileSdkVersion", 35)
-rootProject.ext.set("react.targetSdkVersion", 35)
+rootProject.ext.set("react.compileSdkVersion", 36)
+rootProject.ext.set("react.targetSdkVersion", 36)

example/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.14.1-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-9.3.1-bin.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

example/android/settings.gradle

@@ -19,3 +19,11 @@ apply(from: {
     throw new GradleException("Could not find `react-native-test-app`");
 }())
 applyTestAppSettings(settings)
+
+if (System.getProperty("os.name").toLowerCase().contains("windows")) {
+    def shortTestAppAndroidDir = file("../r")
+    if (shortTestAppAndroidDir.exists()) {
+        project(":app").projectDir = file("${shortTestAppAndroidDir}/android/app")
+        project(":support").projectDir = file("${shortTestAppAndroidDir}/android/support")
+    }
+}