chore: rn 0.77 upgrade

examples/ExpoMessaging/package.json

@@ -10,41 +10,41 @@
     "eject": "expo eject"
   },
   "dependencies": {
-    "@op-engineering/op-sqlite": "^11.4.2",
+    "@op-engineering/op-sqlite": "^11.4.7",
     "@react-native-community/netinfo": "11.4.1",
     "@react-navigation/elements": "^1.3.30",
-    "expo": "~52.0.20",
+    "expo": "~52.0.36",
     "expo-av": "~15.0.2",
     "expo-clipboard": "~7.0.1",
-    "expo-constants": "~17.0.5",
-    "expo-document-picker": "~13.0.2",
-    "expo-file-system": "~18.0.7",
+    "expo-constants": "~17.0.7",
+    "expo-document-picker": "~13.0.3",
+    "expo-file-system": "~18.0.11",
     "expo-haptics": "~14.0.1",
     "expo-image-manipulator": "~13.0.6",
-    "expo-image-picker": "~16.0.4",
+    "expo-image-picker": "~16.0.6",
     "expo-linking": "~7.0.5",
-    "expo-media-library": "~17.0.5",
+    "expo-media-library": "~17.0.6",
     "expo-router": "~4.0.17",
     "expo-sharing": "~13.0.1",
-    "expo-splash-screen": "~0.29.21",
+    "expo-splash-screen": "~0.29.22",
     "expo-status-bar": "~2.0.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "react-native": "0.76.6",
-    "react-native-gesture-handler": "~2.20.2",
-    "react-native-reanimated": "~3.16.1",
-    "react-native-safe-area-context": "4.12.0",
-    "react-native-screens": "~4.4.0",
-    "react-native-svg": "15.8.0",
+    "react-native": "0.77.1",
+    "react-native-gesture-handler": "~2.24.0",
+    "react-native-reanimated": "~3.16.7",
+    "react-native-safe-area-context": "5.2.0",
+    "react-native-screens": "~4.8.0",
+    "react-native-svg": "15.11.1",
     "react-native-web": "~0.19.13",
     "stream-chat-expo": "link:../../package/expo-package",
     "stream-chat-react-native-core": "link:../../package",
-    "typescript": "~5.3.3"
+    "typescript": "~5.7.3"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
-    "@rnx-kit/metro-config": "^1.3.15",
-    "@rnx-kit/metro-resolver-symlinks": "^0.1.35"
+    "@rnx-kit/metro-config": "^2.0.1",
+    "@rnx-kit/metro-resolver-symlinks": "^0.2.1"
   },
   "private": true
 }

examples/SampleApp/.gitignore

@@ -33,6 +33,7 @@ local.properties
 .cxx/
 *.keystore
 !debug.keystore
+.kotlin/
 
 # node.js
 #
@@ -71,4 +72,4 @@ yarn-error.log
 !.yarn/plugins
 !.yarn/releases
 !.yarn/sdks
-!.yarn/versions
+!.yarn/versions

examples/SampleApp/App.tsx

@@ -12,7 +12,7 @@ import {
   ThemeProvider,
   useOverlayContext,
 } from 'stream-chat-react-native';
-import messaging from '@react-native-firebase/messaging';
+import { getMessaging } from '@react-native-firebase/messaging';
 import notifee, { EventType } from '@notifee/react-native';
 import { AppContext } from './src/context/AppContext';
 import { AppOverlayProvider } from './src/context/AppOverlayProvider';
