Update app.py

app.py

@@ -26,7 +26,6 @@ model = AutoModelForCausalLM.from_pretrained(model_name, token=hf_token)
 model.to(device)
 
 # Set tokenizer configuration
-
 tokenizer.eos_token = "<|answer_end|>"
 eos_token_id=tokenizer.eos_token_id
 tokenizer.pad_token = tokenizer.eos_token
@@ -98,20 +97,21 @@ class pleiasBot:
                 analysis = parts[0].strip()
                 answer = parts[1].replace("<|answer_start|>", "").replace("<|answer_end|>", "").strip()
                 
-                # Format with section titles using strong tags for extra emphasis
-                formatted_text = f'<div class="section-title"><strong>Analyse des sources</strong></div>\n\n{analysis}\n\n<div class="section-title"><strong>Réponse</strong></div>\n\n{answer}'
+                # Format each section separately
+                analysis_text = f'<div class="generation">' + format_references(analysis) + "</div>"
+                answer_text = '<h2 style="text-align:center">Réponse</h3>\n<div class="generation">' + format_references(answer) + "</div>"
             else:
-                formatted_text = generated_text
+                analysis_text = ""
+                answer_text = format_references(generated_text)
             
-            generated_text = '<h2 style="text-align:center">Réponse</h3>\n<div class="generation">' + format_references(formatted_text) + "</div>"
             fiches_html = '<h2 style="text-align:center">Sources</h3>\n' + fiches_html
-            return generated_text, fiches_html
+            return analysis_text, answer_text, fiches_html
 
         except Exception as e:
             print(f"Error during generation: {str(e)}")
             import traceback
             traceback.print_exc()
-            return None, None
+            return None, None, None
 
 def format_references(text):
     ref_pattern = r'<ref name="([^"]+)">"([^"]+)"</ref>'
@@ -207,32 +207,43 @@ css = """
 
 # Gradio interface
 def gradio_interface(user_message):
-    response, sources = pleias_bot.predict(user_message)
-    return response, sources
+    analysis, response, sources = pleias_bot.predict(user_message)
+    return analysis, response, sources
 
 # Create Gradio app
 demo = gr.Blocks(css=css)
 
 with demo:
+    # Header with black bar
     gr.HTML("""
-    <div style="display: flex; justify-content: center; width: 100%; background-color: black; padding: 10px 0;">
+    <div style="display: flex; justify-content: center; width: 100%; background-color: black; padding: 7px 0;">
         <pre style="font-family: monospace; line-height: 1.2; font-size: 24px; color: #00ffea; margin: 0;">
 ╔═══════════════════╗
-║  pleias-RAG 1.0   ║
+║   pleias-RAG 1.0  ║
 ╚═══════════════════╝
         </pre>
     </div>
     """)
+    
+    # Input section
+    with gr.Column(scale=2):
+        text_input = gr.Textbox(label="Votre question ou votre instruction", lines=3)
+        text_button = gr.Button("Interroger pleias-RAG")
+    
+    # Two columns for output: Analysis and Response
     with gr.Row():
         with gr.Column(scale=2):
-            text_input = gr.Textbox(label="Votre question ou votre instruction", lines=3)
-            text_button = gr.Button("Interroger pleias-RAG")
+            text_output = gr.HTML(label="Analyse des sources")
         with gr.Column(scale=3):
-            text_output = gr.HTML(label="La réponse du modèle")
+            response_output = gr.HTML(label="Réponse")
+            
+    # Sources at the bottom
     with gr.Row():
         embedding_output = gr.HTML(label="Les sources utilisées")
     
-    text_button.click(gradio_interface, inputs=text_input, outputs=[text_output, embedding_output])
+    text_button.click(gradio_interface, 
+                     inputs=text_input, 
+                     outputs=[text_output, response_output, embedding_output])
 
 # Launch the app
 if __name__ == "__main__":