teste fix: Ajustes

app.py

@@ -1,36 +1,33 @@
 import streamlit as st
 import requests
-from PIL import Image
-import base64
 import re
 import streamlit_authenticator as stauth
-from streamlit_feedback import streamlit_feedback
 import os
 import yaml
 from yaml.loader import SafeLoader
 from pathlib import Path
-from drive_search import search_file_in_drive   
+from drive_search import search_file_in_drive
 from datetime import datetime
-import json
+from feedback_manager import FeedbackManager
+
 
 class ChatbotApp:
     def __init__(self):
         # Configura título, ícone e layout da página
         st.set_page_config(page_title="Sicoob Chatbot 🤖", page_icon="logos/sicoob-ico.ico", layout="wide")
-        
         self.backend_url = "http://localhost:5001/chat"
         self.title = "Sicoob Chatbot"
-        self.feedback_dir = os.path.join(os.getcwd(), "./feedback")
-        self.description = "Este assistente virtual pode te ajudar com informações sobre carômetros da Sicoob."
-        
+        self.description = "Este assistente virtual pode te ajudar com informações sobre documentos da Sicoob."
+        self.caption = "Confira as atualizações no botão 'Atualizações'."
         self.style_dir = Path("./logos/styles")
         self.load_styles()
+        self.feedback_manager = FeedbackManager()
         st.session_state.first = False
-        
         if "theme" not in st.session_state:
             st.session_state.theme = "light"
-
         self.configyml = os.path.join(os.getcwd(), "./files/config.yaml")
+        if "feedback_submitted" not in st.session_state:
+            st.session_state.feedback_submitted = set()
 
     def load_styles(self):
         try:
@@ -43,43 +40,23 @@ class ChatbotApp:
             self.light_style = ""
             self.dark_style = ""
 
+    def change_style(self):
+        with st.sidebar:
+            if st.session_state.theme == "light":
+                st.logo("./logos/sicoob-logo-horizontal-light.png", icon_image="./logos/sicoob-logo-vertical-sm.png")
+            else:
+                st.logo("./logos/sicoob-logo-horizontal-dark.png", icon_image="./logos/sicoob-logo-vertical-sm.png")
+        st.session_state.theme = "dark" if st.session_state.theme == "light" else "light"
+
     @st.dialog("📄 Atualizações Sicoob Chatbot", width="small")
     def changelog_user(self):
         with open("./logos/ChangelogUser.md", encoding="utf-8") as f:
             st.markdown(f"{f.read()}", unsafe_allow_html=True)
-        
+
     def get_current_style(self):
         theme_style = self.dark_style if st.session_state.theme == "dark" else self.light_style
         return f"<style>{self.base_style}{theme_style}</style>"
 
