authera 2.1.0 → 2.2.1

package/dist/helper/axios.d.ts

@@ -0,0 +1,10 @@
+import { type AxiosInstance } from "axios";
+import type { customeFunc } from "./storage";
+import type { AuthHookSettings } from "./types";
+/**
+ * Create a preconfigured Axios instance that:
+ * - Attaches Authorization header from storage on each request
+ * - On 401 responses, attempts token refresh and retries the original request
+ * - If refresh fails, redirects to fallback_401_url
+ */
+export default function createAxios<T extends string>(storage: customeFunc, settings: AuthHookSettings<T>): AxiosInstance;

package/dist/helper/axios.js

@@ -0,0 +1,88 @@
+"use client";
+import axios from "axios";
+import { useAuth } from "../hooks/useAuth";
+/**
+ * Create a preconfigured Axios instance that:
+ * - Attaches Authorization header from storage on each request
+ * - On 401 responses, attempts token refresh and retries the original request
+ * - If refresh fails, redirects to fallback_401_url
+ */
+export default function createAxios(storage, settings) {
+    const { setAccessToken, setRefreshToken, access_token, refresh_token } = useAuth();
+    const instance = axios.create({
+        baseURL: settings.backendUrl,
+    });
+    // Single-flight refresh across concurrent 401s
+    let refreshPromise = null;
+    const writeTokens = (access, refresh) => {
+        if (access)
+            setAccessToken(access);
+        if (refresh)
+            setRefreshToken(refresh);
+    };
+    const resolveAccessFromResponse = (data) => {
+        return data?.access_token ?? data?.accessToken ?? data?.token ?? null;
+    };
+    const resolveRefreshFromResponse = (data) => {
+        return data?.refresh_token ?? data?.refreshToken ?? null;
+    };
+    const doRefresh = async () => {
+        const token = refresh_token;
+        if (!token)
+            return null;
+        try {
+            // Use a bare client to avoid interceptor recursion
+            const client = axios.create({ baseURL: settings.backendUrl });
+            const resp = await client.post("auth/refresh/", { refresh_token: token });
+            const newAccess = resolveAccessFromResponse(resp.data);
+            const newRefresh = resolveRefreshFromResponse(resp.data);
+            writeTokens(newAccess, newRefresh);
+            return newAccess;
+        }
+        catch {
+            return null;
+        }
+    };
+    const getOrStartRefresh = () => {
+        if (!refreshPromise) {
+            refreshPromise = doRefresh().finally(() => {
+                // allow subsequent refreshes
+                refreshPromise = null;
+            });
+        }
+        return refreshPromise;
+    };
+    // Attach Authorization header on each request
+    instance.interceptors.request.use((config) => {
+        if (access_token) {
+            config.headers = {
+                ...config.headers,
+                Authorization: `Bearer ${access_token}`,
+            };
+        }
+        return config;
+    });
+    // Handle 401 responses with token refresh
+    instance.interceptors.response.use((response) => response, async (error) => {
+        const responseStatus = error.response?.status;
+        const originalConfig = (error.config || {});
+        if (responseStatus === 401 && !originalConfig._retry) {
+            originalConfig._retry = true;
+            const newAccess = await getOrStartRefresh();
+            if (newAccess) {
+                originalConfig.headers = {
+                    ...(originalConfig.headers || {}),
+                    Authorization: `Bearer ${newAccess}`,
+                };
+                // retry original request with new token
+                return instance.request(originalConfig);
+            }
+            // refresh failed: redirect to login/fallback
+            if (typeof window !== "undefined" && settings.fallback_401_url) {
+                window.location.href = settings.fallback_401_url;
+            }
+        }
+        return Promise.reject(error);
+    });
+    return instance;
+}

package/dist/hooks/useAuth.d.ts

@@ -22,4 +22,6 @@ export declare function useAuth<T extends string>(): {
     setAccessToken: (token: string) => void;
     setRefreshToken: (token: string) => void;
     logout: () => void;
+    access_token: string | null | undefined;
+    refresh_token: string | null | undefined;
 };

package/dist/hooks/useAuth.js

@@ -8,6 +8,8 @@ export function useAuth() {
         throw new Error("useAuth must be used within an AuthContext");
     // -------------------------------------------------- data
     const { permits: permitsData, ...user } = ctx.userData;
+    const access_token = ctx.access_token;
+    const refresh_token = ctx.refresh_token;
     const authera_props = ctx.authera_props;
     const prm = (permitsData || []);
     // -------------------------------------------------- funtions
@@ -68,6 +70,8 @@ export function useAuth() {
         setAccessToken,
         setRefreshToken,
         logout,
+        access_token,
+        refresh_token,
         ...authera_props,
     };
 }

package/dist/index.d.ts

@@ -25,7 +25,10 @@ export default function AuthHook<T extends string>(props: AuthHookSettings<T>):
         setAccessToken: (token: string) => void;
         setRefreshToken: (token: string) => void;
         logout: () => void;
+        access_token: string | null | undefined;
+        refresh_token: string | null | undefined;
     };
+    axios: import("axios").AxiosInstance;
     LoginScenario: (prop: {
         submitButtonClassName?: string;
         submitButtonText?: string;

package/dist/index.js

@@ -4,15 +4,18 @@ import { name2storage } from "./helper/storage";
 import AuthProvider from "./web";
 import { useAuth } from "./hooks/useAuth";
 import LoginForm from "./web/login";
+import createAxios from "./helper/axios";
 export default function AuthHook(props) {
     // set storage functions
     let storage = props.storage;
     if (typeof storage === "string")
         storage = name2storage(storage);
     // create backend data
+    const axios = createAxios(storage, props);
     return {
         createAuthProvider: (children) => (_jsx(AuthProvider, { storage: storage, authera_props: props, children: children })),
         useAuth: () => useAuth(),
+        axios,
         LoginScenario: (prop) => (_jsx(LoginForm, { on_after_login: props.on_after_login, on_after_step: props.on_after_step, backendUrl: props.backendUrl, submitButtonClassName: prop.submitButtonClassName, submitButtonText: prop.submitButtonText })),
     };
 }

package/dist/web/login.js

@@ -16,7 +16,7 @@ export default function LoginForm({ on_after_login, on_after_step, backendUrl, s
     const { handleSubmit, control } = useForm();
     const { setUserData, setPermits } = useAuth();
     const request = axios.create({
-        baseURL: backendUrl,
+        baseURL: backendUrl + "/auth",
     });
     // fetch data from steps
     useEffect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "authera",
-  "version": "2.1.0",
+  "version": "2.2.1",
   "description": "this project is a simple auth hook for react",
   "type": "module",
   "main": "dist/index.js",
@@ -43,4 +43,4 @@
     "minimal-form": "^2.8.1",
     "react-hook-form": "^7.66.0"
   }
-}
+}