Update app.py

app.py

@@ -9,6 +9,9 @@ from sentence_transformers import SentenceTransformer
 import google.generativeai as genai
 import uuid
 
+# Page configuration
+st.set_page_config(layout="wide")
+
 # Initialize Gemini API
 genai.configure(api_key="AIzaSyAxUd2tS-qj9C7frYuHRsv92tziXHgIvLo")
 
@@ -21,6 +24,8 @@ if 'scraped' not in st.session_state:
     st.session_state.scraped = False
 if 'collection_name' not in st.session_state:
     st.session_state.collection_name = "default_collection"
+if 'chat_history' not in st.session_state:
+    st.session_state.chat_history = []
 
 # Initialize embedding model
 embedding_model = SentenceTransformer("all-MiniLM-L6-v2")
@@ -87,12 +92,37 @@ def ask_question(query, collection_name):
     response = model.generate_content(full_prompt)
     return response.text
 
-# Main UI
-st.title("Web Scraper & Q&A Chatbot")
+# Create two columns: sidebar for database and main content
+col1, main_col = st.columns([1, 3])
 
-# Scraping section
-with st.container():
-    st.subheader("Step 1: Scrape a Website")
+# Database management sidebar
+with col1:
+    st.header("Database Management")
+    
+    # List available collections
+    try:
+        # Fix for ChromaDB v0.6.0 - list_collections() now returns only names
+        collection_names = chroma_client.list_collections()
+        
+        if collection_names:
+            st.write("Available data collections:")
+            selected_collection = st.selectbox("Select a collection to query:", collection_names)
+            
+            if selected_collection and st.button("Load Selected Collection"):
+                st.session_state.collection_name = selected_collection
+                st.session_state.scraped = True
+                st.success(f"Loaded collection: {selected_collection}")
+                st.rerun()
+    except Exception as e:
+        st.error(f"Error: {str(e)}")
+    
+    # Add a button to clear the session and start over
+    if st.button("Clear Chat History"):
+        st.session_state.chat_history = []
+        st.rerun()
+    
+    # Scraping section
+    st.header("Step 1: Scrape a Website")
     
     url = st.text_input("Enter the URL to scrape:")
     
@@ -102,63 +132,64 @@ with st.container():
                 result = scrape_text(url)
                 st.success(result)
 
-# Q&A section - only appears after scraping is complete
-if st.session_state.scraped:
-    with st.container():
+# Main content area
+with main_col:
+    st.title("Web Scraper & Q&A Chatbot")
+    
+    # Use a container with custom CSS for the scrollable chat area
+    chat_container = st.container()
+    
+    # Apply custom CSS for the chat container
+    st.markdown("""
+    <style>
+    .chat-container {
+        height: 500px;
+        overflow-y: auto;
+        border: 1px solid #ddd;
+        border-radius: 5px;
+        padding: 15px;
+        margin-bottom: 10px;
+        background-color: #f9f9f9;
+    }
+    .stChatInputContainer {
+        position: sticky;
+        bottom: 0;
+        background-color: white;
+        padding-top: 10px;
+        z-index: 100;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+    
+    # Q&A section - only appears after scraping is complete
+    if st.session_state.scraped:
         st.subheader("Step 2: Ask Questions About the Scraped Content")
-        st.write("Ask a question about the content you've scraped:")
         
-        # Chat history
-        if 'chat_history' not in st.session_state:
-            st.session_state.chat_history = []
-            
+        # Use a div with our custom class for the scrollable area
+        st.markdown('<div class="chat-container">', unsafe_allow_html=True)
+        
         # Display chat history
         for message in st.session_state.chat_history:
-            with st.chat_message(message["role"]):
+            with chat_container.chat_message(message["role"]):
                 st.write(message["content"])
         
-        # Input for new question
+        st.markdown('</div>', unsafe_allow_html=True)
+        
+        # Input for new question - always at the bottom
         user_query = st.chat_input("Ask your question here")
         
         if user_query:
             # Add user question to chat history
             st.session_state.chat_history.append({"role": "user", "content": user_query})
             
-            # Display user question
-            with st.chat_message("user"):
-                st.write(user_query)
-            
-            # Get and display answer
-            with st.chat_message("assistant"):
-                with st.spinner("Searching database..."):
-                    answer = ask_question(user_query, st.session_state.collection_name)
-                    st.write(answer)
-                    
+            # Get answer
+            with st.spinner("Searching database..."):
+                answer = ask_question(user_query, st.session_state.collection_name)
+                
             # Add answer to chat history
             st.session_state.chat_history.append({"role": "assistant", "content": answer})
-
-# Selection of existing collections
-with st.sidebar:
-    st.header("Database Management")
-    
-    # List available collections
-    try:
-        # Fix for ChromaDB v0.6.0 - list_collections() now returns only names
-        collection_names = chroma_client.list_collections()
-        
-        if collection_names:
-            st.write("Available data collections:")
-            selected_collection = st.selectbox("Select a collection to query:", collection_names)
             
-            if selected_collection and st.button("Load Selected Collection"):
-                st.session_state.collection_name = selected_collection
-                st.session_state.scraped = True
-                st.success(f"Loaded collection: {selected_collection}")
-                st.rerun()
-    except Exception as e:
-        st.error(f"Error: {str(e)}")
-    
-    # Add a button to clear the session and start over
-    if st.button("Clear Chat History"):
-        st.session_state.chat_history = []
-        st.rerun()
+            # Rerun to update the UI with new messages
+            st.rerun()
+    else:
+        st.info("Please scrape a website or load a collection to start chatting.")