quivr/frontend/app/chat/[chatId]/hooks/useChat.ts
Mamadou DICKO b0514d6149
fix(i18n): update tests for french and spanish (#878)
* add libraries for traslation purposes

* Add button and service for language selection

* add spanish translation on login page

* add spanish translation on upload page

* Add spanish translations for explore page

* Add translations on user page

* Add translations for config page

* Add spanish translations on chat page

* add translations for brain page

* fix GUI and save on local storage

* fix (i18n) init and types

* fix (i18n): typos

* add translation on new brain modal

* add translations on metadata

* Add translations on home page

* fixes types

* fix(frontend-tests): use get by id instead of text

---------

Co-authored-by: Gustavo Maciel <gustavo_m13@outlook.com>
2023-08-07 14:13:41 +02:00

103 lines
2.9 KiB
TypeScript

/* eslint-disable max-lines */
import { AxiosError } from "axios";
import { useParams } from "next/navigation";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { getChatConfigFromLocalStorage } from "@/lib/api/chat/chat.local";
import { useChatApi } from "@/lib/api/chat/useChatApi";
import { useChatContext } from "@/lib/context/ChatProvider/hooks/useChatContext";
import { useToast } from "@/lib/hooks";
import { useEventTracking } from "@/services/analytics/useEventTracking";
import { useQuestion } from "./useQuestion";
import { ChatQuestion } from "../types";
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
export const useChat = () => {
const { track } = useEventTracking();
const params = useParams();
const [chatId, setChatId] = useState<string | undefined>(
params?.chatId as string | undefined
);
const [generatingAnswer, setGeneratingAnswer] = useState(false);
const { history, setHistory } = useChatContext();
const { publish } = useToast();
const { createChat, getHistory } = useChatApi();
const { addStreamQuestion } = useQuestion();
const { t } = useTranslation(['chat']);
useEffect(() => {
const fetchHistory = async () => {
const currentChatId = chatId;
if (currentChatId === undefined) {
return;
}
const chatHistory = await getHistory(currentChatId);
if (chatId === currentChatId && chatHistory.length > 0) {
setHistory(chatHistory);
}
};
void fetchHistory();
}, [chatId, setHistory]);
const addQuestion = async (question: string, callback?: () => void) => {
try {
setGeneratingAnswer(true);
let currentChatId = chatId;
//if chatId is not set, create a new chat. Chat name is from the first question
if (currentChatId === undefined) {
const chatName = question.split(" ").slice(0, 3).join(" ");
const chat = await createChat(chatName);
currentChatId = chat.chat_id;
setChatId(currentChatId);
}
void track("QUESTION_ASKED");
const chatConfig = getChatConfigFromLocalStorage(currentChatId);
const chatQuestion: ChatQuestion = {
model: chatConfig?.model,
question,
temperature: chatConfig?.temperature,
max_tokens: chatConfig?.maxTokens,
};
await addStreamQuestion(currentChatId, chatQuestion);
callback?.();
} catch (error) {
console.error({ error });
if ((error as AxiosError).response?.status === 429) {
publish({
variant: "danger",
text: t('limit_reached',{ns: 'chat'}),
});
return;
}
publish({
variant: "danger",
text: t('error_occurred',{ns: 'chat'}),
});
} finally {
setGeneratingAnswer(false);
}
};
return {
history,
addQuestion,
generatingAnswer,
chatId,
};
};