Native Handlers

Stream Chat for React Native uses a number of features that require packages that run native code.

Stream Chat for React Native also supports Expo, which has it’s own set of native packages.

To reconcile these differences Stream Chat for React Native is made up of two packages, stream-chat-react-native-core, and either stream-chat-react-native or stream-chat-expo. The non core packages call a function from the core package, registerNativeHandlers, this gives the core package access to different native functions that perform the same task, but are different between Expo and React Native CLI.

Overriding Handlers

If desired, the native handlers can be overridden using registerNativeHandlers. The same function that is called internally to set the handlers can be used to override them. If the function returns the same type of data as the original function it should seamlessly work with the rest of the SDK. You should look at the default implementation to ensure any override conforms to the appropriate type definition provided by the SDK.

Example

Haptic feedback is used in the app to indicate certain presses, and within the image viewer to indicate zoom limits are hit. If haptic feedback is not desired in your application you can easily remove it by registering a different handler to the function.

import { registerNativeHandlers } from "stream-chat-react-native";

registerNativeHandlers({
  triggerHaptic: () => null,
});

Handlers

There are the handlers registered as they interact with different native API packages depending on if the SDK being used on Expo or React Native CLI.

Audio

The handler used to play audio files and for voice recording.

overrideAudioRecordingConfiguration

A handler that allows you to override the audio recording configuration provided to the Audio module. It can be used to change the default behaviour and record audio in different formats, qualities and general native behaviours.

It works as a transformer function that takes Audio.audioRecordingConfiguration as its input and expects the same to be returned (with any modifications) as output. Its return value is then set to audioRecordingConfiguration on the Audio singleton instance.

The appropriate types for the configuration can be found here for RN CLI and here for Expo.

The React Native CLI configuration is in line with the configuration used by the react-native-audio-recorder-player package, while the Expo one is in line with the expo-av one.

compressImage

An async function that compresses an image and returns the local uri of the compressed image.

deleteFile

A function that deletes a file at a given local uri.

getLocalAssetUri

A function that gets the local uri of an image or remote asset.

getPhotos

A function that returns photos from the camera roll given an offset of after and a number to retrieve, first.

pickDocument

A function to open the document picker and return documents picked from it.

pickImage

A function to open the native image picker and return images picked from it.

saveFile

A function to save a file from a URL to local storage.

SDK

String identifying which package, stream-chat-react-native or stream-chat-expo, is being used.

setClipboardString

An function to copy strings or text in the message.

shareImage

A function to provide a given image to the native sharing functionality of the OS.

takePhoto

A function that opens the OS specific camera and returns an image when one is taken.

triggerHaptic

A function to trigger haptic feedback given the type of haptic force desired.

Sound

A component that renders the Sound/Audio on the message attachment.

Video

A component that renders the Video on the ImageGallery when an video attachment is opened.