remove streaming

Author: mrlynn

mongodb-rag-docs/.docusaurus/client-manifest.json

@@ -504,9 +504,9 @@
     "5354": {
       "js": [
         {
-          "file": "assets/js/runtime~main.d5dee0a9.js",
-          "hash": "03a1c33c41e3b718",
-          "publicPath": "/mongodb-rag/assets/js/runtime~main.d5dee0a9.js"
+          "file": "assets/js/runtime~main.15670ace.js",
+          "hash": "ccf4d0e9ed9eb22d",
+          "publicPath": "/mongodb-rag/assets/js/runtime~main.15670ace.js"
         }
       ]
     },
@@ -621,9 +621,9 @@
     "7522": {
       "js": [
         {
-          "file": "assets/js/e3e8e5bb.7e7fac55.js",
-          "hash": "4a21ad8447d1be8c",
-          "publicPath": "/mongodb-rag/assets/js/e3e8e5bb.7e7fac55.js"
+          "file": "assets/js/e3e8e5bb.112010b1.js",
+          "hash": "e7451f1fee5ebcfb",
+          "publicPath": "/mongodb-rag/assets/js/e3e8e5bb.112010b1.js"
         }
       ]
     },

mongodb-rag-docs/src/components/ChatbotInterface/index.js

@@ -10,25 +10,25 @@ import './ChatbotInterface.css';
 // Sample Questions component as a proper React component
 const SampleQuestions = ({ onSelectQuestion }) => {
   const [visible, setVisible] = useState(true);
-  
+
   // Sample questions that will appear as clickable buttons
   const questions = [
     "How do I configure MongoDB RAG with Ollama?",
     "What's the difference between OpenAI and Ollama embeddings?",
     "Can you fix my config file structure?",
     "How do I troubleshoot connection issues?"
   ];
-  
+
   // Function to handle clicking a question
   const handleQuestionClick = (question) => {
     // Call the callback with the selected question
     onSelectQuestion(question);
     // Hide suggestions
     setVisible(false);
   };
-  
+
   if (!visible) return null;
-  
+
   return (
     <div className="sample-questions">
       <div className="sample-questions-label">Suggested questions:</div>
@@ -58,10 +58,8 @@ export default function ChatbotInterface() {
   const [isLoading, setIsLoading] = useState(false);
   const [sessionId, setSessionId] = useState(null);
   const [showSampleQuestions, setShowSampleQuestions] = useState(true);
-  const [currentStreamedMessage, setCurrentStreamedMessage] = useState('');
   const messagesEndRef = useRef(null);
   const inputRef = useRef(null);
-  const eventSourceRef = useRef(null);
 
   // Auto-scroll to bottom when messages update
   useEffect(() => {
@@ -100,23 +98,11 @@ export default function ChatbotInterface() {
     }
   }, [sessionId, messages]);
 
-  const cleanupEventSource = () => {
-    if (eventSourceRef.current) {
-      eventSourceRef.current.close();
-      eventSourceRef.current = null;
-    }
-  };
-
-  // Cleanup on unmount
-  useEffect(() => {
-    return () => cleanupEventSource();
-  }, []);
-
   // Handle input changes and control sample questions visibility
   const handleInputChange = (e) => {
     const value = e.target.value;
     setInput(value);
-    
+
     // Show sample questions only when input is empty
     setShowSampleQuestions(value.length === 0);
   };
@@ -129,129 +115,42 @@ export default function ChatbotInterface() {
     inputRef.current?.focus();
   };
 
-  const safeJsonParse = (text) => {
-    try {
-      return text ? JSON.parse(text) : null;
-    } catch (error) {
-      console.warn('JSON parse error:', error);
-      return null;
-    }
-  };
 
-  const handleStreamedChat = async (input, history) => {
-    // Clean up any existing EventSource
-    cleanupEventSource();
-  
-    try {
-      // Make initial request without expecting JSON response
-      const response = await fetch('https://mongodb-rag-docs-backend.vercel.app/api/chat', {
-        method: 'POST',
-        headers: { 
-          'Content-Type': 'application/json',
-          'Accept': 'text/event-stream'  // Request SSE response
-        },
-        body: JSON.stringify({
-          query: input,
-          sessionId: sessionId,
-          history: !sessionId ? history : undefined
-        })
-      });
-  
-      if (!response.ok) {
-        throw new Error(`HTTP error! status: ${response.status}`);
-      }
-  
-      if (response.headers.get('content-type')?.includes('text/event-stream')) {
-        // Handle SSE response directly
-        const reader = response.body.getReader();
-        const decoder = new TextDecoder();
-        let buffer = '';
-  
-        while (true) {
-          const { done, value } = await reader.read();
-          if (done) break;
-          
-          buffer += decoder.decode(value, { stream: true });
-          const lines = buffer.split('\n');
-          buffer = lines.pop() || '';
-  
-          for (const line of lines) {
-            if (line.trim()) {
-              const event = safeJsonParse(line);
-              if (event) {
-                if (event.type === 'token') {
-                  setCurrentStreamedMessage(prev => prev + event.content);
-                } else if (event.type === 'sources') {
-                  // Store sources for final message
-                  sourcesData = event.sources;
-                } else if (event.type === 'done') {
-                  // Add final message with sources
-                  setMessages(msgs => [...msgs, {
-                    role: 'assistant',
-                    content: currentStreamedMessage,
-                    sources: sourcesData
-                  }]);
-                  return;
-                }
-              }
-            }
-          }
-        }
-      } else {
-        // Handle regular JSON response
-        const text = await response.text();
-        const data = safeJsonParse(text);
-        
-        if (!data) {
-          throw new Error('Invalid response format');
-        }
-  
-        setMessages(msgs => [...msgs, {
-          role: 'assistant',
-          content: data.answer,
-          sources: data.sources
-        }]);
-      }
-    } catch (error) {
-      console.error('Error in streaming chat:', error);
-      throw error;
-    } finally {
-      cleanupEventSource();
-    }
-  };
-  
   const handleSubmit = async (e) => {
     e.preventDefault();
     if (!input.trim()) return;
-  
+
+    // Add user message
     const userMessage = { role: 'user', content: input };
     setMessages(msgs => [...msgs, userMessage]);
     setInput('');
     setIsLoading(true);
-  
+    setShowSampleQuestions(true);
+
     try {
+      // Call API with session support
       const response = await fetch('https://mongodb-rag-docs-backend.vercel.app/api/chat', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
           query: input,
           sessionId: sessionId,
-          history: !sessionId ? messages : undefined
-        }),
-        // Add request timeout
-        signal: AbortSignal.timeout(45000) // 45 second timeout
+          history: !sessionId ? messages : undefined // Only send history if no sessionId
+        })
       });
