centralize token renewal service (#3570)

* centralize token renewal service

* renewal token is now used for renewal request

* Fix test cases

* Refactor error handling in renewAuthToken test for missing renewal token

---------

Co-authored-by: Akansha Sakhre <[email protected]>
Co-authored-by: Shijith Karumathil <[email protected]>

Author: 3 people

src/services/AuthService.test.ts

@@ -115,12 +115,10 @@ describe('AuthService', () => {
   });
 
   test('testing renewAuthToken with error when there is no auth token', async () => {
-    // Call renewAuthToken
-    const result = renewAuthToken();
-
-    expect(result).toBeInstanceOf(Error);
+    clearAuthSession();
 
+    await expect(renewAuthToken()).rejects.toThrow('No renewal token available');
     // Verify setLogs was called with the correct arguments
-    expect(setLogs).toHaveBeenCalledWith('Token renewal failed: not found', 'error');
+    expect(setLogs).toHaveBeenCalledWith('Token renewal failed: renewal_token not found', 'error');
   });
 });

src/services/AuthService.tsx

@@ -1,8 +1,9 @@
 import axios from 'axios';
 import { setErrorMessage } from 'common/notification';
 
-import { RENEW_TOKEN, VITE_GLIFIC_AUTHENTICATION_API } from 'config';
+import { VITE_GLIFIC_AUTHENTICATION_API } from 'config';
 import setLogs from 'config/logs';