-
-    def save_feedback(feedback_type, user_input, assistant_response):
-        feedback_dir = os.path.join(os.getcwd(), "feedback")
-        
-        if not os.path.exists(feedback_dir):
-            os.makedirs(feedback_dir)
-        
-        filename = os.path.join(feedback_dir, f"feedback_{feedback_type}.json")
-        
-        try:
-            data = []
-            if os.path.exists(filename):
-                with open(filename, 'r', encoding='utf-8') as f:
-                    data = json.load(f)
-            
-            data.append({
-                "user_input": user_input,
-                "assistant_response": assistant_response,
-                "timestamp": datetime.now().isoformat()
-            })
-
-            with open(filename, 'w', encoding='utf-8') as f:
-                json.dump(data, f, ensure_ascii=False, indent=2)
-
-            st.toast(f"Feedback {feedback_type} salvo com sucesso!", icon="✅")
-        except Exception as e:
-            st.toast(f"Erro ao salvar feedback: {str(e)}", icon="❌")
-
     def stream_chat(self, user_input):
         """
         Faz a comunicação com o backend e retorna a resposta como streaming de tokens.
@@ -102,43 +79,34 @@ class ChatbotApp:
     def clear_chat_history(self):
         st.session_state.chat_history = []
         st.toast("Histórico limpo com sucesso!", icon="✅")
-        
+
     def render_sidebar(self):
         """Siderbar"""
         with st.sidebar:
-            if st.button("Light/Dark Mode"):
-                st.session_state.theme = "dark" if st.session_state.theme == "light" else "light"
-                st.rerun()
-            if st.session_state.theme == "light": 
+            st.button("Light/Dark Mode", on_click=self.change_style)
+            if st.session_state.theme == "light":
                 st.logo("./logos/sicoob-logo-horizontal-light.png", icon_image="./logos/sicoob-logo-vertical-sm.png")
             else:
                 st.logo("./logos/sicoob-logo-horizontal-dark.png", icon_image="./logos/sicoob-logo-vertical-sm.png")
-            
             if st.button("Limpar Histórico", icon=":material/delete:"):
                 self.clear_chat_history()
-                
-            if st.button("Atualizações", icon=":material/info:"):
-                self.changelog_user()
+            st.button("Atualizações", icon=":material/info:", on_click=self.changelog_user)
             st.divider()
-            # st.title("Configuração de LLM")
-            # sidebar_option = st.radio("Selecione o LLM", ["gpt-3.5-turbo"])
-            # if sidebar_option != "gpt-3.5-turbo":
-            #     raise Exception("Opção de LLM inválida!")
-    
+
+    def add_link_to_text(self, text):
+        """
+        Adiciona links ao texto com base no padrão ||texto||.
+        """
+        return re.sub(r'\|\|(.*?)\|\|', lambda match: f' <br>Fonte: <a href="{search_file_in_drive(match.group(1))}" target="_blank">{match.group(1)}</a>', text)
+
     def render(self):
-       
         """
         Renderiza a interface do chatbot.
-        """ 
-
+        """
         st.markdown(self.get_current_style(), unsafe_allow_html=True)
-        
         with open(self.configyml) as file:
             config = yaml.load(file, Loader=SafeLoader)
 
-        # Pre-hashing all plain text passwords once
-        # stauth.Hasher.hash_passwords(config['credentials'])
-
         authenticator = stauth.Authenticate(
             config['credentials'],
             config['cookie']['name'],
@@ -146,32 +114,21 @@ class ChatbotApp:
             config['cookie']['expiry_days']
         )
 
-        #try:
-        #    authenticator.login()
-        #except Exception as e:
-        #    st.error(e)
-        def add_link_to_text(text):
-           return re.sub(r'\|\|(.*?)\|\|', lambda match: f' <br>Fonte: <a href="{search_file_in_drive(match.group(1))}" target="_blank">{match.group(1)}</a>', text)
-
-       
         with open('./config.yaml', 'w', encoding='utf-8') as file:
             yaml.dump(config, file, default_flow_style=False)
 
-
-        authentication_status = authenticator.login()
+        authentication_status = authenticator.login(fields={'Form name': 'Autenticação', 'Username': 'Nome de Usuário', 'Password': 'Senha', 'Login': 'Entrar'})
 
         if st.session_state["authentication_status"]:
-            
             # Renderiza a barra lateral
             self.render_sidebar()
 
             # Título e descrição
             st.title(self.title)
             st.write(self.description)
-
             with st.sidebar:
+                st.caption(self.caption)
                 authenticator.logout('Sair', 'main')
-                
             # Inicializa o histórico na sessão
             if "chat_history" not in st.session_state:
                 st.session_state.chat_history = []
@@ -180,7 +137,7 @@ class ChatbotApp:
             for message in st.session_state.chat_history:
                 role, text = message.split(":", 1)
                 with st.chat_message(role.strip().lower()):
-                     st.markdown(text.strip(), unsafe_allow_html=True)
+                    st.markdown(text.strip(), unsafe_allow_html=True)
 
             # Captura o input do usuário
             user_input = st.chat_input("Digite sua pergunta")
