How can I sync streamlit spinner with ChatGPT’s operations?

Using Streamlit
1

“I’m working on an app that uses the ChatGPT API and I want to display a custom spinner. The spinner shows up when the process starts, but the issue is that it keeps displaying even after the process has finished. How can I sync it with ChatGPT’s operations so that the spinner clears once the processing is done?
Here’s the relevant code snippet created by ChatGPT:”

def communicate(user_input, bot_response_placeholder, model, temperature, top_p):
    spinner_placeholder=st.empty()

    show_custom_spinner(spinner_placeholder)
    try:
        messages = st.session_state["messages"]
        user_message = {"role": "user", "content": user_input}
        messages.append(user_message)

        complete_response = ""

        # Get the response from ChatCompletion
        response = client.chat.completions.create(
            model=model,
            messages=messages,
            temperature=temperature,
            max_tokens=2000,
            top_p=top_p,
        )
        response_message = response.choices[0].message.content
        if response_message is not None:
            # Accumulate content and update the bot's response in real time
            complete_response += response_message
            formatted_response = complete_response.replace("\n", "<br>")
            indented_response = "".join([f"<div style='margin-left: 20px; white-space: pre-wrap;'>{line}</div>" for line in complete_response.split('\n')]) 
            bot_response_placeholder.markdown(indented_response, unsafe_allow_html=True)

        # After all chunks are received, add the complete response to the chat history
            if complete_response:
                bot_message = {"role": "assistant", "content": complete_response}
                messages.append(bot_message)

        # Reset the messages after the chat
        messages = [{"role": "system", "content": "You are the best AI assistant in the world."}]

        return complete_response

        spinner_placeholder.empty()

    except Exception as e:
        spinner_placeholder.empty()  
        raise e
2

Hi @Kazuki_Takahashi,

Thanks for posting!

I see you’re using a custom spinner and the issue might be due to the placement of the spinner_placeholder.empty() after the return statement. You should move the spinner_placeholder.empty() call to a place in your communicate method where it will be executed right after the chat response is completely processed and just before returning the response.

def communicate(user_input, bot_response_placeholder, model, temperature, top_p):
    spinner_placeholder=st.empty()

    show_custom_spinner(spinner_placeholder)
    try:
        messages = st.session_state["messages"]
        user_message = {"role": "user", "content": user_input}
        messages.append(user_message)

        complete_response = ""

        # Get the response from ChatCompletion
        response = client.chat.completions.create(
            model=model,
            messages=messages,
            temperature=temperature,
            max_tokens=2000,
            top_p=top_p,
        )
        response_message = response.choices[0].message.content
        if response_message is not None:
            # Accumulate content and update the bot's response in real time
            complete_response += response_message
            formatted_response = complete_response.replace("\n", "<br>")
            indented_response = "".join([f"<div style='margin-left: 20px; white-space: pre-wrap;'>{line}</div>" for line in complete_response.split('\n')]) 
            bot_response_placeholder.markdown(indented_response, unsafe_allow_html=True)

        # After all chunks are received, add the complete response to the chat history
            if complete_response:
                bot_message = {"role": "assistant", "content": complete_response}
                messages.append(bot_message)
        
        # Clear spinner
        spinner_placeholder.empty()

        # Reset the messages after the chat
        messages = [{"role": "system", "content": "You are the best AI assistant in the world."}]

        return complete_response


    except Exception as e:
        spinner_placeholder.empty()  
        raise e

Let me know if this resolves the issue.

3

＠tonykip Hi. Thank you for your quick reply!
As you suggested, I moved the Clear spinner code before the “messages reset” part, but the spinner still remains visible without disappearing.
Do you have any suggestions? Thank you.

4

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.