import axios, { AxiosInstance, AxiosResponse, InternalAxiosRequestConfig } from 'axios'; import { reportError } from './errorReporter'; import { getToken } from '../utils/auth'; import { logAction } from './actionLog'; function readStored(key: string): string | null { try { return localStorage.getItem(key); } catch { return null; } } const storedApi = typeof window !== 'undefined' ? (readStored('fc_api_base_url') || readStored('api_base_url')) : null; const envApiUrl = process.env.REACT_APP_API_URL || process.env.REACT_APP_API_BASE_URL; let API_URL = storedApi || envApiUrl || '/api/v1'; try { const maybe = new URL(API_URL, typeof window !== 'undefined' ? window.location.origin : undefined); if (!/\/api\//.test(maybe.pathname)) { maybe.pathname = maybe.pathname.replace(/\/$/, '') + '/api/v1'; API_URL = maybe.toString(); } else { API_URL = maybe.toString(); } } catch {} export const api: AxiosInstance = axios.create({ baseURL: API_URL, headers: { // If admin token provided at build time, include it only in non-production env ...((process.env.NODE_ENV !== 'production' && process.env.REACT_APP_ADMIN_TOKEN) ? { 'X-Admin-Token': process.env.REACT_APP_ADMIN_TOKEN } : {}), // Dev bypass header to allow protected calls in non-production (middleware DevBypass) ...((process.env.NODE_ENV !== 'production') ? { 'X-Dev-Admin': 'true' } : {}), }, // Send cookies for same-site or allowed CORS origins withCredentials: true, // Prevent infinite loading spinners if backend is down or unreachable timeout: 20000, // 20 seconds to better tolerate slower endpoints }); // Simple in-memory CSRF token cache let csrfTokenCache: { token: string; fetchedAt: number } | null = null; async function getCsrfToken(): Promise { try { // Refresh token every 45 minutes const now = Date.now(); if (csrfTokenCache && now - csrfTokenCache.fetchedAt < 45 * 60 * 1000) { return csrfTokenCache.token; } const res = await fetch(`${API_URL.replace(/\/$/, '')}/csrf-token`, { credentials: 'include', headers: { 'Accept': 'application/json' }, }); if (!res.ok) return null; const data = await res.json(); const token = data?.csrf_token || null; if (token) { csrfTokenCache = { token, fetchedAt: now }; } return token; } catch { return null; } } // Request interceptor - attach bearer token when available api.interceptors.request.use( async (config: InternalAxiosRequestConfig) => { (config as any).metadata = { ...(config as any).metadata, start: Date.now() }; const token = getToken(); config.headers = config.headers || {}; if (token) { (config.headers as any).Authorization = `Bearer ${token}`; } // Dev helper: attach X-Admin-Token from localStorage if present (allows admin calls without rebuild) if (process.env.NODE_ENV !== 'production') { try { const devAdmin = readStored('fc_admin_token'); if (devAdmin && !(config.headers as any)['X-Admin-Token']) { (config.headers as any)['X-Admin-Token'] = devAdmin; (config.headers as any)['X-Dev-Admin'] = 'true'; } } catch {} } // For cookie-based flows (no Bearer header), attach X-CSRF-Token on mutating methods const method = (config.method || 'get').toLowerCase(); const isMutating = method === 'post' || method === 'put' || method === 'patch' || method === 'delete'; const hasAuth = !!(config.headers as any).Authorization; if (isMutating && !hasAuth) { const csrf = await getCsrfToken(); if (csrf) { (config.headers as any)['X-CSRF-Token'] = csrf; } } return config; }, (error) => { return Promise.reject(error); } ); // Response interceptor api.interceptors.response.use( (response: AxiosResponse) => response, (error) => { try { const status = error?.response?.status; try { const cfg = error?.config || {}; const method: string = (cfg?.method || 'get').toUpperCase(); const url: string = cfg?.url || ''; const start: number | undefined = (cfg as any)?.metadata?.start; const ms = typeof start === 'number' ? Date.now() - start : undefined; logAction({ type: 'request', at: Date.now(), method, url, status, ms, ok: false }); } catch {} if (typeof status === 'number' && status >= 500) { const reqUrl: string = error.config?.url || ''; const method: string = (error.config?.method || 'get').toUpperCase(); const requestId: string | undefined = error.response?.headers?.['x-request-id'] || error.response?.headers?.['X-Request-ID']; reportError({ message: `HTTP ${status} ${method} ${reqUrl}`, status, method, url: reqUrl, request_id: requestId }); } } catch {} if (error.response?.status === 401) { // Avoid redirect loop on the login call itself const reqUrl: string = error.config?.url || ''; const isLoginEndpoint = reqUrl.endsWith('/auth/login') || reqUrl.includes('/auth/login'); // Do not force redirect for public endpoints like file uploads; let the caller handle it. const isUploadEndpoint = reqUrl.endsWith('/upload') || reqUrl.includes('/upload'); if (!isLoginEndpoint) { // Redirect to login unless already there and not an exempt endpoint if (!isUploadEndpoint) { if (window.location.pathname !== '/login') { window.location.href = '/login'; } } } } return Promise.reject(error); } ); api.interceptors.response.use((response: AxiosResponse) => { try { const cfg = response.config || {} as any; const method: string = (cfg?.method || 'get').toUpperCase(); const url: string = cfg?.url || ''; const start: number | undefined = (cfg as any)?.metadata?.start; const ms = typeof start === 'number' ? Date.now() - start : undefined; const status = response.status; logAction({ type: 'request', at: Date.now(), method, url, status, ms, ok: true }); } catch {} return response; }); // Upload image helper export const uploadImage = async (formData: FormData): Promise<{ url: string }> => { const res = await api.post('/upload', formData, { headers: { 'Content-Type': 'multipart/form-data', }, }); return res.data; }; export { API_URL }; export default api;