-  
+
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
-  
+
       const data = await response.json();
-      
-      if (data.error) {
-        throw new Error(data.error);
+
+      // Store the session ID if this is a new session
+      if (data.sessionId && !sessionId) {
+        setSessionId(data.sessionId);
       }
-  
+
+      // Add bot response with sources
       setMessages(msgs => [
         ...msgs,
         {
@@ -261,38 +160,19 @@ export default function ChatbotInterface() {
         }
       ]);
     } catch (error) {
-      handleError(error);
+      console.error('Chat error:', error);
+      setMessages(msgs => [
+        ...msgs,
+        {
+          role: 'assistant',
+          content: 'Sorry, I encountered an error. Please try again later.'
+        }
+      ]);
     } finally {
       setIsLoading(false);
     }
   };
 
-  const handleError = (error, fallback = true) => {
-    console.error('Chat error:', error);
-    
-    let errorMessage = 'Sorry, I encountered an error. Please try again later.';
-    
-    if (error.response?.status === 504 || error.message?.includes('timed out')) {
-      errorMessage = 'The search is taking longer than expected. You might try:' +
-        '\n1. Rephrasing your question to be more specific' +
-        '\n2. Breaking it into smaller parts' +
-        '\n3. Trying again in a moment';
-    }
-  
-    setMessages(msgs => [
-      ...msgs,
-      {
-        role: 'assistant',
-        content: errorMessage
-      }
-    ]);
-  
-    if (fallback && !error.message?.includes('timed out')) {
-      // Optionally try fallback handling for non-timeout errors
-      handleFallbackChat(input, messages);
-    }
-  };
-
   const clearChat = () => {
     // Reset the chat
     setMessages([
@@ -301,17 +181,17 @@ export default function ChatbotInterface() {
         content: 'Hi! I\'m the MongoDB-RAG chatbot. Ask me anything about using MongoDB-RAG!'
       }
     ]);
-    
+
     // Clear the session ID to start a new session
     setSessionId(null);
-    
+
     // Clear localStorage
     localStorage.removeItem('mongodbRagChatSession');
-    
+
     // Clear input and show sample questions
     setInput('');
     setShowSampleQuestions(true);
-    
+
     // Focus the input field
     inputRef.current?.focus();
   };
@@ -334,7 +214,7 @@ export default function ChatbotInterface() {
                     >
                       {message.content}
                     </ReactMarkdown>
-                    
+
                     {message.sources && message.sources.length > 0 && (
                       <div className="sources">
                         <details>
@@ -359,24 +239,9 @@ export default function ChatbotInterface() {
               </div>
             </div>
           ))}
-          
-          {/* Show streaming message */}
-          {currentStreamedMessage && (
-            <div className="message assistant">
-              <div className="message-avatar">🦉</div>
-              <div className="message-content">
-                <ReactMarkdown
-                  rehypePlugins={[rehypeHighlight, rehypeRaw]}
-                  remarkPlugins={[remarkGfm]}
-                >
-                  {currentStreamedMessage}
-                </ReactMarkdown>
-              </div>
-            </div>
-          )}
-          
+
           {/* Show loading indicator */}
-          {isLoading && !currentStreamedMessage && (
+          {isLoading && (
             <div className="message assistant">
               <div className="message-avatar">🦉</div>
               <div className="message-content">
@@ -386,22 +251,22 @@ export default function ChatbotInterface() {
               </div>
             </div>
           )}
-          
+
           <div ref={messagesEndRef} />
         </div>
       </div>
-      
+
       <div className="input-area">
         {/* Rest of the input area remains unchanged */}
         <div className="input-container">
           <button onClick={clearChat} className="clear-button">
             Clear Chat
           </button>
-          
+
           {showSampleQuestions && (
             <SampleQuestions onSelectQuestion={handleSelectQuestion} />
           )}
-          
+
           <form onSubmit={handleSubmit} className="input-form">
             <input
               ref={inputRef}
@@ -412,8 +277,8 @@ export default function ChatbotInterface() {
               className="chat-input"
               disabled={isLoading}
             />
-            <button 
-              type="submit" 
+            <button
+              type="submit"
               className="send-button"
               disabled={isLoading || !input.trim()}
             >