Update app.py

app.py

@@ -35,7 +35,7 @@ def chatbot(user_input, category, history=[]):
     bot_response = get_groq_response(user_input, category)
     history.append({"role": "user", "content": user_input})
     history.append({"role": "assistant", "content": bot_response})
-    return history, history
+    return history, bot_response
 
 # Gradio Interface with enhanced styling
 chat_interface = gr.Blocks(css="""
@@ -103,39 +103,36 @@ with chat_interface:
     with gr.Row():
         chatbot_output = gr.Chatbot(label="Chat History", type="messages")
     with gr.Row():
-        # Custom HTML button
-        gr.HTML("""
-        <button id="copy-btn" style="
-            background: linear-gradient(90deg, #f9f9f9, #e6e6e6);
-            color: #555;
-            padding: 0.8rem 1.5rem;
-            font-size: 1rem;
-            font-weight: bold;
-            border-radius: 20px;
-            border: none;
-            cursor: pointer;
-            transition: transform 0.2s ease, background 0.2s ease;
-        ">Copy Response</button>
+        copy_button = gr.Button("Copy Response")
+
+    # Add functionality to handle interactions
+    def handle_chat(user_input, category, history):
+        if not user_input.strip():
+            return history, history
+        updated_history, bot_response = chatbot(user_input, category, history)
+        return updated_history, updated_history
+
+    def handle_copy(last_bot_response):
+        # Copy the last bot response to clipboard using the JavaScript in Gradio.
+        return gr.HTML(f"""
         <script>
-        document.getElementById('copy-btn').addEventListener('click', () => {
-            const responses = document.querySelectorAll('.bot-message');
-            if (responses.length > 0) {
-                const lastResponse = responses[responses.length - 1].innerText;
-                navigator.clipboard.writeText(lastResponse)
-                    .then(() => alert('Copied to clipboard!'))
-                    .catch(() => alert('Failed to copy!'));
-            } else {
-                alert('No bot response to copy!');
-            }
-        });
+            const copyText = '{last_bot_response}';
+            navigator.clipboard.writeText(copyText)
+                .then(() => alert('Copied to clipboard!'))
+                .catch(() => alert('Failed to copy!'));
         </script>
         """)
 
-    # Add functionality to handle interactions
     send_button.click(
-        chatbot,
+        handle_chat,
         inputs=[user_input, category_dropdown, chatbot_output],
         outputs=[chatbot_output, chatbot_output]
     )
 
+    copy_button.click(
+        handle_copy,
+        inputs=[chatbot_output],
+        outputs=[]
+    )
+
 chat_interface.launch()