update files

src/main.ts

@@ -1,12 +1,4 @@
-import { oauthLoginUrl, oauthHandleRedirectIfPresent } from "@huggingface/hub";
-
-interface HuggingFaceWindow extends Window {
-  huggingface?: {
-    variables: {
-      OAUTH_SCOPES: string;
-    };
-  };
-}
+import { oauthManager, HuggingFaceWindow } from "./oauth";
 
 interface OrganizationInfo {
   type: string;
@@ -29,19 +21,6 @@ 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;
-  }
-}
-
 async function getOrganizationInfo(
   accessToken: string
 ): Promise<WhoAmIResponse> {
@@ -61,17 +40,22 @@ async function getOrganizationInfo(
 }
 
 const init = async (): Promise<void> => {
-  oauthResult ||= await oauthHandleRedirectIfPresent();
+  await oauthManager.handleRedirect();
+
+  if (oauthManager.isAuthenticated()) {
+    const accessToken = oauthManager.getAccessToken();
+    if (!accessToken) {
+      throw new Error("Access token not found");
+    }
 
-  if (oauthResult !== null && oauthResult !== false) {
     // Get organization info after successful authentication
     try {
-      const orgInfo = await getOrganizationInfo(oauthResult.accessToken);
+      const orgInfo = await getOrganizationInfo(accessToken);
       const preElement = document.querySelector("pre");
       if (preElement) {
         preElement.textContent = JSON.stringify(
           {
-            oauth: oauthResult,
+            oauth: oauthManager.getAccessToken(),
             user: orgInfo,
           },
           null,
@@ -82,28 +66,16 @@ const init = async (): Promise<void> => {
       console.error("Failed to fetch organization info:", error);
     }
 
-    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();
-      };
+      signoutButton.onclick = () => oauthManager.logout();
     }
   } 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`;
-      };
+      signinButton.onclick = () => oauthManager.initiateLogin();
     }
   }
 };

src/oauth.ts

@@ -0,0 +1,62 @@
+import { oauthLoginUrl, oauthHandleRedirectIfPresent } from "@huggingface/hub";
+
+export interface HuggingFaceWindow extends Window {
+  huggingface?: {
+    variables: {
+      OAUTH_SCOPES: string;
+    };
+  };
+}
+
+declare const window: HuggingFaceWindow;
+
+export type OAuthResult = Record<string, any> | null | false;
+
+export class OAuthManager {
+  private oauthResult: OAuthResult = null;
+
+  constructor() {
+    const storedOAuth = localStorage.getItem("oauth");
+    if (storedOAuth) {
+      try {
+        this.oauthResult = JSON.parse(storedOAuth);
+      } catch {
+        this.oauthResult = null;
+      }
+    }
+  }
+
+  async handleRedirect(): Promise<OAuthResult> {
+    this.oauthResult ||= await oauthHandleRedirectIfPresent();
+    if (this.oauthResult !== null && this.oauthResult !== false) {
+      localStorage.setItem("oauth", JSON.stringify(this.oauthResult));
+    }
+    return this.oauthResult;
+  }
+
+  async initiateLogin(): Promise<void> {
+    const loginUrl = await oauthLoginUrl({
+      scopes: window.huggingface?.variables?.OAUTH_SCOPES ?? "",
+    });
+    window.location.href = `${loginUrl}&prompt=consent`;
+  }
+
+  logout(): void {
+    localStorage.removeItem("oauth");
+    window.location.href = window.location.href.replace(/\?.*$/, "");
+    window.location.reload();
+  }
+
+  getAccessToken(): string | null {
+    if (this.oauthResult && typeof this.oauthResult === "object") {
+      return this.oauthResult.accessToken ?? null;
+    }
+    return null;
+  }
+
+  isAuthenticated(): boolean {
+    return this.oauthResult !== null && this.oauthResult !== false;
+  }
+}
+
+export const oauthManager = new OAuthManager();