This SDK enables automatic, real-time translation of chat messages in your React application.
react
and react-dom
.
useQuetzalChat
hook in your component:
getChatMetadata
under the hood and store the quetzalChatId
and participants in context.
Step | Description |
---|---|
1️⃣ | Backend calls /chat/new with participants and internal chat ID |
2️⃣ | Frontend calls setUpChat(externalChatId) |
3️⃣ | Call setCurrentParticipantId(participantId) |
4️⃣ | Fetch your app’s chat messages |
5️⃣ | Call fetchTranslationsByExternalIdAndStore(messageIds) |
6️⃣ | Use translateBatchMessagesAndStore() if needed |
7️⃣ | Use getTranslationForCurrentParticipant(msg.id) for each message |
8️⃣ | Use setTranslatedMessageDisplayState() to control toggle UI |
9️⃣ | On language change, call maybeUpdateChat() |