Im stuck. My setChatHistory state is being called twice and data is dublicated. And only place where i use it is in the function below, which is being called by onClick event. I have discovered that it works fine if i remove it from chat settings: const chat = model.startChat({ history: chatHistory, generationConfig: { maxOutputTokens: 3000, }, });

const chat = model.startChat({
            history: chatHistory,
            generationConfig: {
                maxOutputTokens: 3000,
            },
        });
        let modelRes = {};
        try {
            await chat.sendMessage(query).then((value)=> {
                console.log(value)
                modelRes = formatAIText(value.response.text());
            });
        } catch (error) {
            console.error("Error sending message:", error);
        }
        if(modelRes.text) {
            setModelResult(modelRes);
            setChatHistory((prev)=> [
                ...prev,
                { role: "user", parts: [{ text: query }] },
                { role: "model", parts: [{ text: modelRes.text }] }
            ])
        }

i expect it to return not dublicated messages to render it using map.

Im stuck. My setChatHistory state is being called twice and data is dublicated. And only place where i use it is in the function below, which is being called by onClick event. I have discovered that it works fine if i remove it from chat settings: const chat = model.startChat({ history: chatHistory, generationConfig: { maxOutputTokens: 3000, }, });

const chat = model.startChat({
            history: chatHistory,
            generationConfig: {
                maxOutputTokens: 3000,
            },
        });
        let modelRes = {};
        try {
            await chat.sendMessage(query).then((value)=> {
                console.log(value)
                modelRes = formatAIText(value.response.text());
            });
        } catch (error) {
            console.error("Error sending message:", error);
        }
        if(modelRes.text) {
            setModelResult(modelRes);
            setChatHistory((prev)=> [
                ...prev,
                { role: "user", parts: [{ text: query }] },
                { role: "model", parts: [{ text: modelRes.text }] }
            ])
        }

i expect it to return not dublicated messages to render it using map.

• javascript
• reactjs
• gemini

1 Answer 1

Based on the code and the context provided, it is possible that your issue is caused not by your code but in the way you are managing chatHistory.

It looks like that the chat instance remembers the messages you are sending throughout a chat, meaning that when you initialize the chat with:

const chat = model.startChat({ history: chatHistory, generationConfig: { maxOutputTokens: 3000 }, });

the chat instance was already “seeded” with your previous messages.

Long story short, when you send a new message first it gets combined with model "internal history" (which includes all previous messages) and then you add it again to your state.

A quick fix could be:

1. As you mention you could get rid of chatHistory so that the chat does not preload the history and then you only manage your conversation through setChatHistory

Therefore call startChat like this:

const chat = model.startChat({
    generationConfig: { maxOutputTokens: 3000 },
});

or

2. Let the chat API manage the state for you, meaning that you might not need a dedicated state for tracking chat changes at all.