Use the React Native SDK settings and actions to customize the behavior of your bot.

Settings

For the React Native SDK, AdaEmbedView takes various props that you can use to customize the behavior of your chatbot.

cluster

cluster?: string;

Specifies the Kubernetes cluster to be used. Do not change this value unless directed by an Ada team member.

greeting

greeting?: string;

Use this prop to customize the greeting that new chatters see. This is useful for setting view-specific greetings across your app. The greeting should correspond to the ID of the Answer you would like to use, which you can find in the URL of the corresponding Answer in the dashboard.

Example

handle

handle: string;

The handle for your bot. This is a required field.

language

language?: string;

Takes in a language code to programatically set the bot language. You must first turn languages on under Settings > Bot Setup > Multilingual on your Ada dashboard. See Support multiple languages in the same bot.

📘

Language codes use the ISO 639-1 language format.

metaFields

metaFields?: object;

Use metaFields to pass information about a chatter to Ada. This can be useful for tracking information about your customers, as well as personalizing their experience. For example, you may wish to track the phone_number and name for conversation attribution. (See Variables for more information.)

Once set, you can access this information:

  • in the email attachment from Handoff Form submissions
  • via the Chatter Info modal in the Conversations page of your Ada dashboard
metaFields={{
  name: "Some name",
  age: 30
}}

To change these values after bot setup, use the setMetaFields action.

thirdPartyCookiesEnabled (Android)

thirdPartyCookiesEnabled?: boolean;

Set the thirdPartyCookies prop to enable third-party cookies in AdaEmbedView. This feature is only available in Android. The default value is false.

zdChatterAuthCallback

zdChatterAuthCallback?(callback: (token: string) => void): void;

Use the zdChatterAuthCallback to request a JWT token from your API, then pass it to Ada. This creates shared trust between Ada and Zendesk, and in turn allows for verifiable chatter identity.

zdChatterAuthCallback={callback => {
  const token = getTokenFromAPI(); // Get a fresh JWT token from your API
  callback(token);
}}

endConversationCallback

endConversationCallback?(callback: (event?: { [key]: string | object }) => void): void;

Use endConversationCallback to specify a callback function to be called when a chatter ends a conversation. The callback will receive an event object containing conversation metadata.

endConversationCallback={(event) => {
  // perform action after conversation has been ended by the chatter
}}

Actions

Call actions directly from the AdaEmbedView ref. This allows you to modify Ada chat without using state/props to trigger a re-render of the entire subtree.

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

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

deleteHistory

Deletes the chatter used to fetch conversation logs for a chatter from storage. When a user opens a new chat window, a new chatter is generated.

this.adaEmbedView.deleteHistory();

reset

Creates a new chatter and refreshes the Chat window. reset can take an optional object allowing language, metaFields, and greeting to be changed for the new chatter.

this.adaEmbedView.reset();

// With options
this.adaEmbedView.reset({
  metaFields: {
    name: "Some name",
    age: 30
    }
});

setLanguage

setLanguage(languageCode: string)

Changes the language in chat programatically. Use this action, rather than the language setting, to change the chat language without clearing the chat history. Language codes must use a lowercase, two-letter code, in ISO 639-1 language format. For example, en, fr, ca, ar, and so on.

this.adaEmbedView.setLanguage(languageCode: "fr")

Before using setLanguage:

  • You must turn languages on under Settings > Bot Setup > Multilingual on your Ada dashboard. See Multilingual for more information.

  • The chat window must be opened at least once.

setMetaFields

Used to set metaFields for a chatter after instantiation. This is useful if you need to update user data after Ada chat has already launched.

this.adaEmbedView.setMetaFields({
  name: "Some name",
  age: 30
});

triggerAnswer

this.adaEmbedView.triggerAnswer()

Triggers an answer in chat. Include the Answer ID, which you can find in the URL of the corresponding Answer in the dashboard.

Example

this.adaEmbedView.triggerAnswer("627d28a9bd9ca9e5337b9763")

📘

The chat window must be opened at least once before this method can be used.