JS client take 2

[pngwn]

Description

Closes #3310. Closes #3262. Closes #3263.

New API:

Initialise the client

const app = await client('some/space', space_status_callback);

Supports the following types for tyhe 'some/space' argument:

• owner/name
• sub-dom-ain.hf.space
• https://sub-dom-ain.hf.space
• https://my-own-host.com

Make a prediction

const result = await app.predict('/predict', payload);

This will return the result for simple endpoints of the first generated value for generator endpoints, regardless of whether there are a finite number of iterations or require cancellation.

Returning the first result in this manner means that generator functions will never block for longer than a simple prediction function, even if they are infinite.

Get data updates other than the initial result

For generator functions, users may be interested in data other than the initial value.

app.on('data', event => {
  event.type /// === 'data'
  event.endpoint // === '/predict' or whichever endpoint the data corresponds to
  event.data // the payload/ data
  event.fn_index // === the fn_index
})

Get status updates

Users may be interested in what their prediction is up to:

app.on('status', event => {
  event.type /// === 'status'
  event.endpoint // === '/predict' or whichever endpoint the data corresponds to
  event.status // the status for this prediction? need to double check
  event.fn_index // === the fn_index
})

To cancel a generator function:

app.cancel('/predict', optional_fn_index);

This does nothing if the function is not a generator.

[gradio-pr-bot]

🎉 The demo notebooks match the run.py files! 🎉

[gradio-pr-bot]

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

[julien-c]

i haven't dived enough at all, but what would you think of this living (or minimally, being duplicated/exposed) in https://github.com/huggingface/huggingface.js, maybe as a @huggingface/spaces package ?

Would be quite consistent with Inference APi and Endpoints.

cc @coyotte508 @Wauplin and others

[pngwn]

Reposting:

The client will work with any app regardless of how it is hosted, so i don't think it makes sense to require users to install a hugging face specific lib if they're only using the library and not hugging face.

I also think it makes sense to keep them separate so we can change things more easily with less red tape, gradio functions also have some features that require specific APIs.

We also use the client library in gradio itself, so we need to be able to tweak + develop locally, it is core to gradio so having it somewhere else doesn't make sense.

The hub library could include it as a dependency and wrap it but i wouldn't want to do it the other way around.

[coyotte508]

We can link to it in a "see also" section in the hugginface.js's main README for example?

[pngwn]

This library isn't being published yet anyway so there is no huge rush on this, we'd like to dogfood it a little before releasing to npm.

[pngwn]

Will probably release a 0.x at some point just to get the publish tooling sorted + tested. We'll be releasing other stuff under the gradio namespace too soonish™️.

[abidlabs]

I did one round of testing and the demos look good @pngwn. Can you go ahead and resolve the merge conflict and I'll do some more testing?

[pngwn]

Should be okay now @abidlabs.

[abidlabs]

Looks great @pngwn! Tested a variety of demos locally and on the deployed PR Space, and they all worked, with the exception of one: chatbot_multimodal.

If you run demo/chatbot_multimodal on this branch and upload an image, you'll notice that the image does not appear:

The reason seems to be that the chatbot component is looking for a file at this location:

http://127.0.0.1:7870file=filepath

instead of:

http://127.0.0.1:7870/file=filepath

(notice the missing slash). This is even though the chatbot_multimodal explicitly provides a slash when creating the message. See:

history + [(f"![](/file={quote(image.name)})", "Cool pic!")]

Do you know what might be happening? This demo is working fine on main

[pngwn]

The frontend of the chatbot replaces the link sources for a reasons that aren't entirely clear to me.

This PR changes how we handle basepaths a little.

Will fix.

[abidlabs]

Tested a variety of demos and everything is working great! LGTM