✨ Introduce oauthLogin function

[coyotte508]

Fix #408

import { oauthLogin, oauthHandleRedirectIfPresent } from "@huggingface/hub";
import {HfInference} from "@huggingface/inference";

const oauthResult = await oauthHandleRedirectIfPresent();

if (!oauthResult) {
  // If the user is not logged in, redirect to the login page
  oauthLogin();
}

// You can use oauthResult.accessToken and oauthResult.userInfo
console.log(oauthResult);

const inference = new HfInference(oauthResult.accessToken);

await inference.textToImage({
  model: 'stabilityai/stable-diffusion-2',
  inputs: 'award winning high resolution photo of a giant tortoise/((ladybird)) hybrid, [trending on artstation]',
  parameters: {
    negative_prompt: 'blurry',
  }
})

Tested inside a space: https://huggingface.co/spaces/coyotte508/client-side-oauth

Mainly looking for reviews regarding the APIs / usability cc @xenova @radames @vvmnnnkv @jbilcke-hf @Wauplin .

I started with a single oauthLogin that was split into oauthLogin and oauthHandleRedirect with an extra oauthHandleRedirectIfPresent for convenience.

[HuggingFaceDocBuilderDev]

The docs for this PR live here. All of your documentation changes will be reflected on that endpoint. The docs are available until 30 days after the last update.

[Wauplin]

Interesting read, thanks for the ping. DX-wise looks good to me. Just to be sure, is oauthHandleRedirect intended to be used or is it more like an internal helper and oauthHandleRedirectIfPresent is meant to be used more often?

Small comment in the documentation, I would mention accessTokenExpiresAt. In the Python+Gradio integration I think that the token expiration is one of the blocking aspect (or at least one frustrating aspect). Having it explicitly documented should help IMO (if was not the case in the gradio integration).

[radames]

Overall the API looks good! can we test it already?

[coyotte508]

Took comments under consideration:

• improved doc
• renamed oauthLogin to oauthLoginUrl

Published a test version @huggingface/[email protected] @radames

import { oauthLoginUrl, oauthHandleRedirectIfPresent } from "https://esm.sh/@huggingface/[email protected]"

[coyotte508]

Overall the API looks good! can we test it already?

https://huggingface.co/spaces/coyotte508/client-side-oauth uses the lib, checkout https://huggingface.co/spaces/coyotte508/client-side-oauth/blob/main/index.html

[radames]

Overall the API looks good! can we test it already?

https://huggingface.co/spaces/coyotte508/client-side-oauth uses the lib, checkout https://huggingface.co/spaces/coyotte508/client-side-oauth/blob/main/index.html

cool, testing this https://huggingface.co/spaces/coyotte508/client-side-oauth , for some reason if I refresh the page I have to re-login to hf, but accessing it via https://coyotte508-client-side-oauth.static.hf.space/index.html I just need to click sign-in and no need to re-login, do you know why?

[coyotte508]

Overall the API looks good! can we test it already?

huggingface.co/spaces/coyotte508/client-side-oauth uses the lib, checkout huggingface.co/spaces/coyotte508/client-side-oauth/blob/main/index.html

cool, testing this huggingface.co/spaces/coyotte508/client-side-oauth , for some reason if I refresh the page I have to re-login to hf, but accessing it via coyotte508-client-side-oauth.static.hf.space/index.html I just need to click sign-in and no need to re-login, do you know why?

Cookies storage inside iframes I guess, browser measures to prevent tracking