@@ -80,7 +80,8 @@ const App = () => {
   const streamChatTheme = useStreamChatTheme();
 
   useEffect(() => {
-    const unsubscribeOnNotificationOpen = messaging().onNotificationOpenedApp((remoteMessage) => {
+    const messaging = getMessaging();
+    const unsubscribeOnNotificationOpen = messaging.onNotificationOpenedApp((remoteMessage) => {
       // Notification caused app to open from background state on iOS
       const channelId = remoteMessage.data?.channel_id as string;
       if (channelId) {
@@ -106,7 +107,7 @@ const App = () => {
         }
       }
     });
-    messaging()
+    messaging
       .getInitialNotification()
       .then((remoteMessage) => {
         if (remoteMessage) {
@@ -138,6 +139,7 @@ const App = () => {
               ...(colorScheme === 'dark' ? DarkTheme : DefaultTheme).colors,
               background: streamChatTheme.colors?.white_snow || '#FCFCFC',
             },
+            fonts: (colorScheme === 'dark' ? DarkTheme : DefaultTheme).fonts,
             dark: colorScheme === 'dark',
           }}
         >
@@ -181,7 +183,7 @@ const DrawerNavigatorWrapper: React.FC<{
         <Chat<StreamChatGenerics>
           client={chatClient}
           enableOfflineSupport
-          // @ts-expect-error
+          // @ts-expect-error - the `ImageComponent` prop is generic, meaning we can expect an error
           ImageComponent={FastImage}
           isMessageAIGenerated={(message: MessageType) => !!message.ai_generated}
         >

examples/SampleApp/Gemfile.lock

@@ -78,7 +78,7 @@ GEM
     colored2 (3.1.2)
     commander (4.6.0)
       highline (~> 2.0.0)
-    concurrent-ruby (1.3.4)
+    concurrent-ruby (1.2.3)
     declarative (0.0.20)
     digest-crc (0.6.5)
       rake (>= 12.0.0, < 14.0.0)
@@ -317,6 +317,7 @@ PLATFORMS
 DEPENDENCIES
   activesupport (>= 6.1.7.5, != 7.1.0)
   cocoapods (>= 1.13, != 1.15.1, != 1.15.0)
+  concurrent-ruby (< 1.3.4)
   fastlane
   fastlane-plugin-firebase_app_distribution
   fastlane-plugin-load_json

examples/SampleApp/android/app/build.gradle

@@ -65,14 +65,14 @@ def enableProguardInReleaseBuilds = false
  * The preferred build flavor of JavaScriptCore (JSC)
  *
  * For example, to use the international variant, you can use:
- * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ * `def jscFlavor = io.github.react-native-community:jsc-android-intl:2026004.+`
  *
  * The international variant includes ICU i18n library and necessary data
  * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
  * give correct results when using with locales other than en-US. Note that
  * this variant is about 6MiB larger per architecture than default.
  */
-def jscFlavor = 'org.webkit:android-jsc:+'
+def jscFlavor = 'io.github.react-native-community:jsc-android:2026004.+'
 
 android {
     ndkVersion rootProject.ext.ndkVersion

examples/SampleApp/android/build.gradle

@@ -6,9 +6,9 @@ buildscript {
         buildToolsVersion = "35.0.0"
         minSdkVersion = 24
         compileSdkVersion = 35
-        targetSdkVersion = 34
-        ndkVersion = "26.1.10909125"
-        kotlinVersion = "1.9.25"
+        targetSdkVersion = 35
+        ndkVersion = "27.1.12297006"
+        kotlinVersion = "2.0.21"
         androidXCore = "1.0.2"
     }
     repositories {

examples/SampleApp/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,7 +1,7 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.12-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME
-zipStorePath=wrapper/dists
+zipStorePath=wrapper/dists

examples/SampleApp/android/gradlew

@@ -86,8 +86,7 @@ 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 -P "${APP_HOME:-./}" > /dev/null && printf '%s
-' "$PWD" ) || exit
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s\n' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum
@@ -249,4 +248,4 @@ eval "set -- $(
         tr '\n' ' '
     )" '"$@"'
 
-exec "$JAVACMD" "$@"
+exec "$JAVACMD" "$@"

examples/SampleApp/eslint.config.mjs

@@ -0,0 +1,64 @@
+import eslintPluginReact from 'eslint-plugin-react';
+import eslintPluginReactNative from 'eslint-plugin-react-native';
+import eslintPluginReactNativeOfficial from '@react-native/eslint-plugin';
+import eslintPluginComments from 'eslint-plugin-eslint-comments';
+import eslintPluginReactHooks from 'eslint-plugin-react-hooks';
+import eslintPluginJest from 'eslint-plugin-jest';
+
+import eslintReactNativeConfig from '@react-native/eslint-config';
+
+import tsEslint from 'typescript-eslint';
+
+/**
+ * @react-native/eslint-config is for some reason still using the old notation
+ * for globals. We parse them manually here to make sure they're compatible with
+ * the new config. All globals which were previously set to true are now readonly.
+ */
+const globals = Object.keys(eslintReactNativeConfig.globals).reduce((acc, key) => {
+  if (eslintReactNativeConfig.globals[key]) {
+    acc[key] = 'readonly';
+  }
+  return acc;
+}, {});
+
+export default tsEslint.config(
+  tsEslint.configs.recommended,
+  {
+    ignores: ['node_modules/', 'dist/', '**/*.config.js'],
+  },
+  {
+    files: ['**/*.js', '**/*.cjs', '**/*.mjs', '**/*.jsx', '**/*.ts', '**/*.tsx'],
+    languageOptions: {
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+      parser: tsEslint.parser,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        ...globals,
+        console: 'readonly',
+      },
+    },
+    settings: {
+      react: {
+        version: 'detect',
+      },
+    },
+    plugins: {
+      '@react-native': eslintPluginReactNativeOfficial,
+      react: eslintPluginReact,
+      'react-native': eslintPluginReactNative,
+      'eslint-comments': eslintPluginComments,
+      'react-hooks': eslintPluginReactHooks,
+      jest: eslintPluginJest,
+    },
+    rules: {
+      ...eslintReactNativeConfig.rules,
+      'jsx-quotes': ['error', 'prefer-single'],
+      'react-native/no-inline-styles': 'off',
+    },
+  },
+);

examples/SampleApp/ios/AppDelegate.swift

@@ -0,0 +1,38 @@
+import UIKit
+import React
+import React_RCTAppDelegate
+import ReactAppDependencyProvider
+import FirebaseCore
+import FirebaseMessaging
+
+@main
+class AppDelegate: RCTAppDelegate {
+  override func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
+    self.moduleName = "SampleApp"
+    self.dependencyProvider = RCTAppDependencyProvider()
+    FirebaseApp.configure()
+
+    // You can add your custom initial props in the dictionary below.
+    // They will be passed down to the ViewController used by React Native.
+    self.initialProps = [:]
+
+    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
+  }
+
+  override func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
+      // Pass the device token to FCM
+      Messaging.messaging().apnsToken = deviceToken
+  }
+
+  override func sourceURL(for bridge: RCTBridge) -> URL? {
+    self.bundleURL()
+  }
+
+  override func bundleURL() -> URL? {
+#if DEBUG
+    RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: "index")
+#else
+    Bundle.main.url(forResource: "main", withExtension: "jsbundle")
+#endif
+  }
+}