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 in your Ada dashboard.
- If you're using a generative AI Agent, go to Customization > Languages. See Support multiple languages in the same AI Agent for more information.
- If you're using a scripted bot, go to Settings > Bot setup > Multilingual. See Support multiple languages in the same bot for more information.
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 Meta variables 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.
sensitiveMetaFields
sensitiveMetaFields?: object;
Use sensitiveMetaFields to pass sensitive meta information about a chatter
to Ada. This works like metafields, but provides an added layer of security.
Once set, you can access this information:
- in the email attachment from Handoff Form submissions
- via the Meta variables modal in the Conversations page of your Ada dashboard
sensitiveMetaFields={{
token: "your_jwt_token"
}}
To change these values after bot setup, use the setSensitiveMetaFields 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 in your Ada dashboard.
- If you're using a generative AI Agent, go to Customization > Languages. See Support multiple languages in the same AI Agent for more information.
- If you're using a scripted bot, go to Settings > Bot setup > Multilingual. See Support multiple languages in the same bot 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
});
setSensitiveMetaFields
Used to set sensitiveMetaFields for a chatter
after instantiation. This is useful if you need to update user data after Ada chat has already launched.
this.adaEmbedView.setSensitiveMetaFields({
token: "your_jwt_token"
});
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.