Your search did not match any results.

Chat - AI and Chatbot Integration

This demo uses an Azure OpenAI service and the DevExtreme Chat component to create a chatbot UI. You can integrate Chat with various AI services, including OpenAI, Google Dialogflow, and Microsoft Bot Framework.

Handling dataSource (reloadOnChange: false)

The Chat component's dataSource is a CustomStore that implements its own load and insert functions. The Chat deactivates reloadOnChange to push updates directly into the store and update the conversation manually. See the onMessageEntered event handler and the processMessageSending function to review the code that manages data transfer between the Chat and its data store.

Backend API

Custom Message Template

The Chat specifies a messageTemplate that displays "Copy" and "Regenerate" buttons in bot messages.

Response Format Conversion: Markdown to HTML

The AI model outputs responses in Markdown, while the Chat requires HTML output. This example uses the unified plugin library to convert response content. Review convertToHtml function code for implementation details.

Default Caption Customization

The Chat component in this demo displays modified captions when the conversation is empty. The demo uses localization techniques to alter built-in text.