auth

src/App.tsx

@@ -5,6 +5,15 @@ import { I18nextProvider } from 'react-i18next'
 import { BrowserRouter } from 'react-router-dom'
 import 'swiper/swiper-bundle.css';
 import FaJson from './langs/fa.json'
+import { useState } from 'react';
+import { Pages } from './config/Pages';
+import { getRefreshToken, getToken, removeRefreshToken, removeToken, setRefreshToken, setToken } from './config/func';
+import { useEffect } from 'react';
+import AuthRouter from './router/Auth';
+import { QueryCache, QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { IApiErrorRepsonse } from './types/error.types';
+import { refreshToken } from './pages/auth/service/AuthService';
+import ToastContainer from './components/Toast';
 i18next.init({
   interpolation: { escapeValue: false },
   lng: 'fa',
@@ -15,16 +24,112 @@ i18next.init({
   }
 })
 
+declare global {
+  interface Window {
+    isRefreshingToken?: boolean;
+  }
+}
+
 function App() {
 
+  const [isLogin, setIsLogin] = useState<'checking' | 'isLogin' | 'isNotLogin'>('checking')
+  useEffect(() => {
+    const checkLogin = async () => {
+      const token = await getToken();
+      if (token) {
+        setIsLogin('isLogin')
+      } else {
+        setIsLogin('isNotLogin')
+        if (window.location.href.split('auth').length === 1) {
+          window.location.href = Pages.auth.login
+        }
+      }
+    }
+    checkLogin();
+  }, []);
+
+  const queryClient = new QueryClient({
+    queryCache: new QueryCache({
+      onError: async (error: IApiErrorRepsonse) => {
+        if (error?.response?.status === 401) {
+          try {
+            // Use a flag to track if refresh is in progress
+            if (window.isRefreshingToken) {
+              // Wait for the refresh to complete
+              await new Promise(resolve => {
+                const checkComplete = setInterval(() => {
+                  if (!window.isRefreshingToken) {
+                    clearInterval(checkComplete);
+                    resolve(true);
+                  }
+                }, 100);
+              });
+              return;
+            }
+
+            // Set the flag to indicate refresh is in progress
+            window.isRefreshingToken = true;
+
+            try {
+              const refreshTokenValue = await getRefreshToken();
+              const { data } = await refreshToken({ refreshToken: refreshTokenValue || '' });
+
+              if (data?.accessToken?.token) {
+                // Save the new token
+                await setToken(data?.accessToken?.token);
+
+                // If refresh token also returned, update it
+                if (data.refreshToken?.token) {
+                  await setRefreshToken(data.refreshToken?.token);
+                }
+
+                // Retry the failed request
+                queryClient.invalidateQueries();
+                return;
+              } else {
+                throw new Error('Invalid token response');
+              }
+            } finally {
+              window.isRefreshingToken = false;
+            }
+          } catch (refreshError: unknown) {
+            console.error('Token refresh failed:', refreshError);
+            // Clear tokens and redirect to login
+            await removeToken();
+            await removeRefreshToken();
+            window.location.href = '/auth/login';
+          }
+        }
+      }
+    }),
+    defaultOptions: {
+      queries: {
+        refetchOnWindowFocus: false,
+        retry: false
+        // staleTime: 86400000 // 1 day in milliseconds
+      }
+    }
+  });
+
   return (
- <>
-   <BrowserRouter>
-      <I18nextProvider i18n={i18next}>
-              <MainRouter />
-      </I18nextProvider>
-   </BrowserRouter>
- </>
+    <>
+      <BrowserRouter>
+        <QueryClientProvider client={queryClient}>
+          <I18nextProvider i18n={i18next}>
+            {
+              isLogin === 'checking' ?
+                null
+                :
+                isLogin === 'isLogin' ?
+                  <MainRouter />
+                  :
+                  <AuthRouter />
+            }
+            <ToastContainer />
+          </I18nextProvider>
+        </QueryClientProvider>
+      </BrowserRouter>
+    </>