Update streamlit_app.py

streamlit_app.py

@@ -1,31 +1,102 @@
 import streamlit as st
 import time
 
-st.set_page_config(page_title="Meu Chatbot", page_icon="💬", layout="centered")
-st.title("💬 Meu Chatbot")
+st.set_page_config(
+    page_title="Chatbot Streamlit",
+    page_icon="🤖",
+    layout="wide"
+)
+
+st.markdown("""
+<style>
+.stApp {
+    background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
+}
+.block-container {
+    padding-top: 2rem;
+    max-width: 1100px;
+}
+[data-testid="stSidebar"] {
+    background: #0b1220;
+}
+.chat-title {
+    text-align: center;
+    color: white;
+    margin-bottom: 0.3rem;
+}
+.chat-subtitle {
+    text-align: center;
+    color: #cbd5e1;
+    margin-bottom: 1.5rem;
+}
+.user-bubble {
+    background: #2563eb;
+    color: white;
+    padding: 12px 16px;
+    border-radius: 16px 16px 4px 16px;
+    margin: 8px 0 8px auto;
+    width: fit-content;
+    max-width: 75%;
+}
+.bot-bubble {
+    background: #1f2937;
+    color: #f9fafb;
+    padding: 12px 16px;
+    border-radius: 16px 16px 16px 4px;
+    margin: 8px auto 8px 0;
+    width: fit-content;
+    max-width: 75%;
+    border: 1px solid #374151;
+}
+</style>
+""", unsafe_allow_html=True)
+
+with st.sidebar:
+    st.title("⚙️ Painel")
+    st.write("Chatbot em Streamlit")
+    if st.button("🗑️ Nova conversa", use_container_width=True):
+        st.session_state.messages = [
+            {"role": "assistant", "content": "Olá! Sou o teu chatbot em Streamlit. Como te posso ajudar?"}
+        ]
+        st.rerun()
+    st.info("Podes ligar isto depois a uma API, modelo local ou Hugging Face.")
+
+st.markdown("<h1 class='chat-title'>🤖 Chatbot Streamlit</h1>", unsafe_allow_html=True)
+st.markdown("<p class='chat-subtitle'>Versão com visual melhorado e histórico de conversa</p>", unsafe_allow_html=True)
 
 if "messages" not in st.session_state:
     st.session_state.messages = [
-        {"role": "assistant", "content": "Olá! Sou o teu chatbot. Em que posso ajudar?"}
+        {"role": "assistant", "content": "Olá! Sou o teu chatbot em Streamlit. Como te posso ajudar?"}
     ]
 
-for message in st.session_state.messages:
-    with st.chat_message(message["role"]):
-        st.markdown(message["content"])
+for msg in st.session_state.messages:
+    css_class = "user-bubble" if msg["role"] == "user" else "bot-bubble"
+    st.markdown(f"<div class='{css_class}'>{msg['content']}</div>", unsafe_allow_html=True)
 
 def gerar_resposta(prompt):
-    resposta = f"Tu disseste: {prompt}. Isto é uma resposta de teste mais bonita."
+    resposta = f"Recebi a tua mensagem: '{prompt}'. Esta é uma resposta exemplo em Streamlit com estilo melhorado."
+    texto = ""
     for palavra in resposta.split():
-        yield palavra + " "
+        texto += palavra + " "
         time.sleep(0.03)
+        yield texto
+
+prompt = st.chat_input("Escreve a tua mensagem...")
 
-if prompt := st.chat_input("Escreve a tua mensagem..."):
+if prompt:
     st.session_state.messages.append({"role": "user", "content": prompt})
+    st.rerun()
 
-    with st.chat_message("user"):
-        st.markdown(prompt)
+if st.session_state.messages and st.session_state.messages[-1]["role"] == "user":
+    placeholder = st.empty()
+    resposta_final = ""
 
-    with st.chat_message("assistant"):
-        resposta_final = st.write_stream(gerar_resposta(prompt))
+    for parcial in gerar_resposta(st.session_state.messages[-1]["content"]):
+        resposta_final = parcial
+        placeholder.markdown(
+            f"<div class='bot-bubble'>{resposta_final}</div>",
+            unsafe_allow_html=True
+        )
 
-    st.session_state.messages.append({"role": "assistant", "content": resposta_final})
+    st.session_state.messages.append({"role": "assistant", "content": resposta_final})
+    st.rerun()