try to do better

frontend/src/api/client.ts

@@ -1,4 +1,5 @@
-import axios from 'axios';
+import axios, { AxiosError } from 'axios';
+import axiosRetry from 'axios-retry';
 import type {
   Family,
   Category,
@@ -33,8 +34,51 @@ const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || '';
 const apiClient = axios.create({
   baseURL: API_BASE_URL,
   withCredentials: true,
+  timeout: 30000,
 });
 
+axiosRetry(apiClient, {
+  retries: 3,
+  retryDelay: axiosRetry.exponentialDelay,
+  retryCondition: (error: AxiosError) => {
+    return (
+      axiosRetry.isNetworkOrIdempotentRequestError(error) ||
+      (error.response?.status ? error.response.status >= 500 : false)
+    );
+  },
+  onRetry: (retryCount, error, requestConfig) => {
+    console.log(`Retry attempt ${retryCount} for ${requestConfig.url}`, error.message);
+  },
+});
+
+apiClient.interceptors.request.use(
+  (config) => {
+    console.log(`[API] ${config.method?.toUpperCase()} ${config.url}`);
+    return config;
+  },
+  (error) => {
+    console.error('[API] Request error:', error);
+    return Promise.reject(error);
+  }
+);
+
+apiClient.interceptors.response.use(
+  (response) => {
+    console.log(`[API] ${response.config.method?.toUpperCase()} ${response.config.url} - ${response.status}`);
+    return response;
+  },
+  (error: AxiosError) => {
+    if (error.response?.status === 401) {
+      console.warn('[API] Unauthorized - redirecting to login');
+      if (!window.location.pathname.includes('/login')) {
+        window.location.href = '/login';
+      }
+    }
+    console.error('[API] Response error:', error.response?.status, error.message);
+    return Promise.reject(error);
+  }
+);
+
 export const authApi = {
   login: (data: LoginRequest) =>
     apiClient.post<LoginResponse>('/login', data),