Update app.py

app.py

@@ -666,15 +666,8 @@ use_web_search = gr.Checkbox(label="Use Web Search", value=False)
 
 custom_placeholder = "Ask a question (Note: You can toggle between Web Search and PDF Chat in Additional Inputs below)"
 
-asr_interface = gr.Interface(
-    fn=transcribe,
-    inputs=[
-        gr.Audio(sources="microphone", type="filepath")
-    ],
-    outputs="text",
-    title="Speech to Text",
-    description="Speak your query, and it will be transcribed."
-)
+def update_textbox(transcription):
+    return gr.Textbox.update(value=transcription)
 
 # Update the Gradio interface
 with gr.Blocks() as demo:
@@ -682,56 +675,30 @@ with gr.Blocks() as demo:
     
     with gr.Row():
         with gr.Column(scale=1):
-            asr_interface.render()
+            audio_input = gr.Audio(sources="microphone", type="filepath", label="Speak your query")
+            transcribe_button = gr.Button("Transcribe")
         
         with gr.Column(scale=2):
-            chatbot = gr.ChatInterface(
-                respond,
-                additional_inputs=[
-                    gr.Dropdown(choices=MODELS, label="Select Model", value=MODELS[3]),
-                    gr.Slider(minimum=0.1, maximum=1.0, value=0.2, step=0.1, label="Temperature"),
-                    gr.Slider(minimum=1, maximum=5, value=1, step=1, label="Number of API Calls"),
-                    gr.Checkbox(label="Use Web Search", value=True),
-                    gr.CheckboxGroup(label="Select documents to query")
-                ],
-                title="Chat with PDFs or Web Search",
-                description="Chat with your PDFs or use web search to answer questions.",
-                theme=gr.themes.Soft(
-                    primary_hue="orange",
-                    secondary_hue="amber",
-                    neutral_hue="gray",
-                    font=[gr.themes.GoogleFont("Exo"), "ui-sans-serif", "system-ui", "sans-serif"]
-                ).set(
-                    body_background_fill_dark="#0c0505",
-                    block_background_fill_dark="#0c0505",
-                    block_border_width="1px",
-                    block_title_background_fill_dark="#1b0f0f",
-                    input_background_fill_dark="#140b0b",
-                    button_secondary_background_fill_dark="#140b0b",
-                    border_color_accent_dark="#1b0f0f",
-                    border_color_primary_dark="#1b0f0f",
-                    background_fill_secondary_dark="#0c0505",
-                    color_accent_soft_dark="transparent",
-                    code_background_fill_dark="#140b0b"
-                ),
-                css=css,
-                examples=[
-                    ["Tell me about the contents of the uploaded PDFs."],
-                    ["What are the main topics discussed in the documents?"],
-                    ["Can you summarize the key points from the PDFs?"],
-                    ["What's the latest news about artificial intelligence?"]
-                ],
-                cache_examples=False,
-                analytics_enabled=False,
-                textbox=gr.Textbox(placeholder="Ask a question about the uploaded PDFs or any topic", container=False, scale=7),
-                chatbot=gr.Chatbot(
-                    show_copy_button=True,
-                    likeable=True,
-                    layout="bubble",
-                    height=400,
-                    value=initial_conversation()
-                )
+            chatbot = gr.Chatbot(
+                show_copy_button=True,
+                likeable=True,
+                layout="bubble",
+                height=400,
+                value=initial_conversation()
+            )
+            query_textbox = gr.Textbox(
+                placeholder="Ask a question about the uploaded PDFs or any topic", 
+                container=False, 
+                scale=7
             )
+            submit_button = gr.Button("Submit")
+    
+    with gr.Accordion("⚙️ Parameters", open=False):
+        model = gr.Dropdown(choices=MODELS, label="Select Model", value=MODELS[3])
+        temperature = gr.Slider(minimum=0.1, maximum=1.0, value=0.2, step=0.1, label="Temperature")
+        num_calls = gr.Slider(minimum=1, maximum=5, value=1, step=1, label="Number of API Calls")
+        use_web_search = gr.Checkbox(label="Use Web Search", value=True)
+        document_selector = gr.CheckboxGroup(label="Select documents to query")
     
     # Add file upload functionality
     gr.Markdown("## Upload and Manage PDF Documents")
@@ -744,39 +711,49 @@ with gr.Blocks() as demo:
     update_output = gr.Textbox(label="Update Status")
     delete_button = gr.Button("Delete Selected Documents")
     
-    # Update both the output text and the document selector
+    # Connect components
+    transcribe_button.click(
+        transcribe, 
+        inputs=[audio_input], 
+        outputs=[query_textbox]
+    )
+    
+    submit_button.click(
+        respond,
+        inputs=[query_textbox, chatbot, model, temperature, num_calls, use_web_search, document_selector],
+        outputs=[chatbot]
+    )
+    
     update_button.click(
         update_vectors, 
         inputs=[file_input, parser_dropdown], 
-        outputs=[update_output, chatbot.additional_inputs[-1]]
+        outputs=[update_output, document_selector]
     )
     
-    # Add the refresh button functionality
     refresh_button.click(
         refresh_documents, 
         inputs=[], 
-        outputs=[chatbot.additional_inputs[-1]]
+        outputs=[document_selector]
     )
     
-    # Add the delete button functionality
     delete_button.click(
         delete_documents,
-        inputs=[chatbot.additional_inputs[-1]],
-        outputs=[update_output, chatbot.additional_inputs[-1]]
+        inputs=[document_selector],
+        outputs=[update_output, document_selector]
     )
 
     gr.Markdown(
     """
     ## How to use
-    1. Use the microphone to speak your query, or type it in the chat interface.
-    2. Upload PDF documents using the file input at the bottom.
-    3. Select the PDF parser (pypdf or llamaparse) and click "Upload Document" to update the vector store.
-    4. Select the documents you want to query using the checkboxes.
-    5. Ask questions in the chat interface. 
+    1. Use the microphone to speak your query, then click "Transcribe", or type directly in the text box.
+    2. Click "Submit" to get a response from the AI.
+    3. Upload PDF documents using the file input at the bottom.
+    4. Select the PDF parser (pypdf or llamaparse) and click "Upload Document" to update the vector store.
+    5. Select the documents you want to query using the checkboxes.
     6. Toggle "Use Web Search" to switch between PDF chat and web search.
     7. Adjust Temperature and Number of API Calls to fine-tune the response generation.
-    8. Use the provided examples or ask your own questions.
     """
     )
+
 if __name__ == "__main__":
-    demo.launch(share=True)
+    demo.launch(share=True)