Fix: Fixed the issue where deleted images in the agent chat box would still be sent to the backend. (#12992)

### What problem does this PR solve?

Fix: Fixed the issue where deleted images in the agent chat box would
still be sent to the backend.
### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/pages/agent/chat/box.tsx

@@ -36,6 +36,7 @@ function AgentChatBox() {
     sendFormMessage,
     findReferenceByMessageId,
     appendUploadResponseList,
+    removeFile,
   } = useSendAgentMessage({ refetch });
 
   const { visible, hideModal, documentId, selectedChunk, clickDocumentButton } =
@@ -130,6 +131,7 @@ function AgentChatBox() {
             onInputChange={handleInputChange}
             stopOutputMessage={stopOutputMessage}
             onUpload={handleUploadFile}
+            removeFile={removeFile}
             conversationId=""
           />
         )}

web/src/pages/agent/chat/use-send-agent-message.ts

@@ -183,12 +183,20 @@ export function useSetUploadResponseData() {
     setFileList([]);
   }, []);
 
+  const removeFile = useCallback((file: File) => {
+    setFileList((prev) => prev.filter((f) => f !== file));
+    setUploadResponseList((prev) =>
+      prev.filter((item) => item.name !== file.name),
+    );
+  }, []);
+
   return {
     uploadResponseList,
     fileList,
     setUploadResponseList,
     appendUploadResponseList: append,
     clearUploadResponseList: clear,
+    removeFile,
   };
 }
 
@@ -251,6 +259,7 @@ export const useSendAgentMessage = ({
     clearUploadResponseList,
     uploadResponseList,
     fileList,
+    removeFile,
   } = useSetUploadResponseData();
 
   const { stopMessage } = useStopMessage();
@@ -461,5 +470,6 @@ export const useSendAgentMessage = ({
     appendUploadResponseList,
     addNewestOneAnswer,
     sendMessage,
+    removeFile,
   };
 };