Feat: Files uploaded via the dialog box can be uploaded without binding to a dataset. #9590 (#11630)

### What problem does this PR solve?

Feat: Files uploaded via the dialog box can be uploaded without binding
to a dataset. #9590

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

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,
   ]);

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,
   ]);

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<string[]>([]);
-  const [fileMap, setFileMap] = useState<Map<File, string>>(new Map());
+  const [currentFiles, setCurrentFiles] = useState<Record<string, any>[]>([]);
+  const [fileMap, setFileMap] = useState<Map<File, Record<string, any>>>(
+    new Map(),
+  );
 
   type FileUploadParameters = Parameters<
     NonNullable<FileUploadProps['onUpload']>
@@ -20,10 +22,11 @@ export function useUploadFile() {
       if (Array.isArray(files) && files.length) {
         const file = files[0];
         const ret = await uploadAndParseFile({ file, options, conversationId });
-        if (ret?.code === 0 && Array.isArray(ret?.data)) {
-          setFileIds((list) => [...list, ...ret.data]);
+        if (ret?.code === 0) {
+          const data = ret.data;
+          setCurrentFiles((list) => [...list, data]);
           setFileMap((map) => {
-            map.set(files[0], ret.data[0]);
+            map.set(files[0], data);
             return map;
           });
         }
@@ -32,8 +35,8 @@ export function useUploadFile() {
     [uploadAndParseFile],
   );
 
-  const clearFileIds = useCallback(() => {
-    setFileIds([]);
+  const clearFiles = useCallback(() => {
+    setCurrentFiles([]);
     setFileMap(new Map());
   }, []);
 
@@ -45,7 +48,7 @@ export function useUploadFile() {
       }
       const id = fileMap.get(file);
       if (id) {
-        setFileIds((list) => list.filter((item) => item !== id));
+        setCurrentFiles((list) => list.filter((item) => item !== id));
       }
     },
     [cancel, fileMap, loading],
@@ -53,9 +56,9 @@ export function useUploadFile() {
 
   return {
     handleUploadFile,
-    clearFileIds,
-    fileIds,
+    files: currentFiles,
     isUploading: loading,
     removeFile,
+    clearFiles: clearFiles,
   };
 }