This guide covers migrating from RTVIClient to the new PipecatClient in a React Native application. The new client introduces simplified configuration and improved client-server messaging. For an overview of the changes, see the top-level RTVIClient Migration Guide.

Key Changes

As primarily a wrapper around the JavaScript SDK with a unique Transport, the changes are the same as those in the JavaScript migration guide with only the following transport-specific updates. PLEASE REFER TO THE JAVASCRIPT MIGRATION GUIDE FOR FULL DETAILS.

1. Transport Configuration

Same as with the JavaScript transports, the RNDailyTransport now accepts a constructor argument, allowing for providing a Daily configuration. Old
const client = new RTVIClient({
  transport: new RNDailyTransport(),
  ...
});
New
const client = new PipecatClient({
  transport: new RNDailyTransport({
    userName: 'Tina',
    reactNativeConfig: { disableAutoDeviceManagement: { audio: true } },
  }),
});

2. Connection Methods

Again, same as with the JavaScript transport, you can provide a Daily configuration via one of the connection methods (connect() or startBotAndConnect()) on the PipecatClient. Old
await client.connect();
New There are three options for connecting now. For migration purposes, you are likely to use option 3 (startBotAndConnect()):
  1. Direct Connection: Provide the connection details directly to connect().
const cxnDetails = {
  url: 'https://your-daily-room-url',
  token: 'your-daily-token',
  userData: { favoriteFlower: 'black-eyed susan' },
};
await client.connect(cxnDetails);
  1. Using startBot(): Fetch connection details from an API endpoint and pass them to connect().
let cxnDetails = await client.startBot({
  endpoint: 'http://localhost:7860/connect',
  requestData: {
    // Any custom data your /connect endpoint requires
    llm_provider: 'openai',
    initial_prompt: "You are a pirate captain",
    // Any additional data
  }
});
cxnDetails = modifyCxnDetails(cxnDetails); // Modify if needed
await client.connect(cxnDetails);
  1. Using startBotAndConnect(): Fetch connection details and connect in one step.
When using startBotAndConnect(), the response from your endpoint is passed directly to the transport and should match the Daily configuration type.
await client.startBotAndConnect({
  endpoint: 'http://localhost:7860/connect',
  requestData: {
    // Any custom data your /connect endpoint requires
    llm_provider: 'openai',
    initial_prompt: "You are a pirate captain",
    // Any additional data
  }
});