From a26597a696359f840cc4e9d2c9494bfb8dc462bf Mon Sep 17 00:00:00 2001 From: Danny Avila Date: Thu, 28 Aug 2025 23:11:16 -0400 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=87=20refactor:=20Improve=20State=20mg?= =?UTF-8?q?mt.=20for=20File=20uploads=20and=20Tool=20Auth=20(#9359)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 🔧 fix: Ensure loading state is correctly set when files are empty or in progress * 🔧 fix: Update ephemeral agent state on file upload error for execute code tool resource * 🔧 fix: Reset ephemeral agent state for tool when authentication fails * refactor: Pass conversation prop to FileFormChat and AttachFileChat components --- client/src/components/Chat/Input/ChatForm.tsx | 4 ++-- .../components/Chat/Input/Files/AttachFileChat.tsx | 12 ++++++++---- .../components/Chat/Input/Files/FileFormChat.tsx | 5 +++-- client/src/components/Chat/Input/Files/FileRow.tsx | 2 ++ client/src/hooks/Files/useFileHandling.ts | 14 ++++++++++++++ client/src/hooks/Plugins/useToolToggle.ts | 4 ++++ 6 files changed, 33 insertions(+), 8 deletions(-) diff --git a/client/src/components/Chat/Input/ChatForm.tsx b/client/src/components/Chat/Input/ChatForm.tsx index 50fa318b3e..0736c7dc61 100644 --- a/client/src/components/Chat/Input/ChatForm.tsx +++ b/client/src/components/Chat/Input/ChatForm.tsx @@ -253,7 +253,7 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => { handleSaveBadges={handleSaveBadges} setBadges={setBadges} /> - + {endpoint && (
{ )} >
- +
isAgentsEndpoint(endpoint), [endpoint]); diff --git a/client/src/components/Chat/Input/Files/FileFormChat.tsx b/client/src/components/Chat/Input/Files/FileFormChat.tsx index 0dc8618e91..3c01f2d642 100644 --- a/client/src/components/Chat/Input/Files/FileFormChat.tsx +++ b/client/src/components/Chat/Input/Files/FileFormChat.tsx @@ -1,13 +1,14 @@ import { memo } from 'react'; import { useRecoilValue } from 'recoil'; +import type { TConversation } from 'librechat-data-provider'; import { useChatContext } from '~/Providers'; import { useFileHandling } from '~/hooks'; import FileRow from './FileRow'; import store from '~/store'; -function FileFormChat({ disableInputs }: { disableInputs: boolean }) { +function FileFormChat({ conversation }: { conversation: TConversation | null }) { + const { files, setFiles, setFilesLoading } = useChatContext(); const chatDirection = useRecoilValue(store.chatDirection).toLowerCase(); - const { files, setFiles, conversation, setFilesLoading } = useChatContext(); const { endpoint: _endpoint } = conversation ?? { endpoint: null }; const { abortUpload } = useFileHandling(); diff --git a/client/src/components/Chat/Input/Files/FileRow.tsx b/client/src/components/Chat/Input/Files/FileRow.tsx index 47da77bbf9..babb0aef69 100644 --- a/client/src/components/Chat/Input/Files/FileRow.tsx +++ b/client/src/components/Chat/Input/Files/FileRow.tsx @@ -59,10 +59,12 @@ export default function FileRow({ useEffect(() => { if (files.length === 0) { + setFilesLoading(false); return; } if (files.some((file) => file.progress < 1)) { + setFilesLoading(true); return; } diff --git a/client/src/hooks/Files/useFileHandling.ts b/client/src/hooks/Files/useFileHandling.ts index d90c310a93..9deaa78f24 100644 --- a/client/src/hooks/Files/useFileHandling.ts +++ b/client/src/hooks/Files/useFileHandling.ts @@ -1,10 +1,13 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { v4 } from 'uuid'; +import { useSetRecoilState } from 'recoil'; import { useToastContext } from '@librechat/client'; import { useQueryClient } from '@tanstack/react-query'; import { QueryKeys, + Constants, EModelEndpoint, + EToolResources, mergeFileConfig, isAgentsEndpoint, isAssistantsEndpoint, @@ -19,6 +22,7 @@ import useLocalize, { TranslationKeys } from '~/hooks/useLocalize'; import { useDelayedUploadToast } from './useDelayedUploadToast'; import { processFileForUpload } from '~/utils/heicConverter'; import { useChatContext } from '~/Providers/ChatContext'; +import { ephemeralAgentByConvoId } from '~/store'; import { logger, validateFiles } from '~/utils'; import useClientResize from './useClientResize'; import useUpdateFiles from './useUpdateFiles'; @@ -39,6 +43,9 @@ const useFileHandling = (params?: UseFileHandling) => { const abortControllerRef = useRef(null); const { startUploadTimer, clearUploadTimer } = useDelayedUploadToast(); const { files, setFiles, setFilesLoading, conversation } = useChatContext(); + const setEphemeralAgent = useSetRecoilState( + ephemeralAgentByConvoId(conversation?.conversationId ?? Constants.NEW_CONVO), + ); const setError = (error: string) => setErrors((prevErrors) => [...prevErrors, error]); const { addFile, replaceFile, updateFileById, deleteFileById } = useUpdateFiles( params?.fileSetter ?? setFiles, @@ -133,6 +140,13 @@ const useFileHandling = (params?: UseFileHandling) => { const error = _error as TError | undefined; console.log('upload error', error); const file_id = body.get('file_id'); + const tool_resource = body.get('tool_resource'); + if (tool_resource === EToolResources.execute_code) { + setEphemeralAgent((prev) => ({ + ...prev, + [EToolResources.execute_code]: false, + })); + } clearUploadTimer(file_id as string); deleteFileById(file_id as string); diff --git a/client/src/hooks/Plugins/useToolToggle.ts b/client/src/hooks/Plugins/useToolToggle.ts index f95577d4cf..cce9e4fa2e 100644 --- a/client/src/hooks/Plugins/useToolToggle.ts +++ b/client/src/hooks/Plugins/useToolToggle.ts @@ -98,6 +98,10 @@ export function useToolToggle({ if (isAuthenticated !== undefined && !isAuthenticated && setIsDialogOpen) { setIsDialogOpen(true); e?.preventDefault?.(); + setEphemeralAgent((prev) => ({ + ...(prev || {}), + [toolKey]: false, + })); return; }