@@ -189,35 +146,37 @@ class ChatbotApp:
                 with st.chat_message("user"):
                     st.write(user_input)
                 st.session_state.chat_history.append(f"user: {user_input}")
-
                 # Placeholder para a resposta do assistente
                 with st.chat_message("assistant"):
                     message_placeholder = st.empty()
                     assistant_message = ""
-
-                    # Executa o streaming de tokens enquanto o backend responde
-                    for token in self.stream_chat(user_input):
-                       assistant_message += token
-                       assistant_message_with_link = add_link_to_text(assistant_message)
-                       message_placeholder.markdown(assistant_message_with_link + "▌", unsafe_allow_html=True)
-
-                    message_placeholder.markdown(assistant_message_with_link, unsafe_allow_html=True)
-                    
-                    #Adicionando histórico Streamlit
-                    st.session_state.chat_history.append(f"assistant: {assistant_message_with_link}")   
-                     
-                    #Feedback
-                    with st.container(border=True):
-                        if st.button("Gostei", icon=":material/thumb_up:"):
-                            save_feedback("positive", "Exemplo de pergunta do usuário", "Exemplo de resposta do assistente")
-
-                        if st.button("Não Gostei", icon=":material/thumb_down:"):
-                            save_feedback("negative", "Exemplo de pergunta do usuário", "Exemplo de resposta do assistente")    
-                                                
+                    try:
+                        # Gerando ID único para a mensagem
+                        message_id = datetime.now().strftime("%Y%m%d_%H%M%S_%f")
+                        print(f"Message ID gerado: {message_id}")
+                        # Executa o streaming de tokens enquanto o backend responde
+                        for token in self.stream_chat(user_input):
+                            assistant_message += token
+                            message_placeholder.markdown(assistant_message + "▌", unsafe_allow_html=True)
+                    except Exception as e:
+                        st.error(f"Erro durante o chat: {str(e)}")
+                        print(f"Erro durante o chat: {str(e)}")
+                    finally:
+                        assistant_message_with_link = self.add_link_to_text(assistant_message)
+                        message_placeholder.markdown(assistant_message_with_link, unsafe_allow_html=True)
+                        # Feedback
+                        self.feedback_manager.render_feedback_buttons(
+                            message_id=message_id,
+                            user_input=user_input,
+                            assistant_response=assistant_message_with_link
+                        )
+                        # Adicionando histórico Streamlit
+                        st.session_state.chat_history.append(f"assistant: {assistant_message_with_link}")
         elif st.session_state["authentication_status"] == False:
-            st.error('Username/password is incorrect')
+            st.error('Nome de Usuário/Senha incorreta.')
         elif st.session_state["authentication_status"] == None:
-            st.warning('Por favor entre com seu "username" e senha.')
+            st.warning('Por favor entre com seu nome de usuário e senha.')
+
 
 if __name__ == "__main__":
     chatbot_app = ChatbotApp()

feedback_manager.py

