Update app.py

app.py

@@ -12,16 +12,19 @@ st.title("💬 Chatbot avec Claude 3")
 if "messages" not in st.session_state:
     st.session_state["messages"] = []
 
-# Affichage de tous les messages précédents
-for msg in st.session_state.messages:
-    # Utiliser st.container pour mieux organiser l'affichage des messages
-    with st.container():
+# Affichage de tous les messages précédents dans un container pour une meilleure gestion de l'espace
+chat_container = st.container()
+with chat_container:
+    for msg in st.session_state.messages:
         if msg["role"] == "user":
-            st.text(f"User: {msg['content']}")
+            st.markdown(f"<div style='margin-left: 10px;'><img src='https://www.example.com/user_icon.png' width='24'> User: {msg['content']}</div>", unsafe_allow_html=True)
         else:
-            st.text(f"Assistant: {msg['content']}")
+            st.markdown(f"<div style='margin-right: 10px; text-align: right;'><img src='https://www.example.com/bot_icon.png' width='24'> Assistant: {msg['content']}</div>", unsafe_allow_html=True)
 
-# Entrée pour les nouvelles questions avec un container en bas
+# Créer un espace vide pour pousser l'input en bas
+st.empty()
+
+# Entrée pour les nouvelles questions en bas
 with st.container():
     prompt = st.text_input("Posez votre question :", key="chat")
     if prompt:
@@ -50,4 +53,4 @@ with st.container():
 
             # Ajouter et afficher la réponse de l'assistant
             st.session_state.messages.append({"role": "assistant", "content": msg})
-            st.text(f"Assistant: {msg}")
+            st.markdown(f"<div style='margin-right: 10px; text-align: right;'><img src='https://www.example.com/bot_icon.png' width='24'> Assistant: {msg}</div>", unsafe_allow_html=True)