src/main.ts

import { oauthLoginUrl, oauthHandleRedirectIfPresent } from "@huggingface/hub";

interface HuggingFaceWindow extends Window {
  huggingface?: {
    variables: {
      OAUTH_SCOPES: string;
    };
  };
}

declare const window: HuggingFaceWindow;

console.log("huggingface env", window.huggingface);

type OAuthResult = Record<string, any> | null | false;

let oauthResult: OAuthResult = null;
const storedOAuth = localStorage.getItem("oauth");

if (storedOAuth) {
  try {
    oauthResult = JSON.parse(storedOAuth);
  } catch {
    oauthResult = null;
  }
}

const init = async (): Promise<void> => {
  oauthResult ||= await oauthHandleRedirectIfPresent();

  if (oauthResult !== null && oauthResult !== false) {
    const preElement = document.querySelector("pre");
    if (preElement) {
      preElement.textContent = JSON.stringify(oauthResult, null, 2);
    }

    localStorage.setItem("oauth", JSON.stringify(oauthResult));

    const signoutButton = document.getElementById("signout");
    if (signoutButton) {
      signoutButton.style.removeProperty("display");
      signoutButton.onclick = async function () {
        localStorage.removeItem("oauth");
        window.location.href = window.location.href.replace(/\?.*$/, "");
        window.location.reload();
      };
    }
  } else {
    const signinButton = document.getElementById("signin");
    if (signinButton) {
      signinButton.style.removeProperty("display");
      signinButton.onclick = async function () {
        // prompt=consent to re-trigger the consent screen instead of silently redirecting
        const loginUrl = await oauthLoginUrl({
          scopes: window.huggingface?.variables?.OAUTH_SCOPES ?? "",
        });
        window.location.href = `${loginUrl}&prompt=consent`;
      };
    }
  }
};

init().catch(console.error);