I am creating a custom chatbot that integrates with OpenAI to do custom API calls. The code I working on works in the preview but not in the live site. I can see logs being passed with the correct data too, so I know the API is working. However The visual elements are not being populated with the correct chat information in my repeater. Please help!
Front end code:
import { getNextChatMessageWithChatHistory } from 'backend/chatbot'
/*[
{ "role": "system", "content": "You are a helpful assistant." },
{ "role": "user", "content": "Who won the world series in 2020?" },
{ "role": "assistant", "content": "The Los Angeles Dodgers won the World Series in 2020." },
{ "role": "user", "content": "Where was it played?" }
]
*/
$w.onReady(function () {
let messages = [];
const hideStartScreen = ()=>{
$w("#startSection").collapse();
$w("#conversationSection").expand();
}
$w("#messagesRepeater").onItemReady(($item, itemData, index)=>{
console.log(itemData);
$item("#botText").text = itemData.content;
})
const messageSendHandler = async () => {
if(messages.length === 0) hideStartScreen();
const userInput = $w("#userInput").value;
const message = {
role: "user",
content: userInput
}
messages.push(message);
const answer = await getNextChatMessageWithChatHistory(messages);
console.log("answer:", answer);
messages.push(answer);
console.log("messages:", messages);
$w("#messagesRepeater").data = messages.map((message)=> ({...message, _id: Math.floor(Math.random()*1000000000).toString()}));
$w("#messagesRepeater").expand();
}
$w('#sendButton').onClick(messageSendHandler);
});