Discussions

Ask a Question
Back to All

how to make avatar to respond to LLM (Speech-to-Speech)?

I am using my LLM for text-to-speech and is working fine.
But when I use LLM for speech-to-speech, when I ask a question trained from LLM,
before getting api response from LLM, avatar is started speaking "Hey There! I am not able to understand".
After few seconds, once the LLM response got, then it is started speaking the LLM answer.

const handleStartSession = async () => {
    const avatar = new StreamingAvatar({ token: accessToken });
    const sessionData = await avatar.createStartAvatar({
        avatarName: avatarName,
        quality: "high",
        language: language,
    });
    avatar.on(StreamingEvents.USER_TALKING_MESSAGE, (message) => {
        console.log("user talking message", message)
        handleVoiceMessage(message);
    });

};

const getLLMResponse = async (query) => {
    const avatar = avatarRef.current;
    if (!avatar) return;
    try {
        console.log("Fetching LLM response for query:", query);
        const response = await fetch("https://myllm.com/faq", {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
            },
            body: JSON.stringify({ query: query }),
        });

        if (!response.ok) {
            throw new Error(`HTTP error! Status: ${response.status}`);
        }

        const data = await response.json();
        return data;
    } catch (error) {
        console.error("Error fetching LLM response:", error);
        return null;
    }
};

const handleVoiceMessage = async (message) => {
    const avatar = avatarRef.current;
    if (!avatar) return;

    if (message && message.detail) {
        const userMessage = message.detail.message;
        const data = await getLLMResponse(userMessage);
        if (data && data.bot) {
            await avatar.speak({
                text: data.bot,
                taskType: TaskType.REPEAT,
                taskMode: TaskMode.SYNC,
            });
        } else {
            console.error("No bot response received.");
        }
    }
};

const handleTextMessage = async () => {
    console.log("text message", message)
    const avatar = avatarRef.current;
    if (!avatar) return;

    const data = await getLLMResponse(message);

    if (data && data.bot) {
        await avatar.speak({
            text: data.bot,
            taskType: TaskType.REPEAT,
            taskMode: TaskMode.SYNC,
        });
    } else {
        console.error("No bot response received.");
    }
    setMessage('');
};