Logo
Search
API Docs

React Native SDK Integration

Chat Agents

React Native SDK Integration & the Provider/Hook Pattern

Overview

The React Native SDK brings voice-assistant calling to native mobile apps built with React Native, using a familiar provider-and-hook pattern instead of a raw client object. It follows the same underlying model as the Web SDK Integration guide for the browser — here the equivalent building blocks are exposed as a context provider and a hook.


Installation

Install the package with your preferred package manager:

npm install @core-system/react-native

Provider & Hook Pattern

Wrap your app (or the subtree that needs voice calling) in SulusVoiceProvider, passing your public API key as a prop. Any nested component can then call the useSulusVoice hook to get start, stop, and isConnected:

import { SulusVoiceProvider, useSulusVoice } from '@core-system/react-native';

export default () => (
  <SulusVoiceProvider apiKey="YOUR_PUBLIC_API_KEY">
    <VoiceApp />
  </SulusVoiceProvider>
);
  • SulusVoiceProvider — wraps your app and accepts your apiKey as a prop, providing context to all children
  • useSulusVoice — a hook returning start, stop, isConnected, and other call state

Basic Example

Combining the provider and the hook into a working screen:

import { View, Button } from 'react-native';
import { SulusVoiceProvider, useSulusVoice } from '@core-system/react-native';

const VoiceApp = () => {
  const { start, stop, isConnected } = useSulusVoice();

  return (
    <View>
      <Button
        title={isConnected ? 'End Call' : 'Start Call'}
        onPress={() => (isConnected ? stop() : start('ASSISTANT_ID'))}
      />
    </View>
  );
};

export default () => (
  <SulusVoiceProvider apiKey="YOUR_PUBLIC_API_KEY">
    <VoiceApp />
  </SulusVoiceProvider>
);

Place SulusVoiceProvider high in your component tree so any nested screen can access the hook.


Prerequisites & Next Steps

Prerequisites

  • A Sulus account with your public API key
  • An existing assistant ID for the assistant you want to connect to

If you don't have an assistant yet, you can create one quickly from the dashboard, or programmatically ahead of time using the server-side TypeScript SDK, for example:

import { SulusClient } from '@core-system/server-sdk';

const client = new SulusClient(process.env.SULUS_API_KEY);

const assistant = await client.assistants.create({
  name: 'Support Assistant',
  model: { provider: 'openai', model: 'gpt-4.1' },
});

console.log(assistant.id); // use this as your ASSISTANT_ID

Next steps

  • Handle call lifecycle events surfaced through the hook's state to drive loading/connected/ended UI
  • Display a live transcript by subscribing to message events

For the browser equivalent of this integration, see Web SDK Integration.