@@ -0,0 +1,67 @@
+import json
+from datetime import datetime
+from pathlib import Path
+import streamlit as st
+
+
+class FeedbackManager:
+    def __init__(self, feedback_dir="./feedback"):
+        self.feedback_dir = Path(feedback_dir)
+        self.feedback_dir.mkdir(exist_ok=True)
+        if "feedback_submitted" not in st.session_state:
+            st.session_state.feedback_submitted = set()
+
+    def save_feedback(self, feedback_type: str, user_input: str, assistant_response: str, message_id: str):
+        if message_id in st.session_state.feedback_submitted:
+            st.toast("Feedback já enviado para está mensagem.", icon="ℹ️")
+            return False
+        feedback_file = self.feedback_dir / f"feedback_{feedback_type}.json"
+        try:
+            data = []
+            if feedback_file.exists():
+                with open(feedback_file, 'r', encoding='utf-8') as f:
+                    data = json.load(f)
+            feedback_entry = {
+                "message_id": message_id,
+                "timestamp": datetime.now().isoformat(),
+                "feedback_type": feedback_type,
+                "user_input": user_input,
+                "assistant_response": assistant_response,
+            }
+            data.append(feedback_entry)
+            with open(feedback_file, 'w', encoding='utf-8') as f:
+                json.dump(data, f, ensure_ascii=False, indent=2)
+            st.session_state.feedback_submitted.add(message_id)
+            emoji = "👍" if feedback_type == "positive" else "👎"
+            st.toast(f"Obrigado por seu Feedback! {emoji}", icon="✅")
+            return True
+        except Exception as e:
+            st.error(f"Error ao salvar feedback: {str(e)}")
+            return False
+
+    def handle_feedback_click(self, feedback_type: str, message_id: str, user_input: str, assistant_response: str):
+        self.save_feedback(
+            feedback_type=feedback_type,
+            user_input=user_input,
+            assistant_response=assistant_response,
+            message_id=message_id
+        )
+
+    def render_feedback_buttons(self, message_id: str, user_input: str, assistant_response: str):
+        col1, col2 = st.columns(2, gap="small")
+
+        with col1:
+            st.button(
+                "👍 Gostei",
+                key=f"positive_{message_id}",
+                on_click=self.handle_feedback_click,
+                args=("positive", message_id, user_input, assistant_response)
+            )
+
+        with col2:
+            st.button(
+                "👎 Não Gostei",
+                key=f"negative_{message_id}",
+                on_click=self.handle_feedback_click,
+                args=("negative", message_id, user_input, assistant_response)
+            )

logos/styles/base.css

