diff --git a/frontend/app/chat/[chatId]/__tests__/page.test.tsx b/frontend/app/chat/[chatId]/__tests__/page.test.tsx index 697d503daa24..ba54a7b36cbf 100644 --- a/frontend/app/chat/[chatId]/__tests__/page.test.tsx +++ b/frontend/app/chat/[chatId]/__tests__/page.test.tsx @@ -42,6 +42,12 @@ vi.mock("@/lib/context/BrainConfigProvider/brain-config-provider", () => ({ BrainConfigContext: BrainConfigContextMock, })); +vi.mock("@/lib/api/chat/useChatApi", () => ({ + useChatApi: () => ({ + getHistory: () => [], + }), +})); + describe("Chat page", () => { it("should render chat page correctly", () => { const { getByTestId } = render( diff --git a/frontend/app/chat/[chatId]/components/ActionsBar/ActionsBar.tsx b/frontend/app/chat/[chatId]/components/ActionsBar/ActionsBar.tsx index 512e13f66e05..d3df97255e54 100644 --- a/frontend/app/chat/[chatId]/components/ActionsBar/ActionsBar.tsx +++ b/frontend/app/chat/[chatId]/components/ActionsBar/ActionsBar.tsx @@ -1,37 +1,71 @@ +import { useParams } from "next/navigation"; +import { useEffect, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { AiOutlineLoading3Quarters } from "react-icons/ai"; + +import { useChatApi } from "@/lib/api/chat/useChatApi"; + import { ChatInput, KnowledgeToFeed } from "./components"; import { useActionBar } from "./hooks/useActionBar"; import { useKnowledgeUploader } from "./hooks/useKnowledgeUploader"; +import { checkIfHasPendingRequest } from "./utils/checkIfHasPendingRequest"; export const ActionsBar = (): JSX.Element => { const { shouldDisplayUploadCard, setShouldDisplayUploadCard } = useActionBar(); const { addContent, contents, feedBrain, removeContent } = useKnowledgeUploader(); + const { getHistory } = useChatApi(); + const { t } = useTranslation(["chat"]); + const [hasPendingRequests, setHasPendingRequests] = useState(false); + const params = useParams(); - return ( -
{ + const updateNotificationsStatus = async () => { + const chatId = params?.chatId as string | undefined; + if (chatId !== undefined) { + const history = await getHistory(chatId); + setHasPendingRequests(checkIfHasPendingRequest(history)); } - > - {shouldDisplayUploadCard && ( -
- setShouldDisplayUploadCard(false)} - contents={contents} - addContent={addContent} - removeContent={removeContent} - /> + }; + void updateNotificationsStatus(); + }, [getHistory, params?.chatId]); + + return ( + <> + {hasPendingRequests && ( +
+
+ {t("filesUploading")} +
+
)} -
- void feedBrain()} - hasContentToFeedBrain={contents.length > 0} - /> + +
+ {shouldDisplayUploadCard && ( +
+ setShouldDisplayUploadCard(false)} + contents={contents} + addContent={addContent} + removeContent={removeContent} + /> +
+ )} +
+ void feedBrain()} + hasContentToFeedBrain={contents.length > 0} + /> +
-
+ ); }; diff --git a/frontend/app/chat/[chatId]/components/ActionsBar/utils/checkIfHasPendingRequest.ts b/frontend/app/chat/[chatId]/components/ActionsBar/utils/checkIfHasPendingRequest.ts new file mode 100644 index 000000000000..6bab024c9627 --- /dev/null +++ b/frontend/app/chat/[chatId]/components/ActionsBar/utils/checkIfHasPendingRequest.ts @@ -0,0 +1,8 @@ +import { ChatItem } from "../../../types"; + +export const checkIfHasPendingRequest = (chatItems: ChatItem[]): boolean => { + return chatItems.some( + (item) => + item.item_type === "NOTIFICATION" && item.body.status === "Pending" + ); +}; diff --git a/frontend/app/chat/[chatId]/types/index.ts b/frontend/app/chat/[chatId]/types/index.ts index faefcc6ef908..7283b3a5a04d 100644 --- a/frontend/app/chat/[chatId]/types/index.ts +++ b/frontend/app/chat/[chatId]/types/index.ts @@ -18,7 +18,7 @@ export type ChatHistory = { brain_name?: string; }; -type HistoryItemType = "MESSAGE" | "NOTIFICATION"; +type NotificationStatus = "Pending" | "Done"; type Notification = { id: string; @@ -26,13 +26,18 @@ type Notification = { chat_id?: string | null; message?: string | null; action: string; - status: string; + status: NotificationStatus; }; -export type ChatItem = { - item_type: HistoryItemType; - body: ChatHistory | Notification; -}; +export type ChatItem = + | { + item_type: "MESSAGE"; + body: ChatHistory; + } + | { + item_type: "NOTIFICATION"; + body: Notification; + }; export type ChatEntity = { chat_id: UUID; diff --git a/frontend/public/locales/en/chat.json b/frontend/public/locales/en/chat.json index f4a1f1e9a31d..ebb954bfdf0f 100644 --- a/frontend/public/locales/en/chat.json +++ b/frontend/public/locales/en/chat.json @@ -34,5 +34,6 @@ "actions_bar_placeholder": "Ask a question to a @brain and choose your #prompt", "missing_brain": "Please select a brain to chat with", "new_prompt": "Create new prompt", - "feed_brain_placeholder":"Choose which @brain you want to feed with these files" + "feed_brain_placeholder":"Choose which @brain you want to feed with these files", + "filesUploading":"Files uploading" } diff --git a/frontend/public/locales/es/chat.json b/frontend/public/locales/es/chat.json index 1083ffd6e7ea..c8a8d035d4f4 100644 --- a/frontend/public/locales/es/chat.json +++ b/frontend/public/locales/es/chat.json @@ -35,5 +35,6 @@ "title": "Conversa con {{brain}}", "missing_brain": "No hay cerebro seleccionado", "new_prompt": "Crear nueva instrucción", - "feed_brain_placeholder" : "Elige cuál @cerebro quieres alimentar con estos archivos" + "feed_brain_placeholder" : "Elige cuál @cerebro quieres alimentar con estos archivos", + "filesUploading": "Subiendo archivos..." } diff --git a/frontend/public/locales/fr/chat.json b/frontend/public/locales/fr/chat.json index 5d144390bdd4..c7068dc82896 100644 --- a/frontend/public/locales/fr/chat.json +++ b/frontend/public/locales/fr/chat.json @@ -35,5 +35,6 @@ "title": "Discuter avec {{brain}}", "missing_brain": "Veuillez selectionner un cerveau pour discuter", "new_prompt": "Créer un nouveau prompt", - "feed_brain_placeholder" : "Choisissez le @cerveau que vous souhaitez nourrir avec ces fichiers" + "feed_brain_placeholder" : "Choisissez le @cerveau que vous souhaitez nourrir avec ces fichiers", + "filesUploading": "Téléchargement des fichiers..." } diff --git a/frontend/public/locales/pt-br/chat.json b/frontend/public/locales/pt-br/chat.json index 2eb2b689ab8c..8e7852229668 100644 --- a/frontend/public/locales/pt-br/chat.json +++ b/frontend/public/locales/pt-br/chat.json @@ -35,5 +35,6 @@ "title": "Converse com {{brain}}", "missing_brain": "Cérebro não encontrado", "new_prompt": "Criar novo prompt", - "feed_brain_placeholder" : "Escolha qual @cérebro você deseja alimentar com esses arquivos" + "feed_brain_placeholder" : "Escolha qual @cérebro você deseja alimentar com esses arquivos", + "filesUploading":"Arquivos sendo enviados" } diff --git a/frontend/public/locales/ru/chat.json b/frontend/public/locales/ru/chat.json index dc10e08f7d9a..63b1901bc0aa 100644 --- a/frontend/public/locales/ru/chat.json +++ b/frontend/public/locales/ru/chat.json @@ -35,5 +35,6 @@ "title": "Чат с {{brain}}", "missing_brain": "Мозг не найден", "new_prompt": "Создать новый запрос", - "feed_brain_placeholder" : "Выберите, какой @мозг вы хотите питать этими файлами" + "feed_brain_placeholder" : "Выберите, какой @мозг вы хотите питать этими файлами", + "filesUploading": "Загрузка файлов..." } diff --git a/frontend/public/locales/zh-cn/chat.json b/frontend/public/locales/zh-cn/chat.json index 83a84489e09c..4c06570a7d2f 100644 --- a/frontend/public/locales/zh-cn/chat.json +++ b/frontend/public/locales/zh-cn/chat.json @@ -35,5 +35,6 @@ "actions_bar_placeholder": "向@大脑提问，选择您的#提示", "missing_brain": "请选择一个大脑进行聊天", "new_prompt": "新提示", - "feed_brain_placeholder" : "选择要用这些文件喂养的 @大脑" + "feed_brain_placeholder" : "选择要用这些文件喂养的 @大脑", + "filesUploading": "文件上传中..." }