Upgrade sample to React Native 76

.eslintrc.js

@@ -0,0 +1,34 @@
+const path = require('path');
+
+const modulePath = 'modules/@shopify/checkout-sheet-kit';
+const moduleAbsolutePath = path.join(__dirname, modulePath);
+
+module.exports = {
+  root: true,
+  parser: '@typescript-eslint/parser',
+  extends: '@react-native',
+  rules: {
+    '@typescript-eslint/consistent-type-imports': 'error',
+    'no-console': 'error',
+  },
+  overrides: [
+    // Sample app files
+    {
+      files: ['sample/**/*.ts', 'sample/**/*.tsx'],
+      rules: {
+        'no-console': 'off',
+        '@typescript-eslint/no-shadow': 'off',
+      },
+    },
+    // Module files
+    {
+      files: [
+        path.join(modulePath, 'src/**/*.ts'),
+        path.join(modulePath, 'src/**/*.tsx'),
+      ],
+      parserOptions: {
+        project: path.join(moduleAbsolutePath, 'tsconfig.build.json'),
+      },
+    },
+  ],
+};

modules/@shopify/checkout-sheet-kit/.eslintignore

@@ -0,0 +1 @@
+lib

modules/@shopify/checkout-sheet-kit/package.json

@@ -16,7 +16,7 @@
     "clean": "rm -rf lib",
     "build": "bob build",
     "lint:swift": "./../../../sample/ios/Pods/SwiftLint/swiftlint --strict --quiet ios",
-    "lint": "yarn typecheck && eslint src",
+    "lint": "yarn typecheck && eslint .",
     "typecheck": "tsc --noEmit"
   },
   "files": [
@@ -49,7 +49,7 @@
   },
   "devDependencies": {
     "react-native-builder-bob": "^0.23.1",
-    "typescript": "^5.4.2"
+    "typescript": "5.5.2"
   },
   "react-native-builder-bob": {
     "source": "src",

package.json

@@ -25,32 +25,36 @@
     "test": "jest"
   },
   "devDependencies": {
-    "@babel/core": "^7.20.0",
-    "@babel/preset-env": "^7.20.0",
-    "@babel/runtime": "^7.20.0",
-    "@react-native/babel-preset": "0.74.83",
-    "@react-native/eslint-config": "0.74.83",
-    "@react-native/metro-config": "0.74.83",
-    "@react-native/typescript-config": "0.74.83",
-    "@tsconfig/react-native": "^3.0.0",
-    "@types/jest": "^29.5.10",
-    "@types/react": "^18",
-    "@types/react-native-dotenv": "^0.2.1",
-    "@types/react-test-renderer": "^18.0.0",
+    "@babel/core": "^7.26.0",
+    "@babel/preset-env": "^7.26.0",
+    "@babel/runtime": "^7.26.0",
+    "@react-native-community/cli": "15.0.0-alpha.2",
+    "@react-native-community/cli-platform-android": "15.0.0-alpha.2",
+    "@react-native-community/cli-platform-ios": "15.0.0-alpha.2",
+    "@react-native/babel-preset": "0.76.0",
+    "@react-native/eslint-config": "0.76.0",
+    "@react-native/metro-config": "0.76.0",
+    "@react-native/typescript-config": "0.76.0",
+    "@tsconfig/react-native": "^3.0.5",
+    "@types/jest": "^29.5.14",
+    "@types/react": "^18.3.12",
+    "@types/react-native-dotenv": "^0.2.2",
+    "@types/react-test-renderer": "^18.3.0",
     "babel-jest": "^29.7.0",
-    "eslint": "^8.19.0",
-    "eslint-plugin-prettier": "^5.1.3",
-    "jest": "^29.2.1",
-    "prettier": "^3.2.5",
-    "react": "^18.2.0",
-    "react-native": "0.74.1",
+    "eslint": "^8.57.1",
+    "eslint-plugin-ft-flow": "^3.0.11",
+    "eslint-plugin-prettier": "^5.2.1",
+    "jest": "^29.7.0",
+    "prettier": "^3.3.3",
+    "react": "18.3.1",
+    "react-native": "0.76.0",
     "react-native-dotenv": "^3.4.9",
-    "react-native-gesture-handler": "^2.15.0",
+    "react-native-gesture-handler": "^2.20.2",
     "react-native-gradle-plugin": "^0.71.19",
-    "react-test-renderer": "18.2.0",
-    "ts-jest": "^29.1.1",
+    "react-test-renderer": "18.3.1",
+    "ts-jest": "^29.2.5",
     "turbo": "^1.10.16",
-    "typescript": "^5.4.2"
+    "typescript": "5.5.2"
   },
   "engines": {
     "node": ">=18"
@@ -70,14 +74,5 @@
     "shopify",
     "checkout"
   ],
-  "eslintConfig": {
-    "root": true,
-    "extends": "@react-native",
-    "rules": {
-      "@typescript-eslint/no-shadow": "off",
-      "@typescript-eslint/consistent-type-imports": "error",
-      "no-console": "error"
-    }
-  },
   "packageManager": "yarn@4.4.1"
 }

sample/Gemfile