+import { tokenRenewalManager } from './TokenRenewalService';
 
 interface RegisterRequest {
   phone: string;
@@ -51,40 +52,34 @@ export const getAuthSession = (element?: string) => {
 };
 
 // service to auto renew the auth token based on valid refresh token
-export const renewAuthToken = () => {
-  const renewalToken = getAuthSession('renewal_token');
-  if (!renewalToken) {
-    setLogs('Token renewal failed: not found', 'error');
-    return new Error('Error');
-  }
-  // get the renewal token from session
-  axios.defaults.headers.common.authorization = renewalToken;
-
-  return axios
-    .post(RENEW_TOKEN)
-    .then((response: any) => response)
-    .catch((error: any) => {
-      // if we are not able to renew the token for some weird reason or if refresh token
-      throw error;
-    });
-};
+// delegates this to TokenRenewalManager to prevent race conditions
+export const renewAuthToken = () => tokenRenewalManager.renewToken();
 
 // service to check the validity of the auth / token  status
+// uses a 30sec buffer to proactively renew tokens before they expire
+// this prevents mid request token expirations
 export const checkAuthStatusService = () => {
   let authStatus = false;
   const tokenExpiryTimeFromSession = getAuthSession('token_expiry_time');
+
   // return false if there is no session on local
   if (!tokenExpiryTimeFromSession) {
     authStatus = false;
   } else {
     const tokenExpiryTime = new Date(tokenExpiryTimeFromSession);
-    // compare the session token with the current time
-    if (tokenExpiryTime > new Date()) {
-      // token is still valid return true
+    const now = new Date();
+    const bufferMs = 30 * 1000; // 30 seconds buffer
+
+    // consider token invalid if it expires within the next 30 seconds
+    // this ensures we renew tokens proactively before they actually expire
+    if (tokenExpiryTime.getTime() - now.getTime() > bufferMs) {
+      // token is still valid (with buffer) return true
       authStatus = true;
+      setLogs(`Token valid. Expires in ${Math.floor((tokenExpiryTime.getTime() - now.getTime()) / 1000)}s`, 'info');
     } else {
-      // this means token has expired and let's return false
+      // this means token has expired or is about to expire
       authStatus = false;
+      setLogs('Token expired or expiring soon (within 30s), renewal required', 'info');
     }
   }
   return authStatus;
@@ -192,37 +187,24 @@ export const getOrganizationServices = (service: ServiceType) => {
 
 export const setAuthHeaders = () => {
   // add authorization header in all calls
-  let renewTokenCalled = false;
-  let renewCallInProgress = false;
-
   const { fetch } = window;
   window.fetch = (...args) =>
     (async (parameters) => {
       const parametersCopy = parameters;
-      if (checkAuthStatusService()) {
-        if (parametersCopy[1]) {
-          parametersCopy[1].headers = {
-            ...parametersCopy[1].headers,
-            authorization: getAuthSession('access_token'),
-          };
-        }
-        // @ts-ignore
-        const result = await fetch(...parametersCopy);
-        return result;
-      }
-      renewTokenCalled = true;
-      const authToken = await renewAuthToken();
-      if (authToken.data) {
-        // update localstore
-        setAuthSession(authToken.data.data);
-        renewTokenCalled = false;
+
+      // check if token is valid (or renew if needed)
+      if (!checkAuthStatusService()) {
+        setLogs('Fetch: Token invalid, triggering renewal', 'info');
+        await renewAuthToken();
       }
+
       if (parametersCopy[1]) {
         parametersCopy[1].headers = {
           ...parametersCopy[1].headers,
           authorization: getAuthSession('access_token'),
         };
       }
+
       // @ts-ignore
       const result = await fetch(...parametersCopy);
       return result;
@@ -240,6 +222,7 @@ export const setAuthHeaders = () => {
       username?: string | null,
       password?: string | null
     ) {
+      // mark renewal endpoint calls to prevent infinite loops
       if (url.toString().endsWith('renew')) {
         // @ts-ignore
         this.renewGlificCall = true;
@@ -251,35 +234,26 @@ export const setAuthHeaders = () => {
   ((send) => {
     XMLHttpRequest.prototype.send = async function authCheck(body) {
       this.addEventListener('loadend', () => {
+        // handle 401 errors by logging out
         // @ts-ignore
-        if (this.renewGlificCall) {
-          renewCallInProgress = false;
-        } else if (this.status === 401) {
+        if (!this.renewGlificCall && this.status === 401) {
+          setLogs('XMLHttpRequest: Received 401, logging out', 'error');
           window.location.href = '/logout/user';
         }
       });
 
       // @ts-ignore
-      if (this.renewGlificCall && !renewCallInProgress) {
-        renewCallInProgress = true;
+      if (this.renewGlificCall) {
+        // this is the renewal endpoint itself - don't add auth or trigger renewal
+        // to prevent infinite loops
         send.call(this, body);
-      }
-      // @ts-ignore
-      else if (this.renewGlificCall) {
-        this.abort();
-      }
-      // @ts-ignore
-      else if (checkAuthStatusService()) {
-        this.setRequestHeader('authorization', getAuthSession('access_token'));
-        send.call(this, body);
-      } else if (!renewTokenCalled) {
-        renewTokenCalled = true;
-        const authToken = await renewAuthToken();
-        if (authToken.data) {
-          // update localstore
-          setAuthSession(authToken.data.data);
-          renewTokenCalled = false;
+      } else {
+        // regular request - check token and renew if needed
+        if (!checkAuthStatusService()) {
+          setLogs('XMLHttpRequest: Token invalid, triggering renewal', 'info');
+          await renewAuthToken();
         }
+
         this.setRequestHeader('authorization', getAuthSession('access_token'));
         send.call(this, body);
       }

src/services/TokenRenewalService.ts

@@ -0,0 +1,97 @@
+import axios from 'axios';
+import { RENEW_TOKEN } from 'config';
+import setLogs from 'config/logs';
+
+/**
+ * TokenRenewalManager
+ *
+ * This is centralized manager for authentication token renewal that prevents race conditions
+ * between multiple renewal requests done by various clients. (GraphQL, Axios)
+ *
+ */
+class TokenRenewalManager {
+  private renewalPromise: Promise<any> | null = null;
+
+  /**
+   * Renew authentication token
+   *
+   * If a renewal is already in progress then it returns the exsiting promise.
+   * Otherwise start a new renewal and returns it's promise.
+   *
+   * This ensures only one token renewal happens at a time, regardless of
+   * how many simultaneous requests trigger renewal.
+   *
+   * @returns Promise that resolves with the renewal response
+   */
+  async renewToken(): Promise<any> {
+    // if renewal already in progress then return existing promise
+    if (this.renewalPromise) {
+      setLogs('Token renewal: Waiting for existing renewal to complete', 'info');
+      return this.renewalPromise;
+    }
+
+    setLogs('Token renewal: Starting new renewal', 'info');
+
+    this.renewalPromise = this.performRenewal();
+
+    try {
+      const result = await this.renewalPromise;
+      setLogs('Token renewal: Completed successfully', 'info');
+      return result;
+    } catch (error) {
+      setLogs(`Token renewal: Failed - ${error}`, 'error');
+      throw error;
+    } finally {
+      // clear promise after completion (success or failure)
+      this.renewalPromise = null;
+    }
+  }
+
+  /**
+   * Perform the actual token renewal API call
+   *
+   * @private
+   * @returns Promise with axios response
+   * @throws Error if renewal token is missing or API call fails
+   */
+  private async performRenewal(): Promise<any> {
+    // TODO: Not sure if this is the best way to handle circular dependencies
+    // import here to avoid circular dependency
+    const { getAuthSession, setAuthSession } = await import('./AuthService');
+
+    const renewalToken = getAuthSession('renewal_token');
+    if (!renewalToken) {
+      setLogs('Token renewal failed: renewal_token not found', 'error');
+      throw new Error('No renewal token available');
+    }
+
+    try {
+      const response = await axios.post(RENEW_TOKEN, null, {
+        headers: { authorization: renewalToken },
+      });
+
+      // update session with new tokens
+      if (response.data && response.data.data) {
+        setAuthSession(response.data.data);
+        setLogs('Token renewal: Session updated with new tokens', 'info');
+      }
+
+      return response;
+    } catch (error: any) {
+      setLogs(`Token renewal API error: ${error.message}`, 'error');
+      throw error;
+    }
+  }
+
+  /**
+   * Check if a renewal is currently in progress
+   *
+   * @returns true if renewal is in progress, false otherwise
+   */
+  isRenewalInProgress(): boolean {
+    return this.renewalPromise !== null;
+  }
+}
+
+// export singleton instance
+export const tokenRenewalManager = new TokenRenewalManager();