) => {
- // check if it was shift + enter
- if (event.key === 'Enter' && event.shiftKey) return;
- if (event.key !== 'Enter') return;
- if (sendDisabled || isUploadingFile || sendLoading) return;
-
- event.preventDefault();
- handlePressEnter();
- },
- [sendDisabled, isUploadingFile, sendLoading, handlePressEnter],
- );
-
- const handleRemove = useCallback(
- async (file: UploadFile) => {
- const ids = get(file, 'response.data', []);
- // Upload Successfully
- if (Array.isArray(ids) && ids.length) {
- if (isShared) {
- await deleteDocument(ids);
- } else {
- await removeDocument(ids[0]);
- }
- setFileList((preList) => {
- return preList.filter((x) => getFileId(x) !== ids[0]);
- });
- } else {
- // Upload failed
- setFileList((preList) => {
- return preList.filter((x) => x.uid !== file.uid);
- });
- }
- },
- [removeDocument, deleteDocument, isShared],
- );
-
- const handleStopOutputMessage = useCallback(() => {
- stopOutputMessage?.();
- }, [stopOutputMessage]);
-
- const getDocumentInfoById = useCallback(
- (id: string) => {
- return documentInfos.find((x) => x.id === id);
- },
- [documentInfos],
- );
-
- useEffect(() => {
- const ids = getFileIds(fileList);
- setDocumentIds(ids);
- }, [fileList, setDocumentIds]);
-
- useEffect(() => {
- if (
- conversationIdRef.current &&
- conversationId !== conversationIdRef.current
- ) {
- setFileList([]);
- }
- conversationIdRef.current = conversationId;
- }, [conversationId, setFileList]);
-
- return (
-
-
-
-
- {fileList.length > 0 && (
- {
- const id = getFileId(item);
- const documentInfo = getDocumentInfoById(id);
- const fileExtension = getExtension(documentInfo?.name ?? '');
- const fileName = item.originFileObj?.name ?? '';
-
- return (
-
-
-
- {item.status === 'uploading' ? (
-
- }
- />
- ) : item.status === 'error' ? (
-
- ) : (
-
- )}
-
-
- {fileName}
-
- {item.status === 'error' ? (
- t('uploadFailed')
- ) : (
- <>
- {item.percent !== 100 ? (
- t('uploading')
- ) : !item.response ? (
- t('parsing')
- ) : (
-
- {fileExtension?.toUpperCase()},
-
- {formatBytes(
- getDocumentInfoById(id)?.size ?? 0,
- )}
-
-
- )}
- >
- )}
-
-
-
- {item.status !== 'uploading' && (
-
- handleRemove(item)}
- />
-
- )}
-
-
- );
- }}
- />
- )}
- 0 ? '50%' : '100%',
- }}
- >
- {showUploadIcon && (
- {
- return false;
- }}
- >
-
-
- )}
- {sendLoading ? (
-
- ) : (
-
- )}
-
-
-
- );
-};
-
-export default memo(MessageInput);
diff --git a/web/src/components/message-item/index.tsx b/web/src/components/message-item/index.tsx
index dbd38aef4..e42a73f96 100644
--- a/web/src/components/message-item/index.tsx
+++ b/web/src/components/message-item/index.tsx
@@ -4,19 +4,16 @@ import {
IMessage,
IReference,
IReferenceChunk,
+ UploadResponseDataType,
} from '@/interfaces/database/chat';
import classNames from 'classnames';
-import { memo, useCallback, useEffect, useMemo } from 'react';
+import { memo, useCallback, useMemo } from 'react';
-import {
- useFetchDocumentInfosByIds,
- useFetchDocumentThumbnailsByIds,
-} from '@/hooks/document-hooks';
import { IRegenerateMessage, IRemoveMessageById } from '@/hooks/logic-hooks';
import { cn } from '@/lib/utils';
import MarkdownContent from '../markdown-content';
import { ReferenceDocumentList } from '../next-message-item/reference-document-list';
-import { InnerUploadedMessageFiles } from '../next-message-item/uploaded-message-files';
+import { UploadedMessageFiles } from '../next-message-item/uploaded-message-files';
import { RAGFlowAvatar } from '../ragflow-avatar';
import { useTheme } from '../theme-provider';
import { AssistantGroupButton, UserGroupButton } from './group-button';
@@ -55,9 +52,10 @@ const MessageItem = ({
const { theme } = useTheme();
const isAssistant = item.role === MessageType.Assistant;
const isUser = item.role === MessageType.User;
- const { data: documentList, setDocumentIds } = useFetchDocumentInfosByIds();
- const { data: documentThumbnails, setDocumentIds: setIds } =
- useFetchDocumentThumbnailsByIds();
+
+ const uploadedFiles = useMemo(() => {
+ return item?.files ?? [];
+ }, [item?.files]);
const referenceDocumentList = useMemo(() => {
return reference?.doc_aggs ?? [];
@@ -67,17 +65,6 @@ const MessageItem = ({
regenerateMessage?.(item);
}, [regenerateMessage, item]);
- useEffect(() => {
- const ids = item?.doc_ids ?? [];
- if (ids.length) {
- setDocumentIds(ids);
- const documentIds = ids.filter((x) => !(x in documentThumbnails));
- if (documentIds.length) {
- setIds(documentIds);
- }
- }
- }, [item.doc_ids, setDocumentIds, setIds, documentThumbnails]);
-
return (
)}
- {isUser && documentList.length > 0 && (
-
- )}
+ {isUser &&
+ Array.isArray(uploadedFiles) &&
+ uploadedFiles.length > 0 && (
+
+ )}
diff --git a/web/src/components/next-message-item/uploaded-message-files.tsx b/web/src/components/next-message-item/uploaded-message-files.tsx
index 9e24504bc..bf1894626 100644
--- a/web/src/components/next-message-item/uploaded-message-files.tsx
+++ b/web/src/components/next-message-item/uploaded-message-files.tsx
@@ -1,13 +1,13 @@
+import { UploadResponseDataType } from '@/interfaces/database/chat';
import { IDocumentInfo } from '@/interfaces/database/document';
import { getExtension } from '@/utils/document-util';
import { formatBytes } from '@/utils/file-util';
import { memo } from 'react';
import FileIcon from '../file-icon';
-import NewDocumentLink from '../new-document-link';
import SvgIcon from '../svg-icon';
interface IProps {
- files?: File[] | IDocumentInfo[];
+ files?: File[] | IDocumentInfo[] | UploadResponseDataType[];
}
type NameWidgetType = {
@@ -15,16 +15,16 @@ type NameWidgetType = {
size: number;
id?: string;
};
-function NameWidget({ name, size, id }: NameWidgetType) {
+function NameWidget({ name, size }: NameWidgetType) {
return (
- {id ? (
+ {/* {id ? (
{name}
) : (
-
{name}
- )}
+ )} */}
+
{name}
{formatBytes(size)}
);
diff --git a/web/src/hooks/document-hooks.ts b/web/src/hooks/document-hooks.ts
index aa04bad33..f33ef6108 100644
--- a/web/src/hooks/document-hooks.ts
+++ b/web/src/hooks/document-hooks.ts
@@ -6,7 +6,6 @@ import {
IDocumentMetaRequestBody,
} from '@/interfaces/request/document';
import i18n from '@/locales/config';
-import chatService from '@/services/chat-service';
import kbService, { listDocument } from '@/services/knowledge-service';
import api, { api_host } from '@/utils/api';
import { buildChunkHighlights } from '@/utils/document-util';
@@ -428,39 +427,6 @@ export const useDeleteDocument = () => {
return { data, loading, deleteDocument: mutateAsync };
};
-export const useUploadAndParseDocument = (uploadMethod: string) => {
- const {
- data,
- isPending: loading,
- mutateAsync,
- } = useMutation({
- mutationKey: ['uploadAndParseDocument'],
- mutationFn: async ({
- conversationId,
- fileList,
- }: {
- conversationId: string;
- fileList: UploadFile[];
- }) => {
- try {
- const formData = new FormData();
- formData.append('conversation_id', conversationId);
- fileList.forEach((file: UploadFile) => {
- formData.append('file', file as any);
- });
- if (uploadMethod === 'upload_and_parse') {
- const data = await kbService.upload_and_parse(formData);
- return data?.data;
- }
- const data = await chatService.uploadAndParseExternal(formData);
- return data?.data;
- } catch (error) {}
- },
- });
-
- return { data, loading, uploadAndParseDocument: mutateAsync };
-};
-
export const useParseDocument = () => {
const {
data,
diff --git a/web/src/hooks/use-chat-request.ts b/web/src/hooks/use-chat-request.ts
index 25155e1fc..77663ea9b 100644
--- a/web/src/hooks/use-chat-request.ts
+++ b/web/src/hooks/use-chat-request.ts
@@ -11,6 +11,7 @@ import { IAskRequestBody } from '@/interfaces/request/chat';
import { useGetSharedChatSearchParams } from '@/pages/next-chats/hooks/use-send-shared-message';
import { isConversationIdExist } from '@/pages/next-chats/utils';
import chatService from '@/services/next-chat-service';
+import api from '@/utils/api';
import { buildMessageListWithUuid, getConversationId } from '@/utils/chat';
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { useDebounce } from 'ahooks';
@@ -427,6 +428,7 @@ export function useUploadAndParseFile() {
const { data } = await chatService.uploadAndParse(
{
+ url: api.upload_and_parse(conversationId || id),
signal: controller.current.signal,
data: formData,
onUploadProgress: ({ progress }) => {
diff --git a/web/src/interfaces/database/chat.ts b/web/src/interfaces/database/chat.ts
index fb409b05e..dbdf78a73 100644
--- a/web/src/interfaces/database/chat.ts
+++ b/web/src/interfaces/database/chat.ts
@@ -96,7 +96,7 @@ export interface Message {
id?: string;
audio_binary?: string;
data?: any;
- files?: File[];
+ files?: (File | UploadResponseDataType)[];
chatBoxId?: string;
attachment?: IAttachment;
}
@@ -192,3 +192,14 @@ export interface IMessage extends Message {
export interface IClientConversation extends IConversation {
message: IMessage[];
}
+
+export interface UploadResponseDataType {
+ created_at: number;
+ created_by: string;
+ extension: string;
+ id: string;
+ mime_type: string;
+ name: string;
+ preview_url: null;
+ size: number;
+}
diff --git a/web/src/pages/next-chats/hooks/use-send-chat-message.ts b/web/src/pages/next-chats/hooks/use-send-chat-message.ts
index 6263f6c23..50c80e05c 100644
--- a/web/src/pages/next-chats/hooks/use-send-chat-message.ts
+++ b/web/src/pages/next-chats/hooks/use-send-chat-message.ts
@@ -86,7 +86,7 @@ export const useSendMessage = (controller: AbortController) => {
const { conversationId, isNew } = useGetChatSearchParams();
const { handleInputChange, value, setValue } = useHandleMessageInputChange();
- const { handleUploadFile, fileIds, clearFileIds, isUploading, removeFile } =
+ const { handleUploadFile, isUploading, removeFile, files, clearFiles } =
useUploadFile();
const { send, answer, done } = useSendMessageWithSse(
@@ -208,7 +208,7 @@ export const useSendMessage = (controller: AbortController) => {
addNewestQuestion({
content: value,
- doc_ids: fileIds,
+ files: files,
id,
role: MessageType.User,
});
@@ -218,16 +218,16 @@ export const useSendMessage = (controller: AbortController) => {
id,
content: value.trim(),
role: MessageType.User,
- doc_ids: fileIds,
+ files: files,
});
}
- clearFileIds();
+ clearFiles();
}, [
value,
addNewestQuestion,
- fileIds,
+ files,
done,
- clearFileIds,
+ clearFiles,
setValue,
handleSendMessage,
]);
diff --git a/web/src/pages/next-chats/hooks/use-send-multiple-message.ts b/web/src/pages/next-chats/hooks/use-send-multiple-message.ts
index 34a2c099d..4b60e05f0 100644
--- a/web/src/pages/next-chats/hooks/use-send-multiple-message.ts
+++ b/web/src/pages/next-chats/hooks/use-send-multiple-message.ts
@@ -29,7 +29,7 @@ export function useSendMultipleChatMessage(
api.completeConversation,
);
- const { handleUploadFile, fileIds, clearFileIds } = useUploadFile();
+ const { handleUploadFile, files, clearFiles } = useUploadFile();
const { setFormRef, getLLMConfigById, isLLMConfigEmpty } =
useBuildFormRefs(chatBoxIds);
@@ -181,7 +181,7 @@ export function useSendMultipleChatMessage(
id,
role: MessageType.User,
chatBoxId,
- doc_ids: fileIds,
+ files,
});
}
});
@@ -195,22 +195,22 @@ export function useSendMultipleChatMessage(
id,
content: value.trim(),
role: MessageType.User,
- doc_ids: fileIds,
+ files,
},
chatBoxId,
});
}
});
}
- clearFileIds();
+ clearFiles();
}, [
value,
chatBoxIds,
allDone,
- clearFileIds,
+ clearFiles,
isLLMConfigEmpty,
addNewestQuestion,
- fileIds,
+ files,
setValue,
sendMessage,
]);
diff --git a/web/src/pages/next-chats/hooks/use-upload-file.ts b/web/src/pages/next-chats/hooks/use-upload-file.ts
index 66eaef689..1562b2268 100644
--- a/web/src/pages/next-chats/hooks/use-upload-file.ts
+++ b/web/src/pages/next-chats/hooks/use-upload-file.ts
@@ -4,8 +4,10 @@ import { useCallback, useState } from 'react';
export function useUploadFile() {
const { uploadAndParseFile, loading, cancel } = useUploadAndParseFile();
- const [fileIds, setFileIds] = useState([]);
- const [fileMap, setFileMap] = useState