The response from API is not updated in the st.text_area

Using Streamlit
,
1

Hello,
I am creating a Streamlit app, which should work like Translator using Large Language Model (Mistral) via API.

The app has two boxes(text_area). One for Input, the other for output. Once a ‘translate’ button is clicked, the translated response from API using the Input is supposed to appear on the outbox box.

  • The response from API does not land on the ‘output box’. It takes around 5-6 seconds to receive the response. (translate_text)
  • If I use an artificial function that returns the value immediately to the output box, it shows the result on the output box (translate_text_alternative)

I guess it has something to do with the session state and and longer running time of the translation, but couldn’t find an easy way to resolve this.
Can anyone please help here?

I am using streamlit ==1.29.0 on my local Python 3.12.

import streamlit as st

def translate_text(text):
    input_params = {
        "prompt": "Write a Poem",  
    }
    translated_text = ""
    try:
        for event in replicate.stream(
            "mistralai/mixtral-8x7b-instruct-v0.1", input=input_params
        ):
            if 'text' in event:
                translated_text += event['text']  
        
        return translated_text
    except Exception as e:
        st.error(f"Failed to translate text: {str(e)}")
        return None

def translate_text_alternative(input_text):
    return f"Translated result for: {input_text}"



# Streamlit UI
st.title("Translator")
st.session_state['translated_text'] = ""

with st.container():
    col1, col2 = st.columns(2)
    
    with col1:
        title = st.text_input("Title", key="title")
        text_to_translate = st.text_area("Text to translate", height=300, key="text_input")
        translate_button = st.button("Translate", key="translate_button")
    
    with col2:
        translated_text = "The translated text will appear here."
       
        # When the 'Translate' button is clicked, update the translated text
        if translate_button:
            #translated_text = translate_text(text_to_translate) #if this is used, then it won't display the result in the below 'text_area'. 
            translated_text = translate_text_alternative(text_to_translate)  # if this is used, it will display the input directly in the below 'text_area'     
        # Display the translated (or calculated) text in a disabled text area to simulate an output box
        st.text_area("Translated text", value=translated_text, height=400, disabled=True, key="translated_output")
2

Use this code.

    with col2:
        translated_text = "The translated text will appear here."
       
        # When the 'Translate' button is clicked, update the translated text
        if translate_button:
            translated_text = translate_text_alternative(text_to_translate)
            st.session_state.translated_output = translated_text  # set value via the key
        st.text_area("Translated text", height=400, disabled=True, key="translated_output")  # remnove the value parameter
3

Thanks. The issue was actually on the other side (the API - replicate), but the way to put the value in the key is helping.

1 Like
4

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