@@ -3,6 +3,7 @@ source 'https://rubygems.org'
 # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
 ruby ">= 2.6.10"
 
-gem 'cocoapods', '>= 1.15'
+# Exclude problematic versions of cocoapods and activesupport that causes build failures.
+gem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'
 gem 'cocoapods-check', '1.1.0'
-gem 'activesupport', '>= 6.1.7.5', '< 7.1.0'
+gem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'

sample/Gemfile.lock

@@ -97,8 +97,8 @@ PLATFORMS
   ruby
 
 DEPENDENCIES
-  activesupport (>= 6.1.7.5, < 7.1.0)
-  cocoapods (>= 1.15)
+  activesupport (>= 6.1.7.5, != 7.1.0)
+  cocoapods (>= 1.13, != 1.15.1, != 1.15.0)
   cocoapods-check (= 1.1.0)
 
 RUBY VERSION

sample/android/app/build.gradle

@@ -51,6 +51,10 @@ react {
     //
     //   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
      hermesFlags = ["-O", "-output-source-map"]
+
+
+    /* Autolinking */
+    autolinkLibrariesWithApp()
 }
 
 /**

sample/android/app/src/main/AndroidManifest.xml

@@ -9,7 +9,8 @@
       android:roundIcon="@mipmap/ic_launcher_round"
       android:allowBackup="false"
       android:theme="@style/AppTheme"
-      android:networkSecurityConfig="@xml/network_security_config">
+      android:networkSecurityConfig="@xml/network_security_config"
+      android:supportsRtl="true">
       <activity
         android:name=".MainActivity"
         android:label="@string/app_name"

sample/android/app/src/main/java/com/shopify/checkoutkitreactnative/MainApplication.kt

@@ -9,6 +9,7 @@ import com.facebook.react.ReactPackage
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load
 import com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost
 import com.facebook.react.defaults.DefaultReactNativeHost
+import com.facebook.react.soloader.OpenSourceMergedSoMapping
 import com.facebook.soloader.SoLoader
 
 class MainApplication : Application(), ReactApplication {
@@ -34,7 +35,7 @@ class MainApplication : Application(), ReactApplication {
 
   override fun onCreate() {
     super.onCreate()
-    SoLoader.init(this, false)
+    SoLoader.init(this, OpenSourceMergedSoMapping)
     if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
       // If you opted-in for the New Architecture, we load the native entry point for this app.
       load()

sample/android/build.gradle

@@ -1,12 +1,12 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 buildscript {
     ext {
-        buildToolsVersion = "34.0.0"
-        minSdkVersion = 23
-        compileSdkVersion = 34
+        buildToolsVersion = "35.0.0"
+        minSdkVersion = 24
+        compileSdkVersion = 35
         targetSdkVersion = 34
         ndkVersion = "26.1.10909125"
-        kotlinVersion = "1.9.22"
+        kotlinVersion = "1.9.24"
 
     }
     repositories {

sample/android/gradle.properties

@@ -21,8 +21,6 @@ org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
 # Android operating system, and which are packaged with your app's APK
 # https://developer.android.com/topic/libraries/support-library/androidx-rn
 android.useAndroidX=true
-# Automatically convert third-party libraries to use AndroidX
-android.enableJetifier=true
 
 # Use this property to specify which architecture you want to build.
 # You can also override it from the CLI using
@@ -34,7 +32,7 @@ reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
 # your application. You should enable this flag either if you want
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them.
-newArchEnabled=false
+newArchEnabled=true
 
 # Use this property to enable or disable the Hermes JS engine.
 # If set to false, you will be using JSC instead.

sample/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.6-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

sample/android/gradlew

@@ -15,6 +15,7 @@
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
+# SPDX-License-Identifier: Apache-2.0
 
 ##############################################################################
 #
@@ -55,7 +56,7 @@
 #       Darwin, MinGW, and NonStop.
 #
 #   (3) This script is generated from the Groovy template
-#       https://github.com/gradle/gradle/blob/HEAD/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
+#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
 #       within the Gradle project.
 #
 #       You can find Gradle at https://github.com/gradle/gradle/.
@@ -84,7 +85,8 @@ done
 # shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
 # Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
-APP_HOME=$( cd "${APP_HOME:-./}" > /dev/null && pwd -P ) || exit
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
+' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum

sample/android/gradlew.bat

@@ -13,6 +13,8 @@
 @rem See the License for the specific language governing permissions and
 @rem limitations under the License.
 @rem
+@rem SPDX-License-Identifier: Apache-2.0
+@rem
 
 @if "%DEBUG%"=="" @echo off
 @rem ##########################################################################

sample/android/settings.gradle

@@ -1,7 +1,8 @@
+pluginManagement { includeBuild("../node_modules/@react-native/gradle-plugin") }
+plugins { id("com.facebook.react.settings") }
+extensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }
 rootProject.name = 'ReactNative'
 
-apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
-
 include ':app'
 include ':react-native-config'
 

sample/ios/Podfile

@@ -5,7 +5,7 @@ require Pod::Executable.execute_command('node', ['-p',
     {paths: [process.argv[1]]},
   )', __dir__]).strip
 
-platform :ios, '13.4'
+platform :ios, '15.1'
 
 prepare_react_native_project!