Positioning streamlit chat

[nelsonchristof]

Summary

Hello all, I am trying to bring the user message box to the bottom of the page instead of being at the top. I have exhausted all the ideas I have and it still does not work. I need some help, please.

Steps to reproduce

Code snippet:

st.title(“Welcome to my pgae 2”)

import streamlit as st
from streamlit_chat import message

if ‘generated’ not in st.session_state:
    st.session_state[‘generated’] = [“I’m you cenversational agent, what can we talk about today”]

if ‘past’ not in st.session_state:
    st.session_state[‘past’] = [‘Hi’]

input_container = st.container()
response_container = st.container()

#User input

# Function for taking user-provided prompt as input

def get_text():
input_text = st.text_input("You: ", “”, key=“input”)
return input_text

# ## Applying the user input box

with response_container:
    if st.session_state[‘generated’]:
         for i in range(len(st.session_state[‘generated’])):
               message(st.session_state[‘past’][i], is_user=True, key=str(i) + ‘_user’)
               message(st.session_state[‘generated’][i], key=str(i))

with input_container:
     user_input = get_text()
     if user_input:
          response = "You are welcome"
          st.session_state.past.append(user_input)
          st.session_state.generated.append(response)

Expected behaviour:
I want the user message box to be at the bottom of the page as that would make more sense.

Here is a screenshot of the behaviour:

[edsaac]

@nelsonchristof

input_container = st.container()
response_container = st.container()

Streamlit elements are rendered in the order they are declared on your python script. Try switching the order of those two containers.

response_container = st.container()
input_container = st.container()

[nelsonchristof]

Thanks