gradio refresh interface when selecting File

Question

I'm trying to create a gradio User Interface which does the following

1. on the left panel I have a File control, that allows the selection of a local file (eg. a .csv)
2. when a file is selected a "Process" button should be made visible
3. when the "Process" button is pressed, a function is called, reading the contents of the file, and processing it in some ways, resulting in a string
4. the resulting string is shown in a TextArea in the right column

I'm stuck implementing point 2. I can select the file, but can't make the Process button become visible.

This is my code so far (not yet implementing points 3. a:

import gradio as gr

def file_selected(file_input):
    print("yes, file_selected is invoked")
    print(process_button)
    process_button.visible=True
    demo.render()
    return process_button

with gr.Blocks() as demo:
    with gr.Row():
        with gr.Column(scale=1):
            gr.Markdown("### Data")
            file_input = gr.File(label="Select File")
            process_button = gr.Button("Process", visible=False)

        with gr.Column(scale=2, min_width=600):
            gr.Markdown("### Output")
            result_display = gr.TextArea(default="", label="Result", lines=10, visible=False)

    file_input.change(fn=file_selected, inputs=file_input, outputs=process_button)
    
if __name__ == "__main__":
    demo.launch()    

I see that at file selection the message is printed (and print(process_button) prints "button" so I'm sure this variable is not None), but the button doesn't appear on the page.

edited: fixed some errors not directly related to the problem.

Answer 1

There were many problems with the code (I fixed those not related with the main issue in the original post), but in the end what solved my problem (making the button visible) was that instead to rerender,

def file_selected():
    ...
    process_button.visible=True
    demo.render()

I just had to return the process_button.update

def file_selected(file_input):
    ...
    return gr.update(visible=True)

(Actually this was documented in gradio's online docs; sorry, I didn't notice it before)

This is the complete working code:

import gradio as gr

def file_selected(file_input):
    print("yes, file_selected is invoked")
    print(process_button)
    return gr.update(visible=True)
    
with gr.Blocks() as demo:
    with gr.Row():
        with gr.Column(scale=1):
            gr.Markdown("### Data")
            file_input = gr.File(label="Select File")
            process_button = gr.Button("Process", visible=False)

        with gr.Column(scale=2, min_width=600):
            gr.Markdown("### Output")
            result_display = gr.TextArea(default="", label="Result", lines=10, visible=False)

    file_input.change(fn=file_selected, inputs=file_input, outputs=process_button)
    
if __name__ == "__main__":
    demo.launch()