@rationalbloks/frontblok-auth 0.1.0

package/dist/index.cjs

@@ -0,0 +1,603 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const client = require("react-dom/client");
+const google = require("@react-oauth/google");
+class BaseApi {
+  constructor(apiBaseUrl) {
+    this.token = null;
+    this.refreshToken = null;
+    this.isRefreshing = false;
+    this.refreshPromise = null;
+    this.proactiveRefreshTimer = null;
+    this.refreshCheckInterval = null;
+    this.tokenRefreshPromise = null;
+    this.apiBaseUrl = apiBaseUrl;
+    this.loadTokens();
+    this.setupVisibilityHandler();
+    this.setupStorageListener();
+    this.startRefreshCheckInterval();
+    console.log(`[API] Base URL: ${this.apiBaseUrl}`);
+    console.log(`[API] Environment: ${"Production"}`);
+  }
+  // ========================================================================
+  // TOKEN MANAGEMENT
+  // ========================================================================
+  /**
+   * Sync tokens across browser tabs when localStorage changes.
+   * Prevents "stale refresh token" issue where Tab A rotates the token
+   * but Tab B still has the old (now invalid) refresh token in memory.
+   */
+  setupStorageListener() {
+    if (typeof window !== "undefined") {
+      window.addEventListener("storage", (event) => {
+        if (event.key === "auth_token") {
+          console.log("[API] Token updated in another tab, syncing...");
+          this.token = event.newValue;
+        } else if (event.key === "refresh_token") {
+          console.log("[API] Refresh token updated in another tab, syncing...");
+          this.refreshToken = event.newValue;
+        } else if (event.key === null) {
+          console.log("[API] Storage cleared in another tab, syncing logout...");
+          this.token = null;
+          this.refreshToken = null;
+          window.dispatchEvent(new CustomEvent("auth:cleared"));
+        }
+      });
+    }
+  }
+  /**
+   * Start interval-based token check (runs every 60 seconds).
+   * More reliable than setTimeout which browsers throttle in background tabs.
+   */
+  startRefreshCheckInterval() {
+    if (this.refreshCheckInterval) {
+      clearInterval(this.refreshCheckInterval);
+    }
+    this.refreshCheckInterval = setInterval(() => {
+      if (this.token) {
+        this.checkAndRefreshToken();
+      }
+    }, 60 * 1e3);
+  }
+  /**
+   * Handle tab visibility changes - check token when user returns to tab.
+   */
+  setupVisibilityHandler() {
+    if (typeof document !== "undefined") {
+      document.addEventListener("visibilitychange", () => {
+        if (document.visibilityState === "visible" && this.token) {
+          console.log("[API] Tab became visible, checking token validity...");
+          this.checkAndRefreshToken();
+        }
+      });
+      window.addEventListener("focus", () => {
+        if (this.token) {
+          console.log("[API] Window focused, checking token validity...");
+          this.checkAndRefreshToken();
+        }
+      });
+    }
+  }
+  /**
+   * Check token expiry and refresh if needed.
+   */
+  async checkAndRefreshToken() {
+    if (!this.token) return;
+    const expiry = this.getTokenExpiry(this.token);
+    if (!expiry) return;
+    const now = Date.now();
+    const timeUntilExpiry = expiry - now;
+    const refreshBuffer = 3 * 60 * 1e3;
+    if (timeUntilExpiry <= 0) {
+      console.log("[API] Token expired, refreshing immediately...");
+      await this.refreshAccessToken();
+    } else if (timeUntilExpiry <= refreshBuffer) {
+      console.log(`[API] Token expires in ${Math.round(timeUntilExpiry / 1e3)}s, refreshing proactively...`);
+      await this.refreshAccessToken();
+    }
+  }
+  /**
+   * Parse JWT to get expiration time.
+   */
+  getTokenExpiry(token) {
+    try {
+      const payload = JSON.parse(atob(token.split(".")[1]));
+      return payload.exp ? payload.exp * 1e3 : null;
+    } catch {
+      return null;
+    }
+  }
+  /**
+   * Schedule proactive refresh 5 minutes before token expires.
+   */
+  scheduleProactiveRefresh() {
+    if (this.proactiveRefreshTimer) {
+      clearTimeout(this.proactiveRefreshTimer);
+      this.proactiveRefreshTimer = null;
+    }
+    if (!this.token) return;
+    const expiry = this.getTokenExpiry(this.token);
+    if (!expiry) return;
+    const now = Date.now();
+    const timeUntilExpiry = expiry - now;
+    const refreshBuffer = 5 * 60 * 1e3;
+    if (timeUntilExpiry <= 0) {
+      console.log("[API] Token already expired, refreshing immediately...");
+      this.refreshAccessToken();
+      return;
+    }
+    if (timeUntilExpiry <= refreshBuffer) {
+      console.log("[API] Token expiring soon, refreshing immediately...");
+      this.refreshAccessToken();
+      return;
+    }
+    const refreshIn = timeUntilExpiry - refreshBuffer;
+    console.log(`[API] Scheduling proactive token refresh in ${Math.round(refreshIn / 6e4)} minutes`);
+    this.proactiveRefreshTimer = setTimeout(async () => {
+      console.log("[API] Proactive token refresh triggered");
+      await this.refreshAccessToken();
+    }, refreshIn);
+  }
+  /**
+   * Load tokens from localStorage on initialization.
+   */
+  loadTokens() {
+    const storedToken = localStorage.getItem("auth_token");
+    const storedRefreshToken = localStorage.getItem("refresh_token");
+    if (storedToken) {
+      this.token = storedToken;
+      console.log("[API] Access token loaded from localStorage");
+    }
+    if (storedRefreshToken) {
+      this.refreshToken = storedRefreshToken;
+      console.log("[API] Refresh token loaded from localStorage");
+    }
+    if (this.token) {
+      this.tokenRefreshPromise = this.checkAndRefreshToken();
+      this.scheduleProactiveRefresh();
+    }
+  }
+  /**
+   * Wait for any pending token refresh to complete before making API calls.
+   */
+  async ensureTokenReady() {
+    if (this.tokenRefreshPromise) {
+      await this.tokenRefreshPromise;
+      this.tokenRefreshPromise = null;
+    }
+  }
+  /**
+   * Refresh the access token using the refresh token.
+   */
+  async refreshAccessToken() {
+    if (this.isRefreshing) {
+      return this.refreshPromise || Promise.resolve(false);
+    }
+    const latestRefreshToken = localStorage.getItem("refresh_token");
+    if (latestRefreshToken && latestRefreshToken !== this.refreshToken) {
+      console.log("[API] Syncing refresh token from localStorage");
+      this.refreshToken = latestRefreshToken;
+    }
+    if (!this.refreshToken) {
+      console.warn("[API] No refresh token available");
+      return false;
+    }
+    this.isRefreshing = true;
+    this.refreshPromise = (async () => {
+      try {
+        console.log("[API] Refreshing access token...");
+        const response = await fetch(`${this.apiBaseUrl}/api/auth/refresh`, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ refresh_token: this.refreshToken })
+        });
+        if (!response.ok) {
+          console.error("[API] Token refresh failed:", response.status);
+          if (response.status === 401 || response.status === 403) {
+            console.log("[API] Refresh token is invalid, logging out...");
+            this.clearAuth();
+          } else {
+            console.warn(`[API] Refresh failed with ${response.status}, will retry on next interval`);
+          }
+          return false;
+        }
+        const data = await response.json();
+        this.token = data.access_token;
+        localStorage.setItem("auth_token", data.access_token);
+        if (data.refresh_token) {
+          this.refreshToken = data.refresh_token;
+          localStorage.setItem("refresh_token", data.refresh_token);
+          console.log("[API] Refresh token rotated");
+        }
+        this.scheduleProactiveRefresh();
+        console.log("[API] Access token refreshed successfully");
+        return true;
+      } catch (error) {
+        console.error("[API] Token refresh network error:", error);
+        console.warn("[API] Will retry refresh on next interval");
+        return false;
+      } finally {
+        this.isRefreshing = false;
+        this.refreshPromise = null;
+      }
+    })();
+    return this.refreshPromise;
+  }
+  // ========================================================================
+  // HTTP REQUEST METHOD
+  // ========================================================================
+  /**
+   * Make an authenticated HTTP request.
+   * Handles token refresh, 401 retry, and rate limiting automatically.
+   * 
+   * This method is public so apps can make custom API calls without extending BaseApi.
+   * 
+   * @example
+   * const authApi = createAuthApi(API_URL);
+   * const data = await authApi.request<MyType>('/api/my-endpoint/', { method: 'POST', body: JSON.stringify(payload) });
+   */
+  async request(endpoint, options = {}, isRetry = false, retryCount = 0) {
+    await this.ensureTokenReady();
+    if (this.token && !isRetry && !endpoint.includes("/auth/")) {
+      const expiry = this.getTokenExpiry(this.token);
+      if (expiry) {
+        const now = Date.now();
+        const timeUntilExpiry = expiry - now;
+        if (timeUntilExpiry < 2 * 60 * 1e3) {
+          console.log(`[API] Token expires in ${Math.round(timeUntilExpiry / 1e3)}s, refreshing before request...`);
+          await this.refreshAccessToken();
+        }
+      }
+    }
+    const url = `${this.apiBaseUrl}${endpoint}`;
+    const headers = {
+      "Content-Type": "application/json",
+      ...options.headers
+    };
+    if (this.token) {
+      headers.Authorization = `Bearer ${this.token}`;
+    }
+    console.log(`[API Request] ${options.method || "GET"} ${url}`);
+    try {
+      const response = await fetch(url, { ...options, headers });
+      console.log(`[API Response] ${response.status} ${response.statusText}`);
+      if (!response.ok) {
+        const error = await response.text();
+        console.error(`[API Error] ${response.status}: ${error}`);
+        if (response.status === 429 && retryCount < 3) {
+          const backoffMs = Math.pow(2, retryCount) * 1e3;
+          console.log(`[API] Rate limited (429), retrying in ${backoffMs}ms (attempt ${retryCount + 1}/3)...`);
+          await new Promise((resolve) => setTimeout(resolve, backoffMs));
+          return this.request(endpoint, options, isRetry, retryCount + 1);
+        }
+        if (response.status === 401 && !isRetry && !endpoint.includes("/auth/login") && !endpoint.includes("/auth/register") && !endpoint.includes("/auth/refresh")) {
+          console.log("[API] Attempting token refresh...");
+          const refreshed = await this.refreshAccessToken();
+          if (refreshed) {
+            return this.request(endpoint, options, true, retryCount);
+          }
+          console.warn("[API] Token refresh failed, returning error to caller");
+        }
+        const apiError = new Error(`API Error: ${response.status} - ${error}`);
+        apiError.status = response.status;
+        throw apiError;
+      }
+      return response.json();
+    } catch (error) {
+      console.error("[API Connection Error]:", error);
+      if (error instanceof TypeError && error.message.includes("Failed to fetch")) {
+        throw new Error(`Cannot connect to API: ${this.apiBaseUrl}`);
+      }
+      throw error;
+    }
+  }
+  // ========================================================================
+  // AUTHENTICATION METHODS
+  // ========================================================================
+  async login(email, password) {
+    console.log("[API] Login attempt:", email);
+    const data = await this.request("/api/auth/login", {
+      method: "POST",
+      body: JSON.stringify({ email, password })
+    });
+    this.token = data.access_token;
+    this.refreshToken = data.refresh_token || null;
+    localStorage.setItem("auth_token", data.access_token);
+    if (data.refresh_token) {
+      localStorage.setItem("refresh_token", data.refresh_token);
+    }
+    localStorage.setItem("user_data", JSON.stringify(data.user));
+    this.scheduleProactiveRefresh();
+    console.log("[API] Login successful");
+    return data;
+  }
+  async register(email, password, firstName, lastName) {
+    console.log("[API] Registration attempt:", email);
+    const data = await this.request("/api/auth/register", {
+      method: "POST",
+      body: JSON.stringify({
+        email,
+        password,
+        first_name: firstName,
+        last_name: lastName
+      })
+    });
+    this.token = data.access_token;
+    this.refreshToken = data.refresh_token || null;
+    localStorage.setItem("auth_token", data.access_token);
+    if (data.refresh_token) {
+      localStorage.setItem("refresh_token", data.refresh_token);
+    }
+    localStorage.setItem("user_data", JSON.stringify(data.user));
+    this.scheduleProactiveRefresh();
+    console.log("[API] Registration successful");
+    return data;
+  }
+  async getMe() {
+    console.log("[API] Fetching current user");
+    return this.request("/api/auth/me");
+  }
+  async getCurrentUser() {
+    console.log("[API] Fetching current user data");
+    const response = await this.request("/api/auth/me");
+    localStorage.setItem("user", JSON.stringify(response.user));
+    return response.user;
+  }
+  async deleteAccount(password, confirmText) {
+    console.log("[API] Deleting account (DESTRUCTIVE)");
+    const response = await this.request("/api/auth/me", {
+      method: "DELETE",
+      body: JSON.stringify({
+        password,
+        confirm_text: confirmText
+      })
+    });
+    this.clearAuth();
+    console.log("[API] Account deleted successfully");
+    return response;
+  }
+  async logout() {
+    console.log("[API] Logging out");
+    if (this.refreshToken) {
+      try {
+        await this.request("/api/auth/logout", {
+          method: "POST",
+          body: JSON.stringify({ refresh_token: this.refreshToken })
+        });
+        console.log("[API] Refresh token revoked on server");
+      } catch (error) {
+        console.warn("[API] Failed to revoke refresh token on server:", error);
+      }
+    }
+    this.clearAuth();
+  }
+  async logoutAllDevices() {
+    console.log("[API] Logging out from all devices");
+    try {
+      await this.request("/api/auth/logout-all", { method: "POST" });
+      console.log("[API] All sessions revoked on server");
+    } catch (error) {
+      console.warn("[API] Failed to revoke all sessions:", error);
+    }
+    this.clearAuth();
+  }
+  clearAuth() {
+    if (this.proactiveRefreshTimer) {
+      clearTimeout(this.proactiveRefreshTimer);
+      this.proactiveRefreshTimer = null;
+    }
+    this.token = null;
+    this.refreshToken = null;
+    localStorage.removeItem("auth_token");
+    localStorage.removeItem("refresh_token");
+    localStorage.removeItem("user_data");
+    console.log("[API] Auth cache cleared");
+    window.dispatchEvent(new CustomEvent("auth:cleared"));
+  }
+  // ========================================================================
+  // API KEY MANAGEMENT
+  // ========================================================================
+  async listApiKeys() {
+    console.log("[API] Listing user API keys");
+    return this.request("/api/auth/api-keys", { method: "GET" });
+  }
+  async createApiKey(data) {
+    console.log(`[API] Creating API key: ${data.name}`);
+    return this.request("/api/auth/api-keys", {
+      method: "POST",
+      body: JSON.stringify({
+        name: data.name,
+        scopes: data.scopes || "read,write",
+        expires_in_days: data.expires_in_days,
+        rate_limit_per_minute: data.rate_limit_per_minute || 60
+      })
+    });
+  }
+  async revokeApiKey(keyId) {
+    console.log(`[API] Revoking API key: ${keyId}`);
+    return this.request(`/api/auth/api-keys/${keyId}`, { method: "DELETE" });
+  }
+}
+function createAuthApi(apiBaseUrl) {
+  return new BaseApi(apiBaseUrl);
+}
+const getStoredUser = () => {
+  const userData = localStorage.getItem("user_data");
+  if (!userData) return null;
+  try {
+    return JSON.parse(userData);
+  } catch (error) {
+    console.error("[API] Invalid user_data in localStorage:", error);
+    localStorage.removeItem("user_data");
+    return null;
+  }
+};
+const getStoredToken = () => {
+  return localStorage.getItem("auth_token");
+};
+const isAuthenticated = () => {
+  return !!getStoredToken();
+};
+const AuthContext = react.createContext(void 0);
+const useAuth = () => {
+  const context = react.useContext(AuthContext);
+  if (!context) {
+    throw new Error("useAuth must be used within AuthProvider");
+  }
+  return context;
+};
+function createAuthProvider(api) {
+  const AuthProvider = ({ children }) => {
+    const [state, setState] = react.useState({
+      user: getStoredUser(),
+      isLoading: false,
+      isAuthenticated: !!getStoredToken(),
+      error: null
+    });
+    react.useEffect(() => {
+      const handleAuthCleared = () => {
+        console.log("[Auth] Session expired or invalidated - clearing auth state");
+        setState({
+          user: null,
+          isAuthenticated: false,
+          isLoading: false,
+          error: null
+        });
+      };
+      window.addEventListener("auth:cleared", handleAuthCleared);
+      return () => window.removeEventListener("auth:cleared", handleAuthCleared);
+    }, []);
+    react.useEffect(() => {
+      const refreshUserData = async () => {
+        const token = getStoredToken();
+        if (token) {
+          try {
+            const currentUser = await api.getCurrentUser();
+            setState((prev) => ({
+              ...prev,
+              user: currentUser,
+              isAuthenticated: true
+            }));
+          } catch (error) {
+            console.error("[Auth] Failed to refresh user data:", error);
+            const httpError = error;
+            if ((httpError == null ? void 0 : httpError.status) === 401 || (httpError == null ? void 0 : httpError.status) === 403) {
+              console.warn("[Auth] Auth failed - clearing local state only");
+              localStorage.removeItem("auth_token");
+              localStorage.removeItem("user_data");
+              setState({
+                user: null,
+                isAuthenticated: false,
+                isLoading: false,
+                error: null
+              });
+            } else {
+              console.warn("[Auth] Keeping user logged in with cached data");
+            }
+          }
+        }
+      };
+      refreshUserData();
+    }, []);
+    const login = async (email, password) => {
+      setState((prev) => ({ ...prev, isLoading: true, error: null }));
+      try {
+        const result = await api.login(email, password);
+        setState((prev) => ({
+          ...prev,
+          user: result.user,
+          isAuthenticated: true,
+          isLoading: false
+        }));
+        return true;
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error.message : "Login failed",
+          isLoading: false
+        }));
+        return false;
+      }
+    };
+    const register = async (email, password, firstName, lastName) => {
+      setState((prev) => ({ ...prev, isLoading: true, error: null }));
+      try {
+        const result = await api.register(email, password, firstName, lastName);
+        setState((prev) => ({
+          ...prev,
+          user: result.user,
+          isAuthenticated: true,
+          isLoading: false
+        }));
+        return true;
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error.message : "Registration failed",
+          isLoading: false
+        }));
+        return false;
+      }
+    };
+    const logout = () => {
+      api.logout();
+      setState({
+        user: null,
+        isAuthenticated: false,
+        isLoading: false,
+        error: null
+      });
+    };
+    const clearError = () => {
+      setState((prev) => ({ ...prev, error: null }));
+    };
+    const refreshUser = async () => {
+      try {
+        const currentUser = await api.getCurrentUser();
+        setState((prev) => ({
+          ...prev,
+          user: currentUser
+        }));
+      } catch (error) {
+        console.error("[Auth] Failed to refresh user:", error);
+      }
+    };
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      AuthContext.Provider,
+      {
+        value: {
+          ...state,
+          login,
+          register,
+          logout,
+          clearError,
+          refreshUser
+        },
+        children
+      }
+    );
+  };
+  return AuthProvider;
+}
+function createAppRoot(App, config = {}) {
+  const { googleClientId } = config;
+  const root = client.createRoot(document.getElementById("root"));
+  let appElement = /* @__PURE__ */ jsxRuntime.jsx(App, {});
+  if (googleClientId) {
+    appElement = /* @__PURE__ */ jsxRuntime.jsx(google.GoogleOAuthProvider, { clientId: googleClientId, children: appElement });
+  }
+  root.render(
+    /* @__PURE__ */ jsxRuntime.jsx(react.StrictMode, { children: appElement })
+  );
+}
+exports.BaseApi = BaseApi;
+exports.createAppRoot = createAppRoot;
+exports.createAuthApi = createAuthApi;
+exports.createAuthProvider = createAuthProvider;
+exports.getStoredToken = getStoredToken;
+exports.getStoredUser = getStoredUser;
+exports.isAuthenticated = isAuthenticated;
+exports.useAuth = useAuth;
+//# sourceMappingURL=index.cjs.map