Updating to test

chatbot.py

@@ -66,7 +66,7 @@ async def text_to_speech(text: str, filename: str):
 
 
 def render_chatbot(code: str, output: str, error: str):
-    """Render the chatbot UI as an integrated panel"""
+    """Render the chatbot UI in a fixed-height, scrollable panel"""
 
     # Initialize session state
     if "conversation" not in st.session_state:
@@ -77,9 +77,17 @@ def render_chatbot(code: str, output: str, error: str):
     # Create bot instance
     bot = CodeAssistantBot()
 
-    # Chat interface
+    # Apply CSS for scrollable chat window
     st.markdown("""
         <style>
+        .chat-container {
+            height: 500px;  /* Fixed height */
+            overflow-y: auto; /* Scrollable */
+            border: 1px solid #ddd;
+            padding: 10px;
+            background-color: #f9f9f9;
+            border-radius: 5px;
+        }
         .chat-message {
             padding: 10px;
             border-radius: 5px;
@@ -92,13 +100,25 @@ def render_chatbot(code: str, output: str, error: str):
             background-color: #f5f5f5;
         }
         </style>
-    """,
-                unsafe_allow_html=True)
-    # Input area
+    """, unsafe_allow_html=True)
+
+    # Chat history in a scrollable container
+    chat_container = st.container()
+    with chat_container:
+        st.markdown('<div class="chat-container">', unsafe_allow_html=True)
+
+        # Display all chat messages
+        for q, a in st.session_state.conversation:
+            st.markdown(f'<div class="chat-message user-message">You: {q}</div>', unsafe_allow_html=True)
+            st.markdown(f'<div class="chat-message bot-message">Assistant: {a}</div>', unsafe_allow_html=True)
+
+        # Close the chat container div
+        st.markdown('</div>', unsafe_allow_html=True)
+
+    # Input area at the bottom
     col1, col2 = st.columns([4, 1])
     with col1:
-        user_input = st.text_input("Ask your Question here",key="chat_input",
-                                   placeholder="Type your question here...")
+        user_input = st.text_input("Ask your Question here", key="chat_input", placeholder="Type your question here...")
     with col2:
         send_clicked = st.button("🚀")  # Button to send the message
 
@@ -106,30 +126,27 @@ def render_chatbot(code: str, output: str, error: str):
         # Get response
         response = bot.analyze_code(code, output, error, user_input)
         st.session_state.conversation.append((user_input, response))
-        user_input = ""
-        
+
         # Generate summary and speech if conversation is long enough
         if len(st.session_state.conversation) > 3:
             with st.spinner("Generating conversation summary..."):
-                summary = bot.summarize_conversation(
-                    st.session_state.conversation)
+                summary = bot.summarize_conversation(st.session_state.conversation)
                 audio_file = f"summary_{st.session_state.audio_count}.wav"
                 asyncio.run(text_to_speech(summary, audio_file))
                 st.session_state.audio_count += 1
 
-                # Display summary in a collapsible section
                 with st.expander("📝 Conversation Summary", expanded=False):
                     st.markdown(summary)
                     st.audio(audio_file, format="audio/wav")
-        
-    # Chat history in a scrollable container
-    chat_container = st.container()
-    with chat_container:
-        for q, a in st.session_state.conversation:
-            st.markdown(
-                f'<div class="chat-message user-message">You:-  {q}</div>',
-                unsafe_allow_html=True)
-            st.markdown(
-                f'<div class="chat-message bot-message">Assistant:-  {a}</div>',
-                unsafe_allow_html=True)
+
+    # **Auto-scroll to bottom (forcing UI refresh)**
+    st.markdown("""
+        <script>
+        var chatDiv = window.parent.document.querySelector('.chat-container');
+        if (chatDiv) {
+            chatDiv.scrollTop = chatDiv.scrollHeight;
+        }
+        </script>
+    """, unsafe_allow_html=True)
+