Update app.py

app.py

@@ -207,10 +207,11 @@ def upload_pdf(pdf_file):
     chain = create_chain(vectorstore)
     return "تم تحميل الملف بنجاح !", True
 
-
+chat_history = []
 def chat(user_input):
-    global chain  # Access the global chain variable
+    global chain chat_history # Access the global chain variable
 
+    chat_history.append({"role": "user", "content": user_input})
    
     prompt = f"""
         You are an expert Arabic-language assistant specialized in analyzing and responding to queries about Arabic PDF documents. Your responses should be precise, informative, and reflect the professional tone and structure expected in formal Arabic communication. Focus on extracting and presenting relevant information from the document clearly and systematically, while avoiding colloquial or informal language.
@@ -225,6 +226,7 @@ def chat(user_input):
     response = chain({"question": prompt})
     assistant_response = response["answer"]
 
+    chat_history.append({"role": "assistant", "content": assistant_response})
     # Generate a unique identifier for the audio file
     audio_id = str(uuid.uuid4())
 
@@ -233,20 +235,32 @@ def chat(user_input):
     audio_file = f"{audio_id}.mp3"
     tts.save(audio_file)
 
-
-    return assistant_response, audio_file
+    history_display = [(h["role"], h["content"]) for h in chat_history]
+    return history_display, audio_file
 
 with gr.Blocks(css=custom_css) as demo:
-    pdf_input = gr.File(label="اختر ملف PDF")
-    output_label = gr.HTML(value='')  # Replaced Textbox with HTML for label
-    submit_button_pdf = gr.Button("ارفع الملف", interactive=False)
+    with gr.Row():
+        gr.Markdown("<h2 style='text-align: center; color: #4A90E2;'>المساع العربي للدردشة مع الـ PDF</h2>")
+    
+    with gr.Row():
+        pdf_input = gr.File(label="اختر ملف PDF")
+        output_label = gr.HTML(value='')  # Replaced Textbox with HTML for label
+    with gr.Row():
+        submit_button_pdf = gr.Button("ارفع الملف", interactive=False)
+    with gr.Row():
+        with gr.Column(scale=3):
+            chatbot = gr.Chatbot(label="الدردشة العربية", elem_id="chatbox").style(height=400, rounded=True, shadow=True)
     
-    chat_input = gr.Textbox(label="أدخل سؤالك هنا 💬", rtl=True, visible=False)
-    chat_output = gr.Textbox(label="الرد الآلي 🤖", rtl=True, visible=False)
-    audio_output = gr.Audio(label="🔊", visible=False)
+    with gr.Row():
+        chat_input = gr.Textbox(label="أدخل سؤالك هنا 💬", rtl=True, visible=Falseو  placeholder="أخل سؤالك هنا ..", elem_id="inputbox", lines=2)
+    #chat_output = gr.Textbox(label="الرد الآلي 🤖", rtl=True, visible=False)
+    with gr.Row():
+        audio_output = gr.Audio(label="🔊", visible=False)
     with gr.Group():
-        submit_button_chat = gr.Button("إرسال", interactive=True, visible=False)
-        clear_btn = gr.Button("مسح", interactive=True, visible=False)
+        with gr.Row():
+            submit_button_chat = gr.Button("إرسال", interactive=True, visible=False).style(full_width=True)
+        with gr.Row():
+            clear_btn = gr.Button("مسح", interactive=True, visible=False).style(full_width=True)
 
     def handle_file_upload(pdf):
         output_label.value=''
@@ -271,16 +285,16 @@ with gr.Blocks(css=custom_css) as demo:
         return gr.update(value=value), gr.update(visible=True), gr.update(interactive=False), gr.update(visible=True), gr.update(visible=True), gr.update(visible=True), gr.update(visible=True)
 
     def clear_chat():
-        return "", "", None 
+        return "", None 
        
      # When the user uploads a file, validate it and then allow PDF upload
-    pdf_input.change(handle_file_upload, inputs=pdf_input, outputs=[output_label,submit_button_pdf, submit_button_chat, chat_output, chat_input, audio_output, clear_btn])
+    pdf_input.change(handle_file_upload, inputs=pdf_input, outputs=[output_label,submit_button_pdf, submit_button_chat, chatbot, chat_input, audio_output, clear_btn])
 
     # When the user presses the upload button, process the PDF and enable other components
-    submit_button_pdf.click(process_pdf_and_enable_components, inputs=pdf_input, outputs=[output_label, submit_button_chat, submit_button_pdf, chat_output, chat_input, audio_output, clear_btn])
-    clear_btn.click(clear_chat, outputs=[chat_input, chat_output, audio_output])
+    submit_button_pdf.click(process_pdf_and_enable_components, inputs=pdf_input, outputs=[output_label, submit_button_chat, submit_button_pdf, chatbot, chat_input, audio_output, clear_btn])
+    clear_btn.click(clear_chat, outputs=[chat_input, audio_output])
     # Chat button connection
-    submit_button_chat.click(chat, inputs=chat_input, outputs=[chat_output, audio_output])
+    submit_button_chat.click(chat, inputs=chat_input, outputs=[chatbot, audio_output])
     
 
 # Launch the Gradio app