How to make two different streamlit components work independently

I am running my app locally and here is the app:

import streamlit as st

st.set_page_config(layout="wide")

if 'button_state' not in st.session_state:
    st.session_state.button_state = False

with st.sidebar:
    inp = st.chat_input("Hello")

    with st.chat_message("user"):
        st.write(inp)

    with st.chat_message("ai"):
        st.write("Hello")
if st.session_state.button_state:
    st.markdown("Button pressed")

if b:= st.button("press"):
    st.session_state.button_state = True
    st.markdown("Button pressed")

Now here this is how my initial application looks like (when I write something in the chat box)

And when I press the button, then it looks like this

So How can I save the state of both of them, and chat should be working independently with the button in the main page.

Thanks