diff --git a/frontend/app/onboarding/_components/onboarding-upload.tsx b/frontend/app/onboarding/_components/onboarding-upload.tsx index a356aa70..b434cce9 100644 --- a/frontend/app/onboarding/_components/onboarding-upload.tsx +++ b/frontend/app/onboarding/_components/onboarding-upload.tsx @@ -18,390 +18,261 @@ interface OnboardingUploadProps { } const OnboardingUpload = ({ onComplete }: OnboardingUploadProps) => { - const fileInputRef = useRef(null); - const [isUploading, setIsUploading] = useState(false); - const [currentStep, setCurrentStep] = useState(null); - const [uploadedFilename, setUploadedFilename] = useState(null); - const [uploadedTaskId, setUploadedTaskId] = useState(null); - const [shouldCreateFilter, setShouldCreateFilter] = useState(false); - const [isCreatingFilter, setIsCreatingFilter] = useState(false); - const [error, setError] = useState(null); + const fileInputRef = useRef(null); + const [isUploading, setIsUploading] = useState(false); + const [currentStep, setCurrentStep] = useState(null); + const [uploadedFilename, setUploadedFilename] = useState(null); + const [uploadedTaskId, setUploadedTaskId] = useState(null); + const [shouldCreateFilter, setShouldCreateFilter] = useState(false); + const [isCreatingFilter, setIsCreatingFilter] = useState(false); - // Track which tasks we've already handled to prevent infinite loops - const handledFailedTasksRef = useRef>(new Set()); + const createFilterMutation = useCreateFilter(); - const createFilterMutation = useCreateFilter(); + const STEP_LIST = [ + "Uploading your document", + "Generating embeddings", + "Ingesting document", + "Processing your document", + ]; - const STEP_LIST = [ - "Uploading your document", - "Generating embeddings", - "Ingesting document", - "Processing your document", - ]; + // Query tasks to track completion + const { data: tasks } = useGetTasksQuery({ + enabled: currentStep !== null, // Only poll when upload has started + refetchInterval: currentStep !== null ? 1000 : false, // Poll every 1 second during upload + }); - // Query tasks to track completion - const { data: tasks } = useGetTasksQuery({ - enabled: currentStep !== null, // Only poll when upload has started - refetchInterval: currentStep !== null ? 1000 : false, // Poll every 1 second during upload - }); + const { refetch: refetchNudges } = useGetNudgesQuery(null); - // Monitor tasks and call onComplete when file processing is done - useEffect(() => { - if (currentStep === null || !tasks || !uploadedTaskId) { - return; - } + // Monitor tasks and call onComplete when file processing is done + useEffect(() => { + if (currentStep === null || !tasks || !uploadedTaskId) { + return; + } - // Find the task by task ID from the upload response - const matchingTask = tasks.find((task) => task.task_id === uploadedTaskId); + // Find the task by task ID from the upload response + const matchingTask = tasks.find((task) => task.task_id === uploadedTaskId); - // If no matching task found, wait for it to appear - if (!matchingTask) { - return; - } + // If no matching task found, wait for it to appear + if (!matchingTask) { + return; + } - // Skip if this task was already handled as a failed task (from a previous failed upload) - // This prevents processing old failed tasks when a new upload starts - if (handledFailedTasksRef.current.has(matchingTask.task_id)) { - // Check if it's a failed task that we've already handled - const hasFailedFile = - matchingTask.files && - Object.values(matchingTask.files).some( - (file) => file.status === "failed" || file.status === "error", - ); - if (hasFailedFile) { - // This is an old failed task that we've already handled, ignore it - console.log( - "Skipping already-handled failed task:", - matchingTask.task_id, - ); - return; - } - // If it's not a failed task, remove it from handled list (it might have succeeded on retry) - handledFailedTasksRef.current.delete(matchingTask.task_id); - } + // Check if the matching task is still active (pending, running, or processing) + const isTaskActive = + matchingTask.status === "pending" || + matchingTask.status === "running" || + matchingTask.status === "processing"; - // Check if any file failed in the matching task - const hasFailedFile = (() => { - // Must have files object - if (!matchingTask.files || typeof matchingTask.files !== "object") { - return false; - } + // If task is completed or has processed files, complete the onboarding step + if (!isTaskActive || (matchingTask.processed_files ?? 0) > 0) { + // Set to final step to show "Done" + setCurrentStep(STEP_LIST.length); - const fileEntries = Object.values(matchingTask.files); + // Create knowledge filter for uploaded document if requested + // Guard against race condition: only create if not already creating + if (shouldCreateFilter && uploadedFilename && !isCreatingFilter) { + // Reset flags immediately (synchronously) to prevent duplicate creation + setShouldCreateFilter(false); + const filename = uploadedFilename; + setUploadedFilename(null); + setIsCreatingFilter(true); - // Must have at least one file - if (fileEntries.length === 0) { - return false; - } + // Get display name from filename (remove extension for cleaner name) + const displayName = filename.includes(".") + ? filename.substring(0, filename.lastIndexOf(".")) + : filename; - // Check if any file has failed status - return fileEntries.some( - (file) => file.status === "failed" || file.status === "error", - ); - })(); + const queryData = JSON.stringify({ + query: "", + filters: { + data_sources: [filename], + document_types: ["*"], + owners: ["*"], + connector_types: ["*"], + }, + limit: 10, + scoreThreshold: 0, + color: "green", + icon: "file", + }); - // If any file failed, show error and jump back one step (like onboarding-card.tsx) - // Only handle if we haven't already handled this task - if ( - hasFailedFile && - !isCreatingFilter && - !handledFailedTasksRef.current.has(matchingTask.task_id) - ) { - console.error("File failed in task, jumping back one step", matchingTask); + // Wait for filter creation to complete before proceeding + createFilterMutation + .mutateAsync({ + name: displayName, + description: `Filter for ${filename}`, + queryData: queryData, + }) + .then((result) => { + if (result.filter?.id && typeof window !== "undefined") { + localStorage.setItem( + ONBOARDING_USER_DOC_FILTER_ID_KEY, + result.filter.id, + ); + console.log( + "Created knowledge filter for uploaded document", + result.filter.id, + ); + } + }) + .catch((error) => { + console.error("Failed to create knowledge filter:", error); + }) + .finally(() => { + setIsCreatingFilter(false); + // Refetch nudges to get new ones + refetchNudges(); - // Mark this task as handled to prevent infinite loops - handledFailedTasksRef.current.add(matchingTask.task_id); + // Wait a bit before completing (after filter is created) + setTimeout(() => { + onComplete(); + }, 1000); + }); + } else { + // No filter to create, just complete + // Refetch nudges to get new ones + refetchNudges(); - // Extract error messages from failed files - const errorMessages: string[] = []; - if (matchingTask.files) { - Object.values(matchingTask.files).forEach((file) => { - if ( - (file.status === "failed" || file.status === "error") && - file.error - ) { - errorMessages.push(file.error); - } - }); - } + // Wait a bit before completing + setTimeout(() => { + onComplete(); + }, 1000); + } + } + }, [ + tasks, + currentStep, + onComplete, + refetchNudges, + shouldCreateFilter, + uploadedFilename, + uploadedTaskId, + createFilterMutation, + isCreatingFilter, + ]); - // Also check task-level error - if (matchingTask.error) { - errorMessages.push(matchingTask.error); - } + const resetFileInput = () => { + if (fileInputRef.current) { + fileInputRef.current.value = ""; + } + }; - // Use the first error message, or a generic message if no errors found - const errorMessage = - errorMessages.length > 0 - ? errorMessages[0] - : "Document failed to ingest. Please try again with a different file."; + const handleUploadClick = () => { + fileInputRef.current?.click(); + }; - // Set error message and jump back one step - setError(errorMessage); - setCurrentStep(STEP_LIST.length); + const performUpload = async (file: File) => { + setIsUploading(true); + try { + setCurrentStep(0); + const result = await uploadFile(file, true, true); // Pass createFilter=true + console.log("Document upload task started successfully"); - // Clear filter creation flags since ingestion failed - setShouldCreateFilter(false); - setUploadedFilename(null); + // Store task ID to track the specific upload task + if (result.taskId) { + setUploadedTaskId(result.taskId); + } - // Jump back one step after 1 second (go back to upload step) - setTimeout(() => { - setCurrentStep(null); - }, 1000); - return; - } + // Store filename and createFilter flag in state to create filter after ingestion succeeds + if (result.createFilter && result.filename) { + setUploadedFilename(result.filename); + setShouldCreateFilter(true); + } - // Check if the matching task is still active (pending, running, or processing) - const isTaskActive = - matchingTask.status === "pending" || - matchingTask.status === "running" || - matchingTask.status === "processing"; + // Move to processing step - task monitoring will handle completion + setTimeout(() => { + setCurrentStep(1); + }, 1500); + } catch (error) { + const errorMessage = error instanceof Error ? error.message : "Upload failed"; + console.error("Upload failed", errorMessage); - // If task is completed successfully (no failures) and has processed files, complete the onboarding step - if ( - (!isTaskActive || (matchingTask.processed_files ?? 0) > 0) && - !hasFailedFile - ) { - // Set to final step to show "Done" - setCurrentStep(STEP_LIST.length); + // Dispatch event that chat context can listen to + // This avoids circular dependency issues + if (typeof window !== "undefined") { + window.dispatchEvent( + new CustomEvent("ingestionFailed", { + detail: { source: "onboarding" }, + }), + ); + } - // Create knowledge filter for uploaded document if requested - // Guard against race condition: only create if not already creating - if (shouldCreateFilter && uploadedFilename && !isCreatingFilter) { - // Reset flags immediately (synchronously) to prevent duplicate creation - setShouldCreateFilter(false); - const filename = uploadedFilename; - setUploadedFilename(null); - setIsCreatingFilter(true); + // Show error toast notification + toast.error("Document upload failed", { + description: errorMessage, + duration: 5000, + }); - // Get display name from filename (remove extension for cleaner name) - const displayName = filename.includes(".") - ? filename.substring(0, filename.lastIndexOf(".")) - : filename; + // Reset on error + setCurrentStep(null); + setUploadedTaskId(null); + } finally { + setIsUploading(false); + } + }; - const queryData = JSON.stringify({ - query: "", - filters: { - data_sources: [filename], - document_types: ["*"], - owners: ["*"], - connector_types: ["*"], - }, - limit: 10, - scoreThreshold: 0, - color: "green", - icon: "file", - }); + const handleFileChange = async (event: ChangeEvent) => { + const selectedFile = event.target.files?.[0]; + if (!selectedFile) { + resetFileInput(); + return; + } - // Wait for filter creation to complete before proceeding - createFilterMutation - .mutateAsync({ - name: displayName, - description: `Filter for ${filename}`, - queryData: queryData, - }) - .then((result) => { - if (result.filter?.id && typeof window !== "undefined") { - localStorage.setItem( - ONBOARDING_USER_DOC_FILTER_ID_KEY, - result.filter.id, - ); - console.log( - "Created knowledge filter for uploaded document", - result.filter.id, - ); - } - }) - .catch((error) => { - console.error("Failed to create knowledge filter:", error); - }) - .finally(() => { - setIsCreatingFilter(false); - - // Wait a bit before completing (after filter is created) - setTimeout(() => { - onComplete(); - }, 1000); - }); - } else { - // No filter to create, just complete + try { + await performUpload(selectedFile); + } catch (error) { + console.error( + "Unable to prepare file for upload", + (error as Error).message, + ); + } finally { + resetFileInput(); + } + }; - // Wait a bit before completing - setTimeout(() => { - onComplete(); - }, 1000); - } - } - }, [ - tasks, - currentStep, - onComplete, - shouldCreateFilter, - uploadedFilename, - uploadedTaskId, - createFilterMutation, - isCreatingFilter, - ]); - - const resetFileInput = () => { - if (fileInputRef.current) { - fileInputRef.current.value = ""; - } - }; - - const handleUploadClick = () => { - // Clear any previous error when user clicks to upload again - setError(null); - fileInputRef.current?.click(); - }; - - const performUpload = async (file: File) => { - setIsUploading(true); - // Clear any previous error when starting a new upload - setError(null); - // Clear handled tasks ref to allow retry - handledFailedTasksRef.current.clear(); - // Reset task ID to prevent matching old failed tasks - setUploadedTaskId(null); - // Clear filter creation flags - setShouldCreateFilter(false); - setUploadedFilename(null); - - try { - setCurrentStep(0); - const result = await uploadFile(file, true, true); // Pass createFilter=true - console.log("Document upload task started successfully"); - - // Store task ID to track the specific upload task - if (result.taskId) { - setUploadedTaskId(result.taskId); - } - - // Store filename and createFilter flag in state to create filter after ingestion succeeds - if (result.createFilter && result.filename) { - setUploadedFilename(result.filename); - setShouldCreateFilter(true); - } - - // Move to processing step - task monitoring will handle completion - setTimeout(() => { - setCurrentStep(1); - }, 1500); - } catch (error) { - const errorMessage = - error instanceof Error ? error.message : "Upload failed"; - console.error("Upload failed", errorMessage); - - // Dispatch event that chat context can listen to - // This avoids circular dependency issues - if (typeof window !== "undefined") { - window.dispatchEvent( - new CustomEvent("ingestionFailed", { - detail: { source: "onboarding" }, - }), - ); - } - - // Show error toast notification - toast.error("Document upload failed", { - description: errorMessage, - duration: 5000, - }); - - // Reset on error - setCurrentStep(null); - setUploadedTaskId(null); - setError(errorMessage); - setShouldCreateFilter(false); - setUploadedFilename(null); - } finally { - setIsUploading(false); - } - }; - - const handleFileChange = async (event: ChangeEvent) => { - const selectedFile = event.target.files?.[0]; - if (!selectedFile) { - resetFileInput(); - return; - } - - try { - await performUpload(selectedFile); - } catch (error) { - console.error( - "Unable to prepare file for upload", - (error as Error).message, - ); - } finally { - resetFileInput(); - } - }; - - return ( - - {currentStep === null ? ( - -
- - {error && ( - -
- - - {error} - -
- - )} - -
- -
- -
- - ) : ( - - - - )} - - ); + return ( + + {currentStep === null ? ( + + + + + ) : ( + + + + )} + + ); }; export default OnboardingUpload; diff --git a/frontend/components/chat-renderer.tsx b/frontend/components/chat-renderer.tsx index cceb99c7..a0e2a9d4 100644 --- a/frontend/components/chat-renderer.tsx +++ b/frontend/components/chat-renderer.tsx @@ -172,12 +172,14 @@ export function ChatRenderer({ // Mark onboarding as complete in context setOnboardingComplete(true); - // Clear ALL conversation state so next message starts fresh - await startNewConversation(); - - // Store the user document filter as default for new conversations and load it + // Store the user document filter as default for new conversations FIRST + // This must happen before startNewConversation() so the filter is available await storeDefaultFilterForNewConversations(true); + // Clear ALL conversation state so next message starts fresh + // This will pick up the default filter we just set + await startNewConversation(); + // Clean up onboarding filter IDs now that we've set the default if (typeof window !== "undefined") { localStorage.removeItem(ONBOARDING_OPENRAG_DOCS_FILTER_ID_KEY); diff --git a/frontend/contexts/chat-context.tsx b/frontend/contexts/chat-context.tsx index 611c3324..90c83023 100644 --- a/frontend/contexts/chat-context.tsx +++ b/frontend/contexts/chat-context.tsx @@ -262,6 +262,10 @@ export function ChatProvider({ children }: ChatProviderProps) { const startNewConversation = useCallback(async () => { console.log("[CONVERSATION] Starting new conversation"); + // Check if there's existing conversation data - if so, this is a manual "new conversation" action + // Check state values before clearing them + const hasExistingConversation = conversationData !== null || placeholderConversation !== null; + // Clear current conversation data and reset state setCurrentConversationId(null); setPreviousResponseIds({ chat: null, langflow: null }); @@ -295,15 +299,22 @@ export function ChatProvider({ children }: ChatProviderProps) { setConversationFilterState(null); } } else { - console.log("[CONVERSATION] No default filter set"); - setConversationFilterState(null); + // No default filter in localStorage + if (hasExistingConversation) { + // User is manually starting a new conversation - clear the filter + console.log("[CONVERSATION] Manual new conversation - clearing filter"); + setConversationFilterState(null); + } else { + // First time after onboarding - preserve existing filter if set + // This prevents clearing the filter when startNewConversation is called multiple times during onboarding + console.log("[CONVERSATION] No default filter set, preserving existing filter if any"); + // Don't clear the filter - it may have been set by storeDefaultFilterForNewConversations + } } - } else { - setConversationFilterState(null); } // Create a temporary placeholder conversation to show in sidebar - const placeholderConversation: ConversationData = { + const newPlaceholderConversation: ConversationData = { response_id: "new-conversation-" + Date.now(), title: "New conversation", endpoint: endpoint, @@ -318,10 +329,10 @@ export function ChatProvider({ children }: ChatProviderProps) { last_activity: new Date().toISOString(), }; - setPlaceholderConversation(placeholderConversation); + setPlaceholderConversation(newPlaceholderConversation); // Force immediate refresh to ensure sidebar shows correct state refreshConversations(true); - }, [endpoint, refreshConversations]); + }, [endpoint, refreshConversations, conversationData, placeholderConversation]); const addConversationDoc = useCallback((filename: string) => { setConversationDocs((prev) => [