Update app.py

app.py

@@ -37,38 +37,6 @@ You can change the LLM models in the **Additional Inputs** at the bottom of the
 
 """
 
-chatbot_css = """
-    .gradio-container {
-        font-family: 'Inter', sans-serif;
-        border-radius: 12px;
-        overflow: hidden;
-    }
-    .panel {
-        border-radius: 8px;
-        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-    }
-    .gr-button {
-        border-radius: 8px;
-        padding: 10px 20px;
-        font-weight: bold;
-        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-        transition: all 0.2s ease-in-out;
-    }
-    .gr-button:hover {
-        transform: translateY(-2px);
-        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
-    }
-    .gr-textbox textarea {
-        border-radius: 8px;
-    }
-    .gr-slider {
-        padding: 10px 0;
-    }
-    .gr-tabitem {
-        padding: 20px;
-    }
-"""
-
 sample_button = "Load User Guide and Installation Guide documents"
 
 
@@ -142,7 +110,7 @@ def format_docs(docs):
     return "\n\n".join(doc.page_content for doc in docs)
 
 def generate_response(query, history, model, temperature, max_tokens, top_p, seed):
-
+  
     if vector_store is None:
         return "Please upload and index a PDF at the Indexing tab."
 
@@ -177,7 +145,7 @@ additional_inputs = [
 
 
 # Create the Gradio interface
-with gr.Blocks(theme=gr.themes.Default() ) as demo:
+with gr.Blocks(theme=gr.themes.Default()) as demo:
     with gr.Tab("Indexing"):
         gr.Markdown(desc)
         # pdf_input = gr.File(label="Upload PDF", file_types=[".pdf"])
@@ -191,88 +159,22 @@ with gr.Blocks(theme=gr.themes.Default() ) as demo:
     
     with gr.Tab("Chatbot"):
         with gr.Row():
-            with gr.Column(scale=2):
-                chatbot = gr.Chatbot(
-                    show_label=False,
-                    show_share_button=False,
-                    show_copy_button=True,
-                    layout="panel",
-                    height=500, # Set a fixed height for the chatbot
-                    avatar_images=(
-                        "https://placehold.co/60x60/FFD700/000000?text=U", # User avatar
-                        "https://placehold.co/60x60/6366F1/FFFFFF?text=AI" # Bot avatar
-                    )
-                )
-                msg = gr.Textbox(
-                    label="Your Message",
-                    placeholder="Type your message here...",
-                    show_copy_button=True,
-                    container=False # Prevent it from being wrapped in a default container
-                )
-                with gr.Row():
-                    submit_btn = gr.Button("Send", variant="primary")
-                    clear_btn = gr.ClearButton() # Will be configured below
-
-                gr.Examples(
+            with gr.Column():
+                gr.ChatInterface(
+                    fn=generate_response, 
+                    chatbot=gr.Chatbot(show_label=False, show_share_button=False, show_copy_button=True, likeable=True, layout="panel"),
                     examples=examples_questions,
-                    inputs=[msg],
-                    outputs=[msg], # Update the message input with the example
-                    label="Quick Examples",
+                    additional_inputs=additional_inputs,
                     cache_examples=False,
                 )
+            # with gr.Column():
+            #     retrieve_button = gr.Button("Retrieve Relevant Info")
+            #     relevant_info = gr.Textbox(
+            #         label="Retrieved Information",
+            #         interactive=False,
+            #         lines=20, 
+            #     )
 
-            with gr.Column(scale=1):
-                # Additional inputs as separate Gradio components (interactive but don't affect dummy fn)
-                model_name_textbox = gr.Textbox(label="Model Name", value="dummy-model", interactive=True)
-                temperature_slider = gr.Slider(minimum=0, maximum=1, value=0.7, step=0.01, label="Temperature", interactive=True)
-                max_tokens_slider = gr.Slider(minimum=10, maximum=2000, value=500, step=10, label="Max Tokens", interactive=True)
-                top_p_slider = gr.Slider(minimum=0, maximum=1, value=0.9, step=0.01, label="Top P", interactive=True)
-                seed_number = gr.Number(minimum=0, maximum=100000, value=0, step=1, label="Seed", precision=0, interactive=True)
-
-                gr.Markdown("### Retrieved Information")
-                # Textbox for relevant_info
-                relevant_info_textbox = gr.Textbox(
-                    label="Retrieved Information",
-                    interactive=False, # Not editable by the user
-                    lines=20,
-                    show_copy_button=True,
-                    autoscroll=True,
-                    container=True # Ensure it has a container for styling
-                )
-
-        # --- Event Handling ---
-        # This function acts as a wrapper to process inputs and distribute outputs
-        def process_chat_and_info(message, chat_history, model, temp, max_tok, top_p_val, seed_val):
-            # Call your generate_response function which returns two values
-            bot_message, retrieved_info = generate_response(
-                message, chat_history, model, temp, max_tok, top_p_val, seed_val
-            )
-            
-            # Update the chat history for the chatbot component
-            chat_history.append((message, bot_message))
             
-            # Return values in the order of the outputs list
-            return chat_history, retrieved_info, "" # Clear the message input after sending
-
-        # Bind the `process_chat_and_info` function to the submit event of the message textbox
-        msg.submit(
-            fn=generate_response,
-            inputs=[msg, chatbot, model_name_textbox, temperature_slider, max_tokens_slider, top_p_slider, seed_number],
-            outputs=[chatbot, relevant_info_textbox], # Order matters here: chatbot, relevant_info, then msg
-            queue=False # Set to True if you expect heavy load
-        )
-
-        # Bind the `process_chat_and_info` function to the click event of the send button
-        submit_btn.click(
-            fn=generate_response,
-            inputs=[msg, chatbot, model_name_textbox, temperature_slider, max_tokens_slider, top_p_slider, seed_number],
-            outputs=[chatbot, relevant_info_textbox], # Order matters here
-            queue=False # Set to True if you expect heavy load
-        )
-
-        # Configure the clear button to clear both the chatbot and the relevant_info_textbox
-        clear_btn.add([msg, chatbot, relevant_info_textbox])
-
-           
 # Launch the Gradio app
 demo.launch(share=True)