Update app.py

app.py

@@ -35,7 +35,7 @@ st.set_page_config(page_title="PDF Assistant", page_icon="📘", layout="wide")
 # ---------------- CSS ----------------
 st.markdown("""
 <style>
-/* 1. SCROLL FIX FOR SIDEBAR & MAIN AREA */
+/* 1. SCROLL FIX FOR SIDEBAR */
 [data-testid="stSidebar"] {
     position: fixed;
     overflow-y: hidden !important;
@@ -43,13 +43,29 @@ st.markdown("""
     z-index: 99;
 }
 
+/* 2. FIXED HEADER STYLING */
+/* This pins the title to the top and adds a background so chat flows under it */
+.fixed-header {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    background-color: #0e1117; /* Match app background */
+    z-index: 98; /* Below sidebar, above content */
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+    text-align: center;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+/* 3. ADJUST MAIN CONTENT TO ACCOUNT FOR FIXED HEADER */
 .main .block-container {
-    overflow-y: auto;
-    height: 100vh;
+    margin-top: 6rem; /* Push content down so it doesn't hide behind header */
     padding-bottom: 5rem;
+    overflow-y: auto; /* Allow scrolling */
 }
 
-/* 2. SIDEBAR BUTTON STYLING (Vertical & Uniform) */
+/* 4. SIDEBAR BUTTON STYLING */
 [data-testid="stSidebar"] .stButton button {
     width: 100%;
     border-radius: 8px;
@@ -57,25 +73,12 @@ st.markdown("""
     margin-bottom: 6px;
 }
 
-/* 3. HIDE UPLOADED FILE LIST BELOW UPLOADER */
-/* This specifically hides the list of file names that appears below the browse button */
+/* 5. HIDE UPLOADED FILE LIST */
 section[data-testid="stFileUploader"] ul {
     display: none;
 }
-/* Also hide the small 'Limit 200MB' text if desired, optional:
-section[data-testid="stFileUploader"] small {
-    display: none;
-} 
-*/
-
-/* 4. CHAT & UI STYLING */
-:root {
-    --primary-color: #1e3a8a;
-    --background-color: #0e1117;
-    --secondary-background-color: #1a1d29;
-    --text-color: #f0f2f6;
-}
 
+/* 6. CHAT BUBBLES */
 .chat-user {
     background: #2d3748;
     padding: 12px;
@@ -83,10 +86,10 @@ section[data-testid="stFileUploader"] small {
     margin: 6px 0 6px auto;
     max-width: 85%;
     text-align: right;
-    color: var(--text-color);
+    color: #f0f2f6;
 }
 .chat-bot {
-    background: var(--primary-color);
+    background: #1e3a8a;
     padding: 12px;
     border-radius: 10px 10px 10px 2px;
     margin: 6px auto 6px 0;
@@ -94,7 +97,6 @@ section[data-testid="stFileUploader"] small {
     text-align: left;
     color: #ffffff;
 }
-
 .sources {
     font-size: 0.8em;
     opacity: 0.7;
@@ -103,20 +105,15 @@ section[data-testid="stFileUploader"] small {
     padding-top: 5px;
 }
 
-/* 5. CENTER TITLE STYLING */
-.title-container {
-    text-align: center;
-    margin-bottom: 20px;
-}
+/* 7. TITLE TEXT */
 .title-text {
-    font-size: 3rem;
+    font-size: 2.5rem;
     font-weight: 800;
     margin: 0;
 }
 .creator-text {
-    font-size: 1.1rem;
+    font-size: 1rem;
     font-weight: 500;
-    margin-top: -5px;
     color: #cccccc;
 }
 .creator-text a {
@@ -124,7 +121,7 @@ section[data-testid="stFileUploader"] small {
     text-decoration: none;
 }
 
-/* 6. INPUT FORM STYLING */
+/* 8. INPUT FORM STYLING */
 [data-testid="stForm"] {
     border: none;
     padding: 0;
@@ -132,6 +129,17 @@ section[data-testid="stFileUploader"] small {
 </style>
 """, unsafe_allow_html=True)
 
+# ---------------- FIXED HEADER ----------------
+st.markdown("""
+<div class="fixed-header">
+    <div class="title-text">📘 PDF Assistant</div>
+    <div class="creator-text">
+        <a href="https://www.linkedin.com/in/abhishek-iitr/" target="_blank">Abhishek Saxena</a>
+    </div>
+</div>
+""", unsafe_allow_html=True)
+
+
 # ---------------- SESSION STATE ----------------
 if "chat" not in st.session_state:
     st.session_state.chat = []
@@ -162,7 +170,6 @@ def clear_memory():
         torch.cuda.empty_cache()
 
 def process_pdf(uploaded_file):
-    """Process uploaded PDF and create vectorstore."""
     try:
         with tempfile.NamedTemporaryFile(delete=False, suffix=".pdf") as tmp:
             tmp.write(uploaded_file.getvalue())
@@ -171,10 +178,7 @@ def process_pdf(uploaded_file):
         loader = PyPDFLoader(path)
         docs = loader.load()
         
-        splitter = RecursiveCharacterTextSplitter(
-            chunk_size=800,
-            chunk_overlap=50
-        )
+        splitter = RecursiveCharacterTextSplitter(chunk_size=800, chunk_overlap=50)
         chunks = splitter.split_documents(docs)
         
         embeddings = HuggingFaceEmbeddings(
@@ -193,18 +197,15 @@ def process_pdf(uploaded_file):
             os.unlink(path)
         
         return len(chunks)
-        
     except Exception as e:
         st.error(f"Error processing PDF: {str(e)}")
         return None
 
 def ask_question(question):
-    """Retrieve and generate answer for the question."""
     if not client:
-        return None, 0, "Groq client is not initialized. Check API key setup."
-    
+        return None, 0, "Groq client is not initialized."
     if not st.session_state.retriever:
-        return None, 0, "Upload PDF first to initialize the knowledge base."
+        return None, 0, "Upload PDF first."
     
     try:
         docs = st.session_state.retriever.invoke(question)
@@ -212,87 +213,52 @@ def ask_question(question):
         
         prompt = f"""
 You are a strict RAG Q&A assistant.
-Use ONLY the context provided. If the answer is not found, reply:
-"I cannot find this in the PDF."
-
+Use ONLY the context provided. If the answer is not found, reply: "I cannot find this in the PDF."
 ---------------- CONTEXT ----------------
 {context}
 -----------------------------------------
-
 QUESTION: {question}
-
-FINAL ANSWER:
-"""
+FINAL ANSWER:"""
+        
         response = client.chat.completions.create(
             model=GROQ_MODEL,
             messages=[
-                {"role": "system",
-                 "content": "Use only the PDF content. If answer not found, say: 'I cannot find this in the PDF.'"},
+                {"role": "system", "content": "Use only the PDF content."},
                 {"role": "user", "content": prompt}
             ],
             temperature=0.0
         )
-        
-        answer = response.choices[0].message.content.strip()
-        return answer, len(docs), None
-        
-    except APIError as e:
-        return None, 0, f"Groq API Error: {str(e)}"
+        return response.choices[0].message.content.strip(), len(docs), None
     except Exception as e:
-        return None, 0, f"General error: {str(e)}"
-
-# ---------------- CENTERED TITLE ----------------
-st.markdown("""
-<div class="title-container">
-    <div class="title-text">📘 PDF Assistant</div>
-    <div class="creator-text">
-        Created by <a href="https://www.linkedin.com/in/abhishek-iitr/" target="_blank">Abhishek Saxena</a>
-    </div>
-</div>
-""", unsafe_allow_html=True)
+        return None, 0, f"Error: {str(e)}"
 
 # ---------------- SIDEBAR ----------------
 with st.sidebar:
     st.write("") 
-    
-    # Action Buttons
     if st.button("🗑️ Clear Chat History", use_container_width=True):
         clear_chat_history()
-        
     if st.button("🔥 Clear PDF Memory", on_click=clear_memory, use_container_width=True):
          st.success("Memory Cleared!")
 
     st.markdown("---")
     
-    # Dynamic Label based on state
-    # If a file is loaded, show a success icon/text. If not, show "Upload PDF".
     upload_label = "✅ PDF Uploaded!" if st.session_state.uploaded_file_name else "Upload PDF"
-
     uploaded = st.file_uploader(
-        upload_label, 
-        type=["pdf"],
-        key=st.session_state.uploader_key,
-        label_visibility="collapsed" # Still hiding the main label text
+        upload_label, type=["pdf"], key=st.session_state.uploader_key, label_visibility="collapsed"
     )
 
-    # Status Message logic
     if uploaded:
         if uploaded.name != st.session_state.uploaded_file_name:
-            # Processing
             st.session_state.uploaded_file_name = None
             st.session_state.chat = []
-            
             with st.spinner(f"Processing '{uploaded.name}'..."):
-                chunks_count = process_pdf(uploaded)
-                
-                if chunks_count is not None:
+                chunks = process_pdf(uploaded)
+                if chunks:
                     st.session_state.uploaded_file_name = uploaded.name
-                    st.success(f"✅ Processed! {chunks_count} chunks.")
+                    st.success(f"✅ Processed! {chunks} chunks.")
                 else:
                     st.error("❌ Failed.")
         else:
-            # Active State
-            # This appears BELOW the uploader box
             st.success(f"👍 **Ready:** `{uploaded.name}`")
     else:
         st.warning("⬆️ Upload a PDF to start chatting!")
@@ -300,9 +266,9 @@ with st.sidebar:
 # ---------------- INPUT AREA ----------------
 disabled_input = st.session_state.uploaded_file_name is None or client is None
 
+# Input Form
 with st.form(key='chat_form', clear_on_submit=True):
     col_input, col_btn = st.columns([0.85, 0.15], gap="small")
-    
     with col_input:
         user_question = st.text_input(
             "Ask a question", 
@@ -310,27 +276,26 @@ with st.form(key='chat_form', clear_on_submit=True):
             label_visibility="collapsed",
             disabled=disabled_input
         )
-        
     with col_btn:
         submit_btn = st.form_submit_button("➤", disabled=disabled_input, use_container_width=True)
 
-# Processing the Input
 if submit_btn and user_question:
     st.session_state.chat.append(("user", user_question))
-    
     with st.spinner("Thinking..."):
         answer, sources, error = ask_question(user_question)
-        
         if answer:
-            bot_message = f"{answer}<div class='sources'>Context Chunks Used: {sources}</div>"
-            st.session_state.chat.append(("bot", bot_message))
+            bot_msg = f"{answer}<div class='sources'>Context Chunks Used: {sources}</div>"
+            st.session_state.chat.append(("bot", bot_msg))
         else:
             st.session_state.chat.append(("bot", f"🔴 **Error:** {error}"))
+    st.rerun() # Rerun to update the display at the top immediately
 
-# ---------------- CHAT HISTORY DISPLAY ----------------
-st.markdown("---")
-for role, msg in st.session_state.chat:
-    if role == "user":
-        st.markdown(f"<div class='chat-user'>{msg}</div>", unsafe_allow_html=True)
-    else:
-        st.markdown(f"<div class='chat-bot'>{msg}</div>", unsafe_allow_html=True)
+# ---------------- CHAT HISTORY (REVERSED) ----------------
+# We iterate through the reversed list so the newest message (last in list) comes first.
+if st.session_state.chat:
+    st.markdown("---")
+    for role, msg in reversed(st.session_state.chat):
+        if role == "user":
+            st.markdown(f"<div class='chat-user'>{msg}</div>", unsafe_allow_html=True)
+        else:
+            st.markdown(f"<div class='chat-bot'>{msg}</div>", unsafe_allow_html=True)