> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.ada.cx/chat/react-native/getting-started/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.ada.cx/_mcp/server.

# Getting started

> **Warning**
>
> Ada has deprecated Chat. Messaging fully replaces Chat on December 15, 2026. Read [Introducing Messaging](https://docs.ada.cx/2026-09-30-introducing-messaging) to learn how to migrate.

This page covers the legacy Chat React Native SDK. Follow the [Messaging React Native upgrade guide](/messaging/react-native/getting-started#upgrade-from-the-existing-react-native-sdk) to migrate.

This guide will help you set up the Ada React Native SDK in your app. The process involves three main steps:

1. [Complete prerequisites](#before-you-begin): Ensure all necessary configurations and installations are done.
2. [Install](#install-react-native-sdk) the SDK: Add the SDK manually to your project.
3. [Launch](#launch) Ada: Choose one of the available options to display Ada, such as using the `AdaEmbedView` component.

Follow the instructions below to install the SDK and start integrating Ada into your app!

# Before you begin

The Ada React Native SDK is based on [react-native-webview](https://github.com/react-native-community/react-native-webview). Before using the SDK, you must do the following:

* Complete the react-native-webview [Getting Started Guide](https://github.com/react-native-community/react-native-webview/blob/master/docs/Getting-Started.md).
* Ensure that you're using react-native-webview version 11.2.0 or greater. The React Native SDK uses `allowUniversalAccessFromFileURLs` from the later versions of this module.
* To support developing and testing locally, ensure that you temporarily add `http://localhost:8081/` to your [Approved Domains](https://docs.ada.cx/en/use-ada-with-your-website/deploy-ada-on-your-website-or-app/restrict-your-bot-to-a-list-of-approved-domains.html). Without doing this the bot will be blocked by the Content Security Policy.

Once you've configured react-native-webview, simply [install the Ada React Native SDK via NPM](#install-react-native-sdk).

# Install React Native SDK

1. Use one of the following options to install [Ada React Native SDK](https://www.npmjs.com/package/@ada-support/react-native-sdk) via NPM:
   1. With npm: `npm install --save @ada-support/react-native-sdk`
   2. With yarn: `yarn add @ada-support/react-native-sdk`
2. Update your iOS Podfile to include the following import:

`require_relative '../node_modules/@ada-support/react-native-sdk/react_native_pods'`

3. Update your iOS Podfile to include the following piece of code. This will import any required native modules in the React Native SDK.

`use_ada!()`

4. Run `pod install` in your app to install the required native modules.

```
# Example Podfile
require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
require_relative '../node_modules/@ada-support/react-native-sdk/react_native_pods'

platform :ios, '11.0'

target 'example' do
  config = use_native_modules!

  use_react_native!(
    :path => config[:reactNativePath],
    # to enable hermes on iOS, change `false` to `true` and then install pods
    :hermes_enabled => false
  )

  use_ada!()

  target 'exampleTests' do
    inherit! :complete
    # Pods for testing
  end

  # Enables Flipper.
  #
  # Note that if you have use_frameworks! enabled, Flipper will not work and
  # you should disable the next line.
  use_flipper!()

  post_install do |installer|
    react_native_post_install(installer)
  end
end
```

# Launch

Once you have installed the Ada React Native SDK, you're ready to use it in your app! Simply import the `AdaEmbedView` component, then render it. Note that you must pass a valid `handle` for the Chat window to work.

**`JSX`**

```jsx JSX
import AdaEmbedView from '@ada-support/react-native-sdk';
// ...

class MyComponent extends React.Component {
  render() {
    return <AdaEmbedView handle="ada-example"/>;
  }
}
```

# File permissions

Some functionality in the Ada Chat bot will not work unless permissions are explicitly given.

## React Native iOS permissions

For iOS, specify the permissions in your `ios/[project]/Info.plist` file.

**`XML`**

```xml XML
<!-- Photo capture -->
<key>NSCameraUsageDescription</key>
<string>Take pictures for certain activities</string>

<!-- Gallery selection -->
<key>NSPhotoLibraryUsageDescription</key>
<string>Select pictures for certain activities</string>

<!-- Video recording -->
<key>NSMicrophoneUsageDescription</key>
<string>Need microphone access for recording videos</string>
```

## React Native Android permissions

For Android, add permissions in `AndroidManifest.xml`.

**`XML`**

```xml XML
<manifest ...>
  ...
  <!-- this is required only for Android 4.1-5.1 (api 16-22)  -->
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
  ...
</manifest>
```