@@ -53,4 +53,15 @@ a {
 
 .stButton button {
     margin-right: 5px;
+}
+
+[data-testid="stDialog"] > div > div > div > div {
+    max-height: 400px !important;
+    overflow: scroll;
+}
+
+[data-testid="stExpanderIcon"] {
+    font-family: "Material Symbols Rounded" !important;
+    font-weight: 400;
+    font-style: normal;
 }

logos/styles/dark.css

@@ -1,9 +1,18 @@
 .stMain, .stAppHeader, .st-emotion-cache-hzygls {
-    background-color: #003641;
+    background-color: #003641 !important;
 }
 
 .stAppHeader, .st-emotion-cache-hzygls, .stBottomBlockContainer {
-    background-color: #002025;
+    background-color: #002025 !important;
+}
+
+[data-testid="stChatInputSubmitButton"] {
+    background-color: transparent !important;
+    border-radius: 10px;
+}
+
+[data-testid="stChatInputSubmitButton"]:hover {
+    background-color: #002025 !important;
 }
 
 .stSidebar {
@@ -44,6 +53,7 @@
 
 [data-testid="stChatInput"] > div > div {
     border: none;
+    border-radius: 10px;
 }
 
 [data-testid="stChatInput"] > div > div > div > textarea {
@@ -67,6 +77,14 @@ a:hover {
     color: #7DB61C !important;
 }
 
+.stMarkdown h1 {
+    color: #FAFAFA !important
+}
+
+body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
+    color: #FAFAFA !important
+}
+
 [data-testid="stChatMessageAvatarUser"] {
     fill: #7DB61C !important;
     background-color: #7DB61C !important;
@@ -100,17 +118,15 @@ a:hover {
 }
 
 hr {
-    background-color: #FAFAFA;
+    background-color: #FAFAFA !important;
 }
 
 [data-testid="stDialog"] > div > div > div > div {
-    max-height: 550px !important;
-    overflow: scroll;
     color: #002025 !important;
 }
 
 [data-testid="stDialog"] > div > div > div {
-    background-color: #00AE9D;
+    background-color: #00AE9D !important;
     border-top-left-radius: 0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 10px;
@@ -123,9 +139,18 @@ hr {
 }
 
 [data-testid="stDialog"] > div > div > div:first-child {
-    background-color: #002530;
+    background-color: #002530 !important;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
+}
+
+[data-testid="stBaseButton-borderlessIcon"] {
+    color: #49479D;
+}
+
+.stChatMessage:has([data-testid="stChatMessageAvatarUser"]) {
+    background-color: #002530 !important;
+    border-radius: 10px;
 }

logos/styles/light.css

@@ -1,9 +1,18 @@
 .stMain, .stAppHeader, .st-emotion-cache-hzygls {
-    background-color: #FAFAFA;
+    background-color: #FAFAFA !important;
 }
 
 .stAppHeader, .st-emotion-cache-hzygls, .stBottomBlockContainer {
-    background-color: #00AE9D ;
+    background-color: #00AE9D !important;
+}
+
+[data-testid="stChatInputSubmitButton"] {
+    background-color: transparent !important;
+    border-radius: 10px;
+}
+
+[data-testid="stChatInputSubmitButton"]:hover {
+    background-color: #00AE9D !important;
 }
 
 .stSidebar {
@@ -13,7 +22,7 @@
 }   
 
 .stHeading {
-    color: #003641;
+    color: #003641 !important;
 }
 
 [data-testid="stChatInputSubmitButton"] > svg {
@@ -49,13 +58,14 @@
 
 [data-testid="stChatInput"] > div > div {
     border: none;
+    border-radius: 10px;
 }
 
 [data-testid="stChatInput"] > div > div > div > textarea {
     background-color: #003641;
     border-radius: 10px;
     border: 1px solid #C9D200;
-    color: #FAFAFA;
+    color: #FAFAFA !important;
 }
 
 [data-testid="stChatInput"] > div > div > div > textarea:focus {
@@ -74,11 +84,11 @@ a:hover {
 }
 
 .stMarkdown h1 {
-    color: #003641
+    color: #003641 !important
 }
 
 body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
-    color: #003641
+    color: #003641 !important
 }
 
 [data-testid="stChatMessageAvatarUser"] {
@@ -108,7 +118,7 @@ body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
 }
 
 .stMarkdown hr {
-    background-color: #002530;
+    background-color: #002530 !important; 
 }
 
 .stSidebarHeader > div > button {
@@ -132,8 +142,7 @@ body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
 }
 
 .stChatMessage:has([data-testid="stChatMessageAvatarUser"]) {
-    background-color: #ebebeb;
-    color: #FAFAFA;
+    background-color: #ebebeb !important;
     border-radius: 10px;
 }
 
@@ -148,8 +157,7 @@ body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
 }
 
 [data-testid="stDialog"] > div > div > div > div {
-    max-height: 550px !important;
-    overflow: scroll;
+    background-color: #00AE9D;
 }
 
 [data-testid="stDialog"] > div > div > div {
@@ -170,9 +178,41 @@ body, .stMarkdown, .stText, .stTitle, .stHeader, .stSubheader {
 
 
 [data-testid="stAlertContainer"] p {
-    color: #002530;
+    color: #002530 !important;
 }
 
 .stTextInput > label {
-    color: #002530;
+    color: #002530 !important;
+}
+
+[data-testid="stTextInputRootElement"] > div {
+    background-color: transparent;
+}
+
+[data-testid="stTextInputRootElement"] {
+    background-color: #003641;
+    border-radius: 10px;
+    border: 1px solid #C9D200;
+    color: #FAFAFA;
+}
+
+.stFormSubmitButton > button {
+    background-color: #003641;
+    color: #FAFAFA;
+}
+
+.stFormSubmitButton > button:hover {
+    background-color: #003641;
+    border-color: #7DB61C;
+    color: #C9D200;
+}
+
+.stFormSubmitButton > button:active , .stFormSubmitButton > button:focus, .stFormSubmitButton > button:focus-visible, .stFormSubmitButton > button:focus:not(:active) {
+    background-color: #7DB61C;
+    border-color: #003641;
+    color: #FAFAFA;
 }
+
+[data-testid="stBaseButton-borderlessIcon"] {
+    color: #7DB61C;
+}