Adds an "API Recorder" to the view API page, some internal methods have been made async

[abidlabs]

This PR adds an "API Recorder" to Gradio's View API page, which should make it easier for developers to use Gradio / Spaces via API.

Closes: #7128

[gradio-pr-bot]

🪼 branch checks and previews

•	Name	Status	URL
	Spaces	ready!	Spaces preview
	Website	ready!	Website preview
	Storybook	ready!	Storybook preview
🦄	Changes	detected!	Details

---

Install Gradio from this PR

pip install https://gradio-builds.s3.amazonaws.com/1964726794e24b64ccbeb085a36e1a6bb25a64bf/gradio-4.25.0-py3-none-any.whl

Install Gradio Python Client from this PR

pip install "gradio-client @ git+https://github.com/gradio-app/gradio@1964726794e24b64ccbeb085a36e1a6bb25a64bf#subdirectory=client/python"

[gradio-pr-bot]

🦄 change detected

This Pull Request includes changes to the following packages.

Package	Version
@gradio/app	patch
gradio	patch
gradio_client	patch

• Maintainers can select this checkbox to manually select packages to update.

With the following changelog entry.

Adds an "API Recorder" to the view API page, some internal methods have been made async

Maintainers or the PR author can modify the PR title to modify this entry.

Something isn't right?

• Maintainers can change the version label to modify the version bump.
• If the bot has failed to detect any changes, or if this pull request needs to update multiple packages to different versions or requires a more comprehensive changelog entry, maintainers can update the changelog file directly.

[abidlabs]

Should be ready for review. Addressed the comments from sync @aliabd @dawoodkhan82!

[aliabid94]

It broken for me currently with the blocks_xray demo:

[abidlabs]

Yeah sorry I pushed some WIP stuff that broke it. Let me revert to draft

[abidlabs]

Ok so I believe this should fix everything, including the Lite E2E test. I adopted @freddyaboulton's suggestion and had two different versions of the move_files_to_cache method, one async (to use within the context of a fastapi route), and one sync to use e.g. when examples are being cached. I also had to make copies of some other methods, which leads to some unfortunate code duplication, but I don't think there is any other way. As mentioned before, the async versions should give us a little bit of performance boost in some cases (e.g. if the value of a component consists of lots of large urls that need to be downloaded) similar to #7327

@aliabid94 I tested the blocks_xray demo and it should be working now after you build the frontend.

[freddyaboulton]

This PR is pretty much ready to go @abidlabs ! Noticed a couple of small issues in the generated python calls:

• If the function has no arguments, the call will be client.predict(, api_name="/...") which is not valid syntax (empty comma)
• The python docs show the javascript null as opposed to None so the python calls can't be used as-is.

Would appreciate if @aliabd and @dawoodkhan82 can take a closer look at the UI and js!

[abidlabs]

Thanks for adding the kitchen sink e2e lite test @whitphx. That caught an issue, fixing rn

[abidlabs]

Thanks @freddyaboulton, I can repro the first issue that you described, but not the second:

When I run this for example:

import gradio as gr

with gr.Blocks() as demo:
    t1 = gr.Textbox()
    t2 = gr.Image()
    t1.submit(lambda x,y:x, [t1, t2], t2)
    
demo.launch()

Here's the recorded snippet I see, which shows None, not null:

Can you provide a repro for what you're seeing?

[abidlabs]

@freddyaboulton both issues have been fixed now. Will go ahead and merge in this PR if CI passes.