import axios, { AxiosHeaders } from 'axios'; import Cookies from 'js-cookie'; // Cookie keys export const ADMIN_TOKEN_KEY = 'admin_token'; export const GALLERY_TOKEN_KEY = 'gallery_token'; // Maintenance mode callback let maintenanceModeCallback: ((enabled: boolean) => void) | null = null; export const setMaintenanceModeCallback = (callback: (enabled: boolean) => void) => { maintenanceModeCallback = callback; }; // Create axios instance export const api = axios.create({ baseURL: import.meta.env.VITE_API_URL || '/api', headers: { 'Content-Type': 'application/json', }, withCredentials: false, // Ensure we're not relying on cookies }); // Request interceptor to add auth token api.interceptors.request.use( (config) => { // Don't process if headers are already set by the component const existingAuth = config.headers?.['Authorization'] || config.headers?.get?.('Authorization'); // If authorization is already set by the component, don't override it if (existingAuth) { return config; } // Check if it's an admin route or gallery route const isAdminRoute = config.url?.includes('/admin'); if (isAdminRoute) { const token = Cookies.get(ADMIN_TOKEN_KEY); if (token) { if (!config.headers) { config.headers = {}; } config.headers['Authorization'] = `Bearer ${token}`; } } else { // For gallery routes, try to extract slug from the request URL first const galleryMatch = config.url?.match(/gallery\/([^\/]+)/); if (galleryMatch && galleryMatch[1]) { const galleryIdOrSlug = galleryMatch[1]; // Remove any query parameters from the slug const cleanIdOrSlug = galleryIdOrSlug.split('?')[0]; // Check if it's a numeric ID (for upload endpoints) let token = null; if (/^\d+$/.test(cleanIdOrSlug)) { // It's an event ID - try to find the token from current page slug const pathParts = window.location.pathname.split('/'); if (pathParts[1] === 'gallery' && pathParts[2]) { const gallerySlug = pathParts[2]; const cleanSlug = gallerySlug.split('?')[0]; token = localStorage.getItem(`gallery_token_${cleanSlug}`); } } else { // It's a slug - use it directly token = localStorage.getItem(`gallery_token_${cleanIdOrSlug}`); } if (token) { if (!config.headers) { config.headers = {}; } config.headers['Authorization'] = `Bearer ${token}`; } } else { // Fallback to getting slug from the current page URL const pathParts = window.location.pathname.split('/'); if (pathParts[1] === 'gallery' && pathParts[2]) { const gallerySlug = pathParts[2]; // Remove any query parameters from the slug const cleanSlug = gallerySlug.split('?')[0]; const token = localStorage.getItem(`gallery_token_${cleanSlug}`); if (token) { if (!config.headers) { config.headers = {}; } config.headers['Authorization'] = `Bearer ${token}`; } } } } // Don't set Content-Type for FormData - let browser set it with boundary if (config.data instanceof FormData) { delete config.headers?.['Content-Type']; } return config; }, (error) => { return Promise.reject(error); } ); // Response interceptor to handle errors api.interceptors.response.use( (response) => response, (error) => { // Handle maintenance mode (503) if (error.response?.status === 503) { const isAdminRoute = error.config?.url?.includes('/admin'); const hasAdminAuth = error.config?.headers?.Authorization?.startsWith('Bearer '); // Only trigger maintenance mode for non-admin routes or unauthenticated admin routes if (!isAdminRoute || !hasAdminAuth) { if (maintenanceModeCallback) { maintenanceModeCallback(true); } } } if (error.response?.status === 401) { // Check if it's an admin route (but not public endpoints) const isAdminRoute = error.config?.url?.includes('/admin') && !error.config?.url?.includes('/public/'); const currentPath = window.location.pathname; if (isAdminRoute) { // Clear admin token on unauthorized Cookies.remove(ADMIN_TOKEN_KEY); // Only redirect if we're not already on the admin login page if (!currentPath.includes('/admin/login')) { window.location.href = '/admin/login'; } } else { // For gallery routes, check if the error is from a gallery API call const galleryMatch = error.config?.url?.match(/\/gallery\/([^\/]+)/); // Check if this is an image request (photo or thumbnail) const isImageRequest = error.config?.url?.match(/\/(photo|thumbnail)\/\d+$/); // Don't redirect if we're on any gallery page (to avoid redirect loops during login) if (currentPath.startsWith('/gallery/')) { // Don't clear tokens for image requests - they might just need a retry if (!isImageRequest && galleryMatch && galleryMatch[1]) { const gallerySlug = galleryMatch[1]; localStorage.removeItem(`gallery_token_${gallerySlug}`); localStorage.removeItem(`gallery_event_${gallerySlug}`); } // Don't redirect - let the component handle the auth state } else if (galleryMatch) { // We're not on a gallery page but got a 401 from a gallery API // This shouldn't happen in normal flow, but if it does, redirect to homepage window.location.href = '/'; } } } return Promise.reject(error); } ); // Helper to set auth tokens export const setAuthToken = (token: string, isAdmin: boolean = false) => { const key = isAdmin ? ADMIN_TOKEN_KEY : GALLERY_TOKEN_KEY; Cookies.set(key, token, { expires: 1 }); // 1 day expiry }; // Helper to clear auth tokens export const clearAuthToken = (isAdmin: boolean = false) => { const key = isAdmin ? ADMIN_TOKEN_KEY : GALLERY_TOKEN_KEY; Cookies.remove(key); }; // Helper to get auth tokens export const getAuthToken = (isAdmin: boolean = false) => { const key = isAdmin ? ADMIN_TOKEN_KEY : GALLERY_TOKEN_KEY; return Cookies.get(key); };