Skip to content

Commit

Permalink
chore: upgrade sample apps to RN 0.76.1 and added new arch docs (#2756)
Browse files Browse the repository at this point in the history
* chore: upgrade sample apps to RN 0.76.1

* docs: add new architecture guide

* docs: add new architecture guide

* fix: vale issues

* chore: update the sample apps
  • Loading branch information
khushal87 authored Nov 8, 2024
1 parent 65f1a6b commit 77980fa
Show file tree
Hide file tree
Showing 26 changed files with 1,986 additions and 2,334 deletions.
3 changes: 3 additions & 0 deletions .styles/Vocab/Base/accept.txt
Original file line number Diff line number Diff line change
Expand Up @@ -59,3 +59,6 @@ loadMore
pollAnswers
enum
SendMessage
interop
bridgeless
resizer
44 changes: 44 additions & 0 deletions docusaurus/docs/reactnative/guides/new-architecture.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
---
id: new-architecture
title: React Native New Architecture
---

Starting v6 we support the [new architecture](https://reactnative.dev/architecture/landing-page) for the React Native Chat SDK.

To be compatible with the new architecture, it is recommended that you use React Native version `0.75.4` and above for React Native CLI and `>=51` for Expo.

### Dependencies

On Native CLI, we recommend you to be on the following versions or higher of the peer dependencies to be able to run the new architecture:

| Dependencies | Versions |
| ----------------------------------- | ---------- |
| `@op-engineering/op-sqlite` | `>=9.3.0` |
| `@react-native-clipboard/clipboard` | `>=1.4.1` |
| `react-native-blob-util` | `>=0.17.0` |
| `react-native-document-picker` | `>=9.1.1` |
| `react-native-gesture-handler` | `>=2.15.0` |
| `react-native-haptic-feedback` | `>=2.2.0` |
| `react-native-image-picker` | `>=7.1.1` |
| `react-native-reanimated` | `>=3.9.0` |
| `react-native-share` | `>=10.0.2` |
| `react-native-svg` | `>=15.2.0` |

Few of the dependencies we rely on are not fully new architecture compatible yet.

1. `react-native-audio-recorder-player` and `react-native-video` work on interop mode.
2. `react-native-document-picker` doesn't support the bridgeless mode. Please use [`@react-native-documents/picker`](https://react-native-documents.github.io/docs/sponsor-only/intro) if you want the bridgeless mode. You can register your own native handler with us using our [Native Handler](../customization/native-handlers.mdx) guide.
3. `@react-native-camera-roll/camera-roll` doesn't work alongside the Image resizer module that we have. We recommend using the native image picker for now. You can read [the guide](./native-image-picker.mdx) here.

:::note
Although the above dependencies are not fully compatible with the new architecture, you can still use them in your project. They doesn't stop you from building the app on both iOS and Android.
:::

For expo, make sure you are on the latest version of the dependencies with the current expo version you have.

### Known issues and limitations

- The audio recorder is not fully compatible with the new architecture, so you might face some issues while recording the audio and playing it using `react-native-audio-recorder-player`. We are working on it to fix the issues.
- The image gallery animations behaves differently and seem to lag a bit on the new architecture specially when you use the pan gesture to drag down the image. We are working on it to fix the issues.

Please feel free to report any issues you face while using the new architecture.
1 change: 1 addition & 0 deletions docusaurus/sidebars-react-native.json
Original file line number Diff line number Diff line change
Expand Up @@ -157,6 +157,7 @@
"guides/audio-messages-support",
"guides/date-time-formatting",
"guides/native-image-picker",
"guides/new-architecture",
"customization/typescript",
"basics/troubleshooting",
"basics/stream_chat_with_navigation",
Expand Down
1 change: 1 addition & 0 deletions examples/SampleApp/Gemfile
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ ruby ">= 2.6.10"
# Exclude problematic versions of cocoapods and activesupport that causes build failures.
gem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'
gem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'
gem 'xcodeproj', '< 1.26.0'
gem 'fastlane'
gem 'rubocop-performance'
gem 'rubocop-require_tools'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand All @@ -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()
Expand Down
6 changes: 3 additions & 3 deletions examples/SampleApp/android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@ import org.apache.tools.ant.taskdefs.condition.Os

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.24"
Expand Down
2 changes: 1 addition & 1 deletion examples/SampleApp/android/gradle.properties
Original file line number Diff line number Diff line change
Expand Up @@ -32,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.
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-8.8-all.zip
distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-all.zip
networkTimeout=10000
validateDistributionUrl=true
zipStoreBase=GRADLE_USER_HOME
Expand Down
5 changes: 4 additions & 1 deletion examples/SampleApp/android/gradlew
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@
# See the License for the specific language governing permissions and
# limitations under the License.
#
# SPDX-License-Identifier: Apache-2.0
#

##############################################################################
#
Expand Down Expand Up @@ -84,7 +86,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
Expand Down
2 changes: 2 additions & 0 deletions examples/SampleApp/android/gradlew.bat
Original file line number Diff line number Diff line change
Expand Up @@ -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 ##########################################################################
Expand Down
Loading

0 comments on commit 77980fa

Please sign in to comment.