When deploying using streamlit cloud, streamlit-chat message shows different format of output, how do I fix this?

[neviojustin]

I am making a chatbot app through Streamlit. When i tried deploying my local streamlit app onto streamlit community cloud via Github, I get different output, even though they are exactly the same code.
This is the localhost output

This is the Streamlit Community Cloud deployment

They are both using the streamlit-chat message() function to display the messages, what seems to be the issue? Any help would be very appreciated.

[tonykip]

Hi @neviojustin,

Thanks for posting!

I would recommend using our newly released Streamlit Chat elements st.chat_input and st.chat_message. We have robust documentation for both in our docs.

Here’s a quick demo and tutorial blog on how to use it to build Conversational Chatbots.