const item = {
    user: [],
    ai: []
};
async function generate() {
    try {
        // process history
        


        // get reply

        // append reply form api
        let userP = document.createElement('p');
        const yourReply = document.getElementById('user-reply').value;
        userP.textContent = 'User: ' + yourReply;
        item.user.push(`${yourReply}.\n`);
        document.getElementById('content').appendChild(userP);

        link = 'https://arcsu1-fine-tuned-models.hf.space/generate'

        const response = await fetch(link, {
            method: 'POST', // Method type
            headers: {
                'Content-Type': 'application/json' // Specify that we are sending JSON
            },
            body: JSON.stringify(item) // Convert the JavaScript object to a JSON string
        });

        const reply = await response.json();

        let aiP = document.createElement('p');
        aiP.textContent = 'AI: ' + reply;
        item.ai.push(`${reply}.\n`);
        console.log(reply);
        document.getElementById('content').appendChild(aiP);
        document.getElementById('user-reply').value = '';

    } catch (error) {
        
        console.error('Error fetching the root endpoint:', error);
        document.getElementById('content').appendChild("Error fetching the root endpoint");
        document.getElementById('user-reply').value = '';
    }
}