Update app.py

app.py

@@ -25,44 +25,51 @@ assistant_id = os.environ.get('ASSISTANT_ID')
 # Initialize OpenAI client
 client = OpenAI(api_key=api_key)
 
-# Center-align the image and title
-st.markdown(
-    """
-    <div style="text-align: center">
-        <img src="https://huggingface.co/spaces/InfoBetyar/RAG-Chat/resolve/main/puhaparna.webp" width="300">
-    </div>
-    """,
-    unsafe_allow_html=True
-)
-
-# Streamlit App Title
-st.title("IT Betyár - ChatBot")
-
 # Verify credentials are loaded
 if not api_key or not assistant_id:
     st.error("Please set up OPENAI_API_KEY and ASSISTANT_ID in your Hugging Face Space secrets.")
     st.stop()
 
+# Custom avatars
+assistant_avatar = "https://huggingface.co/spaces/InfoBetyar/RAG-Chat/resolve/main/puhaparnaicon.webp"
+user_avatar = "https://huggingface.co/spaces/InfoBetyar/RAG-Chat/resolve/main/usericon.webp" 
+
+# Center-align the image and headers
+col1, col2 = st.columns([1, 2])  # The ratio 1:2 gives the second column more space
+
+# Left column: Image
+with col1:
+    st.image("https://huggingface.co/spaces/InfoBetyar/RAG-Chat/resolve/main/puhaparna.webp", width=200)
+
+# Right column: Titles
+with col2:
+    st.markdown("""
+        <div style="margin-top: -30px;">  <!-- Added padding to vertically align with image -->
+            <h1 style="margin: 0;">Soft Pillow Apartment - Chatbot</h1>
+            <h3 style="margin: 0;">IT Betyár - Minta alkalmazás diákoknak</h3>
+        </div>
+        """, unsafe_allow_html=True)
+
 # Initialize messages in session state if not present
 if "messages" not in st.session_state:
     st.session_state.messages = []
 
 # Display existing messages
 for message in st.session_state.messages:
-    with st.chat_message(message["role"]):
+    with st.chat_message(message["role"], avatar=assistant_avatar if message["role"] == "assistant" else user_avatar):
         st.write(message["content"])
 
 # Chat input
 if prompt := st.chat_input("Type your message..."):
     # Display user message
-    with st.chat_message("user"):
+    with st.chat_message("user", avatar=user_avatar):
         st.write(prompt)
     
     # Add user message to state
     st.session_state.messages.append({"role": "user", "content": prompt})
 
     # Get assistant response
-    with st.chat_message("assistant"):
+    with st.chat_message("assistant", avatar=assistant_avatar):
         with st.spinner("Thinking..."):
             try:
                 # Create thread and send message
@@ -104,7 +111,6 @@ if prompt := st.chat_input("Type your message..."):
             except Exception as e:
                 st.error(f"An error occurred: {str(e)}")
 
-
 # Teszt üzenetek:
 #-------------------------------------
 # What's the check in time?