src/main.ts

import { oauthManager, HuggingFaceWindow } from "./oauth";

interface OrganizationInfo {
  type: string;
  id: string;
  name: string;
  role: string;
}

interface WhoAmIResponse {
  type: string;
  id: string;
  name: string;
  email?: string;
  fullname?: string;
  avatarUrl?: string;
  organizations: OrganizationInfo[];
}

declare const window: HuggingFaceWindow;

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

async function getOrganizationInfo(
  accessToken: string
): Promise<WhoAmIResponse> {
  const response = await fetch("https://huggingface.co/api/whoami-v2", {
    headers: {
      Authorization: `Bearer ${accessToken}`,
    },
  });

  if (!response.ok) {
    throw new Error(
      `Failed to fetch organization info: ${response.statusText}`
    );
  }

  return response.json();
}

const init = async (): Promise<void> => {
  await oauthManager.handleRedirect();

  if (oauthManager.isAuthenticated()) {
    const accessToken = oauthManager.getAccessToken();
    if (!accessToken) {
      throw new Error("Access token not found");
    }

    // Get organization info after successful authentication
    try {
      const orgInfo = await getOrganizationInfo(accessToken);
      const preElement = document.querySelector("pre");
      if (preElement) {
        preElement.textContent = JSON.stringify(
          {
            oauth: oauthManager.getAccessToken(),
            user: orgInfo,
          },
          null,
          2
        );
      }
    } catch (error) {
      console.error("Failed to fetch organization info:", error);
    }

    const signoutButton = document.getElementById("signout");
    if (signoutButton) {
      signoutButton.style.removeProperty("display");
      signoutButton.onclick = () => oauthManager.logout();
    }
  } else {
    const signinButton = document.getElementById("signin");
    if (signinButton) {
      signinButton.style.removeProperty("display");
      signinButton.onclick = () => oauthManager.initiateLogin();
    }
  }
};

init().catch(console.error);