Create Warning, Info modals

[aliabid94]

Introduce gr.Warning and gr.Info, which can be written anywhere in a function and will cause a Modal to pop up instantly. Requires websockets.

Example code:

import gradio as gr
import time

def greet(name):
    gr.Info("Starting...")
    time.sleep(2)
    if len(name) < 3:
        gr.Warning("Name is short")
    time.sleep(2)
    raise gr.Error("Error!")

demo = gr.Interface(fn=greet, inputs="text", outputs="text")
demo.queue().launch() 

Did not try to capture every warnings.warn that was raised, as it would be quite tricky (having to hijack the warnings library just as we did with tqdm) and I don't think there would be many use cases.

The modal looks the same for Error, Info, and Warning - @hannahblair would you like to take on styling those as well?

[gradio-pr-bot]

All the demos for this PR have been deployed at https://huggingface.co/spaces/gradio-pr-deploys/pr-4518-all-demos

[hannahblair]

The modal looks the same for Error, Info, and Warning - @hannahblair would you like to take on styling those as well?

Absolutely. Already on it 😊

[gradio-pr-bot]

The demo notebooks don't match the run.py files. Please run this command from the root of the repo and then commit the changes:

pip install nbformat && cd demo && python generate_notebooks.py

[abidlabs]

Nice @aliabid94! I'm still doing some testing, but I noticed that if there's a gr.Warning raised shortly before the function ends, it does not appear. Here's an example:

import gradio as gr
import time

def test(x):
    gr.Warning("step 1")
    yield "step 1"
    time.sleep(1)
    gr.Warning("step 2")
    yield "step 2"
    time.sleep(1)
    gr.Warning("done")
    # time.sleep(1) # If you uncomment this line, it works 
    yield "done"

gr.Interface(test, "textbox", "textbox").queue().launch()

Speaking of, it would be good to write some tests

[pngwn]

Apart from one small comment, I'm happy with the frontend code so far. When we're happy with the core implementation, I guess @hannahblair will take over to add the new UI.

[aliabid94]

ready for re-review

[pngwn]

Reviewed the frontend code a few times now, and looks good to me! Thanks @hannahblair and @aliabid94!

[gradio-pr-bot]

Chromatic build successful 🎉

• Storybook Preview
• Build Review