Hello there and apologies in advance if this is a very newbie question. I’m creating my first streamlit app, a chatbot hooked up to openAI. Everything is working perfectly so far. One feature I have built right now that people can click on buttons that trigger the chatbot with pre-generated text. Currently, that looks like this:
However, I have some images I’ve created that I think would look a lot nicer than the text on those buttons. Want I want is to have it end up looking like this:
I searched around for how to effectively create images that could be used like buttons, and discovered the st-click-detector. However, my attempts at using it were problematic because it didn’t appear to refresh after a click. Instead, a single click on the image would send the bot into an endless loop. I also had issues styling the button’s container via st-click-detector because it seems to functionally create a new html page complete with body, but I don’t know how to style, for example, the background-color of each specific st-click-detector component. Can anyone direct me to how I can better use st-click-detector to fresh to a “non-clicked” value after each click and subsequent st.rerun()? Or is there a better solution that I’m not considering?
The code was forked from, and is thus fundamentally similar to, what can be found here: gpt-assistants-api-ui/app.py at main · ryo-ma/gpt-assistants-api-ui · GitHub
So, in particular I am endeavoring to have clickable image buttons within the load_chat_screen() function, that refresh after the function finishes.